@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/barlow-condensed-latin-600-normal.woff2') format('woff2');
}

@font-face {
  font-family: 'Barlow Condensed';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../fonts/barlow-condensed-latin-800-normal.woff2') format('woff2');
}

:root {
  --font-display: 'Barlow Condensed', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-deva: "Noto Sans Devanagari", "Kohinoor Devanagari", "Nirmala UI", sans-serif;

  /* Sporty Brand Light Tokens */
  --brand: #FF4D1A;
  --brand-hover: #E03E0F;
  --brand-2: #1F4BFF;
  --brand-2-hover: #1338D4;
  --volt: #C6FF00;
  --volt-text: #0B0F1A;
  --grad-hero: linear-gradient(120deg, #FF4D1A 0%, #FF2E7E 50%, #7A2BFF 100%);
  --grad-card: linear-gradient(135deg, rgba(255, 77, 26, 0.08) 0%, rgba(31, 75, 255, 0.05) 100%);

  --bg: #F6F7FB;
  --surface: #FFFFFF;
  --surface-2: #EEF1F8;
  --border: #E2E6F0;
  --border-focus: #1F4BFF;

  --text: #0B0F1A;
  --text-muted: #5A6175;
  --text-subtle: #8A93A6;

  --ok: #00B86B;
  --ok-bg: #E6F8F0;
  --warn: #FFB020;
  --warn-bg: #FFF7E6;
  --bad: #E5243B;
  --bad-bg: #FDE9EC;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-pill: 9999px;

  --shadow-sm: 0 1px 2px rgba(11, 15, 26, 0.05);
  --shadow-md: 0 4px 12px rgba(11, 15, 26, 0.08);
  --shadow-lg: 0 12px 32px rgba(11, 15, 26, 0.12);

  --z-sticky: 100;
  --z-drawer: 200;
  --z-modal: 500;
  --z-toast: 1000;
}

/* Dark Theme Default */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --brand: #FF6A3D;
    --brand-hover: #FF855E;
    --brand-2: #5B7BFF;
    --brand-2-hover: #7A95FF;
    --volt: #D4FF3A;
    --volt-text: #0B0F1A;
    --grad-hero: linear-gradient(120deg, #FF6A3D 0%, #FF2E7E 50%, #8F4AFF 100%);
    --grad-card: linear-gradient(135deg, rgba(255, 106, 61, 0.12) 0%, rgba(91, 123, 255, 0.08) 100%);

    --bg: #0B0F1A;
    --surface: #141A2A;
    --surface-2: #1C243A;
    --border: #26324E;
    --border-focus: #5B7BFF;

    --text: #F2F4FA;
    --text-muted: #9AA3B8;
    --text-subtle: #636D85;

    --ok: #00D67D;
    --ok-bg: rgba(0, 214, 125, 0.15);
    --warn: #FFC043;
    --warn-bg: rgba(255, 192, 67, 0.15);
    --bad: #FF475E;
    --bad-bg: rgba(255, 71, 94, 0.15);

    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 12px 36px rgba(0, 0, 0, 0.6);
  }
}

/* Explicit data-theme overrides */
[data-theme="dark"] {
  --brand: #FF6A3D;
  --brand-hover: #FF855E;
  --brand-2: #5B7BFF;
  --brand-2-hover: #7A95FF;
  --volt: #D4FF3A;
  --volt-text: #0B0F1A;
  --grad-hero: linear-gradient(120deg, #FF6A3D 0%, #FF2E7E 50%, #8F4AFF 100%);
  --grad-card: linear-gradient(135deg, rgba(255, 106, 61, 0.12) 0%, rgba(91, 123, 255, 0.08) 100%);

  --bg: #0B0F1A;
  --surface: #141A2A;
  --surface-2: #1C243A;
  --border: #26324E;
  --border-focus: #5B7BFF;

  --text: #F2F4FA;
  --text-muted: #9AA3B8;
  --text-subtle: #636D85;

  --ok: #00D67D;
  --ok-bg: rgba(0, 214, 125, 0.15);
  --warn: #FFC043;
  --warn-bg: rgba(255, 192, 67, 0.15);
  --bad: #FF475E;
  --bad-bg: rgba(255, 71, 94, 0.15);
}

[data-theme="light"] {
  --brand: #FF4D1A;
  --brand-hover: #E03E0F;
  --brand-2: #1F4BFF;
  --brand-2-hover: #1338D4;
  --volt: #C6FF00;
  --volt-text: #0B0F1A;
  --grad-hero: linear-gradient(120deg, #FF4D1A 0%, #FF2E7E 50%, #7A2BFF 100%);
  --grad-card: linear-gradient(135deg, rgba(255, 77, 26, 0.08) 0%, rgba(31, 75, 255, 0.05) 100%);

  --bg: #F6F7FB;
  --surface: #FFFFFF;
  --surface-2: #EEF1F8;
  --border: #E2E6F0;
  --border-focus: #1F4BFF;

  --text: #0B0F1A;
  --text-muted: #5A6175;
  --text-subtle: #8A93A6;

  --ok: #00B86B;
  --ok-bg: #E6F8F0;
  --warn: #FFB020;
  --warn-bg: #FFF7E6;
  --bad: #E5243B;
  --bad-bg: #FDE9EC;
}

/* High Contrast Range Mode */
[data-high-contrast="true"] {
  --bg: #000000;
  --surface: #111111;
  --surface-2: #222222;
  --border: #FFFFFF;
  --text: #FFFFFF;
  --text-muted: #CCCCCC;
  --brand: #FFFF00;
  --brand-2: #00FFFF;
  --volt: #00FF00;
}
