/* ==========================================================================
 * 语义 Token 层 (Semantic Tokens)
 * 本文件是唯一允许引用基础色阶 token (--blue-* / --gray-* / --red-*) 的位置。
 * 组件和页面仅引用本文件中的语义 token (--color-* / --bg-* / --text-* 等)。
 *
 * D-03: 模板风格切换通过覆盖本文件变量值实现。
 * 示例: [data-template="sunset"] { --color-primary: #E87B35; }
 * 所有色值映射精确取自 UI-SPEC.md Color 节 Semantic Tokens 表。
 * ========================================================================== */

:root {
  /* === 主色系 === */
  --color-primary: var(--blue-500);        /* #2E6BE6 — 主要 CTA、活跃标识、文字链接 */
  --color-primary-dark: var(--blue-600);    /* #2555B8 — 按钮按下、链接已访问 */
  --color-primary-light: var(--blue-100);   /* #EBF1FC — 选中/标签背景、hover 态 */
  --color-danger: var(--red-500);           /* #E8553D — 危险操作按钮、错误告警 */
  --color-danger-light: var(--red-100);     /* #FDEDEB — 危险操作确认背景 */
  --color-pro: var(--amber-500);            /* #F59E0B — Pro 尊享金 */
  --color-pro-light: var(--amber-100);      /* #FEF3C7 */

  /* === 背景 === */
  --bg-page: var(--gray-50);                /* #F5F7FA — 页面背景、空白区域 */
  --bg-card: var(--white);                  /* #FFFFFF — 卡片、底部弹出、对话框、导航栏 */
  --bg-glass: var(--white-glass);           /* 玻璃拟态卡片背景 */
  --bg-dark-glass: var(--dark-glass);       /* 暗黑玻璃拟态卡片背景 */
  --bg-gradient-start: var(--blue-500);     /* 名片展示首屏渐变起点 */
  --bg-gradient-end: var(--blue-400);       /* 名片展示首屏渐变终点 */

  /* === 文字 === */
  --text-primary: var(--gray-900);          /* #1A1A1A — 正文、标题 */
  --text-secondary: var(--gray-500);        /* #8C8C8C — 说明文字、元数据 */
  --text-placeholder: var(--gray-400);      /* #BFBFBF — 输入占位符、禁用文字 */
  --text-inverse: var(--white);             /* #FFFFFF — 深色/渐变背景上的白色文字 */

  /* === 边框 === */
  --border-default: var(--gray-200);        /* #E8E8E8 — 卡片边框、输入边框、分割线 */
  --border-glass: rgba(255, 255, 255, 0.4); /* 玻璃边框 */

  /* === 模板渐变定义 === */
  --gradient-blue: linear-gradient(135deg, #2E6BE6 0%, #5B83D6 100%);
  --gradient-dark: linear-gradient(135deg, #1F2937 0%, #111827 100%);
  --gradient-gold: linear-gradient(135deg, #F59E0B 0%, #D97706 100%);
  --gradient-purple: linear-gradient(135deg, #8B5CF6 0%, #6D28D9 100%);
  --gradient-teal: linear-gradient(135deg, #0D7377 0%, #14A3A8 100%);

  /* === 状态色 === */
  --color-success-bg: var(--green-100);
  --color-success: var(--green-500);

  /* === 字体 === */
  --font-family: var(--font-family-system);

  /* === 阴影 === */
  --shadow-default: var(--shadow-card);
  --shadow-glow: 0 8px 24px rgba(46, 107, 230, 0.25);
  --shadow-glow-gold: 0 8px 24px rgba(245, 158, 11, 0.3);
}

/* === 全局隐藏原生滚动条 (保留滚动交互) === */
html, body, *, *::before, *::after {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}