/* ============================================================
   闪电云 UI 设计系统 · 设计变量(Design Tokens)
   ------------------------------------------------------------
   官网(www)/ 用户中心(app)/ 管理后台(console)三端共用同一份令牌,
   保证品牌色、字体、圆角、阴影、动效在全平台严格一致。
   用法:页面顶部引入 <link rel="stylesheet" href="design-tokens.css">,
   然后直接使用 var(--color-primary) 等变量。
   注意:新增组件时只允许引用本文件变量,不得硬编码色值与圆角,
        以保障企业级视觉的统一与后续主题化能力。
   ============================================================ */

:root {
  /* ---------- 品牌主色(闪电云品牌蓝,三端统一,不再逐页自定义) ---------- */
  --primary: #2563eb;
  --primary-dark: #1d4ed8;
  --primary-darker: #1e40af;
  --primary-light: #dbeafe;
  --primary-soft: #eff6ff;       /* 品牌色浅底:徽章/选中态/表格悬停 */
  --primary-hover: #1d4ed8;
  --primary-border: #bfdbfe;     /* 品牌色描边:浅蓝卡片/输入聚焦前态 */
  --text-on-primary: #ffffff;

  /* ---------- 辅助色 ---------- */
  --accent: #0ea5e9;             /* 天蓝:数据/科技感点缀 */
  --accent-soft: #ecfeff;
  --success: #16a34a;
  --success-light: #dcfce7;
  --warning: #ea580c;
  --warning-light: #ffedd5;
  --danger: #dc2626;
  --danger-light: #fee2e2;
  --info: #64748b;

  /* ---------- 中性色(克制专业的石板灰阶) ---------- */
  --text: #0f172a;
  --text-2: #475569;
  --text-3: #94a3b8;
  --text-on-dark: #e2e8f0;
  --border: #e2e8f0;
  --border-strong: #cbd5e1;
  --bg: #f8fafc;
  --bg-soft: #f1f5f9;
  --bg-elevated: #ffffff;
  --card: #ffffff;
  --sidebar-bg: #0f172a;
  --sidebar-hover: #1e293b;

  /* ---------- 圆角(企业级克制:不用过大圆角) ---------- */
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
  --radius-full: 999px;

  /* ---------- 阴影(更轻、分层更清晰,默认状态几乎无痕,悬浮再抬升) ---------- */
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, .05);
  --shadow: 0 1px 2px rgba(15, 23, 42, .06),
            0 10px 28px -14px rgba(15, 23, 42, .14);
  --shadow-hover: 0 2px 6px rgba(37, 99, 235, .08),
                  0 20px 44px -14px rgba(15, 23, 42, .20);
  --shadow-card: 0 1px 3px rgba(15, 23, 42, .05),
                 0 14px 34px -18px rgba(15, 23, 42, .16);
  /* 兼容旧组件命名 */
  --shadow-3d: 0 10px 30px -8px rgba(37, 99, 235, .22);

  /* ---------- 间距(4px 基准栅格) ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;

  /* ---------- 字体 ----------
     中文界面与图表统一以「微软雅黑」优先(Windows 环境内置,
     路径 C:\WINDOWS\FONTS\MSYHL.TTC),其余系统使用等效无衬线字体兜底 */
  --font-sans: "Microsoft YaHei", "微软雅黑", "PingFang SC",
               "Hiragino Sans GB", -apple-system, BlinkMacSystemFont,
               "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --font-mono: Consolas, "SF Mono", "Cascadia Code", Menlo,
               "Courier New", monospace;

  /* ---------- 字号 ---------- */
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-base: 14px;
  --fs-md: 15px;
  --fs-lg: 18px;
  --fs-xl: 22px;
  --fs-2xl: 28px;
  --fs-3xl: 34px;
  --fs-hero: 48px;

  /* ---------- 布局 ---------- */
  --container: 1120px;
  --sidebar-w: 220px;
  --header-h: 64px;

  /* ---------- 动效(统一缓动曲线,杜绝忽快忽慢) ---------- */
  --transition-fast: .15s cubic-bezier(.4, 0, .2, 1);
  --transition: .22s cubic-bezier(.4, 0, .2, 1);
  --transition-slow: .35s cubic-bezier(.4, 0, .2, 1);

  /* ---------- 焦点环(键盘可达性 / 无障碍) ---------- */
  --ring: 0 0 0 4px rgba(37, 99, 235, .14);
  --ring-danger: 0 0 0 4px rgba(220, 38, 38, .14);

  /* ---------- 层级(z-index 集中管理,避免互相遮盖冲突) ---------- */
  --z-sticky: 100;
  --z-nav: 900;
  --z-dropdown: 950;
  --z-modal: 1000;
  --z-toast: 1100;

  /* ---------- 现代效果:毛玻璃 / 渐变 / 光影(适度使用) ---------- */
  --glass-bg: rgba(255, 255, 255, .72);
  --glass-border: rgba(255, 255, 255, .85);
  --glass-blur: blur(16px) saturate(180%);
  --glass-dark-bg: rgba(15, 23, 42, .55);

  --grad-primary: linear-gradient(135deg, #3b82f6 0%, #2563eb 50%, #0ea5e9 100%);
  --grad-hero: linear-gradient(135deg, #eff6ff 0%, #dbeafe 50%, #f0f9ff 100%);
  --grad-text: linear-gradient(135deg, #2563eb, #0ea5e9);
  --grad-sidebar: linear-gradient(180deg, #0f172a 0%, #111c33 100%);

  --glow-blue: 0 0 20px rgba(59, 130, 246, .35);
  --glow-blue-strong: 0 0 40px rgba(59, 130, 246, .5);
}

/* ---------- 全局基础微调(三端共享,仅做增量增强,不覆盖各端布局) ---------- */
html {
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-sans);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 品牌色文本选中效果,强化全站统一观感 */
::selection {
  background: rgba(37, 99, 235, .16);
  color: var(--primary-darker);
}

/* 统一键盘焦点样式(鼠标点击不显示,键盘 Tab 导航时显示) */
:focus-visible {
  outline: none;
  box-shadow: var(--ring);
  border-radius: var(--radius-sm);
}

/* 克制的细滚动条(三端统一,Chrome/Edge 生效;Firefox 忽略不影响使用) */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--border-strong) transparent;
}
*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
*::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: var(--radius-full);
  border: 2px solid transparent;
  background-clip: content-box;
}
*::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
  background-clip: content-box;
}
*::-webkit-scrollbar-track {
  background: transparent;
}

/* 用户触发了系统级「减弱动态效果」时,关闭过渡与动画(无障碍) */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}