/* ============================================================================
   NOVA Logistics — Design Tokens
   Single source of truth for the brand palette, type scale, spacing, and
   shadow/radius values. Every page (public + admin) should use these
   variables instead of redeclaring its own :root block.

   This is a SUPERSET merge of the :root blocks previously duplicated across
   index.php, booking.php, carpool.php, booking-status.php and
   admin/layout.php — admin's variant was the richest (it already had
   -lite status colors, --radius, --shadow*), so it's the baseline here,
   extended with a spacing scale and fluid type scale that nothing had yet.

   NOTE: both `--text-muted` and `--muted` are defined (aliased to the same
   value) because pages use either name interchangeably today. Once every
   page is migrated, standardize on `--text-muted` and this alias can be
   removed (tracked as Phase 4 cleanup).
   ========================================================================= */

:root {
  /* ── Brand palette ───────────────────────────────────────────────────── */
  --navy:       #0f1f3d;
  --navy-mid:   #162847;
  --navy-lite:  #1e3560;
  --gold:       #c9a84c;
  --gold-lite:  #e8c96a;
  --cream:      #faf8f3;
  --cream2:     #f0ece0;
  --white:      #ffffff;

  /* ── Text / borders ──────────────────────────────────────────────────── */
  --text:       #1a1a2e;
  --text-muted: #6b7280;
  --muted:      #6b7280;   /* alias — see note above */
  --border:     #e5e7eb;

  /* ── Status colors (+ "lite" tint backgrounds for badges/alerts) ─────── */
  --red:        #dc2626;
  --red-lite:   #fef2f2;
  --green:      #16a34a;
  --green-lite: #f0fdf4;
  --yellow:     #d97706;
  --yellow-lite:#fffbeb;
  --blue:       #2563eb;
  --blue-lite:  #eff6ff;

  /* ── Layout constants ────────────────────────────────────────────────── */
  --sidebar-w:  220px;
  --radius:     10px;
  --radius-sm:  8px;
  --radius-lg:  14px;
  --shadow:     0 2px 12px rgba(0,0,0,.08);
  --shadow-lg:  0 8px 32px rgba(0,0,0,.14);

  /* ── Spacing scale (NEW — for consistent rhythm across pages) ────────── */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;

  /* ── Fluid type scale (NEW — clamp() based, scales with viewport) ────── */
  --font-size-h1: clamp(28px, 5vw, 42px);
  --font-size-h2: clamp(22px, 4vw, 30px);
  --font-size-h3: clamp(17px, 2.6vw, 20px);
  --font-size-body: 15px;
  --font-size-sm: 13px;
  --font-size-xs: 11px;

  /* ── Transitions (consistency — most hover effects use .15s today) ───── */
  --transition-fast: .15s ease;
  --transition-med:  .25s ease;
}
