/* =============================================================================
   GTN Workspace — Claude 色彩系統（單一真理來源 / single source of truth）
   -----------------------------------------------------------------------------
   設計原則：暖色暗黑、低對比、文件感、克制、有留白。不是普通黑色後台。
   橙色是「指示色」不是「裝飾色」——只出現在「當前重點」與「主操作」。

   ── 載入方式 ────────────────────────────────────────────────────────────────
   因為各面板用 iframe 載入，CSS 變數不跨 iframe 邊界繼承。
   每個面板 HTML 都必須在自己的樣式之前 link 這個檔案：
     <link rel="stylesheet" href="../styles/theme.css">   (子資料夾面板)
     <link rel="stylesheet" href="styles/theme.css">       (panel.html)

   ── 使用規則（務必遵守，否則 UI 會亂）──────────────────────────────────────
   1. 背景：app→sidebar→panel→card→input 逐層變淺，差距很小，全部偏暖咖灰。
   2. accent(橙)：只給「保存按鈕」「當前選中項」「focus 邊框」「小範圍重點字」。
      普通元素一律不准用橙。
   3. 標籤：普通一律暖灰 pill；只有「選中」才用淡橙底+橙字。不要一籤一色。
   4. toggle：開=橙，關=暖灰，禁用=更暗更淡。關閉不要用純黑。
   5. danger：刪除預設只用紅色「文字」，hover 才出淡紅底；確認彈窗才用紅按鈕。
   6. 狀態色(success/warning/info)：一律低飽和，禁用亮綠/亮黃/亮藍。
   7. 文字分五層，不要全部白色。
   8. 邊框非常柔和，普通 soft / hover medium / focus 才用橙。
   ============================================================================= */

:root {
  /* —— 1. 背景系統（Apple Pro 石墨，非純黑，逐層極微提亮，中性偏暖）———————— */
  --bg-app:      #141416;   /* 最外層 app 底色 */
  --bg-sidebar:  #1a1a1d;   /* 左側欄 */
  --bg-panel:    #1d1d20;   /* 右側編輯區 / 主面板 */
  --bg-card:     #212124;   /* 列表項 / 卡片 */
  --bg-input:    #26262a;   /* 輸入框 / 編輯器 */
  --bg-hover:    #2c2c31;   /* 一般 hover 底 */

  /* —— 2. 主色 accent（iOS 藍，只給重點與主操作；全插件統一 2026-06-13）——— */
  --accent:        #0a84ff;            /* iOS 藍：只給「保存」主按鈕 */
  --accent-hover:  #3d9bff;            /* accent hover */
  --accent-soft:   rgba(10,132,255,0.14); /* 淡藍底：選中狀態 */
  --accent-border: rgba(10,132,255,0.30); /* 藍邊框：focus / active */
  --accent-text:   #6fb6ff;            /* 藍字：小標籤 / 當前狀態 */

  /* —— 3. 標籤系統（普通灰，選中才橙）—————————————————————————————————— */
  --tag-bg:           rgba(255,255,255,0.055);
  --tag-text:         #aeaeb2;
  --tag-border:       rgba(255,255,255,0.08);
  --tag-active-bg:    rgba(10,132,255,0.14);
  --tag-active-text:  #6fb6ff;
  --tag-active-border:rgba(10,132,255,0.28);

  /* —— 4. 按鈕系統 ——————————————————————————————————————————————————— */
  /* primary = accent 實色；secondary = 灰底；danger = 見下方 */
  --button-secondary-bg:    rgba(255,255,255,0.06);
  --button-secondary-hover: rgba(255,255,255,0.10);

  /* —— 5. Toggle / 開關（開=橙，關=暖灰）————————————————————————————— */
  --toggle-on-bg:     #0a7be0;
  --toggle-on-border: #0a84ff;
  --toggle-on-knob:   #ffffff;
  --toggle-off-bg:    #39393d;
  --toggle-off-border:#48484a;
  --toggle-off-knob:  #c7c7cc;

  /* 禁用狀態（更暗更淡）*/
  --disabled-bg:     #2a2a2e;
  --disabled-text:   #6e6e73;
  --disabled-border: #38383c;

  /* —— 6. 危險 / 刪除（低調但看得出危險）———————————————————————————— */
  --danger:        #ff453a;
  --danger-soft:   rgba(255,69,58,0.12);
  --danger-border: rgba(255,69,58,0.26);

  /* —— 7. 狀態色（成功/警告/資訊，全部低飽和）—————————————————————————— */
  --success:      #30d158;
  --success-soft: rgba(48,209,88,0.16);
  --warning:      #ff9f0a;
  --warning-soft: rgba(255,159,10,0.16);
  --info:         #5e9dff;
  --info-soft:    rgba(94,157,255,0.14);

  /* —— 8. 文字層級（不要全部白色）————————————————————————————————————— */
  --text-primary:   #f5f5f7;  /* 標題（冷石墨 iOS）*/
  --text-secondary: #c7c7cc;  /* 正文 */
  --text-muted:     #98989f;  /* label / 時間 / 說明 */
  --text-subtle:    #6e6e73;  /* placeholder / 次要備註 */
  --text-disabled:  #5a5a5e;  /* disabled */

  /* —— 9. 邊框（非常柔和的暖灰線）——————————————————————————————————— */
  --border-soft:   rgba(255,255,255,0.08);  /* 普通卡片 / 輸入框 */
  --border-medium: rgba(255,255,255,0.12);  /* hover */
  --border-focus:  rgba(10,132,255,0.40);   /* 輸入框 focus */
}