/* ==========================================================================
   design-tokens.css — 衡准集 · 商务蓝设计令牌（Design Tokens）
   版本：v1.0 ｜ 编制：vue-frontend-dev ｜ 日期：2026-08-08
   规范依据：frontend-polish-plan v1.4 §3.8（商务高级蓝色系）+ mvp-frontend-plan-v2
   ========================================================================== */

:root {
  /* ---- 色板（商务蓝系） ---- */
  --color-primary:        #1B5BBF;   /* 主色：商务蓝 */
  --color-primary-dark:   #0D3B7C;   /* 深蓝：主色按压/强调 */
  --color-primary-darker: #092B5E;   /* 更深蓝：导航/页脚 */
  --color-primary-light:  #2F80ED;   /* 亮蓝：渐变端点/悬停 */
  --color-primary-soft:   #E8F0FB;   /* 浅蓝：选中背景/标签底 */
  --color-primary-tint:   #F4F8FE;   /* 极浅蓝：卡片底色/区块底 */

  /* 功能色 */
  --color-success:        #34A853;   /* 成功绿：涨/已开通/额度充足 */
  --color-warning:        #F5A623;   /* 警示橙：额度将尽/试用到期 */
  --color-danger:         #E5484D;   /* 错误红：超限/错误提示 */
  --color-info:           #5B7DB1;   /* 中性信息蓝 */

  /* 中性色 */
  --color-bg:             #F5F7FA;   /* 页面背景：浅灰 */
  --color-surface:        #FFFFFF;   /* 卡片/面板表面 */
  --color-border:         #E3E8F0;   /* 描边 */
  --color-border-strong:  #C8D2E0;   /* 强描边（分割线） */
  --color-text-primary:   #1F2D3D;   /* 主文字：深灰蓝 */
  --color-text-secondary: #5A6B7F;   /* 次级文字 */
  --color-text-muted:     #8A97A8;   /* 弱化文字/说明 */
  --color-text-invert:    #FFFFFF;   /* 深底反白文字 */

  /* ---- 渐变 ---- */
  --gradient-primary:  linear-gradient(135deg, #1B5BBF 0%, #2F80ED 100%);
  --gradient-hero:     linear-gradient(135deg, #0D3B7C 0%, #1B5BBF 55%, #2F80ED 100%);
  --gradient-success:  linear-gradient(135deg, #2E9E4F 0%, #45C465 100%);

  /* ---- 字体 ---- */
  --font-family-base:  "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --font-family-num:   "DIN Alternate", "Roboto", "Helvetica Neue", Arial, sans-serif;

  /* 字号阶梯 */
  --font-size-xs:   12px;
  --font-size-sm:   13px;
  --font-size-md:   14px;
  --font-size-base: 15px;
  --font-size-lg:   17px;
  --font-size-xl:   20px;
  --font-size-2xl:  26px;
  --font-size-3xl:  34px;
  --font-size-hero: 44px;

  /* 字重 */
  --font-weight-regular: 400;
  --font-weight-medium:  500;
  --font-weight-bold:    600;
  --font-weight-black:   700;

  /* ---- 间距（4px 基准） ---- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-7:  32px;
  --space-8:  40px;
  --space-9:  48px;
  --space-10: 64px;

  /* ---- 圆角 ---- */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-full: 999px;

  /* ---- 阴影 ---- */
  --shadow-xs: 0 1px 2px rgba(16, 42, 84, 0.06);
  --shadow-sm: 0 2px 8px rgba(16, 42, 84, 0.08);
  --shadow-md: 0 6px 20px rgba(16, 42, 84, 0.10);
  --shadow-lg: 0 12px 32px rgba(16, 42, 84, 0.14);
  --shadow-primary: 0 6px 18px rgba(27, 91, 191, 0.28);

  /* ---- 布局 ---- */
  --container-max: 1200px;
  --header-height: 64px;
  --footer-height: 120px;

  /* ---- 过渡 ---- */
  --transition-fast: 0.15s ease;
  --transition-base: 0.25s ease;

  /* ---- z-index 层级 ---- */
  --z-header:    100;
  --z-modal:     1000;
  --z-toast:     1100;
}

/* ---- 暗色模式预留（迭代期） ---- */
/* @media (prefers-color-scheme: dark) { :root { ... } } */