/* ============================================================
   Lead Orbit — Design tokens (Claude-inspired)
   ------------------------------------------------------------
   Warm cream backgrounds, charcoal text, coral/peach accent.
   Edit this file (and only this file) to retheme the app.
   Component styles in style.css read from these variables.
   ============================================================ */

:root {
  /* ── Brand ─────────────────────────────────────────────── */
  --primary:        #2C2A24;   /* warm charcoal (was navy) */
  --primary-light:  #3A3833;   /* slightly lifted charcoal */
  --accent:         #D97757;   /* Claude peach/coral */
  --accent-dark:    #C96442;   /* deeper coral on hover */
  --accent-soft:    #FCEBE0;   /* coral wash for backgrounds */

  /* ── Status / semantic — refined, slightly muted ───────── */
  --green:          #5A8C3F;
  --green-light:    #EAF1E0;
  --red:            #C84432;
  --red-light:      #FAE8E2;
  --orange:         #D97757;
  --orange-light:   #FCEBE0;
  --blue:           #5B7C99;
  --blue-light:     #DEE6EE;
  --purple:         #8B6FA8;
  --purple-light:   #EAE0F0;

  /* ── Neutrals — warm, paper-like ───────────────────────── */
  --dark:           #1F1E1B;   /* rich warm black */
  --gray:           #6B6B66;   /* body copy gray */
  --gray-light:     #A8A6A0;   /* secondary gray */
  --border:         #E8E5DD;   /* subtle warm border */
  --bg:             #FAF9F5;   /* page bg — warm cream */
  --bg-soft:        #F2F0E8;   /* slightly deeper cream */
  --white:          #FFFFFF;   /* pure white (cards) */

  /* ── Sidebar (light theme variant) ─────────────────────── */
  --sidebar-bg:        #FFFFFF;
  --sidebar-fg:        #3A3833;
  --sidebar-fg-muted:  #8B8A82;
  --sidebar-border:    var(--border);
  --sidebar-hover-bg:  #F5F3EE;
  --sidebar-active-bg: #FAF1EB;
  --sidebar-active-fg: var(--accent-dark);

  /* ── Elevation — gentler, more paper-like ──────────────── */
  --shadow:    0 1px 2px rgba(31, 30, 27, .04), 0 1px 3px rgba(31, 30, 27, .06);
  --shadow-md: 0 4px 10px rgba(31, 30, 27, .06), 0 2px 4px rgba(31, 30, 27, .04);
  --shadow-lg: 0 16px 32px rgba(31, 30, 27, .10), 0 6px 12px rgba(31, 30, 27, .05);
  --shadow-ring-accent: 0 0 0 3px rgba(217, 119, 87, .18);

  /* ── Geometry ──────────────────────────────────────────── */
  --radius:    10px;
  --radius-lg: 14px;
  --sidebar-w:           248px;
  --sidebar-w-collapsed: 68px;
  --topbar-h:  64px;
}
