/* ════════════════════════════════════════════════════════════════════
   ZGAGI — design tokens
   Source of truth: brand/ZGAGI_brand_board_approved.png (approved 2026-09-27).
   Every colour here is from the board; nothing is invented. Components read
   these variables only — never raw hex.
   ════════════════════════════════════════════════════════════════════ */
:root {
  /* ── brand (from the board's palette) ── */
  --zg-navy:        #0F2747;   /* כחול כהה ראשי */
  --zg-blue:        #0EA5FF;   /* כחול ראשי */
  --zg-turquoise:   #06B6D4;   /* טורקיז */
  --zg-ice:         #E6F4FF;   /* תכלת בהיר */
  --zg-bg:          #F8FBFF;   /* רקע אפליקציה */
  --zg-surface:     #FFFFFF;
  --zg-text:        #111827;   /* טקסט ראשי */
  --zg-text-2:      #6B7280;   /* טקסט משני */
  --zg-line:        #D1D5DB;   /* גבולות / קווים */
  --zg-success:     #10B981;
  --zg-warning:     #F59E0B;
  --zg-danger:      #EF4444;

  /* the symbol's gradients, as on the board (135°) */
  --zg-grad-main:   linear-gradient(135deg, #0EA5FF 0%, #0F2747 100%);
  --zg-grad-glass:  linear-gradient(135deg, #06B6D4 0%, #E6F4FF 100%);

  /* ── derived: tints for backgrounds of badges and hovers ── */
  --zg-blue-soft:     #E6F4FF;
  --zg-turq-soft:     #E0F7FA;
  --zg-success-soft:  #E7F8F1;
  --zg-warning-soft:  #FEF3E2;
  --zg-danger-soft:   #FDECEC;
  --zg-neutral-soft:  #F1F3F6;
  --zg-navy-soft:     #E8EDF4;
  /* text colours on the soft tints, dark enough for AA contrast */
  --zg-blue-ink:      #0369A1;
  --zg-turq-ink:      #0E7490;
  --zg-success-ink:   #047857;
  --zg-warning-ink:   #B45309;
  --zg-danger-ink:    #B91C1C;

  /* ── order status (spec §2) → colour. One place, every screen reads it ── */
  --st-draft-bg: var(--zg-neutral-soft);   --st-draft-fg: var(--zg-text-2);
  --st-quote-bg: var(--zg-warning-soft);   --st-quote-fg: var(--zg-warning-ink);
  --st-factory-bg: var(--zg-blue-soft);    --st-factory-fg: var(--zg-blue-ink);
  --st-production-bg: var(--zg-turq-soft); --st-production-fg: var(--zg-turq-ink);
  --st-ready-bg: var(--zg-navy-soft);      --st-ready-fg: var(--zg-navy);
  --st-installed-bg: var(--zg-success-soft); --st-installed-fg: var(--zg-success-ink);
  --st-cancelled-bg: var(--zg-danger-soft);  --st-cancelled-fg: var(--zg-danger-ink);

  /* ── type: Heebo in the app (Gotham lives only inside the logo files) ── */
  --zg-font: 'Heebo', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --fs-xs: 12px; --fs-sm: 14px; --fs-md: 16px; --fs-lg: 18px;
  --fs-xl: 22px; --fs-2xl: 28px; --fs-3xl: 34px;
  --fw-reg: 400; --fw-med: 500; --fw-bold: 700;
  --lh: 1.5;

  /* ── space, radius, depth ── */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px;
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 22px; --r-pill: 999px;
  --shadow-1: 0 1px 2px rgba(15,39,71,.06), 0 1px 3px rgba(15,39,71,.05);
  --shadow-2: 0 4px 16px rgba(15,39,71,.08);
  --shadow-glass: 0 8px 24px rgba(14,165,255,.18);
  --focus: 0 0 0 3px rgba(14,165,255,.35);

  /* ── touch & layout ── */
  --tap: 44px;                /* minimum touch target */
  --nav-h: 64px;              /* mobile bottom bar */
  --side-w: 240px;            /* tablet/desktop side menu */
  --content-max: 1200px;
}