/* 设计令牌:所有颜色/尺寸只在这里定义,明暗主题靠变量切换,组件不写主题覆盖 */
:root {
  /* 显式声明当前配色方案。不声明的话,部分手机浏览器(尤其是国产
     Chromium 内核浏览器的"强制深色"功能)会在系统深色模式下自作主张地
     对页面做反色/滤镜处理,导致我们自己的 data-theme 切换要么被覆盖、
     要么和浏览器的强制深色打架看起来"切了跟没切一样"。这里跟着
     [data-theme] 走,而不是写死 "light dark" 交给浏览器自行判断。 */
  color-scheme: light;
  --color-primary: #fb7750;
  --color-primary-strong: #e05a34;
  --color-primary-weak: rgba(251, 119, 80, 0.12);

  --color-bg: #f7f7f8;
  --color-panel: #ffffff;
  --color-panel-2: #f1f2f4;
  --color-text: #1f2328;
  --color-text-muted: #6b7280;
  --color-border: #e5e7eb;

  --bubble-user: #fff1ea;
  --bubble-assistant: #ffffff;
  --bubble-error: #fdecea;
  --bubble-error-text: #b3261e;

  --shadow-1: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-2: 0 6px 24px rgba(0, 0, 0, 0.12);

  --sidebar-w: 272px;
  --topbar-h: 56px;
  --radius: 10px;
  /* 内容区宽度:随窗口自适应,超宽屏封顶,保证可读性 */
  --content-max: min(96%, 1500px);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-primary: #fb7750;
  --color-primary-strong: #ff8f6e;
  --color-primary-weak: rgba(251, 119, 80, 0.18);

  --color-bg: #111318;
  --color-panel: #1a1d24;
  --color-panel-2: #232733;
  --color-text: #e6e8ee;
  --color-text-muted: #9aa1ad;
  --color-border: #2a2f3a;

  --bubble-user: #2c2320;
  --bubble-assistant: #1a1d24;
  --bubble-error: #3a1f1d;
  --bubble-error-text: #ff8a80;

  --shadow-1: 0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow-2: 0 6px 24px rgba(0, 0, 0, 0.5);
}