/* =========================================================
   大狼狗 JSON 工具箱 — 設計 Token
   風格：現代化毛玻璃・淺藍（Glassmorphism）
   ========================================================= */

:root {
  /* === 主色：現代淺藍（Sky 600 交互藍 + Sky 500 點綴） === */
  --dlg-color-primary:        #0284C7;  /* 交互藍：連結、主按鈕、激活態 */
  --dlg-color-primary-deep:   #0369A1;  /* 深藍：hover 加深 */
  --dlg-color-primary-soft:   #0EA5E9;  /* 亮藍：hover 提亮 */

  /* === 點睛色（藍系，克制） === */
  --dlg-color-accent:         #0EA5E9;  /* 點綴藍：選中態、聚焦框、徽章 */
  --dlg-color-accent-deep:    #0369A1;  /* 正文藍字、代碼、數字 */
  --dlg-color-accent-soft:    #E0F2FE;  /* 淡藍底 */

  /* === 中性色：黑字・毛玻璃白 === */
  --dlg-color-text:           #0F172A;
  --dlg-color-text-soft:      #475569;
  --dlg-color-text-muted:     #94A3B8;
  --dlg-color-bg:             #EAF3FB;  /* 頁面底：淺藍 */
  --dlg-color-bg-card:        #FFFFFF;
  --dlg-color-bg-elevated:    #F1F6FB;
  --dlg-color-border:         #D9E4EF;
  --dlg-color-border-strong:  #C3D2E0;

  /* === 毛玻璃 === */
  --dlg-glass-bg:       rgba(255, 255, 255, 0.62);  /* 玻璃面 */
  --dlg-glass-bg-strong: rgba(255, 255, 255, 0.78); /* 玻璃面（強） */
  --dlg-glass-border:   rgba(255, 255, 255, 0.65);  /* 玻璃描邊 */
  --dlg-glass-inset:    rgba(255, 255, 255, 0.55);  /* 內嵌玻璃（編輯區） */
  --dlg-glass-inset-soft: rgba(255, 255, 255, 0.38); /* 內嵌玻璃（淺） */
  --dlg-glass-blur:     16px;

  /* === 狀態色 === */
  --dlg-color-success:        #157F3D;
  --dlg-color-success-soft:   #E4F4EA;
  --dlg-color-danger:         #B31226;
  --dlg-color-danger-soft:    #FBE9EC;
  --dlg-color-warning:        #B45309;
  --dlg-color-warning-soft:   #FDF0DD;
  --dlg-color-info:           #0E7490;
  --dlg-color-info-soft:      #E0F5F9;

  /* === 字體（現代無襯線） === */
  --dlg-font-zh-title:  "Noto Sans SC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif;
  --dlg-font-zh-body:   "Noto Sans SC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif;
  --dlg-font-en-title:  "Inter", "Helvetica Neue", "Segoe UI", Arial, "Noto Sans SC", sans-serif;
  --dlg-font-mono:      "JetBrains Mono", "Cascadia Code", Consolas, "Source Code Pro", monospace;

  /* === 字號 === */
  --dlg-fs-12: 0.75rem;
  --dlg-fs-13: 0.8125rem;
  --dlg-fs-14: 0.875rem;
  --dlg-fs-36: 2.25rem;
  --dlg-fs-15: 0.9375rem;
  --dlg-fs-16: 1rem;
  --dlg-fs-18: 1.125rem;
  --dlg-fs-20: 1.25rem;
  --dlg-fs-24: 1.5rem;
  --dlg-fs-28: 1.75rem;
  --dlg-fs-32: 2rem;
  --dlg-fs-40: 2.5rem;
  --dlg-fs-52: 3.25rem;

  /* === 行高 === */
  --dlg-lh-tight: 1.25;
  --dlg-lh-normal: 1.5;
  --dlg-lh-loose: 1.7;

  /* === 圓角（毛玻璃需要更大圓角） === */
  --dlg-radius-xs: 4px;
  --dlg-radius-sm: 8px;
  --dlg-radius-md: 12px;
  --dlg-radius-lg: 16px;
  --dlg-radius-xl: 20px;
  --dlg-radius-pill: 999px;

  /* === 間距（4 的倍數） === */
  --dlg-space-1: 4px;
  --dlg-space-2: 8px;
  --dlg-space-3: 12px;
  --dlg-space-4: 16px;
  --dlg-space-5: 20px;
  --dlg-space-6: 24px;
  --dlg-space-8: 32px;
  --dlg-space-10: 40px;
  --dlg-space-12: 48px;
  --dlg-space-16: 64px;
  --dlg-space-20: 80px;

  /* === 陰影（輕、中性，帶一點藍調） === */
  --dlg-shadow-sm:  0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.03);
  --dlg-shadow-md:  0 4px 16px rgba(15, 23, 42, 0.06), 0 2px 4px rgba(15, 23, 42, 0.03);
  --dlg-shadow-lg:  0 16px 40px rgba(15, 23, 42, 0.10), 0 4px 10px rgba(15, 23, 42, 0.05);
  --dlg-shadow-accent: 0 2px 8px rgba(2, 132, 199, 0.18);

  /* === 過渡 === */
  --dlg-ease: cubic-bezier(.2,.6,.2,1);
  --dlg-dur-fast:  150ms;
  --dlg-dur:       220ms;
  --dlg-dur-slow:  380ms;

  /* === 佈局 === */
  --dlg-topbar-h: 64px;
  --dlg-container-max: 1200px;
}

/* === 深色主題覆蓋 === */
[data-bs-theme="dark"] {
  /* 主色改為深石墨，頂欄/頁腳沉穩 */
  --dlg-color-primary:        #38BDF8;
  --dlg-color-primary-deep:   #0C4A6E;
  --dlg-color-primary-soft:   #7DD3FC;
  /* 藍色提亮，深色下保持可讀 */
  --dlg-color-accent:         #38BDF8;
  --dlg-glass-bg:       rgba(17, 24, 39, 0.55);
  --dlg-glass-bg-strong: rgba(15, 20, 30, 0.75);
  --dlg-glass-border:   rgba(148, 163, 184, 0.18);
  --dlg-glass-inset:    rgba(17, 24, 39, 0.45);
  --dlg-glass-inset-soft: rgba(17, 24, 39, 0.30);

  --dlg-color-text:           #E2E8F0;
  --dlg-color-text-soft:      #94A3B8;
  --dlg-color-text-muted:     #64748B;
  --dlg-color-bg:             #0B1220;
  --dlg-color-bg-card:        #111827;
  --dlg-color-bg-elevated:    #1E293B;
  --dlg-color-border:         #233042;
  --dlg-color-border-strong:  #334155;

  --dlg-color-success-soft:   #1A2D22;
  --dlg-color-danger-soft:    #2A1817;
  --dlg-color-warning-soft:   #2A2210;
  --dlg-color-info-soft:      #102530;
  --dlg-color-accent-soft:    #16263A;
  --dlg-color-accent-deep:    #7DD3FC;

  --dlg-shadow-sm:  0 1px 2px rgba(0, 0, 0, 0.4);
  --dlg-shadow-md:  0 4px 12px rgba(0, 0, 0, 0.5);
  --dlg-shadow-lg:  0 12px 35px rgba(0, 0, 0, 0.6);
  --dlg-shadow-accent: 0 2px 8px rgba(56, 189, 248, 0.16);
}