/* =========================================================
   XINAN OS 2.0 — Global Design Tokens
   全局设计令牌：颜色、字体、圆角、间距、阴影、动效
   所有页面应以此文件为唯一权威来源
   ========================================================= */

:root {
  /* ===== 品牌金色系（Brand Gold） ===== */
  --gold-50: #faf3e0;
  --gold-100: #f0e0b0;
  --gold-200: #e8d088;
  --gold-300: #e0c066;
  --gold-400: #d4a853;
  --gold-500: #c4933a;
  --gold-600: #a87a2b;
  --gold-700: #8b6420;

  /* 语义化金色别名（推荐使用） */
  --gold: var(--gold-400);
  --gold-light: var(--gold-300);
  --gold-dark: var(--gold-500);
  --gold-soft: rgba(212, 168, 83, 0.1);
  --gold-glow: rgba(212, 168, 83, 0.25);

  /* ===== 功能色（Functional Colors） ===== */
  --green: #10b981;
  --green-soft: rgba(16, 185, 129, 0.1);
  --green-glow: rgba(16, 185, 129, 0.3);

  --blue: #3b82f6;
  --blue-soft: rgba(59, 130, 246, 0.1);
  --blue-glow: rgba(59, 130, 246, 0.3);

  --cyan: #06b6d4;
  --cyan-soft: rgba(6, 182, 212, 0.1);
  --cyan-glow: rgba(6, 182, 212, 0.3);

  --purple: #8b5cf6;
  --purple-soft: rgba(139, 92, 246, 0.1);
  --purple-glow: rgba(139, 92, 246, 0.3);

  --orange: #f59e0b;
  --orange-soft: rgba(245, 158, 11, 0.1);
  --orange-glow: rgba(245, 158, 11, 0.3);

  --pink: #f472b6;
  --pink-soft: rgba(244, 114, 182, 0.1);
  --pink-glow: rgba(244, 114, 182, 0.3);

  --red: #ef4444;
  --red-soft: rgba(239, 68, 68, 0.1);
  --red-glow: rgba(239, 68, 68, 0.3);

  /* 状态色别名 */
  --status-online: var(--green);
  --status-online-glow: var(--green-glow);
  --status-warning: var(--orange);
  --status-warning-glow: var(--orange-glow);
  --status-error: var(--red);
  --status-error-glow: var(--red-glow);
  --status-offline: #4a4a5e;

  /* ===== 背景色（Backgrounds） ===== */
  --bg-primary: #0a0a0f;
  --bg-secondary: #0f0f17;
  --bg-surface: #0d0d14;
  --bg-card: #13131c;
  --bg-card-hover: #1a1a26;
  --bg-elevated: #1c1c28;
  --bg-background: var(--bg-primary);

  /* ===== 文字色（Text） ===== */
  --text-primary: #f0f0f5;
  --text-secondary: #a0a0b0;
  --text-tertiary: #6a6a7a;
  --text-muted: #4a4a5a;

  /* ===== 边框色（Borders） ===== */
  --border-color: #22222e;
  --border-light: #2a2a38;
  --border-gold: rgba(212, 168, 83, 0.3);
  --border-subtle: var(--border-color);
  --border-hover: #333344;

  /* ===== 圆角（Radius） ===== */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 18px;
  --radius-2xl: 24px;

  /* 别名兼容 */
  --radius: var(--radius-md);
  --radius-small: var(--radius-sm);
  --radius-medium: var(--radius-md);
  --radius-large: var(--radius-lg);

  /* ===== 间距（Spacing） ===== */
  --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;
  --space-16: 64px;

  /* 语义化间距别名 */
  --space-xs: var(--space-1);
  --space-sm: var(--space-2);
  --space-md: var(--space-4);
  --space-lg: var(--space-6);
  --space-xl: var(--space-8);

  /* ===== 阴影（Shadows） ===== */
  --shadow-2xs: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-xs: 0 2px 8px rgba(0, 0, 0, 0.4);
  --shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 6px 20px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.5);
  --shadow-xl: 0 20px 50px rgba(0, 0, 0, 0.6);
  --shadow-2xl: 0 30px 70px rgba(0, 0, 0, 0.7);

  --shadow-glow-gold: 0 0 20px rgba(212, 168, 83, 0.15);

  /* ===== 字体（Typography） ===== */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Microsoft YaHei', 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  --font-size-xs: 10px;
  --font-size-sm: 12px;
  --font-size-base: 14px;
  --font-size-lg: 16px;
  --font-size-xl: 18px;
  --font-size-2xl: 20px;
  --font-size-3xl: 24px;
  --font-size-4xl: 32px;

  --line-height-tight: 1.25;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;

  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* ===== 动效（Motion） ===== */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);

  --duration-fast: 150ms;
  --duration-normal: 220ms;
  --duration-slow: 350ms;
  --duration-slower: 500ms;

  /* ===== 布局尺寸（Layout） ===== */
  --sidebar-width-expanded: 240px;
  --sidebar-width-collapsed: 64px;
  --header-height: 56px;
  --content-max-width: 1440px;
}

/* ===== 减少动效偏好 ===== */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ===== 焦点可见性 ===== */
:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* 移除 Firefox 默认轮廓 */
::-moz-focus-inner {
  border: 0;
}