/* 設計 tokens — 全站（乘客/司機/客服）沿用。沿用簡報品牌：深藍主 + 琥珀強調 */

/* Inter 可變字型（自架，僅 Latin 子集）：英文/數字更精緻現代；
   中文字不在 Inter 內、會自動落到字型堆下一個（Noto Sans TC / 微軟正黑）。
   依 ui-ux-pro-max 建議「Minimal Swiss / Inter」用於後台儀表板。 */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/static/fonts/inter-latin.woff2") format("woff2");
}

:root {
  /* 品牌色 */
  --c-primary: #1F3B5C;
  --c-primary-d: #163A5F;
  --c-primary-l: #2D5480;
  --c-accent: #EFA13C;
  --c-accent-d: #B9772A;
  --c-teal: #0E8088;

  /* 中性 / 底 */
  --c-bg: #F3F6F9;
  --c-card: #FFFFFF;
  --c-ink: #203040;
  --c-muted: #5E6E7C;
  --c-line: #D9E1E8;
  --c-border: var(--c-line);   /* 別名：多處程式引用 --c-border，統一指到 --c-line（修消失的分隔線）*/

  /* 狀態（warn 不得與品牌 accent 同值，否則「警告」與「強調」不可辨） */
  --c-success: #2E8B6F;
  --c-warn: #B9772A;      /* 深琥珀：與 accent #EFA13C 區隔，白底文字對比 4.6:1 */
  --c-danger: #C0453B;
  --c-info: #0E8088;      /* = teal（刻意共用，資訊色即品牌 teal） */

  /* 語意色的淡底（chip/警示/hover 一律引用，禁止手抄 hex） */
  --c-danger-bg: #fbeae6;
  --c-warn-bg: #fbefd9;
  --c-success-bg: #e3f3ec;
  --c-accent-bg: #fdf0dc;   /* 淡琥珀底（到達倒數膠囊）*/
  --c-accent-t: #b0741a;    /* 琥珀底上的文字色 */
  --c-info-bg: #e7f1f1;

  /* ── 語意色板（依 10 人設計評鑑：徽章/圖表/狀態一律取此，杜絕手抄）── */
  --su-50: #ECFDF3; --su-100: #D1FADF; --su-500: #12B76A; --su-700: #027A48;
  --wa-50: #FFFAEB; --wa-100: #FEF0C7; --wa-500: #F79009; --wa-700: #B54708;
  --da-50: #FEF3F2; --da-100: #FEE4E2; --da-500: #F04438; --da-700: #B42318;
  --in-50: #EFF8FF; --in-100: #D1E9FF; --in-500: #2E90FA; --in-700: #175CD3;

  /* ── 中性 slate 9 階：層次靠灰階拉開（文字/邊框/分隔/hover）── */
  --sl-25: #FCFCFD; --sl-50: #F8FAFC; --sl-100: #F2F4F7; --sl-200: #E4E7EC;
  --sl-300: #D0D5DD; --sl-400: #98A2B3; --sl-500: #667085; --sl-600: #475467;
  --sl-700: #344054; --sl-900: #101828;

  /* 文字對比 */
  --c-on-primary: #FFFFFF;
  --c-on-accent: #3A2606;

  /* 字體 */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Noto Sans TC",
    "Microsoft JhengHei", "PingFang TC", "Segoe UI", sans-serif;
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 15px;
  --fs-lg: 17px;
  --fs-xl: 20px;
  --fs-2xl: 24px;
  --lh: 1.5;

  /* 間距（4px 基準）*/
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;

  /* 圓角 / 陰影（分層、柔和）*/
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 16px;
  --r-pill: 999px;
  --shadow-1: 0 1px 2px rgba(28, 45, 64, 0.06), 0 1px 3px rgba(28, 45, 64, 0.08);
  --shadow-md: 0 2px 6px rgba(28, 45, 64, 0.08), 0 8px 20px rgba(28, 45, 64, 0.10);
  --shadow-2: 0 10px 28px rgba(28, 45, 64, 0.16), 0 16px 40px rgba(28, 45, 64, 0.10);
  --shadow-focus: 0 0 0 3px rgba(45, 84, 128, 0.20);
  --shadow-accent: 0 4px 14px rgba(239, 161, 60, 0.38);

  /* 動效 */
  --dur-fast: 0.12s;
  --dur: 0.2s;
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);

  /* 尺寸 */
  --touch: 44px;
  --appbar-h: 52px;
  --maxw: 520px;
}
