/*
Theme Name: 三男坊の節約備忘録
Theme URI:
Description: Cocoon 子テーマ｜三男坊の節約備忘録（薄グリーン・マガジン風）
Author: 三男坊
Template: cocoon-master
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: cocoon-child-setsuyaku
*/

/* ============================================================
   CSS カスタム変数（カラーパレット）
============================================================ */
:root {
  --c-base:      #F4FAF6;
  --c-accent:    #52A977;
  --c-text:      #1E2D24;
  --c-secondary: #5A7A63;
  --c-bg-accent: #E6F2EA;
  --c-dark:      #182820;
  --c-mid:       #B0CDB9;
}

/* ============================================================
   ベース・背景
============================================================ */
body {
  background-color: var(--c-base) !important;
  color: var(--c-text) !important;
  font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic Pro', sans-serif !important;
}

/* ============================================================
   ヘッダー
============================================================ */
#header,
.header-container,
.header-container-in {
  background-color: rgba(244, 250, 246, 0.95) !important;
  border-bottom: 1px solid var(--c-mid) !important;
  box-shadow: none !important;
}

/* サイトタイトル */
#site-name,
.site-name-text {
  font-family: 'Noto Serif JP', serif !important;
  color: var(--c-text) !important;
  font-size: 1.4rem !important;
  letter-spacing: 0.05em !important;
}

/* サイトロゴ画像 */
#site-name img {
  max-height: 70px !important;
  width: auto !important;
}

/* ロゴ・タイトルを左寄せ */
.header-container-in,
.header-in,
#header .header-inner {
  justify-content: flex-start !important;
  text-align: left !important;
}
#site-name,
.site-name-area,
.header-logo-image {
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}
/* Cocoon ヘッダーレイアウト上書き（中央寄せを無効化） */
.hl-center .header-container-in,
.hl-right .header-container-in {
  justify-content: flex-start !important;
}

/* キャッチフレーズ */
#site-catch {
  color: var(--c-secondary) !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.15em !important;
}

/* ============================================================
   グローバルナビ
============================================================ */
#navi,
.navi-in > ul {
  background-color: var(--c-bg-accent) !important;
}

.navi-in > ul > li > a {
  color: var(--c-text) !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.08em !important;
  transition: color 0.2s !important;
}

.navi-in > ul > li > a:hover,
.navi-in > ul > li.current-menu-item > a {
  color: var(--c-accent) !important;
  background-color: transparent !important;
}

/* ============================================================
   メインコンテンツエリア
============================================================ */
#content {
  background-color: var(--c-base) !important;
}

/* 記事カード */
.a-wrap,
.entry-card-wrap {
  background: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 12px rgba(30,45,36,0.07) !important;
  transition: transform 0.25s, box-shadow 0.25s !important;
}

.a-wrap:hover,
.entry-card-wrap:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 8px 28px rgba(30,45,36,0.13) !important;
}

/* カードタイトル */
.entry-card-title,
.a-wrap .entry-title {
  font-family: 'Noto Serif JP', serif !important;
  color: var(--c-text) !important;
  font-size: 1rem !important;
  line-height: 1.6 !important;
}

/* カード抜粋 */
.entry-card-content .card-snippet,
.entry-card-snippet {
  color: var(--c-secondary) !important;
  font-size: 0.82rem !important;
  line-height: 1.7 !important;
}

/* カテゴリラベル */
.cat-label,
.entry-card-category,
.cat-label-1,
.card-cat-label {
  background-color: var(--c-accent) !important;
  color: #fff !important;
  border-radius: 4px !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.06em !important;
}

/* ============================================================
   記事本文ページ
============================================================ */
.entry-title {
  font-family: 'Noto Serif JP', serif !important;
  color: var(--c-text) !important;
  font-size: 1.8rem !important;
  line-height: 1.5 !important;
  border-left: 4px solid var(--c-accent) !important;
  padding-left: 16px !important;
  border-bottom: none !important;
}

/* 見出し h2 */
.entry-content h2 {
  font-family: 'Noto Serif JP', serif !important;
  color: var(--c-text) !important;
  border-bottom: 2px solid var(--c-accent) !important;
  padding-bottom: 8px !important;
  margin-top: 48px !important;
  font-size: 1.3rem !important;
}

/* 見出し h3 */
.entry-content h3 {
  color: var(--c-text) !important;
  border-left: 3px solid var(--c-accent) !important;
  padding-left: 12px !important;
  font-size: 1.1rem !important;
}

/* 本文リンク */
.entry-content a {
  color: var(--c-accent) !important;
  text-decoration: underline !important;
}

/* 本文テキスト */
.entry-content p {
  line-height: 2 !important;
  font-size: 0.95rem !important;
  color: var(--c-text) !important;
}

/* ============================================================
   ボタン
============================================================ */
.btn,
.btn-wrap a,
.more-wrap a,
.comment-btn {
  background-color: var(--c-accent) !important;
  color: #fff !important;
  border-radius: 999px !important;
  border: none !important;
  letter-spacing: 0.08em !important;
  transition: background 0.2s, transform 0.2s !important;
}

.btn:hover,
.btn-wrap a:hover {
  background-color: var(--c-secondary) !important;
  transform: translateY(-2px) !important;
}

/* ============================================================
   サイドバー
============================================================ */
#sidebar {
  background-color: var(--c-base) !important;
}

.widget-title,
.sidebar .widget-title {
  font-family: 'Noto Serif JP', serif !important;
  color: var(--c-text) !important;
  border-bottom: 2px solid var(--c-accent) !important;
  padding-bottom: 8px !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.08em !important;
  background: none !important;
}

/* 最近の投稿 */
.recent-posts-list li {
  border-bottom: 1px solid var(--c-bg-accent) !important;
}

/* カテゴリ一覧 */
.cat-list a {
  color: var(--c-secondary) !important;
}

.cat-list a:hover {
  color: var(--c-accent) !important;
}

/* ============================================================
   パンくずリスト
============================================================ */
#breadcrumb {
  background-color: var(--c-bg-accent) !important;
  color: var(--c-secondary) !important;
  font-size: 0.78rem !important;
}

#breadcrumb a {
  color: var(--c-accent) !important;
}

/* ============================================================
   ページネーション
============================================================ */
.pagination .current,
.page-numbers.current {
  background-color: var(--c-accent) !important;
  color: #fff !important;
  border-radius: 6px !important;
  border: none !important;
}

.pagination a,
.page-numbers a {
  color: var(--c-accent) !important;
  border: 1px solid var(--c-mid) !important;
  border-radius: 6px !important;
}

.pagination a:hover,
.page-numbers a:hover {
  background-color: var(--c-bg-accent) !important;
}

/* ============================================================
   フッター
============================================================ */
#footer {
  background-color: var(--c-dark) !important;
  color: rgba(244,250,246,0.6) !important;
}

#footer a {
  color: var(--c-mid) !important;
}

#footer a:hover {
  color: var(--c-accent) !important;
}

.footer-title {
  color: var(--c-accent) !important;
  font-family: 'Noto Serif JP', serif !important;
  letter-spacing: 0.1em !important;
}

.copyright {
  border-top: 1px solid rgba(255,255,255,0.08) !important;
  color: rgba(244,250,246,0.3) !important;
  font-size: 0.75rem !important;
}

/* ============================================================
   タグクラウド
============================================================ */
.tag-cloud-link {
  background-color: var(--c-bg-accent) !important;
  color: var(--c-secondary) !important;
  border: 1px solid var(--c-mid) !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
  font-size: 0.78rem !important;
  transition: background 0.2s !important;
}

.tag-cloud-link:hover {
  background-color: var(--c-accent) !important;
  color: #fff !important;
  border-color: var(--c-accent) !important;
}

/* ============================================================
   目次（Cocoon TOC）
============================================================ */
.toc {
  background-color: var(--c-bg-accent) !important;
  border: 1px solid var(--c-mid) !important;
  border-radius: 12px !important;
}

.toc-title {
  color: var(--c-text) !important;
  font-family: 'Noto Serif JP', serif !important;
}

.toc-list a {
  color: var(--c-accent) !important;
}

/* ============================================================
   強調ボックス（Cocoon ブロック）
============================================================ */
.blank-box,
.wp-block-cocoon-blocks-blank-box-1 {
  border-color: var(--c-accent) !important;
  border-radius: 8px !important;
}

.check-list li::before,
.memo-box {
  color: var(--c-accent) !important;
}

/* ============================================================
   レスポンシブ調整
============================================================ */
@media (max-width: 768px) {
  .entry-title {
    font-size: 1.3rem !important;
  }
  #site-name {
    font-size: 1.1rem !important;
  }
}