/*
 * BizPlatform v6 — Theme System
 * All color variables for Light and Dark modes.
 * Dark mode inspired by Puzzle finance platform.
 * Toggle via: body[data-theme="dark"]
 */

/* ═══════════════════════════════════════════════════════
   LIGHT THEME (default)
   Clean, professional, high-contrast white
   ═══════════════════════════════════════════════════════ */
:root {
  /* Backgrounds */
  --bg-page:            #f0f2f7;
  --bg-card:            #ffffff;
  --bg-sidebar:         #13151c;
  --bg-sidebar-active:  #4e9af1;
  --bg-sidebar-hover:   rgba(255,255,255,.07);
  --bg-input:           #ffffff;
  --bg-input-focus:     #f8f9ff;
  --bg-table-header:    #f8f9fc;
  --bg-table-stripe:    #fafbfd;
  --bg-modal:           #ffffff;
  --bg-badge-auto:      #e0f2fe;

  /* Text */
  --text-primary:       #1a1d28;
  --text-secondary:     #5c6478;
  --text-muted:         #94a0b8;
  --text-sidebar:       #9ba8be;
  --text-sidebar-hover: #ffffff;
  --text-sidebar-brand: #ffffff;
  --text-on-accent:     #ffffff;
  --text-badge-auto:    #0369a1;

  /* Borders */
  --border-color:       #e4e8f0;
  --border-input:       #d1d9e6;
  --border-sidebar:     rgba(255,255,255,.08);
  --border-card:        transparent;

  /* Accent & Brand */
  --accent:             #4e9af1;
  --accent-hover:       #3a88e0;
  --accent-soft:        rgba(78,154,241,.12);
  --accent-glow:        rgba(78,154,241,.25);

  /* KPI Cards */
  --kpi-bg:             #ffffff;
  --kpi-positive:       #10b981;
  --kpi-positive-bg:    rgba(16,185,129,.10);
  --kpi-negative:       #ef4444;
  --kpi-negative-bg:    rgba(239,68,68,.10);
  --kpi-neutral:        #6366f1;
  --kpi-neutral-bg:     rgba(99,102,241,.10);
  --kpi-warn:           #f59e0b;
  --kpi-warn-bg:        rgba(245,158,11,.10);

  /* Status Badges */
  --badge-paid-bg:      #d1fae5;
  --badge-paid-text:    #065f46;
  --badge-unpaid-bg:    #fee2e2;
  --badge-unpaid-text:  #991b1b;
  --badge-partial-bg:   #fef3c7;
  --badge-partial-text: #92400e;
  --badge-overdue-bg:   #fee2e2;
  --badge-overdue-text: #991b1b;
  --badge-active-bg:    #d1fae5;
  --badge-active-text:  #065f46;
  --badge-inactive-bg:  #f3f4f6;
  --badge-inactive-text:#6b7280;
  --badge-cancelled-bg: #fee2e2;
  --badge-cancelled-text:#991b1b;
  --badge-draft-bg:     #f3f4f6;
  --badge-draft-text:   #374151;

  /* Charts */
  --chart-revenue:      rgba(78,154,241,.85);
  --chart-costs:        rgba(239,68,68,.75);
  --chart-profit:       rgba(16,185,129,.85);
  --chart-grid:         rgba(0,0,0,.06);

  /* Shadows */
  --shadow-card:        0 1px 3px rgba(0,0,0,.06), 0 1px 8px rgba(0,0,0,.04);
  --shadow-card-hover:  0 4px 16px rgba(0,0,0,.10);
  --shadow-modal:       0 20px 60px rgba(0,0,0,.18);
  --shadow-sidebar:     4px 0 24px rgba(0,0,0,.12);

  /* Misc */
  --sidebar-width:      236px;
  --radius-card:        12px;
  --radius-badge:       20px;
  --radius-input:       8px;
  --transition:         0.18s ease;
}


/* ═══════════════════════════════════════════════════════
   DARK THEME — Puzzle-style
   Deep navy/charcoal, purple accent, glowing cards
   ═══════════════════════════════════════════════════════ */
[data-theme="dark"] {
  /* Backgrounds */
  --bg-page:            #0c0f15;
  --bg-card:            #171c25;
  --bg-sidebar:         #0a0d13;
  --bg-sidebar-active:  #8b5cf6;
  --bg-sidebar-hover:   rgba(139,92,246,.16);
  --bg-input:           #202632;
  --bg-input-focus:     #272f3d;
  --bg-table-header:    #1b2130;
  --bg-table-stripe:    rgba(255,255,255,.038);
  --bg-modal:           #171c25;
  --bg-badge-auto:      rgba(129,140,248,.24);

  /* Text */
  --text-primary:       #eef2ff;
  --text-secondary:     #bcc5da;
  --text-muted:         #8f99b2;
  --text-sidebar:       #aeb7cb;
  --text-sidebar-hover: #f4f7ff;
  --text-sidebar-brand: #ffffff;
  --text-on-accent:     #ffffff;
  --text-badge-auto:    #c7d2fe;

  /* Borders */
  --border-color:       rgba(255,255,255,.10);
  --border-input:       rgba(255,255,255,.14);
  --border-sidebar:     rgba(255,255,255,.08);
  --border-card:        rgba(255,255,255,.08);

  /* Accent & Brand */
  --accent:             #9f67ff;
  --accent-hover:       #8a4ff7;
  --accent-soft:        rgba(159,103,255,.18);
  --accent-glow:        rgba(159,103,255,.34);

  /* KPI Cards */
  --kpi-bg:             #181e29;
  --kpi-positive:       #4ade80;
  --kpi-positive-bg:    rgba(74,222,128,.14);
  --kpi-negative:       #fb7185;
  --kpi-negative-bg:    rgba(251,113,133,.14);
  --kpi-neutral:        #a78bfa;
  --kpi-neutral-bg:     rgba(167,139,250,.16);
  --kpi-warn:           #fbbf24;
  --kpi-warn-bg:        rgba(251,191,36,.16);

  /* Status Badges */
  --badge-paid-bg:      rgba(74,222,128,.18);
  --badge-paid-text:    #86efac;
  --badge-unpaid-bg:    rgba(251,113,133,.18);
  --badge-unpaid-text:  #fda4af;
  --badge-partial-bg:   rgba(251,191,36,.18);
  --badge-partial-text: #fde68a;
  --badge-overdue-bg:   rgba(251,113,133,.22);
  --badge-overdue-text: #fecdd3;
  --badge-active-bg:    rgba(74,222,128,.18);
  --badge-active-text:  #86efac;
  --badge-inactive-bg:  rgba(148,163,184,.16);
  --badge-inactive-text:#dbe4f3;
  --badge-cancelled-bg: rgba(251,113,133,.18);
  --badge-cancelled-text:#fecdd3;
  --badge-draft-bg:     rgba(148,163,184,.16);
  --badge-draft-text:   #e2e8f0;

  /* Charts */
  --chart-revenue:      rgba(159,103,255,.88);
  --chart-costs:        rgba(251,113,133,.82);
  --chart-profit:       rgba(74,222,128,.84);
  --chart-grid:         rgba(255,255,255,.08);

  /* Shadows */
  --shadow-card:        0 8px 24px rgba(0,0,0,.28);
  --shadow-card-hover:  0 14px 32px rgba(0,0,0,.36), 0 0 0 1px rgba(159,103,255,.16);
  --shadow-modal:       0 28px 90px rgba(0,0,0,.72);
  --shadow-sidebar:     4px 0 32px rgba(0,0,0,.56);
}