/* ============================================================
   CWN THEME — Design Tokens & Brand Variables
   Montana Storm Network
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@300;400;500;600;700;900&family=JetBrains+Mono:wght@300;400;500;700&family=Barlow:wght@300;400;500&display=swap');

:root {
  /* Brand Palette */
  --sky-blue:        #3F8EDB;
  --sky-blue-dark:   #2b6fad;
  --sky-blue-light:  #6db0f0;
  --storm-gray:      #2C3E50;
  --storm-dark:      #1a252f;
  --storm-deeper:    #0d1a22;
  --prairie-gold:    #F4B942;
  --cloud-white:     #F5F7FA;
  --lightning-yellow:#FFD93B;
  --radar-green:     #3EDC81;
  --alert-red:       #E74C3C;
  --alert-orange:    #E67E22;

  /* Neutral Scale */
  --gray-900: #0d1a22;
  --gray-800: #1a2a35;
  --gray-700: #243444;
  --gray-600: #2C3E50;
  --gray-500: #3d5166;
  --gray-400: #5a7a9a;
  --gray-300: #7fa8c8;
  --gray-200: #b0cfe8;
  --gray-100: #d8eaf7;
  --gray-50:  #eef6fc;

  /* Typography */
  --font-display: 'Barlow Condensed', sans-serif;
  --font-data:    'JetBrains Mono', monospace;
  --font-body:    'Barlow', sans-serif;

  /* Spacing Scale */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  40px;
  --space-2xl: 64px;
  --space-3xl: 96px;

  /* Layout */
  --max-width: 1400px;
  --nav-height: 64px;
  --border-radius: 4px;
  --border-radius-lg: 8px;

  /* Effects */
  --glow-blue:  0 0 24px rgba(63,142,219,0.3);
  --glow-gold:  0 0 24px rgba(244,185,66,0.4);
  --glow-green: 0 0 24px rgba(62,220,129,0.3);
  --shadow-card: 0 2px 16px rgba(0,0,0,0.4), 0 1px 4px rgba(0,0,0,0.3);
  --shadow-deep: 0 8px 32px rgba(0,0,0,0.6);

  /* Transitions */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;

  /* Dynamic Background (updated by JS) */
  --bg-primary:  var(--gray-900);
  --bg-secondary: var(--gray-800);
  --bg-card:     var(--gray-700);

  /* Borders */
  --border-subtle: 1px solid rgba(255,255,255,0.06);
  --border-accent: 1px solid rgba(63,142,219,0.3);
}

/* Dynamic weather backgrounds */
body.weather-clear    { --bg-sky: linear-gradient(160deg, #0d2440 0%, #1a3a5e 40%, #0d1a22 100%); }
body.weather-storm    { --bg-sky: linear-gradient(160deg, #0a0f14 0%, #1a252f 40%, #0d1217 100%); }
body.weather-snow     { --bg-sky: linear-gradient(160deg, #1a2535 0%, #243444 40%, #1a2535 100%); }
body.weather-sunset   { --bg-sky: linear-gradient(160deg, #1a1020 0%, #2d1a0e 40%, #0d1a22 100%); }
body.weather-overcast { --bg-sky: linear-gradient(160deg, #141e28 0%, #1f2f3d 40%, #0d1622 100%); }