/* =========================
   Global Color Tokens + Auto Light/Dark
   ========================= */

/* 1) Light (default) — ピンク寄りの白 */
:root{
  --bg:#f5e9ee;           /* 背景 */
  --text:#111111;         /* 文字 */
  --muted:#777777;        /* 補助文字 */
  --border:#e6dfe9;       /* 枠/区切り */
  --card:#ffffff;         /* カード/ボックス面 */
  --link:#0066cc;         /* リンク */
  --btn-bg:#ff3b85;       /* ボタン背景（アクセント） */
  --btn-text:#ffffff;     /* ボタン文字 */

  /* 後方互換の別名（既存CSSが参照していてもOK） */
  --site-bg:var(--bg);
}

/* 2) Dark — 閲覧者のOS/ブラウザがダーク設定のとき自動適用 */
@media (prefers-color-scheme: dark){
  :root{
    --bg:#111111;
    --text:#eeeeee;
    --muted:#aaaaaa;
    --border:#2a2f3a;
    --card:#171a1f;
    --link:#7ab6ff;
    --btn-bg:#ff3b85;     /* アクセントは共通運用 */
    --btn-text:#ffffff;
  }
}

/* 3) Base Apply（土台にトークンを適用） */
html,body{
  background:var(--bg) !important;
  color:var(--text);
}

/* サイトの主要ラッパーは透過（背景はhtml/bodyが担当） */
.site,.site-content,.site-main,.section-inner,.post-inner,
.archive-header,#site-header,#site-footer{
  background:transparent !important;
  color:var(--text);
}

/* 一般要素の色合わせ（必要最低限） */
a{ color:var(--link); }
hr,.wp-block-separator{ border-color:var(--border); }

.card,.post,.door,.feature,
.wp-block-group,.wp-block-columns{
  background:var(--card);
  border:1px solid var(--border);
  color:var(--text);
}

.button,.btn,.wp-element-button,.wp-block-button__link,.slider-button{
  background:var(--btn-bg);
  color:var(--btn-text);
  border:1px solid transparent;
  text-decoration:none;
}
.button:hover,.btn:hover,.wp-element-button:hover,
.wp-block-button__link:hover,.slider-button:hover{
  filter:brightness(1.05);
}

/* フォーム/コード等の下地色をカードに合わせる */
input,select,textarea{
  background:var(--card);
  color:var(--text);
  border:1px solid var(--border);
}
table{ border-color:var(--border); }
th,td{ border-color:var(--border); }
pre,code,kbd,samp{
  background:var(--card);
  color:var(--text);
  border:1px solid var(--border);
}

/* selection色をアクセント寄りに */
::selection{ background:rgba(255,59,133,.25); }

/* =========================
   Minimal Resets / Safety
   ========================= */

/* テーマ/プラグインの .row 余白打ち消し（副作用最小） */
.row{ margin-left:0 !important; margin-right:0 !important; }

/* ホームのページタイトル帯を消す（余白もゼロ） */
body.home .entry-header,
body.front-page .entry-header,
body.home .page-header,
body.front-page .page-header{
  display:none !important;
}

body.home .site-main > article:first-of-type,
body.front-page .site-main > article:first-of-type{
  margin-top:0 !important;
  padding-top:0 !important;
}

/* ==== ライト/ダーク自動対応：サイト共通テキスト色 ==== */

/* 基本（ライト） */
:root{
  --site-bg: #f3efe2;      /* 既存の背景変数があれば流用 */
  --text:   #111;          /* 本文 */
  --label:  #333;          /* ラベル（左側） */
  --muted:  #555;          /* 補助テキスト（安心テキストなど） */
}

/* ダーク */
@media (prefers-color-scheme: dark){
  :root{
    --site-bg: #111;       /* ダーク時の背景（好みで調整） */
    --text:   #eee;
    --label:  #ddd;
    --muted:  #bbb;
  }
}

/* 背景に反映（既に書いていれば不要） */
html, body{ background: var(--site-bg) !important; }
