/* ============================================================
   SatellitePortal — Design Tokens (variables.css)
   Fonts: Syne (display) · Source Serif 4 (editorial) · JetBrains Mono (technical)
   ============================================================ */

/* ── Google Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&family=Source+Serif+4:ital,opsz,wght@0,8..60,300;0,8..60,400;0,8..60,600;1,8..60,400&family=JetBrains+Mono:wght@400;500&display=swap');

/* ── Light Mode (default) ── */
:root {
  /* Backgrounds */
  --bg-primary:     #ffffff;
  --bg-secondary:   #f4f5f7;
  --bg-tertiary:    #eaecf0;
  --bg-card:        #ffffff;
  --bg-header:      #ffffff;
  --bg-overlay:     rgba(255,255,255,0.96);

  /* Text */
  --text-primary:   #0d1117;
  --text-secondary: #4a5568;
  --text-muted:     #718096;
  --text-inverse:   #ffffff;

  /* Accent — Electric Cyan */
  --accent:         #0099cc;
  --accent-hover:   #007aaa;
  --accent-light:   #e0f4fb;
  --accent-text:    #004d66;

  /* Satellite data — Amber */
  --sat-color:      #d97706;
  --sat-hover:      #b45309;
  --sat-light:      #fef3c7;
  --sat-text:       #78350f;

  /* Status */
  --success:        #059669;
  --success-light:  #d1fae5;
  --warning:        #d97706;
  --warning-light:  #fef3c7;
  --danger:         #dc2626;
  --danger-light:   #fee2e2;
  --info:           #2563eb;
  --info-light:     #dbeafe;

  /* Borders */
  --border:         #e2e8f0;
  --border-strong:  #cbd5e0;
  --border-accent:  rgba(0,153,204,0.3);

  /* Breaking news */
  --breaking-bg:    #dc2626;
  --breaking-text:  #ffffff;

  /* Shadows */
  --shadow-sm:      0 1px 3px rgba(0,0,0,0.07), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:      0 4px 12px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04);
  --shadow-lg:      0 10px 30px rgba(0,0,0,0.1), 0 4px 8px rgba(0,0,0,0.05);

  /* Typography */
  --font-display:   'Syne', sans-serif;
  --font-editorial: 'Source Serif 4', Georgia, serif;
  --font-mono:      'JetBrains Mono', 'Courier New', monospace;
  --font-ui:        'Syne', sans-serif;

  /* Spacing scale */
  --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;

  /* Layout */
  --container-max:  1320px;
  --container-wide: 1140px;
  --container-mid:  960px;
  --radius-sm:      3px;
  --radius:         6px;
  --radius-lg:      10px;

  /* Transitions */
  --transition:     150ms ease;
  --transition-md:  250ms ease;

  /* Header */
  --header-height:  64px;
  --topbar-height:  36px;
  --breaking-height:38px;
}

/* ── Dark Mode ── */
[data-theme="dark"] {
  /* Backgrounds */
  --bg-primary:     #0d1117;
  --bg-secondary:   #161b22;
  --bg-tertiary:    #1c2333;
  --bg-card:        #161b22;
  --bg-header:      #0d1117;
  --bg-overlay:     rgba(13,17,23,0.97);

  /* Text */
  --text-primary:   #e6edf3;
  --text-secondary: #8b949e;
  --text-muted:     #6e7681;
  --text-inverse:   #0d1117;

  /* Accent */
  --accent:         #00b4d8;
  --accent-hover:   #00cffa;
  --accent-light:   rgba(0,180,216,0.12);
  --accent-text:    #90e0ef;

  /* Satellite data */
  --sat-color:      #fbbf24;
  --sat-hover:      #fcd34d;
  --sat-light:      rgba(251,191,36,0.1);
  --sat-text:       #fde68a;

  /* Status */
  --success:        #3fb950;
  --success-light:  rgba(63,185,80,0.1);
  --warning:        #e3b341;
  --warning-light:  rgba(227,179,65,0.1);
  --danger:         #f85149;
  --danger-light:   rgba(248,81,73,0.1);
  --info:           #58a6ff;
  --info-light:     rgba(88,166,255,0.1);

  /* Borders */
  --border:         #21262d;
  --border-strong:  #30363d;
  --border-accent:  rgba(0,180,216,0.25);

  /* Breaking news */
  --breaking-bg:    #b91c1c;
  --breaking-text:  #ffffff;

  /* Shadows */
  --shadow-sm:      0 1px 3px rgba(0,0,0,0.4);
  --shadow-md:      0 4px 12px rgba(0,0,0,0.5);
  --shadow-lg:      0 10px 30px rgba(0,0,0,0.6);
}

/* ── System Dark Mode Fallback ── */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg-primary:     #0d1117;
    --bg-secondary:   #161b22;
    --bg-tertiary:    #1c2333;
    --bg-card:        #161b22;
    --bg-header:      #0d1117;
    --bg-overlay:     rgba(13,17,23,0.97);
    --text-primary:   #e6edf3;
    --text-secondary: #8b949e;
    --text-muted:     #6e7681;
    --text-inverse:   #0d1117;
    --accent:         #00b4d8;
    --accent-hover:   #00cffa;
    --accent-light:   rgba(0,180,216,0.12);
    --accent-text:    #90e0ef;
    --sat-color:      #fbbf24;
    --sat-hover:      #fcd34d;
    --sat-light:      rgba(251,191,36,0.1);
    --sat-text:       #fde68a;
    --success:        #3fb950;
    --success-light:  rgba(63,185,80,0.1);
    --warning:        #e3b341;
    --warning-light:  rgba(227,179,65,0.1);
    --danger:         #f85149;
    --danger-light:   rgba(248,81,73,0.1);
    --info:           #58a6ff;
    --info-light:     rgba(88,166,255,0.1);
    --border:         #21262d;
    --border-strong:  #30363d;
    --border-accent:  rgba(0,180,216,0.25);
    --breaking-bg:    #b91c1c;
    --breaking-text:  #ffffff;
    --shadow-sm:      0 1px 3px rgba(0,0,0,0.4);
    --shadow-md:      0 4px 12px rgba(0,0,0,0.5);
    --shadow-lg:      0 10px 30px rgba(0,0,0,0.6);
  }
}