/* =========================
   WORKOUT THEME SYSTEM
   Dark and Light Mode Support
   ========================= */

/* ===== DEFAULT THEME VARIABLES ===== */
:root {
  --yellow: #FFD400;
  --bg: #000;
  --surface: rgba(255,255,255,.03);
  --surface-strong: rgba(255,255,255,.05);
  --text: #fff;
  --text-muted: rgba(255,255,255,.70);
  --accent: var(--yellow);
  --accent-soft: rgba(255,212,0,.10);
  --accent-border: rgba(255,212,0,.35);
}

/* ===== DARK THEME ===== */
body.theme-dark {
  --yellow: #FFD400;
  --bg: #000;
  --surface: rgba(255,255,255,.03);
  --surface-strong: rgba(255,255,255,.05);
  --text: #fff;
  --text-muted: rgba(255,255,255,.70);
  --accent: var(--yellow);
  --accent-soft: rgba(255,212,0,.10);
  --accent-border: rgba(255,212,0,.35);
}

/* ===== LIGHT THEME ===== */
body.theme-light {
  --yellow: #32d74b;
  --bg: #fff;
  --surface: rgba(255,255,255,.95);
  --surface-strong: rgba(255,255,255,.98);
  --text: #111;
  --text-muted: rgba(34,34,34,.65);
  --accent: var(--yellow);
  --accent-soft: rgba(50,215,75,.12);
  --accent-border: rgba(50,215,75,.25);
}

/* ===== LIGHT THEME OVERRIDES ===== */
body.theme-light {
  background: var(--bg) !important;
  color: var(--text) !important;
}

body.theme-light header,
body.theme-light footer,
body.theme-light .page-header,
body.theme-light .page-header-box,
body.theme-light .page-shell,
body.theme-light .page-main,
body.theme-light .appMain,
body.theme-light .container,
body.theme-light .card,
body.theme-light .cardTop,
body.theme-light .cardBody,
body.theme-light .drawerBody,
body.theme-light .modalBody,
body.theme-light .modalCardBody,
body.theme-light .login-inner,
body.theme-light .login-shell,
body.theme-light .hero,
body.theme-light .heroToday,
body.theme-light .heroTitle,
body.theme-light .heroSub {
  background: rgba(255,255,255,.95) !important;
  color: #111 !important;
  border-color: rgba(0,0,0,.08) !important;
}

body.theme-light .bg-dark {
  background: #fff !important;
}

body.theme-light .text-white {
  color: #111 !important;
}

body.theme-light .text-primary {
  color: var(--accent) !important;
}

body.theme-light footer {
  background: #fff !important;
  color: #111 !important;
  border-top-color: rgba(0,0,0,.08) !important;
}