/* ==========================================================================
   TERZOHUB — COLOR TOKENS
   Brand orange + slate neutral scale + semantic states. Light & dark themes.
   ========================================================================== */
:root {
  /* ── Brand (invariable across themes) ── */
  --terzo-orange:        #FF6600;
  --terzo-orange-hover:  #E65C00;
  --terzo-orange-light:  rgba(255, 102, 0, 0.10);
  --terzo-orange-ring:   rgba(255, 102, 0, 0.30);
  --white:               #FFFFFF;

  /* ── Slate neutral scale (raw) ── */
  --slate-50:   #F8FAFC;
  --slate-100:  #F1F5F9;
  --slate-200:  #E2E8F0;
  --slate-300:  #CBD5E1;
  --slate-400:  #94A3B8;
  --slate-500:  #64748B;
  --slate-600:  #475569;
  --slate-700:  #334155;
  --slate-800:  #1E293B;
  --slate-900:  #0F172A;

  /* ── Semantic state hues ── */
  --success:        #10B981;
  --success-strong: #16A34A;
  --success-soft:   #DCFCE7;
  --warning:        #CA8A04;
  --warning-soft:   #FEF9C3;
  --danger:         #EF4444;
  --danger-strong:  #DC2626;
  --danger-soft:    #FEE2E2;
  --info:           #3B82F6;
  --accent-purple:  #7C3AED;
  --accent-teal:    #14B8A6;

  /* ── Semantic aliases — LIGHT theme (default) ── */
  --bg-base:      #F8FAFC;   /* page background */
  --bg-surface:   #FFFFFF;   /* cards, panels, modals */
  --bg-surface-2: #F1F5F9;   /* inputs, table headers, hover */

  --border-color: #E2E8F0;
  --border-light: #F1F5F9;

  --text-primary:   #1E293B;  /* titles, strong text */
  --text-secondary: #475569;  /* body, cells */
  --text-muted:     #64748B;  /* labels, subtitles */
  --text-subtle:    #94A3B8;  /* placeholders, timestamps */
  --text-on-brand:  #FFFFFF;

  /* Legacy aliases (kept for parity with the product codebase) */
  --bg-light:  #F8FAFC;
  --card-bg:   #FFFFFF;
  --text-main: #1E293B;
}

/* ── Semantic aliases — DARK theme ── */
[data-theme="dark"] {
  --bg-base:      #0F172A;
  --bg-surface:   #1E293B;
  --bg-surface-2: #283548;

  --border-color: #334155;
  --border-light: #1E293B;

  --text-primary:   #F1F5F9;
  --text-secondary: #CBD5E1;
  --text-muted:     #94A3B8;
  --text-subtle:    #64748B;
  --text-on-brand:  #FFFFFF;

  --success-soft: rgba(22, 163, 74, 0.18);
  --warning-soft: rgba(202, 138, 4, 0.18);
  --danger-soft:  rgba(220, 38, 38, 0.18);

  --bg-light:  #0F172A;
  --card-bg:   #1E293B;
  --text-main: #F1F5F9;
}