/* Extracted from index.css L1-L660: CSS custom properties and design tokens */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800&display=swap');

:root {
  --bg-primary: #0b0b1a;
  --bg-secondary: rgba(255,255,255,0.025);
  --bg-card: rgba(10,14,28,0.52);
  --bg-card-hover: rgba(14,20,38,0.62);
  --bg-elevated: rgba(12,16,32,0.60);
  --bg-input: #13132d;
  --border: rgba(255,255,255,0.05);
  --border-subtle: rgba(255,255,255,0.03);
  --glow: 0 0 20px rgba(52,211,153,0.06);
  --shadow-card: 0 4px 20px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.1), 0 0 20px rgba(255,255,255,0.04);
  --shadow-elevated: 0 8px 40px rgba(0,0,0,0.5);
  --text-primary: #f8f8fc;
  --text-secondary: #d4d4ea;
  --text-muted: #a8a8c4;
  --accent-green: #34d399;
  --accent-green-dim: rgba(52,211,153,0.1);
  --accent-green-glow: rgba(52,211,153,0.15);
  --accent-orange: #e8613c;
  --accent-red: #ff4444;
  --accent-red-dim: rgba(255,68,68,0.12);
  --accent-blue: #60a5fa;
  --accent-blue-dim: rgba(96,165,250,0.08);
  --accent-purple: #a78bfa;
  --accent-purple-dim: rgba(167,139,250,0.08);
  --accent-yellow: #fbbf24;
  --accent-yellow-dim: rgba(251,191,36,0.08);
  --sidebar-bg: #090918;
  --sidebar-active: rgba(52,211,153,0.08);
  --radius: 14px;
  --radius-sm: 10px;
  --transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-spring: 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ===== LIGHT MODE TOKENS ===== */
/* ══════════════════════════════════════════════════════════════
   LIGHT MODE — GLASS DESIGN SYSTEM
   Design language: frosted glass over white-sand dunes.
   Nothing is solid. Everything breathes.
   ══════════════════════════════════════════════════════════════ */

/* ── Design tokens ──────────────────────────────────────────── */

[data-theme="light"] {
  /* Surfaces — all translucent, never solid */
  --bg-primary:        transparent;
  --bg-secondary:      rgba(255,255,255,0.20);
  --bg-card:           rgba(255,255,255,0.38);
  --bg-card-hover:     rgba(255,255,255,0.50);
  --bg-elevated:       rgba(255,255,255,0.45);
  --bg-input:          rgba(255,255,255,0.55);

  /* Borders — whisper light */
  --border:            rgba(255,255,255,0.50);
  --border-subtle:     rgba(255,255,255,0.30);

  /* Text — soft dark, never pure black */
  --text-primary:      rgba(28,28,30,0.88);
  --text-secondary:    rgba(28,28,30,0.62);
  --text-muted:        rgba(28,28,30,0.40);

  /* Shadows — warm, soft */
  --shadow-card:       0 4px 24px rgba(0,0,0,0.08), 0 1px 4px rgba(0,0,0,0.04);
  --shadow-elevated:   0 12px 40px rgba(0,0,0,0.12);

  /* Sidebar */
  --sidebar-bg:        rgba(255,255,255,0.42);
  --sidebar-active:    rgba(31,214,166,0.15);

  /* Accent dims — keep existing tokens, they work fine */
  --accent-green-dim:  rgba(52,211,153,0.18);
  --accent-green-glow: rgba(52,211,153,0.15);
  --accent-red-dim:    rgba(255,68,68,0.12);
  --accent-blue-dim:   rgba(96,165,250,0.12);
  --accent-purple-dim: rgba(167,139,250,0.12);
  --accent-yellow-dim: rgba(251,191,36,0.12);

  --glow: none;

  /* Accent text colours — richer/darker for legibility on light glass surfaces */
  --accent-green:      #059669;
  --accent-red:        #dc2626;
  --accent-blue:       #1d6fb8;
  --accent-purple:     #6d35c9;
  --accent-yellow:     #b45309;
  --accent-orange:     #c2410c;
  /* Dim variants updated to match darker accents */
  --accent-green-dim:  rgba(5,150,105,0.12);
  --accent-green-glow: rgba(5,150,105,0.12);
  --accent-red-dim:    rgba(220,38,38,0.10);
  --accent-blue-dim:   rgba(29,111,184,0.10);
  --accent-purple-dim: rgba(109,53,201,0.10);
  --accent-yellow-dim: rgba(180,83,9,0.10);
}

/* ── Background: white-sand image + softening overlay ──────── */

[data-theme="light"] body {
  background-color: #e8ddd0;
  background-image: url('../assets/backgrounds/white-sand.jpg');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

/* Softening overlay — keeps image visible but text readable */
[data-theme="light"] body::before {
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,0.60),
    rgba(255,255,255,0.78)
  ) !important;
}

[data-theme="light"] body::after {
  display: none !important;
}

/* Hide dark video scene */
[data-theme="light"] .app-background-scene {
  display: none !important;
}

/* ── Shimmer animations — suppress in light ─────────────────── */
[data-theme="light"] .stat-card::before,
[data-theme="light"] .card::before { display: none; }

/* ── Cards — glass, not solid ───────────────────────────────── */

[data-theme="light"] .card {
  background: rgba(255,255,255,0.38) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;
  border: 1px solid rgba(255,255,255,0.50) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.08), 0 1px 4px rgba(0,0,0,0.04) !important;
  color: rgba(28,28,30,0.88) !important;
}
[data-theme="light"] .card:hover {
  background: rgba(255,255,255,0.50) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.10) !important;
  transform: translateY(-2px);
}

/* ── Stat cards ─────────────────────────────────────────────── */

[data-theme="light"] .stat-card {
  background: rgba(255,255,255,0.38) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;
  border: 1px solid rgba(255,255,255,0.50) !important;
  border-left-width: 3px !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.07) !important;
}
[data-theme="light"] .stat-card:hover {
  background: rgba(255,255,255,0.50) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.10) !important;
}
[data-theme="light"] .stat-label  { color: rgba(28,28,30,0.50) !important; }
[data-theme="light"] .stat-value  { color: rgba(28,28,30,0.88) !important; }
[data-theme="light"] .stat-change { color: rgba(28,28,30,0.50) !important; }

/* ── Nav column ─────────────────────────────────────────────── */

[data-theme="light"] .nav-column {
  background: rgba(255,255,255,0.55) !important;
  backdrop-filter: blur(24px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(160%) !important;
  border-right: 1px solid rgba(255,255,255,0.50) !important;
  box-shadow: 4px 0 24px rgba(0,0,0,0.06) !important;
}
[data-theme="light"] .nav-column::before { display: none; }
[data-theme="light"] .nav-column::after  { display: none; }

[data-theme="light"] .nav-item {
  color: rgba(28,28,30,0.62) !important;
}
[data-theme="light"] .nav-item:hover {
  background: rgba(31,214,166,0.10) !important;
  color: rgba(28,28,30,0.88) !important;
  text-shadow: none !important;
}
[data-theme="light"] .nav-item:hover svg { filter: none !important; }
[data-theme="light"] .nav-item.active {
  color: rgba(28,28,30,0.88) !important;
  background: rgba(31,214,166,0.15) !important;
}
[data-theme="light"] .nav-item.active::before { box-shadow: none !important; }
[data-theme="light"] .nav-section-label { color: rgba(28,28,30,0.35) !important; }

/* ── Main area ──────────────────────────────────────────────── */
[data-theme="light"] .main::before { display: none; }

/* ── Typography ─────────────────────────────────────────────── */
[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] h4 {
  color: rgba(28,28,30,0.88) !important;
}
[data-theme="light"] p,
[data-theme="light"] span:not([class]),
[data-theme="light"] li {
  color: rgba(28,28,30,0.75);
}

/* Logo */
[data-theme="light"] .logo h1 {
  background: linear-gradient(135deg, rgba(28,28,30,0.88) 0%, #1FD6A6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ── Forms — glass inputs ───────────────────────────────────── */

[data-theme="light"] .form-input,
[data-theme="light"] .form-select,
[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea {
  background: rgba(255,255,255,0.55) !important;
  backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  color: rgba(28,28,30,0.88) !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.04) !important;
}
[data-theme="light"] .form-input::placeholder { color: rgba(28,28,30,0.35) !important; }
[data-theme="light"] input:focus,
[data-theme="light"] select:focus,
[data-theme="light"] textarea:focus {
  border-color: rgba(31,214,166,0.55) !important;
  box-shadow: 0 0 0 3px rgba(31,214,166,0.15) !important;
  outline: none !important;
}
[data-theme="light"] select option {
  background: #f8f4ef !important;
  color: rgba(28,28,30,0.88) !important;
}
[data-theme="light"] select[multiple] option {
  background: #f8f4ef !important;
  color: rgba(28,28,30,0.88) !important;
}

/* ── Custom dropdowns (cd-trigger) ──────────────────────────── */

[data-theme="light"] .cd-trigger {
  background: rgba(255,255,255,0.55) !important;
  backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  color: rgba(28,28,30,0.88) !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.04) !important;
}
[data-theme="light"] .cd-trigger:hover {
  background: rgba(255,255,255,0.68) !important;
  border-color: rgba(31,214,166,0.40) !important;
}
[data-theme="light"] .cd-list {
  background: rgba(250,248,245,0.95) !important;
  backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.12) !important;
}
[data-theme="light"] .cd-item:hover {
  background: rgba(31,214,166,0.10) !important;
  color: rgba(28,28,30,0.88) !important;
}

/* ── Datepicker ─────────────────────────────────────────────── */
[data-theme="light"] .dp-trigger {
  background: rgba(255,255,255,0.55) !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  color: rgba(28,28,30,0.88) !important;
}
[data-theme="light"] .dp-panel {
  background: rgba(250,248,245,0.96) !important;
  backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.12) !important;
}
[data-theme="light"] .dp-header button:hover  { background: rgba(0,0,0,0.05) !important; }
[data-theme="light"] .dp-month-label:hover    { background: rgba(0,0,0,0.05) !important; }
[data-theme="light"] .dp-day:hover            { background: rgba(31,214,166,0.15) !important; }
[data-theme="light"] .dp-day.selected         { box-shadow: none !important; }

/* ── Buttons ─────────────────────────────────────────────────── */

[data-theme="light"] .btn {
  background: rgba(255,255,255,0.45) !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  color: rgba(28,28,30,0.75) !important;
  backdrop-filter: blur(8px) !important;
}
[data-theme="light"] .btn:hover {
  background: rgba(255,255,255,0.65) !important;
  border-color: rgba(31,214,166,0.35) !important;
  color: rgba(28,28,30,0.88) !important;
}
/* Primary buttons keep their gradient — they're explicit CTAs */
[data-theme="light"] .btn-primary {
  background: linear-gradient(180deg, #4aa3f5 0%, #1976d2 50%, #1565c0 100%) !important;
  color: #ffffff !important;
  border: none !important;
}

/* ── Tables ──────────────────────────────────────────────────── */

[data-theme="light"] table { color: rgba(28,28,30,0.88); }
[data-theme="light"] thead tr,
[data-theme="light"] thead { background: rgba(255,255,255,0.25) !important; }
[data-theme="light"] thead th {
  color: rgba(28,28,30,0.50) !important;
  border-bottom: 1px solid rgba(0,0,0,0.08) !important;
}
[data-theme="light"] tbody tr { border-bottom: 1px solid rgba(0,0,0,0.06) !important; }
[data-theme="light"] tbody td { color: rgba(28,28,30,0.88) !important; }
[data-theme="light"] tbody tr:hover { background: rgba(255,255,255,0.28) !important; }
[data-theme="light"] tfoot tr { border-top: 1px solid rgba(0,0,0,0.10) !important; }
[data-theme="light"] tfoot td { color: rgba(28,28,30,0.88) !important; }

/* ── Month cards ─────────────────────────────────────────────── */

[data-theme="light"] .month-card {
  background: rgba(255,255,255,0.35) !important;
  backdrop-filter: blur(14px) !important;
  border: 1px solid rgba(255,255,255,0.50) !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
}
[data-theme="light"] .month-card:hover {
  background: rgba(255,255,255,0.50) !important;
  border-color: rgba(31,214,166,0.35) !important;
}
[data-theme="light"] .month-card.active {
  background: rgba(255,255,255,0.55) !important;
  border-color: rgba(31,214,166,0.50) !important;
}

/* ── Card headers ────────────────────────────────────────────── */

[data-theme="light"] .card-header {
  border-bottom: 1px solid rgba(0,0,0,0.07) !important;
}
[data-theme="light"] .card-title { color: rgba(28,28,30,0.88) !important; }

/* ── Alert / notification banners ───────────────────────────── */

[data-theme="light"] .alert-banner {
  background: rgba(255,255,255,0.55) !important;
  backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
}

/* ── Loading overlay ─────────────────────────────────────────── */

[data-theme="light"] .loading-overlay {
  background: rgba(240,235,228,0.92) !important;
  backdrop-filter: blur(12px) !important;
}

/* ── Cloud status ────────────────────────────────────────────── */

[data-theme="light"] .cloud-status-dot { box-shadow: 0 0 6px #1FD6A6; }

/* ── Scrollbar ───────────────────────────────────────────────── */

[data-theme="light"] ::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.14); }
[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.22); }

/* ── Theme toggle ────────────────────────────────────────────── */

[data-theme="light"] #theme-toggle {
  background: rgba(255,255,255,0.50) !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  backdrop-filter: blur(8px) !important;
}

/* ── Glass panel ─────────────────────────────────────────────── */

[data-theme="light"] .glass-panel {
  background: rgba(255,255,255,0.38) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  border: 1px solid rgba(255,255,255,0.50) !important;
}

/* ── Toast ───────────────────────────────────────────────────── */

[data-theme="light"] .toast {
  background: rgba(250,248,245,0.92) !important;
  backdrop-filter: blur(18px) !important;
  border: 1px solid rgba(0,0,0,0.10) !important;
  color: rgba(28,28,30,0.88) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.12) !important;
}

/* ── Modals ──────────────────────────────────────────────────── */

[data-theme="light"] .modal-overlay {
  background: rgba(0,0,0,0.30) !important;
  backdrop-filter: blur(4px) !important;
}
[data-theme="light"] .modal-content,
[data-theme="light"] .modal-body {
  background: rgba(250,248,245,0.92) !important;
  backdrop-filter: blur(24px) !important;
  border: 1px solid rgba(255,255,255,0.60) !important;
  color: rgba(28,28,30,0.88) !important;
}
[data-theme="light"] .modal-content input,
[data-theme="light"] .modal-content select,
[data-theme="light"] .modal-content textarea,
[data-theme="light"] .modal-body input,
[data-theme="light"] .modal-body select {
  background: rgba(255,255,255,0.65) !important;
  border-color: rgba(0,0,0,0.10) !important;
  color: rgba(28,28,30,0.88) !important;
}

/* ── Budget overview (dbo) ───────────────────────────────────── */

[data-theme="light"] .dbo-header-btn {
  background: rgba(255,255,255,0.38) !important;
  backdrop-filter: blur(14px) !important;
  border-color: rgba(255,255,255,0.50) !important;
}
[data-theme="light"] .dbo-header-btn:hover,
[data-theme="light"] .dbo-header-btn.dbo-open {
  background: rgba(255,255,255,0.52) !important;
}
[data-theme="light"] .dbo-body {
  background: rgba(255,255,255,0.28) !important;
  backdrop-filter: blur(18px) !important;
  border: 1px solid rgba(255,255,255,0.45) !important;
  border-top: none !important;
}
[data-theme="light"] .dbo-item         { border-bottom: 1px solid rgba(0,0,0,0.05) !important; }
[data-theme="light"] .dbo-item:hover   { background: rgba(255,255,255,0.25) !important; }
[data-theme="light"] .dbo-month-progress {
  background: rgba(255,255,255,0.20) !important;
  border-bottom: 1px solid rgba(0,0,0,0.04) !important;
}
[data-theme="light"] .dbo-mp-track     { background: rgba(0,0,0,0.08) !important; }
[data-theme="light"] .dbo-mp-fill      { background: rgba(0,0,0,0.14) !important; }
[data-theme="light"] .dbo-bar-wrap     { background: rgba(0,0,0,0.07) !important; }
[data-theme="light"] .dbo-bar-wrap::after { background: rgba(0,0,0,0.14) !important; }
[data-theme="light"] .dbo-bar-pct-inner { color: rgba(28,28,30,0.88) !important; text-shadow: none !important; }
[data-theme="light"] .dbo-bar-pct-outer { color: rgba(28,28,30,0.55) !important; }
[data-theme="light"] .dbo-footer {
  background: rgba(255,255,255,0.18) !important;
  border-top: 1px solid rgba(0,0,0,0.06) !important;
}
[data-theme="light"] .dbo-section-divider {
  background: rgba(167,139,250,0.08) !important;
  border-color: rgba(167,139,250,0.18) !important;
}
/* Bar colours slightly more saturated for visibility on light */
[data-theme="light"] .dbo-safe       { background: linear-gradient(90deg, rgba(52,211,153,0.85), rgba(52,211,153,0.65)); }
[data-theme="light"] .dbo-warn       { background: linear-gradient(90deg, rgba(245,158,11,0.85), rgba(232,97,60,0.75)); }
[data-theme="light"] .dbo-over       { background: linear-gradient(90deg, rgba(239,68,68,0.90), rgba(220,38,38,0.80)); }
[data-theme="light"] .dbo-done       { background: linear-gradient(90deg, rgba(59,130,246,0.80), rgba(96,165,250,0.65)); }
[data-theme="light"] .dbo-unbudgeted { background: linear-gradient(90deg, rgba(245,158,11,0.60), rgba(245,158,11,0.40)); }

/* ── Budget tablets (tbt) ────────────────────────────────────── */

[data-theme="light"] .tbt-header-panel {
  background: rgba(255,255,255,0.38) !important;
  backdrop-filter: blur(14px) !important;
  border-color: rgba(255,255,255,0.50) !important;
}
[data-theme="light"] .tbt-header-title  { color: rgba(28,28,30,0.88) !important; }
[data-theme="light"] .tbt-header-summary { color: rgba(28,28,30,0.55) !important; }
[data-theme="light"] .tbt-footer {
  background: rgba(255,255,255,0.35) !important;
  backdrop-filter: blur(14px) !important;
  border-color: rgba(255,255,255,0.45) !important;
}

/* ── Monthly tracking ────────────────────────────────────────── */

[data-theme="light"] #monthly .card,
[data-theme="light"] #monthly .month-card,
[data-theme="light"] #monthly .stat-card {
  background: rgba(255,255,255,0.38) !important;
  backdrop-filter: blur(14px) !important;
  border-color: rgba(255,255,255,0.50) !important;
}
[data-theme="light"] #monthly .stat-value  { color: rgba(28,28,30,0.88) !important; }
[data-theme="light"] #monthly .stat-label  { color: rgba(28,28,30,0.50) !important; }
[data-theme="light"] #monthly .month-name  { color: rgba(28,28,30,0.88) !important; }
[data-theme="light"] #monthly .card-title  { color: rgba(28,28,30,0.88) !important; }
[data-theme="light"] #monthly h2           { color: rgba(28,28,30,0.88) !important; }
[data-theme="light"] #monthly h4           { color: rgba(28,28,30,0.50) !important; }
[data-theme="light"] #monthly .month-summary { color: rgba(28,28,30,0.55) !important; }
[data-theme="light"] #monthly table thead tr { background: rgba(255,255,255,0.25) !important; }
[data-theme="light"] #monthly table thead th { color: rgba(28,28,30,0.50) !important; border-color: rgba(0,0,0,0.07) !important; }
[data-theme="light"] #monthly table tbody td { color: rgba(28,28,30,0.88) !important; }
[data-theme="light"] #monthly table tbody tr:hover { background: rgba(255,255,255,0.28) !important; }
[data-theme="light"] #monthly::before { display: none !important; }
[data-theme="light"] #monthly select,
[data-theme="light"] #monthly .form-select {
  background: rgba(255,255,255,0.55) !important;
  border-color: rgba(0,0,0,0.10) !important;
  color: rgba(28,28,30,0.88) !important;
}

/* ── Analytics metric strip ──────────────────────────────────── */

[data-theme="light"] .an-metric-card {
  background: rgba(255,255,255,0.38) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;
  border: 1px solid rgba(255,255,255,0.50) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.07) !important;
}
[data-theme="light"] .an-metric-card:hover {
  background: rgba(255,255,255,0.52) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,0.10) !important;
}
[data-theme="light"] .an-metric-card::before { display: none !important; }
[data-theme="light"] .an-metric-label { color: rgba(28,28,30,0.45) !important; }
[data-theme="light"] .an-metric-sub   { color: rgba(28,28,30,0.40) !important; }
[data-theme="light"] .an-card-badge {
  background: rgba(255,255,255,0.40) !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: rgba(28,28,30,0.55) !important;
}
[data-theme="light"] .an-insight-row  { border-bottom-color: rgba(0,0,0,0.07) !important; color: rgba(28,28,30,0.75) !important; }
[data-theme="light"] .an-legend-row   { border-bottom-color: rgba(0,0,0,0.05) !important; }
[data-theme="light"] .an-legend-label { color: rgba(28,28,30,0.75) !important; }
[data-theme="light"] .an-legend-pct   { color: rgba(28,28,30,0.50) !important; }
[data-theme="light"] .an-legend-val   { color: rgba(28,28,30,0.88) !important; }
[data-theme="light"] .an-data-warning {
  background: rgba(251,191,36,0.12) !important;
  border-color: rgba(251,191,36,0.30) !important;
}

/* ── Budget row inputs (brow) ────────────────────────────────── */

[data-theme="light"] .brow {
  backdrop-filter: blur(14px) !important;
}
[data-theme="light"] .brow input,
[data-theme="light"] .brow select,
[data-theme="light"] .brow .form-input,
[data-theme="light"] .brow .cd-trigger {
  background: rgba(255,255,255,0.65) !important;
  border-color: rgba(0,0,0,0.10) !important;
  color: rgba(28,28,30,0.88) !important;
}
[data-theme="light"] .budget-input-field {
  background: rgba(255,255,255,0.65) !important;
  border-color: rgba(0,0,0,0.10) !important;
  color: rgba(28,28,30,0.88) !important;
}

/* ══════════════════════════════════════════════════════════════
   END LIGHT MODE — GLASS DESIGN SYSTEM
   ══════════════════════════════════════════════════════════════ */
[data-theme="light"] .card::before { display: none; }

[data-theme="light"] .stat-card {
  border: 1px solid rgba(0,0,0,0.06);
  border-left-width: 3px;
  box-shadow: var(--shadow-card);
}
[data-theme="light"] .stat-card:hover {
  box-shadow: 0 6px 24px rgba(0,0,0,0.10);
  border-color: rgba(0,0,0,0.08);
}
[data-theme="light"] .card {
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: var(--shadow-card);
}
[data-theme="light"] .card:hover {
  border-color: rgba(0,0,0,0.10);
  box-shadow: 0 8px 24px rgba(0,0,0,0.09);
  transform: translateY(-2px);
}
[data-theme="light"] .nav-column {
  background:
    linear-gradient(180deg,
      rgba(245, 247, 252, 0.97) 0%,
      rgba(240, 244, 252, 0.95) 100%);
  border-right: 1px solid rgba(0,0,0,0.07);
  box-shadow:
    12px 0 40px rgba(0,0,0,0.08),
    24px 0 80px rgba(0,0,0,0.04);
}
[data-theme="light"] .nav-column::before { opacity: 0.3; }
[data-theme="light"] .nav-column::after { opacity: 0; }
[data-theme="light"] .nav-item:hover {
  color: #111827;
  background: rgba(0,0,0,0.04);
  text-shadow: none;
}
[data-theme="light"] .nav-item:hover svg { filter: none; }
[data-theme="light"] .nav-item.active::before { box-shadow: none; }
[data-theme="light"] .nav-section-label { color: rgba(0,0,0,0.35); }
[data-theme="light"] .main::before { display: none; }
[data-theme="light"] .month-card {
  border: 1px solid rgba(0,0,0,0.07);
  box-shadow: var(--shadow-card);
}
[data-theme="light"] .month-card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,0.10);
  border-color: rgba(0,0,0,0.10);
}
[data-theme="light"] .loading-overlay { background: rgba(246,247,251,0.97); }
[data-theme="light"] .loading-spinner { border-color: rgba(0,0,0,0.08); border-top-color: var(--accent-green); box-shadow: none; }
[data-theme="light"] .cloud-status-dot { box-shadow: 0 0 6px var(--accent-green); }
[data-theme="light"] .alert-banner {
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: var(--shadow-elevated);
}
[data-theme="light"] .cd-trigger {
  background: var(--bg-input);
  border: 1px solid rgba(0,0,0,0.10);
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  color: var(--text-primary);
}
[data-theme="light"] .cd-trigger:hover { border-color: rgba(0,0,0,0.16); }
[data-theme="light"] .cd-list {
  background: rgba(250,248,245,0.95);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(0,0,0,0.10);
  box-shadow: 0 12px 40px rgba(0,0,0,0.12);
}
[data-theme="light"] .cd-item:hover { background: #F3F5FA; color: var(--text-primary); }
[data-theme="light"] .dp-trigger {
  background: var(--bg-input);
  border: 1px solid rgba(0,0,0,0.10);
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  color: var(--text-primary);
}
[data-theme="light"] .dp-panel {
  background: rgba(250,248,245,0.96);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(0,0,0,0.10);
  box-shadow: 0 12px 40px rgba(0,0,0,0.12);
}
[data-theme="light"] .dp-header button:hover { background: rgba(0,0,0,0.05); }
[data-theme="light"] .dp-month-label:hover { background: rgba(0,0,0,0.05); }
[data-theme="light"] .dp-day:hover { background: rgba(0,0,0,0.05); }
[data-theme="light"] .dp-day.selected { box-shadow: none; }
[data-theme="light"] tbody tr:hover { background: rgba(0,0,0,0.02); }
[data-theme="light"] ::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.12); }
[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.18); }
[data-theme="light"] .logo h1 {
  background: linear-gradient(135deg, #111827 0%, var(--accent-green) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
[data-theme="light"] input:focus,
[data-theme="light"] select:focus,
[data-theme="light"] textarea:focus {
  box-shadow: 0 0 0 3px var(--accent-green-dim) !important;
}

