/* ════════════════════════════════════════════════════════
   AuthKeystone Design Tokens —— 全站唯一权威源
   消费者：admin-ui(style.css @import 内联) / landing(index.html <link>) / docs(mdBook additional-css)
   原则：值照搬自原 admin-ui style.css，视觉零变化；命名用语义化（--bg-base / --text-primary）
   ════════════════════════════════════════════════════════ */

/* ─── 1. 结构 Token（主题无关：字号/间距/圆角/动效/层级/布局）─── */
:root {
  /* 字号 */
  --font-xs: 11px;
  --font-sm: 12px;
  --font-base: 13.5px;
  --font-md: 14px;
  --font-lg: 15px;
  --font-xl: 16px;
  --font-2xl: 18px;
  --font-stat: 30px;

  /* 字重 */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* 间距（4px 节拍） */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;

  /* 圆角 */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-control: 7px;
  --radius-lg: 8px;
  --radius-card: 10px;
  --radius-xl: 12px;
  --radius-pill: 20px;
  --radius-full: 50%;

  /* 动效 */
  --transition-fast: 0.12s ease;
  --transition-base: 0.15s ease;
  --transition-theme: 0.2s ease;

  /* 层级 */
  --z-sticky: 50;
  --z-modal: 100;

  /* 布局尺寸 */
  --sidebar-width: 220px;
  --content-pad-y: 28px;
  --content-pad-x: 32px;
}

/* ─── 2. 颜色 Token：深色（默认；landing/docs 无 data-theme 属性也走这里）───
   :root 与 [data-theme="dark"] 合并选择器 = 三前端默认 dark 的根本保证 */
:root,
[data-theme="dark"] {
  --bg-base: #0A0A0B;
  --bg-surface: #111113;
  --bg-elevated: #18181B;
  --bg-hover: #1F1F23;

  --text-primary: #FAFAFA;
  --text-secondary: #A1A1AA;
  --text-tertiary: #71717A;

  --border: #27272A;
  --border-strong: #3F3F46;

  --accent: #5B8DEF;
  --accent-hover: #7BA4F7;
  --accent-dim: rgba(91, 141, 239, 0.12);
  --accent-glow: rgba(91, 141, 239, 0.35);
  --accent2: #7C5CFC;   /* 副强调色（来自 landing，admin-ui 原缺失，补齐）*/

  --success: #3ECF8E;
  --success-dim: rgba(62, 207, 142, 0.12);
  --danger: #F87171;
  --danger-dim: rgba(248, 113, 113, 0.12);
  --warning: #FBBF24;
  --info: #5B8DEF;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.5);
  --shadow-glow: 0 0 24px var(--accent-glow);
  --input-focus-shadow: 0 0 0 3px var(--accent-glow);
}

/* ─── 3. 颜色 Token：浅色（仅 admin-ui 切 light 时命中）─── */
[data-theme="light"] {
  --bg-base: #FFFFFF;
  --bg-surface: #FAFAFA;
  --bg-elevated: #FFFFFF;
  --bg-hover: #F4F4F5;

  --text-primary: #18181B;
  --text-secondary: #52525B;
  --text-tertiary: #A1A1AA;

  --border: #E4E4E7;
  --border-strong: #D4D4D8;

  --accent: #4A7BD8;
  --accent-hover: #3A6BC8;
  --accent-dim: rgba(74, 123, 216, 0.08);
  --accent-glow: rgba(74, 123, 216, 0.2);
  --accent2: #7C5CFC;

  --success: #16A34A;
  --success-dim: rgba(22, 163, 74, 0.1);
  --danger: #DC2626;
  --danger-dim: rgba(220, 38, 38, 0.1);
  --warning: #D97706;
  --info: #4A7BD8;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-glow: 0 0 24px var(--accent-glow);
  --input-focus-shadow: 0 0 0 3px var(--accent-glow);
}
