/* =========================================================
   太平雲梯 Design Tokens ─ 主題系統
   ---------------------------------------------------------
   沉穩的灰階文字＋白底，品牌色只用在重點（湖綠、太陽金）。
   票價表的五種票別色只作為細色條標示。

   1. Primitive：品牌原色（不要直接在元件中使用）
   2. Semantic：元件只引用這一層（--c-*）
   3. Themes：[data-theme] 覆寫 semantic
   ========================================================= */

:root {
  /* ---------- 1. Primitive ---------- */
  --logo-sky:    #6cb0bd;
  --logo-forest: #00705c;
  --logo-ink:    #231815;
  --logo-gold:   #d9a627;

  /* 票價表票別色 */
  --tier-full:    #b5463c;
  --tier-discount:#e2a24f;
  --tier-half:    #2e5e3b;
  --tier-special: #175f70;
  --tier-free:    #1a9ba6;
  --tier-star:    #5b3c11;

  --gray-900: #333333;
  --gray-700: #595959;
  --gray-500: #8a8a8a;
  --gray-300: #cfcfcf;
  --gray-200: #e6e6e6;
  --gray-100: #f4f4f2;

  /* ---------- 2. Semantic（預設：晴空 cloud） ---------- */
  --c-brand:        var(--tier-special);
  --c-brand-strong: #0f4652;
  --c-on-brand:     #ffffff;
  --c-accent:       var(--logo-gold);

  --c-bg:           #ffffff;
  --c-surface:      #ffffff;
  --c-surface-2:    var(--gray-100);
  --c-heading:      var(--gray-900);
  --c-text:         var(--gray-700);
  --c-text-muted:   var(--gray-500);
  --c-line:         var(--gray-200);
  --c-line-strong:  var(--gray-300);
  --deco-sky:       #cfe6ec;   /* 頁首天空漸層，取自 A3 公版 */

  --c-ok:     #3c9a5f;
  --c-warn:   #c98a1a;
  --c-danger: var(--tier-full);

  /* 營業時間深色面板 */
  --c-panel:          #4a4a4a;
  --c-panel-head:     #5c5c5c;
  --c-panel-line:     rgba(255, 255, 255, .14);
  --c-on-panel:       #ffffff;
  --c-on-panel-muted: rgba(255, 255, 255, .66);
  --c-mark-open:      #8ec5d0;
  --c-mark-star:      #f0c35e;
  --c-mark-special:   #f29b84;
  --c-warn-on-dark:   #f0c35e;

  /* 主視覺插畫（放上實景照片後會被照片覆蓋） */
  --sky-top:     #bfe0e7;
  --sky-bottom:  #eef6f7;
  --sun:         #f3d27a;
  --ridge-far:   #cfe3d8;
  --ridge-mid:   #9fc79a;
  --ridge-near:  #6f9f6c;
  --cloud:       #ffffff;
  --bridge:      #b5463c;
  --bridge-tower:#8b9799;

  /* ---------- Typography：系統黑體，數字用 Helvetica ---------- */
  --font-sans: "Helvetica Neue", Arial, "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", sans-serif;
  --font-num:  "Helvetica Neue", Helvetica, Arial, sans-serif;

  --fs-xs:  .8125rem;
  --fs-sm:  .9375rem;
  --fs-md:  1.0625rem;
  --fs-lg:  1.25rem;
  --fs-xl:  clamp(1.25rem, 1.05rem + .8vw, 1.5rem);
  --fs-2xl: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem);
  --fs-3xl: clamp(1.9rem, 1.3rem + 2.4vw, 3rem);

  /* ---------- Layout ---------- */
  --container: 1120px;
  --gutter: clamp(20px, 5vw, 64px);
  --frame: clamp(10px, 1.2vw, 16px);        /* 主視覺與頁尾外框留白 */
  --section-y: clamp(72px, 10vw, 140px);
  --header-h: clamp(68px, 6.5vw, 92px);
  --logo-clear: clamp(8px, 1vw, 14px);      /* 標誌四周最小留白 */

  --radius: 10px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- 3. Themes：季節只微調插畫與重點色 ---------- */
[data-theme="tea"] {
  --deco-sky: #d6e9d9;
  --c-brand: var(--tier-half);
  --c-brand-strong: #1f4229;
  --sky-top: #cfe8dc;
  --ridge-mid: #a9cf8e;
  --ridge-near: #6c9e5f;
}

[data-theme="sunset"] {
  --deco-sky: #f3dccb;
  --sky-top: #f3cdb1;
  --sky-bottom: #fbf0e4;
  --sun: #f5c26b;
  --ridge-far: #e6d3c2;
  --ridge-mid: #b9b48a;
  --ridge-near: #7f8f62;
}

[data-theme="night"] {
  --deco-sky: #1c2b31;
  --c-brand: #7fc0cb;
  --c-brand-strong: #a9d8df;
  --c-on-brand: #0d1b1e;
  --c-bg: #161a1b;
  --c-surface: #1d2223;
  --c-surface-2: #222829;
  --c-heading: #eeeeee;
  --c-text: #c9cdcd;
  --c-text-muted: #8f9797;
  --c-line: rgba(255, 255, 255, .1);
  --c-line-strong: rgba(255, 255, 255, .2);
  --c-panel: #262c2d;
  --c-panel-head: #323a3b;
  --sky-top: #0e1a22;
  --sky-bottom: #1f3038;
  --sun: #efe6c2;
  --ridge-far: #1f3236;
  --ridge-mid: #1a2a2a;
  --ridge-near: #121d1e;
  --cloud: #9fb2b4;
  --bridge: #e0705f;
  color-scheme: dark;
}