/* =============================================
   TEMA LIGHT (B) — Modern Light
   ============================================= */
[data-theme="light"] {
  --bg:           #f8fafc;
  --bg-card:      #ffffff;
  --bg-subtle:    #f1f5f9;
  --border:       #e2e8f0;
  --text:         #0f172a;
  --text-2:       #64748b;
  --text-3:       #94a3b8;
  --accent:       #6366f1;
  --accent-2:     #4f46e5;
  --accent-glow:  rgba(99,102,241,0.15);
  --accent-soft:  rgba(99,102,241,0.08);
  --success:      #10b981;
  --warning:      #f59e0b;
  --danger:       #ef4444;
  --shadow:       0 4px 24px rgba(15,23,42,0.08);
  --shadow-lg:    0 20px 60px rgba(15,23,42,0.12);
  --toggle-bg:    #e2e8f0;
  --toggle-knob:  #ffffff;
  --nav-bg:       rgba(248,250,252,0.85);
  --font-display: 'Syne', sans-serif;
  --font-body:    'DM Sans', sans-serif;
  --radius:       12px;
  --radius-sm:    8px;
}

/* =============================================
   TEMA DARK (A) — Industrial Dark
   ============================================= */
[data-theme="dark"] {
  --bg:           #0d1117;
  --bg-card:      #161b22;
  --bg-subtle:    #1c2333;
  --border:       #30363d;
  --text:         #e6edf3;
  --text-2:       #8b949e;
  --text-3:       #484f58;
  --accent:       #58a6ff;
  --accent-2:     #79c0ff;
  --accent-glow:  rgba(88,166,255,0.15);
  --accent-soft:  rgba(88,166,255,0.08);
  --success:      #3fb950;
  --warning:      #d29922;
  --danger:       #f85149;
  --shadow:       0 4px 24px rgba(0,0,0,0.4);
  --shadow-lg:    0 20px 60px rgba(0,0,0,0.5);
  --toggle-bg:    #30363d;
  --toggle-knob:  #58a6ff;
  --nav-bg:       rgba(13,17,23,0.85);
  --font-display: 'Bebas Neue', cursive;
  --font-body:    'DM Sans', sans-serif;
  --radius:       6px;
  --radius-sm:    4px;
}