/* AUTO-GENERATED by scripts/gen-design-tokens.js — 禁止手改；改 design-tokens.json 后重跑本脚本重新生成 */
/* 唯一事实源：design-tokens.json。brand.css 已于 2026-09-07 收敛为仅 @import 本文件的兼容别名层，不再重复定义任何变量（冲突 7→0，由 scripts/check-token-consistency.js 守护）。 */

:root {
  --primary: #D2091D; /* 长住红 · 主按钮/主链接/激活态/关键强调/重要警告 */
  --primary-dark: #B50715; /* 长住红-深 · hover/按压态 */
  --primary-light: rgba(210,9,29,0.05); /* 长住红-浅 · 选中背景/徽标浅底 */
  --primary-ultra-light: #FFF0F1; /* 长住红-极浅 · hover 行底/分区底 */
  --accent: #C0A98A; /* 莫兰迪沙金 · 仅极淡点缀，不用于主视觉 */
  --accent-light: #F5EFE9;
  --accent-dark: #8C7B6B;
  --champagne: #C0A98A;
  --brand-white: #FFFFFF;
  --surface: #FFFFFF; /* 卡片底 */
  --surface-2: #f5f6f7; /* 页面浅底 */
  --surface-3: #FAFAFA; /* 分区/表头浅底 */
  --gray-50: #F2F3F5;
  --gray-100: #FAFAFA;
  --gray-200: #EBEEF5;
  --gray-300: #E4E7ED;
  --gray-400: #C0C4CC;
  --gray-500: #909399;
  --gray-600: #606266;
  --gray-700: #303133;
  --gray-800: #1F2937;
  --gray-900: #18181B;
  --success: #16A34A; /* 成功/正常绿（降饱和） */
  --success-light: #EAF7E1;
  --warning: #F59E0B; /* 警告/注意橙（降饱和） */
  --warning-light: #FBEFD9;
  --danger: #D2091D; /* 危险/逾期（复用品牌红，对齐规范语义-危险；浅底红字对比度≥4.5:1） */
  --danger-light: #FDE8EA;
  --info: #2563EB; /* 信息（中性灰蓝，不抢品牌） */
  --text-strong: #1f2329; /* 主标题/核心数据 */
  --text: #1f2329; /* 正文/标签 */
  --text-muted: #5e6670; /* 辅助/英文标签（浅灰蓝）·对比度5.82:1达标AA */
  --text-faint: #6e7480; /* 占位/极弱·对比度4.69:1达标AA */
  --border: #e5e6eb; /* 极淡边框 */
  --border-strong: #DCDFE6; /* 输入框/筛选框边框 */
  --divider: #EBEEF5;
  --radius-sm: 4px;
  --radius: 8px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 999px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-sm: 0 2px 12px 0 rgba(0, 0, 0, 0.04); /* 统一卡片阴影（二选一） */
  --shadow-md: 0 4px 12px rgba(15, 23, 42, 0.06), 0 2px 4px rgba(15, 23, 42, 0.04);
  --shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.08);
  --font-sans: "阿里巴巴普惠体", "Alibaba PuHuiTi", "Microsoft YaHei", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
  --font-mono: 'DIN Alternate', 'Roboto Mono', 'Oswald', monospace; /* 数字/金额/百分比/日期 强制等宽 */
  --font-en: 'Inter', 'Helvetica Neue', Arial, sans-serif; /* 英文点缀标签 */
  --font-num: var(--font-mono);
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --transition: 0.2s ease;
  --gradient-brand: linear-gradient(135deg, var(--primary) 0%, #B50715 100%);
  --gradient-brand-soft: linear-gradient(135deg, #FFF0F1 0%, #FFF0F1 100%);
  --chart-1: var(--primary); /* 主系列 · 品牌主色 */
  --chart-2: #909399; /* 对比系列 · 中性灰 */
  --chart-3: #C0C4CC; /* 中性浅灰 */
  --chart-4: #C0A98A; /* 莫兰迪沙金点缀 */
  --chart-pos: #67C23A; /* 正向 */
  --chart-neg: #F56C6C; /* 负向 */
  --chart-grid: #EBEEF5; /* 网格线 */
}

/* =========================================================================
 * 组件基类（轻量、可复用；具体页组件在 style.css 继承/覆盖）
 * ========================================================================= */

/* 主按钮 */
.dg-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; border-radius: var(--radius);
  font: var(--fw-medium) 14px/1 var(--font-sans);
  border: 1px solid transparent; cursor: pointer;
  transition: var(--transition); white-space: nowrap;
}
.dg-btn.primary {
  background: var(--primary); color: #fff;
  box-shadow: var(--shadow-sm);
}
.dg-btn.primary:hover { background: var(--primary-dark); }
.dg-btn.ghost {
  background: var(--surface); color: var(--text);
  border-color: var(--border);
}
.dg-btn.ghost:hover { background: var(--primary-ultra-light); border-color: var(--primary-light); }
.dg-btn.danger { background: var(--danger); color: #fff; }
.dg-btn.danger:hover { filter: brightness(0.95); }
.dg-btn.sm { padding: 5px 10px; font-size: 12px; border-radius: var(--radius-sm); }

/* 卡片 */
.dg-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: var(--shadow-sm);
  padding: var(--space-6);
}

/* KPI 卡 */
.kpi-card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); padding: var(--space-5);
  box-shadow: var(--shadow-xs); transition: var(--transition);
}
.kpi-card:hover { box-shadow: var(--shadow-md); transform: translateY(-1px); }
.kpi-num { font: var(--fw-bold) 26px/1 var(--font-mono); color: var(--text-strong); }  /* 数字强制等宽 */
.kpi-label { margin-top: 6px; font-size: 13px; color: var(--text-muted); }
.kpi-sub { margin-top: 4px; font-size: 12px; color: var(--text-faint); }
.kpi-primary .kpi-num { color: var(--text-strong); }
.kpi-success .kpi-num { color: var(--success); }
.kpi-warning .kpi-num { color: var(--warning); }
.kpi-danger .kpi-num { color: var(--danger); }

/* 区块标题 */
.sec-title {
  display: flex; align-items: center; gap: 8px;
  font: var(--fw-semibold) 15px/1 var(--font-sans); color: var(--text-strong);
  margin: var(--space-6) 0 var(--space-4);
}
.sec-bar { width: 3px; height: 14px; border-radius: 2px; background: var(--primary); }

/* 输入框 */
.dg-in {
  width: 100%; padding: 8px 12px; font: 400 14px/1.4 var(--font-sans);
  color: var(--text); background: var(--surface);
  border: 1px solid var(--border-strong); border-radius: var(--radius);
  transition: var(--transition);
}
.dg-in:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light); }
.dg-in.sm { padding: 5px 10px; font-size: 12px; }

/* 徽标 / 状态点 */
.dg-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px; font-size: 12px; border-radius: var(--radius-pill);
  background: var(--primary-light); color: var(--primary-dark);
}
.dg-badge.muted { background: var(--gray-100); color: var(--text-muted); }
.dg-badge.success { background: var(--success-light); color: var(--success); }
.dg-badge.warning { background: var(--warning-light); color: var(--warning); }
.dg-badge.danger { background: var(--danger-light); color: var(--danger); }

/* 空态（规划中/预计上线/订阅 也复用此基调） */
.empty-state {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: var(--space-12) var(--space-6); text-align: center;
  color: var(--text-muted);
}
.empty-state-icon { font-size: 40px; margin-bottom: var(--space-3); opacity: .8; }

/* 加载态 */
.wb-loading { padding: var(--space-10); text-align: center; color: var(--text-muted); }
.muted { color: var(--text-faint); }

/* 无障碍：焦点环可见（覆盖全局 outline:none 误杀键盘焦点，满足 axe 焦点可达） */
:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
