/* ============================================================================
   客小帮 AI 智慧拓客平台 · 设计令牌（Design Tokens）
   所有颜色 / 字号 / 间距 / 圆角 / 阴影 / 层级 的唯一来源，禁止在业务样式中硬编码色值。
   ========================================================================== */

:root {
  /* ---------------------------------------------------------------- 品牌色 */
  --kx-primary: #c8102e;          /* 主色：中国红 */
  --kx-primary-dark: #a30d25;
  --kx-primary-light: #e0344f;
  --kx-primary-50: #fdf3f5;
  --kx-primary-100: #fbe1e6;
  --kx-primary-200: #f5bfc9;

  --kx-gold: #d4af37;             /* 辅助金 */
  --kx-gold-deep: #b8860b;
  --kx-gold-light: #f2e0a3;
  --kx-gold-50: #fdfaf0;

  /* ---------------------------------------------------------------- 渐变 */
  --kx-gradient-primary: linear-gradient(135deg, #c8102e 0%, #e0344f 100%);
  --kx-gradient-gold: linear-gradient(135deg, #d4af37 0%, #b8860b 100%);
  --kx-gradient-dark: linear-gradient(180deg, #1c1f2b 0%, #14161f 100%);

  /* ---------------------------------------------------------------- 侧边栏 */
  --kx-sidebar-bg: #1a1d29;
  --kx-sidebar-hover: rgba(200, 16, 46, .12);
  --kx-sidebar-active: linear-gradient(90deg, rgba(200, 16, 46, .95) 0%, rgba(224, 52, 79, .85) 100%);
  --kx-sidebar-text: #a8adbb;
  --kx-sidebar-text-active: #ffffff;

  /* ---------------------------------------------------------------- 中性色 */
  --kx-bg: #f4f5f7;               /* 内容区背景 */
  --kx-surface: #ffffff;
  --kx-surface-2: #fafbfc;
  --kx-text: #1d2129;
  --kx-text-2: #4e5969;
  --kx-text-3: #86909c;
  --kx-text-4: #c9cdd4;
  --kx-border: #e5e6eb;
  --kx-border-2: #f0f1f3;

  /* ---------------------------------------------------------------- 语义色 */
  --kx-success: #00b42a;
  --kx-success-bg: #e8ffea;
  --kx-warning: #ff7d00;
  --kx-warning-bg: #fff7e8;
  --kx-danger: #f53f3f;
  --kx-danger-bg: #ffece8;
  --kx-info: #165dff;
  --kx-info-bg: #e8f3ff;
  --kx-violet: #722ed1;
  --kx-violet-bg: #f5e8ff;
  --kx-cyan: #0fc6c2;
  --kx-cyan-bg: #e8fffb;

  /* ---------------------------------------------------------------- 圆角 */
  --kx-radius-sm: 6px;
  --kx-radius: 10px;
  --kx-radius-lg: 14px;
  --kx-radius-xl: 20px;
  --kx-radius-full: 999px;

  /* ---------------------------------------------------------------- 阴影 */
  --kx-shadow-xs: 0 1px 2px rgba(29, 33, 41, .04);
  --kx-shadow-sm: 0 2px 8px rgba(29, 33, 41, .06);
  --kx-shadow: 0 6px 20px rgba(29, 33, 41, .08);
  --kx-shadow-lg: 0 16px 40px rgba(29, 33, 41, .12);
  --kx-shadow-primary: 0 8px 20px rgba(200, 16, 46, .24);
  --kx-shadow-gold: 0 8px 20px rgba(212, 175, 55, .28);

  /* ---------------------------------------------------------------- 字号 */
  --kx-fs-xs: 12px;
  --kx-fs-sm: 13px;
  --kx-fs: 14px;
  --kx-fs-md: 15px;
  --kx-fs-lg: 16px;
  --kx-fs-xl: 18px;
  --kx-fs-2xl: 22px;
  --kx-fs-3xl: 28px;
  --kx-fs-4xl: 36px;

  /* ---------------------------------------------------------------- 间距 */
  --kx-sp-1: 4px;
  --kx-sp-2: 8px;
  --kx-sp-3: 12px;
  --kx-sp-4: 16px;
  --kx-sp-5: 20px;
  --kx-sp-6: 24px;
  --kx-sp-7: 32px;
  --kx-sp-8: 40px;
  --kx-sp-9: 48px;
  --kx-sp-10: 40px;

  /* ---------------------------------------------------------------- 字体 */
  --kx-font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --kx-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;

  /* ---------------------------------------------------------------- 动效 */
  --kx-ease: cubic-bezier(.4, 0, .2, 1);
  --kx-dur: .2s;

  /* ---------------------------------------------------------------- 布局尺寸 */
  --kx-sidebar-w: 232px;
  --kx-sidebar-w-collapsed: 64px;
  --kx-topbar-h: 60px;

  /* ---------------------------------------------------------------- 层级 */
  --kx-z-dropdown: 1000;
  --kx-z-modal: 2000;
  --kx-z-toast: 3000;

  /* ---------------------------------------------------------------- 滚动条 */
  --kx-scrollbar-thumb: #d9dce1;
  --kx-scrollbar-thumb-hover: #bcc0c8;
}

/* ============================================================================
   暗色模式：仅覆盖关键令牌，保证布局与可读性不受影响
   ========================================================================== */
[data-theme="dark"] {
  --kx-bg: #14161f;
  --kx-surface: #1c1f2b;
  --kx-surface-2: #222633;
  --kx-text: #e8eaef;
  --kx-text-2: #b7bcc9;
  --kx-text-3: #868d9e;
  --kx-text-4: #5b6274;
  --kx-border: #2b3040;
  --kx-border-2: #232838;

  --kx-primary-50: #2a1a20;
  --kx-primary-100: #3a2028;
  --kx-primary-200: #5c2b37;
  --kx-gold-50: #2a2519;

  --kx-success-bg: #12301a;
  --kx-warning-bg: #33240d;
  --kx-danger-bg: #3a1a18;
  --kx-info-bg: #12203d;
  --kx-violet-bg: #25153a;
  --kx-cyan-bg: #0d2e2d;

  --kx-shadow-xs: 0 1px 2px rgba(0, 0, 0, .32);
  --kx-shadow-sm: 0 2px 8px rgba(0, 0, 0, .38);
  --kx-shadow: 0 6px 20px rgba(0, 0, 0, .46);
  --kx-shadow-lg: 0 16px 40px rgba(0, 0, 0, .55);

  --kx-sidebar-bg: #12141c;
  --kx-scrollbar-thumb: #343a4b;
  --kx-scrollbar-thumb-hover: #454d63;
}
