/* ============================================================
   Design tokens — the single source of truth for the redesign.
   Components must reference these vars, never raw hex.
   Dark-ready: a future dark theme is one [data-theme="dark"]
   override block, not a rewrite.
   ============================================================ */
:root {
  /* --- Brand / action ------------------------------------- */
  --color-primary:        #4f46e5;  /* indigo-600 */
  --color-primary-hover:  #4338ca;  /* indigo-700 */
  --color-primary-active: #3730a3;  /* indigo-800 */
  --color-primary-soft:   #eef2ff;  /* indigo-50  */
  --color-primary-on:     #ffffff;

  /* --- Neutral surfaces & text ---------------------------- */
  --color-bg:             #f8fafc;  /* app background (slate-50)  */
  --color-surface:        #ffffff;  /* cards, sidebar, topbar     */
  --color-surface-2:      #f1f5f9;  /* subtle fills, table stripes*/
  --color-surface-3:      #e9eef5;  /* hover fills                */
  --color-border:         #e2e8f0;  /* slate-200                  */
  --color-border-strong:  #cbd5e1;  /* slate-300                  */
  --color-text:           #1e293b;  /* body (slate-800)           */
  --color-text-strong:    #0f172a;  /* headings (slate-900)       */
  --color-text-muted:     #64748b;  /* secondary (slate-500)      */
  --color-text-faint:     #94a3b8;  /* slate-400                  */

  /* --- Text selection ------------------------------------- */
  /* BOTH halves are load-bearing. Setting only the background leaves each
     run of text in its own colour, and the leads table is mostly muted
     (#64748b) and faint (#94a3b8) greys: on the old near-white selection
     those came out at 4.26:1 and 2.29:1, i.e. unreadable exactly where
     managers copy phone numbers and emails from. */
  --color-selection-bg:   #fef08a;  /* yellow-200 */
  --color-selection-fg:   #854d0e;  /* yellow-800, 5.89:1 on the above */

  /* --- Feedback ------------------------------------------- */
  --color-success: #16a34a;  --color-success-soft: #dcfce7;
  --color-warning: #d97706;  --color-warning-soft: #fef3c7;
  --color-danger:  #dc2626;  --color-danger-soft:  #fee2e2;
  --color-info:    #0891b2;  --color-info-soft:    #cffafe;

  /* --- Lead status map (one source of truth, 7 statuses) -- */
  /* repeated was unreadable black/beige in the old code → violet */
  --status-new-fg:                #475569;  --status-new-bg:                #f1f5f9;
  --status-no-answer-fg:          #b45309;  --status-no-answer-bg:          #fef3c7;
  --status-not-interested-fg:     #b91c1c;  --status-not-interested-bg:     #fee2e2;
  --status-comes-to-our-place-fg: #c2410c;  --status-comes-to-our-place-bg: #ffedd5;
  --status-in-progress-fg:        #0e7490;  --status-in-progress-bg:        #cffafe;
  --status-sold-fg:               #15803d;  --status-sold-bg:               #dcfce7;
  --status-repeated-fg:           #6d28d9;  --status-repeated-bg:           #ede9fe;

  /* --- Typography ----------------------------------------- */
  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
  --text-xs:   0.75rem;   /* 12px */
  --text-sm:   0.8125rem; /* 13px */
  --text-base: 0.875rem;  /* 14px */
  --text-lg:   1rem;      /* 16px */
  --text-xl:   1.25rem;   /* 20px */
  --text-2xl:  1.625rem;  /* 26px */
  --text-3xl:  2.125rem;  /* 34px */
  --leading:   1.5;

  /* --- Spacing -------------------------------------------- */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-8: 48px;

  /* --- Radius / shadow ------------------------------------ */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(15,23,42,.06);
  --shadow-md: 0 2px 8px rgba(15,23,42,.08);
  --shadow-lg: 0 8px 24px rgba(15,23,42,.12);

  /* --- Layout --------------------------------------------- */
  --sidebar-w:  248px;
  --topbar-h:   56px;
  --content-max: 1280px;
  --focus-ring: 0 0 0 3px rgba(79,70,229,.35);
}
