/* Light theme — applied when html[data-theme="light"]. */
/* Overrides dark :root variables defined per-page via higher specificity selector. */

html[data-theme="light"] {
  --bg:           #EEF2F7;
  --surface:      #FFFFFF;
  --surface-alt:  #F4F7FA;
  --border:       #E2E8F0;
  --border-strong:#CBD5E1;
  --text:         #0F172A;
  --text-2:       #334155;
  --muted:        #64748B;
  --accent:       #0891B2;
  --accent-hover: #0E7490;
  --accent-light: rgba(8,145,178,0.10);
  --red:          #DC2626;
  --red-light:    rgba(220,38,38,0.08);
  --green:        #059669;
}

/* Nav background is hardcoded #000 per page — override here */
html[data-theme="light"] nav {
  background: #FFFFFF;
  border-bottom-color: #E2E8F0;
}
html[data-theme="light"] nav a        { color: #64748B; }
html[data-theme="light"] nav a:hover  { color: #334155; }
html[data-theme="light"] nav a.active { color: #0F172A; }
html[data-theme="light"] .nav-hamburger { color: #64748B; }
html[data-theme="light"] .nav-hamburger:hover { color: #334155; }
html[data-theme="light"] .btn-logout  { border-color: #E2E8F0; color: #64748B; }
html[data-theme="light"] .btn-logout:hover { color: #0F172A; border-color: #CBD5E1; }
html[data-theme="light"] .nav-office  { color: #64748B; }
html[data-theme="light"] .nav-divider { background: #E2E8F0; }

/* Mobile nav dropdown — background hardcoded in mobile.css */
@media (max-width: 768px) {
  html[data-theme="light"] .nav-links {
    background: #FFFFFF;
  }
}

/* Modal overlay — hardcoded rgba per page */
html[data-theme="light"] .modal-backdrop { background: rgba(15,23,42,0.35); }

/* Cards get a subtle shadow in light mode */
html[data-theme="light"] .card {
  box-shadow: 0 1px 3px rgba(0,0,0,0.07), 0 1px 2px rgba(0,0,0,0.05);
}