/* ============================================================
   theme.css — このシステム全体の「色・角丸・影・書体」の正本（2026-10-30）

   読み込み順は全ページで最初（style.css より前）。ここに無い色を各 CSS に直書きしない。
   既存の各トークン（--primary-color / --shell-* / --td-* / --sm-* / --bk-* / --cm-*）は、
   それぞれの CSS 側でこのファイルの --t-* を指す別名になっている。
   見た目の系統を変えたいときは、このファイルの値だけを入れ替える（部品側は触らない）。

   考え方
   - 淡いセージホワイトの地 + 白いカード + くすんだセージグリーン 1 色（主ボタン・選択中）。黒いボタンと冷たい灰青は使わない。
   - 状態の色相は変えない（確定=青 / 来店待ち=橙 / 完了=緑 / キャンセル=赤 / 保留=紫）。彩度だけ下げて柔らかくした。
     どの状態色も「文字（strong）が白地で 4.5:1 以上」「ink が soft 地で 4.5:1 以上」。色だけに頼らず、必ず文字・記号が付く。
   - 本文・数値・時刻は --t-muted 以上の濃さ。--t-faint は補助ラベル・ヒントだけ（白地 3:1 程度）。
   - LINE の吹き出しの緑（#06c755）とチャット背景はお客様の LINE と揃えるため、ここでは持たない（admin_chat.css / chat.html）。
   - repair-board（店内ボード）は暗色の別物なので、このファイルを読まない。
   ============================================================ */

:root {
  /* ── 中立色（ほんのり緑がかった灰。冷たい slate も茶色っぽい灰も使わない） ── */
  --t-page: #f8faf8;          /* ページの地（淡いセージホワイト） */
  --t-surface: #ffffff;       /* カード・入力欄 */
  --t-surface-2: #f1f5f3;     /* カードの中の一段下の面・表の縞・無効 */
  --t-line: #e1e9e6;          /* 罫線・区切り */
  --t-line-strong: #cfdad6;   /* 入力欄など「ここに書く」の縁 */
  --t-faint: #8a9894;         /* 補助ラベル・ヒントだけ（本文には使わない） */
  --t-muted: #5f6f6b;         /* 時刻・金額・補助データ（白地 5.5:1） */
  --t-ink-2: #44524f;         /* 二番目の文字 */
  --t-ink: #232e2c;           /* 本文・見出し */
  --t-ink-rgb: 35, 46, 44;    /* 影・透過の罫線用 */

  /* ── アクセント（セージグリーン）: 主ボタン・選択中・リンク。白文字が 5:1 以上 */
  --t-accent: #267770;
  --t-accent-hover: #1c5d57;
  --t-accent-soft: #e6f3f1;   /* 選択中の地・やわらかい強調 */
  --t-accent-mid: #a9d5cf;    /* 選択中の縁 */
  --t-accent-ink: #184f4a;    /* soft の上の文字（7:1） */
  --t-accent-rgb: 38, 119, 112;
  --t-ring: rgba(38, 119, 112, .30);

  /* ── 状態・意味の色（各: strong=文字/塗り, ink=濃い文字, mid=縁, soft=地） ── */
  --t-red: #c0382f;     --t-red-ink: #8f2a25;     --t-red-mid: #efb3ae;     --t-red-soft: #fdeeed;
  --t-orange: #b04f08;  --t-orange-ink: #8c4207;  --t-orange-mid: #f2c08f;  --t-orange-soft: #fdf1e4;
  --t-amber: #946400;   --t-amber-ink: #74500a;   --t-amber-mid: #ecd38a;   --t-amber-soft: #fff7e0;
  --t-green: #2a7548;   --t-green-ink: #1f5a38;   --t-green-mid: #a7d3b6;   --t-green-soft: #e8f4ec;
  --t-teal: #1a7873;    --t-teal-ink: #14605c;    --t-teal-mid: #a3d4cf;    --t-teal-soft: #e3f3f1;
  --t-blue: #2b68ae;    --t-blue-ink: #1f4f8c;    --t-blue-mid: #b2cdee;    --t-blue-soft: #e8f0fb;
  --t-purple: #7b4fb0;  --t-purple-ink: #5a3590;  --t-purple-mid: #d2bfe9;  --t-purple-soft: #f1eaf9;
  --t-indigo: #5560c0;  --t-indigo-ink: #3d4799;  --t-indigo-mid: #c0c5ef;  --t-indigo-soft: #eceefb;

  /* 予約・案件の状態（意味→色の対応はここだけで決める） */
  --t-st-pending: var(--t-muted);
  --t-st-booked: var(--t-blue);
  --t-st-visiting: var(--t-orange);
  --t-st-completed: var(--t-green);
  --t-st-cancelled: var(--t-red);
  --t-st-hold: var(--t-purple);
  --t-st-today: var(--t-blue);
  --t-st-tomorrow: var(--t-blue-ink);
  --t-st-change: var(--t-indigo);

  /* ── 形（角丸・影・動き） ── */
  --t-r-card: 16px;
  --t-r-ctl: 10px;
  --t-r-pill: 999px;
  --t-shadow-card: 0 18px 44px -28px rgba(var(--t-ink-rgb), .22), 0 3px 10px rgba(var(--t-ink-rgb), .05);
  --t-shadow-float: 0 20px 40px -17px rgba(var(--t-ink-rgb), .24), 0 3px 10px rgba(var(--t-ink-rgb), .09);
  --t-ease: cubic-bezier(.22, 1, .36, 1);

  /* ── 書体（欧数字は Inter、日本語は各 OS のゴシック） ── */
  --t-font: "Inter", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Yu Gothic", "Noto Sans JP", "Meiryo", sans-serif;
}