/*
Theme Name: alice base
Theme URI: https://beauty-trendblog.com/
Author: ありす (alice)
Description: alice kaiseki 共通の親テーマ。クリーム背景・5書体セット・共通パーツを提供し、子テーマ(①レビュー / ②成分解析)でアクセント色と見出し書体を上書きする。
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: alice-base
*/

/* ===== デザイントークン（共通） ===== */
:root{
  --bg:        #FBF6F0; /* ミルキークリーム */
  --surface:   #F4E3E5; /* 淡いダスティピンク */
  --text:      #4A3B38; /* ココアブラウン */
  --muted:     #6b5a55; /* 本文の薄い色 */
  --rose:      #DDA0A6; /* ①アクセント */
  --mocha:     #B8A38E; /* ②アクセント・細線 */
  --sage:      #9CB3A5; /* ②データ系 */
  --plum:      #8E5A60; /* 強調・ホバー */
  --line:      #E4D9CD; /* 区切り線 */

  --font-en:   "Cormorant Garamond", serif;
  --font-maru: "Zen Maru Gothic", sans-serif;
  --font-min:  "Shippori Mincho", serif;
  --font-body: "Noto Sans JP", sans-serif;
  --font-num:  "Jost", sans-serif;

  /* 子テーマで上書きする値（①: rose+maru / ②: mocha+min） */
  --site-accent:  var(--mocha);
  --heading-font: var(--font-maru);

  --radius-card: 12px;
  --radius-chip: 20px;
  --wrap: 1080px;
}

/* ===== ベース ===== */
*{ box-sizing: border-box; }
html{ -webkit-text-size-adjust: 100%; }
body{
  margin:0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-body);
  font-weight: 300;
  line-height: 1.9;
  font-size: 16px;
}
img{ max-width:100%; height:auto; }
a{ color: var(--site-accent); text-decoration: none; }
a:hover{ color: var(--plum); }

.wrap{ max-width: var(--wrap); margin:0 auto; padding:0 20px; }
.site-main{ padding: 32px 0 64px; }
.layout{ display:grid; grid-template-columns: minmax(0,1fr) 300px; gap:40px; }
@media(max-width:860px){ .layout{ grid-template-columns:1fr; } }

/* ===== 見出し ===== */
h1,h2,h3,h4{ font-family: var(--heading-font); color: var(--text); line-height:1.45; font-weight:700; }
.entry-content h2{
  font-size: 1.4rem;
  border-left: 4px solid var(--site-accent);
  padding: 2px 0 2px 14px;
  margin: 2.4em 0 1em;
}
.entry-content h3{
  font-size: 1.15rem;
  border-bottom: 1px solid var(--line);
  padding-bottom: 6px;
  margin: 2em 0 .8em;
}
.entry-content p{ margin: 0 0 1.4em; }
.entry-content a{ text-decoration: underline; text-underline-offset: 2px; }

/* ===== ヘッダー ===== */
.site-header{ background: var(--bg); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:50; }
.site-header .wrap{ display:flex; flex-wrap:nowrap; align-items:center; justify-content:space-between; height:64px; gap:16px; }
.site-logo{ font-family: var(--heading-font); font-style: normal; font-weight:700; font-size:1.15rem; line-height:1.3; color: var(--text); letter-spacing:.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; flex:0 1 auto; }
.site-logo:hover{ color: var(--text); opacity:.8; }
.global-nav ul{ list-style:none; display:flex; gap:20px; margin:0; padding:0; }
.global-nav a{ font-family: var(--heading-font); font-weight:500; font-size:.95rem; color: var(--text); }
.global-nav a:hover{ color: var(--site-accent); }
.nav-toggle{ display:none; background:none; border:0; font-size:1.5rem; color:var(--text); cursor:pointer; }
@media(max-width:768px){
  .global-nav{ position:absolute; top:64px; left:0; right:0; background:var(--bg); border-bottom:1px solid var(--line); display:none; }
  .global-nav.open{ display:block; }
  .global-nav ul{ flex-direction:column; gap:0; padding:8px 20px; }
  .global-nav li{ border-bottom:1px solid var(--line); }
  .global-nav a{ display:block; padding:12px 0; }
  .nav-toggle{ display:block; }
  .site-logo{ font-size:1rem; }
}

/* ===== 投稿カード ===== */
.card-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:22px; }
.post-card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius-card); overflow:hidden; display:flex; flex-direction:column; }
.post-card a{ color:var(--text); }
.post-card .thumb{ aspect-ratio:16/10; background:var(--surface); overflow:hidden; }
.post-card .thumb img{ width:100%; height:100%; object-fit:cover; }
.post-card .body{ padding:12px 14px; display:flex; flex-direction:column; gap:6px; }
.post-card .cat{ font-family:var(--font-num); font-size:.7rem; letter-spacing:.05em; color:var(--site-accent); }
.post-card .title{ font-family:var(--heading-font); font-weight:500; font-size:.98rem; line-height:1.5; }
.post-card .date{ font-family:var(--font-num); font-size:.72rem; color:#a8a08f; }

/* ===== 単一記事 ===== */
.entry-header .entry-title{ font-size:1.7rem; margin:.2em 0 .4em; }
.entry-meta{ font-family:var(--font-num); font-size:.8rem; color:#a8a08f; display:flex; gap:14px; align-items:center; margin-bottom:16px; }
.entry-thumb{ border-radius:var(--radius-card); overflow:hidden; margin-bottom:24px; }

/* パンくず */
.breadcrumbs{ font-size:.78rem; color:#a8a08f; margin-bottom:14px; }
.breadcrumbs a{ color:#a8a08f; }
.breadcrumbs a:hover{ color:var(--site-accent); }
.breadcrumbs .sep{ margin:0 6px; }

/* 著者ボックス */
.author-box{ display:flex; gap:16px; background:#fff; border:1px solid var(--line); border-radius:var(--radius-card); padding:18px; margin:40px 0; }
.author-box .avatar img{ width:64px; height:64px; border-radius:50%; }
.author-box .name{ font-family:var(--heading-font); font-weight:700; font-size:1rem; }
.author-box .role{ font-size:.78rem; color:var(--site-accent); margin-bottom:6px; }
.author-box .bio{ font-size:.85rem; color:var(--muted); line-height:1.7; }

/* 関連記事（自サイト内のみ） */
.related h2{ font-family:var(--heading-font); font-size:1.2rem; border-left:4px solid var(--site-accent); padding-left:12px; margin:48px 0 18px; }

/* ===== 共通パーツ（子テーマで利用） ===== */
/* ① 良かった点 / 残念な点 */
.box-good,.box-bad{ border-radius:10px; padding:14px 16px; margin:18px 0; }
.box-good{ background:#E9EEE7; }
.box-bad{ background:#F3E9E3; }
.box-good .h{ font-family:var(--heading-font); font-weight:700; font-size:.9rem; color:#4f6152; margin-bottom:4px; }
.box-bad .h{ font-family:var(--heading-font); font-weight:700; font-size:.9rem; color:#8a6f5e; margin-bottom:4px; }

/* ① 購入ボタン（pill） */
.btn-shop{ display:block; text-align:center; padding:12px; border-radius:999px; font-size:.95rem; margin:8px 0; }
.btn-shop.amazon{ background:var(--rose); color:#fff; }
.btn-shop.rakuten{ background:#fff; color:var(--plum); border:1px solid var(--rose); }
.pr-note{ font-size:.72rem; color:#a8a08f; margin-top:6px; }

/* ② 特性タグ（中立） */
.trait-tags{ display:flex; flex-wrap:wrap; gap:6px; margin:10px 0 18px; }
.trait-tag{ font-size:.8rem; background:#fff; color:var(--text); border:1px solid #D8C7BB; padding:4px 12px; border-radius:var(--radius-chip); }

/* ② 成分の二面性 */
.duality{ background:#fff; border:1px solid var(--line); border-radius:10px; padding:14px 16px; margin:14px 0; }
.duality .ingredient{ font-family:var(--font-min); font-weight:600; font-size:1rem; margin-bottom:8px; }
.duality .cols{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media(max-width:560px){ .duality .cols{ grid-template-columns:1fr; } }
.duality .col{ border-radius:8px; padding:8px 10px; font-size:.85rem; line-height:1.6; }
.duality .col-plus{ background:#E9EEE7; color:#3f4f43; }
.duality .col-check{ background:#F3E9E3; color:#6b554a; }
.duality .col .lbl{ font-size:.72rem; display:block; margin-bottom:2px; opacity:.85; }

/* ② ひとことで言うと */
.summary-line{ border-left:4px solid var(--mocha); padding:4px 0 4px 12px; margin:8px 0 18px; }
.summary-line .lbl{ font-size:.75rem; color:#8a7558; }
.summary-line .txt{ font-family:var(--font-min); font-size:1.05rem; }

/* ② 成分テーブル（評価列なし） */
.ingredient-table{ width:100%; border-collapse:collapse; margin:14px 0; font-size:.9rem; }
.ingredient-table th{ text-align:left; font-weight:400; font-size:.75rem; color:#a8a08f; padding:4px 6px; }
.ingredient-table td{ border-top:1px solid var(--line); padding:8px 6px; color:var(--text); }
.ingredient-table td.feat{ color:var(--muted); }

/* ② 末尾の定型 */
.nonjudge-note{ background:#F0EDE6; border-radius:8px; padding:12px 14px; font-size:.85rem; color:var(--muted); line-height:1.7; margin:24px 0; }

/* ===== サイドバー / ウィジェット ===== */
.widget{ background:#fff; border:1px solid var(--line); border-radius:var(--radius-card); padding:16px; margin-bottom:24px; }
.widget-title{ font-family:var(--heading-font); font-size:1rem; border-left:4px solid var(--site-accent); padding-left:10px; margin:0 0 12px; }

/* ===== ボタン / ページネーション ===== */
.btn{ display:inline-block; background:var(--site-accent); color:#fff; padding:10px 24px; border-radius:999px; font-size:.9rem; }
.btn:hover{ color:#fff; opacity:.9; }
.pagination{ display:flex; gap:8px; justify-content:center; margin:40px 0; flex-wrap:wrap; }
.pagination .page-numbers{ padding:8px 14px; border:1px solid var(--line); border-radius:8px; color:var(--text); }
.pagination .current{ background:var(--site-accent); color:#fff; border-color:var(--site-accent); }

/* ===== フッター ===== */
.site-footer{ background:#fff; border-top:1px solid var(--line); margin-top:64px; padding:40px 0 24px; }
.footer-widgets{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:32px; margin-bottom:24px; }
.footer-nav ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:16px; justify-content:center; }
.footer-nav a{ color:var(--muted); font-size:.85rem; }
.site-copy{ text-align:center; font-family:var(--font-num); font-size:.75rem; color:#a8a08f; margin-top:16px; }

/* ヒーロー（front-page） */
.hero{ text-align:center; padding:48px 0; }
.hero .en{ font-family:var(--font-en); font-style:italic; font-size:1.4rem; color:var(--site-accent); }
.hero .ja{ font-family:var(--heading-font); font-size:1.6rem; margin:8px 0; }
.hero .lead{ color:var(--muted); font-size:.95rem; }
.hero-search{ max-width:480px; margin:22px auto 0; }
.search-form{ display:flex; gap:8px; }
.search-form .search-field{ flex:1; padding:11px 16px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--text); font-family:var(--font-body); }
.search-form .search-field:focus{ outline:none; border-color:var(--site-accent); }
.search-form .search-submit{ white-space:nowrap; }
.section-title{ font-family:var(--heading-font); font-size:1.3rem; border-left:4px solid var(--site-accent); padding-left:12px; margin:40px 0 20px; }

/* カテゴリーから探す */
.cat-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; margin-bottom:48px; }
.cat-card{ display:flex; flex-direction:column; gap:4px; align-items:center; background:#fff; border:1px solid var(--line); border-radius:var(--radius-card); padding:18px 12px; text-align:center; color:var(--text); }
.cat-card:hover{ border-color:var(--site-accent); color:var(--site-accent); }
.cat-card .cat-name{ font-family:var(--heading-font); font-weight:500; font-size:.95rem; }
.cat-card .cat-count{ font-family:var(--font-num); font-size:.72rem; color:#a8a08f; }


/* ===== グローバルメニュー ドロップダウン（v1.0.1 追加：サブメニュー崩れ修正） ===== */
.global-nav .menu > .menu-item{ position:relative; }
.global-nav .menu > .menu-item > a{ white-space:nowrap; }

/* サブメニューは通常は隠す（上の .global-nav ul{display:flex} を打ち消す） */
.global-nav .sub-menu{
  display:block;
  position:absolute;
  top:100%;
  left:0;
  z-index:1000;
  min-width:220px;
  margin:0;
  padding:8px 0;
  list-style:none;
  background:var(--bg);
  border:1px solid var(--mocha);
  border-radius:10px;
  box-shadow:0 8px 24px rgba(74,59,56,.12);
  opacity:0;
  visibility:hidden;
  transform:translateY(6px);
  transition:opacity .15s ease, transform .15s ease, visibility .15s;
}
/* ホバー／キーボードフォーカスで表示 */
.global-nav .menu-item-has-children:hover > .sub-menu,
.global-nav .menu-item-has-children:focus-within > .sub-menu{
  opacity:1; visibility:visible; transform:translateY(0);
}
.global-nav .sub-menu li{ display:block; }
.global-nav .sub-menu a{ display:block; white-space:nowrap; padding:8px 18px; font-size:.9rem; }
.global-nav .sub-menu a:hover{ background:var(--surface); color:var(--site-accent); }

/* 親項目に▾の合図 */
.global-nav .menu-item-has-children > a::after{ content:"▾"; margin-left:.25em; font-size:.8em; opacity:.7; }

/* スマホ：サブメニューは絶対配置をやめ、インデントした静的リストで表示 */
@media(max-width:768px){
  .global-nav .sub-menu{
    position:static; opacity:1; visibility:visible; transform:none;
    border:0; box-shadow:none; border-radius:0; min-width:0;
    padding:0 0 6px 16px; background:transparent;
  }
  .global-nav .menu-item-has-children > a::after{ content:""; }
}


/* ===== 目次（TOC） ===== */
.toc{ background:var(--surface,#F4E3E5); border:1px solid var(--line); border-radius:var(--radius-card,12px); padding:16px 20px; margin:0 0 28px; }
.toc-title{ font-family:var(--heading-font); font-weight:700; font-size:1rem; margin:0 0 8px; color:var(--text); }
.toc-list{ margin:0; padding:0; list-style:none; counter-reset:toc; }
.toc-list li{ margin:5px 0; line-height:1.6; }
.toc-list a{ color:var(--text); text-decoration:none; border-bottom:1px solid transparent; }
.toc-list a:hover{ color:var(--site-accent); border-bottom-color:var(--site-accent); }
.toc-list .toc-lv2{ counter-increment:toc; }
.toc-list .toc-lv2 > a::before{ content:counter(toc) ". "; color:var(--site-accent); font-family:var(--font-num); font-weight:500; }
.toc-list .toc-lv3{ margin-left:1.5em; font-size:.92em; }
.toc-list .toc-lv3 > a::before{ content:"– "; color:var(--muted,#9A847F); }

/* ===== SNSシェア ===== */
.share{ margin:30px 0; }
.share-label{ display:block; font-family:var(--heading-font); font-size:.9rem; color:var(--muted,#7A6661); margin-bottom:10px; }
.share-btns{ display:flex; flex-wrap:wrap; gap:8px; }
.share .sh{ flex:1 1 auto; min-width:96px; text-align:center; padding:10px 12px; border-radius:999px; font-family:var(--heading-font); font-size:.85rem; font-weight:500; text-decoration:none; border:1.5px solid var(--site-accent); color:var(--site-accent); background:#fff; cursor:pointer; transition:all .15s; }
.share .sh:hover{ background:var(--site-accent); color:#fff; }
.share .sh-copy{ border-style:dashed; }

/* ===== 前後記事ナビ ===== */
.post-navigation{ margin:30px 0; }
.post-navigation .nav-links{ display:flex; gap:14px; justify-content:space-between; }
.post-navigation .nav-previous, .post-navigation .nav-next{ flex:1 1 0; max-width:48%; }
.post-navigation .nav-next{ text-align:right; }
.post-navigation a{ display:block; padding:12px 16px; border:1px solid var(--line); border-radius:var(--radius-card,12px); text-decoration:none; background:#fff; }
.post-navigation a:hover{ border-color:var(--site-accent); }
.post-navigation .nav-sub{ display:block; font-family:var(--font-num); font-size:.72rem; color:var(--site-accent); margin-bottom:4px; }
.post-navigation .nav-title{ display:block; font-family:var(--heading-font); font-size:.9rem; color:var(--text); line-height:1.5; }
@media(max-width:560px){ .post-navigation .nav-links{ flex-direction:column; } .post-navigation .nav-previous, .post-navigation .nav-next{ max-width:100%; text-align:left; } }


/* ===== ②非ジャッジの注記（この解析について） ===== */
.nonjudge-note{ margin:34px 0 8px; padding:18px 20px; background:var(--surface,#EFEAE2); border:1px solid var(--line); border-left:4px solid var(--color-sage,#9CB3A5); border-radius:10px; }
.nonjudge-note__title{ font-family:var(--heading-font); font-weight:600; font-size:1rem; margin:0 0 8px; color:var(--text); }
.nonjudge-note p{ font-size:.9rem; line-height:1.85; color:var(--muted,#6f635c); margin:0 0 8px; }
.nonjudge-note__link{ margin:6px 0 0 !important; }
.nonjudge-note__link a{ font-family:var(--heading-font); font-size:.9rem; color:var(--site-accent); text-decoration:none; }
.nonjudge-note__link a:hover{ text-decoration:underline; }