/* ========================================
   Theme — Eligtas (Emergency Management)
   Command center meets Pacific resilience
   ======================================== */

:root {
  /* Primary — Deep blue (authority, trust) */
  --color-primary: 30, 64, 175;          /* #1e40af */
  --color-primary-light: 96, 165, 250;   /* #60a5fa */
  --color-primary-dark: 30, 58, 138;     /* #1e3a8a */

  /* Secondary — Teal (safety, resilience) */
  --color-secondary: 13, 148, 136;       /* #0d9488 */
  --color-secondary-light: 45, 212, 191; /* #2dd4bf */
  --color-secondary-dark: 15, 118, 110;  /* #0f766e */

  /* Alert levels */
  --color-alert-critical: 220, 38, 38;   /* #dc2626 */
  --color-alert-warning: 251, 191, 36;   /* #fbbf24 */
  --color-alert-info: 59, 130, 246;      /* #3b82f6 */
  --color-alert-safe: 34, 197, 94;       /* #22c55e */

  /* Surfaces */
  --color-bg: #080d1a;
  --color-bg-raised: #111827;
  --color-bg-overlay: #1e293b;
  --color-surface: #111827;
  --color-surface-hover: #1e293b;

  /* Text */
  --color-text: #e2e8f0;
  --color-text-secondary: #94a3b8;
  --color-text-muted: #475569;
  --color-text-inverse: #080d1a;

  /* Borders */
  --color-border: rgba(148, 163, 184, 0.08);
  --color-border-light: rgba(148, 163, 184, 0.15);
  --color-border-focus: rgb(var(--color-primary-light));

  /* Gradients */
  --gradient-brand: linear-gradient(135deg,
    rgb(var(--color-primary)) 0%,
    rgb(var(--color-secondary)) 100%);
  --gradient-brand-light: linear-gradient(135deg,
    rgb(var(--color-primary-light)) 0%,
    rgb(var(--color-secondary-light)) 100%);
  --gradient-surface: linear-gradient(180deg,
    var(--color-bg) 0%,
    var(--color-bg-raised) 100%);

  /* Nav */
  --nav-bg: rgba(8, 13, 26, 0.92);
  --nav-border: rgba(148, 163, 184, 0.06);
  --nav-height: 56px;

  /* Footer */
  --footer-bg: var(--color-bg);
  --footer-border: var(--color-border);

  /* Glow effects */
  --glow-primary: 0 0 40px rgba(var(--color-primary), 0.15);
  --glow-secondary: 0 0 40px rgba(var(--color-secondary), 0.15);
  --glow-critical: 0 0 30px rgba(var(--color-alert-critical), 0.2);
}
