/* ================================================================
   Tokens — Fluent (WinUI 3) Design System
   遵循 Windows 11 WinUI 3 分层体系：Mica 底衬 + Layer 表面 +
   标准强调色 (#0067C0 / #4CA6E8) + Segoe UI Variable 字体。
   Single source of truth for color, type, spacing, and hierarchy.
   ================================================================ */

:root {
  /* === Surface（Win11 分层：Mica 底衬 → Layer → Card） === */
  --surface-sunken:     rgba(243, 243, 243, 0.60);  /* 侧边栏（Mica 上浅层） */
  --surface-primary:    #F3F3F3;                      /* 主区域背景（非 Mica 平台回退） */
  /* 标题栏半透明衬底 = surface-primary 82%（预混色，不用 color-mix() 等新颜色函数） */
  --surface-header:     rgba(243, 243, 243, 0.82);
  --surface-secondary:  rgba(0, 0, 0, 0.028);         /* 思考/搜索等内嵌块（Subtle） */
  --surface-card:       #FFFFFF;                      /* 卡片、气泡、下拉 */
  /* 输入卡玻璃衬底 = surface-card 65%（预混色）：压住模糊云提升打字可读性，保留透 blur */
  --surface-card-glass: rgba(255, 255, 255, 0.65);
  --surface-hover:      rgba(0, 0, 0, 0.045);         /* 悬浮态（Subtle hover） */
  --surface-pressed:    rgba(0, 0, 0, 0.075);         /* 按压态 */

  /* === Surface — Modal === */
  --surface-modal:      #F9F9F9;
  --surface-modal-side: #F0F0F0;
  --surface-modal-card: #FFFFFF;
  --surface-top-highlight: rgba(255, 255, 255, 0.70);  /* 弹层顶部 inset 高光 */

  /* === Surface — Control（输入框等控件填充） === */
  --surface-control:    rgba(255, 255, 255, 0.70);

  /* === Text（WinUI 文字梯度：89.6% / 60.6% / 44.6% 黑） === */
  --text-primary:       #1B1B1B;
  --text-secondary:     #616161;
  --text-tertiary:      #767676;

  /* === Accent（Win11 标准蓝） === */
  --accent:             #0067C0;
  --accent-hover:       #005A9E;
  --accent-subtle:      rgba(0, 103, 192, 0.09);
  --accent-border:      rgba(0, 103, 192, 0.35);
  --on-accent:          #FFFFFF;

  /* === Glass（输入卡片边框；--glass 填充色已随首页透明化移除，260812） === */
  --glass-border:       rgba(0, 0, 0, 0.06);
  /* 输入卡镜像调色（仅输入卡；标题栏保持纯 blur）：亮色压对比提亮 → 白磨砂观感 */
  --input-card-blur-filter: contrast(0.25) brightness(2);

  /* === Rules（发丝线） === */
  --rule:               rgba(0, 0, 0, 0.08);
  --rule-strong:        rgba(0, 0, 0, 0.18);
  --border-primary:     var(--rule);

  /* === Semantic（WinUI System 色） === */
  --error:              #C42B1C;
  --error-bg:           rgba(196, 43, 28, 0.08);
  --success:            #107C10;
  --success-bg:         rgba(16, 124, 16, 0.08);

  /* === Shadows（Fluent depth：轻、弥散） === */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.10), 0 8px 24px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.16), 0 2px 8px rgba(0, 0, 0, 0.08);

  /* === Typography — Font Families（WinUI 标准字体栈） === */
  --font-sans: 'Segoe UI Variable Text', 'Segoe UI', 'Microsoft YaHei UI', 'Microsoft YaHei', system-ui, sans-serif;
  --font-mono: 'Cascadia Code', 'JetBrains Mono', 'Cascadia Mono', 'Consolas', monospace;

  /* === Typography — Hierarchy（对齐 WinUI：Body 14 / Subtitle 20） === */
  --fs-l1:      20px;
  --lh-l1:      1.4;
  --fw-l1:      600;

  --fs-l2:      14px;
  --lh-l2:      1.5;
  --fw-l2:      400;

  --fs-l3:      13px;
  --lh-l3:      1.4;
  --fw-l3:      400;

  --fs-l4:      12px;
  --lh-l4:      1.3;
  --fw-l4:      500;

  --fs-l5:      13px;
  --lh-l5:      1.5;
  --fw-l5:      400;

  /* === Typography — Message specific === */
  --fw-user-msg:  400;
  --fw-ai-msg:    400;
  --fw-semibold:  600;

  /* === Spacing Scale === */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  12px;
  --space-lg:  16px;
  --space-xl:  24px;
  --space-2xl: 32px;
  --space-3xl: 48px;

  /* === Layout === */
  --sidebar-width:  300px;
  --content-max:    720px;
  --content-narrow: 680px;
  --content-wide:   800px;
  --titlebar-h:     32px;

  /* === Misc（WinUI：控件 4px / 卡片与浮层 8px） === */
  --radius-sm: 4px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --avatar-size: 32px;
  --transition-fast: 120ms ease;
  --transition-normal: 200ms ease;
  --transition-modal: 240ms cubic-bezier(0.16, 1, 0.3, 1);  /* WinUI 弹层缓出 */
  --ease-winui: cubic-bezier(0.16, 1, 0.3, 1);            /* WinUI 缓出曲线 */
  --transition-popover: 160ms var(--ease-winui);          /* 弹出小面板入场 */
}

/* ================================================================
   Dark Mode — Explicit (data-theme="dark")
   ================================================================ */

:root[data-theme="dark"] {
  /* === Surface === */
  --surface-sunken:     rgba(32, 32, 32, 0.50);
  --surface-primary:    #202020;
  --surface-header:     rgba(32, 32, 32, 0.82);
  --surface-secondary:  rgba(255, 255, 255, 0.05);
  --surface-card:       #2D2D2D;
  /* 输入卡玻璃衬底 = surface-card 65%（预混色） */
  --surface-card-glass: rgba(45, 45, 45, 0.65);
  --surface-hover:      rgba(255, 255, 255, 0.08);
  --surface-pressed:    rgba(255, 255, 255, 0.12);

  /* === Surface — Modal === */
  --surface-modal:      #2B2B2B;
  --surface-modal-side: #242424;
  --surface-modal-card: #333333;
  --surface-top-highlight: rgba(255, 255, 255, 0.06);  /* 弹层顶部 inset 高光 */

  /* === Surface — Control === */
  --surface-control:    rgba(255, 255, 255, 0.06);

  /* === Text（WinUI 文字梯度：100% / 78.6% / 60.6% 白） === */
  --text-primary:       #FFFFFF;
  --text-secondary:     #C8C8C8;
  --text-tertiary:      #9B9B9B;

  /* === Accent（暗色下高亮蓝，深字压底） === */
  --accent:             #4CA6E8;
  --accent-hover:       #6FB8EE;
  --accent-subtle:      rgba(76, 166, 232, 0.15);
  --accent-border:      rgba(76, 166, 232, 0.40);
  --on-accent:          #06263F;

  /* === Glass === */
  --glass-border:       rgba(255, 255, 255, 0.08);
  /* 输入卡镜像调色：暗色压亮度 → 黑磨砂观感 */
  --input-card-blur-filter: brightness(0.5);

  /* === Rules === */
  --rule:               rgba(255, 255, 255, 0.09);
  --rule-strong:        rgba(255, 255, 255, 0.20);

  /* === Semantic === */
  --error:              #FF99A4;
  --error-bg:           rgba(255, 153, 164, 0.10);
  --success:            #6CCB5F;
  --success-bg:         rgba(108, 203, 95, 0.10);

  /* === Shadows === */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.40);
  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.45), 0 8px 24px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.55), 0 2px 8px rgba(0, 0, 0, 0.40);

  color-scheme: dark;
}

/* ================================================================
   Dark Mode — System preference (no explicit theme override)
   ================================================================ */

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    /* === Surface === */
    --surface-sunken:     rgba(32, 32, 32, 0.50);
    --surface-primary:    #202020;
    --surface-header:     rgba(32, 32, 32, 0.82);
    --surface-secondary:  rgba(255, 255, 255, 0.05);
    --surface-card:       #2D2D2D;
    /* 输入卡玻璃衬底 = surface-card 65%（预混色） */
    --surface-card-glass: rgba(45, 45, 45, 0.65);
    --surface-hover:      rgba(255, 255, 255, 0.08);
    --surface-pressed:    rgba(255, 255, 255, 0.12);

    /* === Surface — Modal === */
    --surface-modal:      #2B2B2B;
    --surface-modal-side: #242424;
    --surface-modal-card: #333333;
    --surface-top-highlight: rgba(255, 255, 255, 0.06);

    /* === Surface — Control === */
    --surface-control:    rgba(255, 255, 255, 0.06);

    /* === Text === */
    --text-primary:       #FFFFFF;
    --text-secondary:     #C8C8C8;
    --text-tertiary:      #9B9B9B;

    /* === Accent === */
    --accent:             #4CA6E8;
    --accent-hover:       #6FB8EE;
    --accent-subtle:      rgba(76, 166, 232, 0.15);
    --accent-border:      rgba(76, 166, 232, 0.40);
    --on-accent:          #06263F;

    /* === Glass === */
    --glass-border:       rgba(255, 255, 255, 0.08);
    /* 输入卡镜像调色：暗色压亮度 → 黑磨砂观感 */
    --input-card-blur-filter: brightness(0.5);

    /* === Rules === */
    --rule:               rgba(255, 255, 255, 0.09);
    --rule-strong:        rgba(255, 255, 255, 0.20);

    /* === Semantic === */
    --error:              #FF99A4;
    --error-bg:           rgba(255, 153, 164, 0.10);
    --success:            #6CCB5F;
    --success-bg:         rgba(108, 203, 95, 0.10);

    /* === Shadows === */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.40);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.45), 0 8px 24px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.55), 0 2px 8px rgba(0, 0, 0, 0.40);

    color-scheme: dark;
  }
}
