/* ==========================================================================
   Bebakids Transfer Portal — Design Tokens
   ========================================================================== */

:root {
  /* Brand / accent — evolved from original #1a237e navy */
  --accent: #5b7bff;
  --accent-hover: #6f8bff;
  --accent-soft: rgba(91, 123, 255, 0.12);
  --accent-ring: rgba(91, 123, 255, 0.28);

  /* Semantic */
  --success: #12b981;
  --success-soft: rgba(18, 185, 129, 0.13);
  --warning: #f59e0b;
  --warning-soft: rgba(245, 158, 11, 0.14);
  --danger: #ef4444;
  --danger-soft: rgba(239, 68, 68, 0.13);
  --info: #3b82f6;
  --info-soft: rgba(59, 130, 246, 0.13);

  /* Radii */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-pill: 999px;

  /* Shadows (light) */
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 1px rgba(15, 23, 42, 0.03);
  --shadow-md: 0 2px 4px rgba(15, 23, 42, 0.04), 0 4px 12px rgba(15, 23, 42, 0.05);
  --shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.08), 0 2px 4px rgba(15, 23, 42, 0.04);
  --shadow-pop: 0 20px 48px rgba(15, 23, 42, 0.18);

  /* Easing */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  /* Font */
  --font-sans: 'Satoshi', 'Geist', 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Geist Mono', 'SF Mono', ui-monospace, monospace;
}

/* LIGHT THEME (default) */
:root,
[data-theme='light'] {
  --bg: #eef0f4;
  --bg-subtle: #e1e4ea;
  --surface: #ffffff;
  --surface-2: #f4f5f8;
  --surface-hover: #eceef2;
  --surface-active: #e1e3ea;

  --border: #cfd3dc;
  --border-strong: #b4bac6;
  --divider: #dee1e7;

  --text: #0a0a0f;
  --text-muted: #4a4a55;
  --text-subtle: #7a7a86;
  --text-inverse: #ffffff;

  --chip-bg: #e7e9ee;
  --kbd-bg: #e7e9ee;

  color-scheme: light;
}

/* DARK THEME */
[data-theme='dark'] {
  --bg: #0E0F14;
  --bg-subtle: #12141A;
  --surface: #181A21;
  --surface-2: #1D1F27;
  --surface-hover: #232530;
  --surface-active: #2A2C38;

  --border: #282A34;
  --border-strong: #353845;
  --divider: #1F2128;

  --text: #f3f3f5;
  --text-muted: #a0a0ad;
  --text-subtle: #6b6b78;
  --text-inverse: #0a0a0f;

  --chip-bg: #1c1c23;
  --kbd-bg: #1c1c23;

  --accent-soft: rgba(91, 123, 255, 0.18);
  --success-soft: rgba(18, 185, 129, 0.18);
  --warning-soft: rgba(245, 158, 11, 0.18);
  --danger-soft: rgba(239, 68, 68, 0.18);
  --info-soft: rgba(59, 130, 246, 0.18);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 2px 6px rgba(0, 0, 0, 0.3), 0 4px 16px rgba(0, 0, 0, 0.2);
  --shadow-lg: 0 8px 28px rgba(0, 0, 0, 0.45);
  --shadow-pop: 0 20px 48px rgba(0, 0, 0, 0.6);

  color-scheme: dark;
}