/* ═══════════════════════════════════════════════════════════════════════════════
   LeagueForce - Light/Dark Mode Theme Toggle
   Default: Dark mode. Toggled via body.light-mode class.
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ─── Theme Toggle Button (Navbar) ──────────────────────────────────────── */
.theme-toggle-btn {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  background-color: transparent;
  border: none;
  outline: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  transition: background 0.3s ease;
  position: relative;
  padding: 0;
  flex-shrink: 0;
  pointer-events: auto;
  z-index: 10;
}

/* ─── SVG Icon Wrapper ──────────────────────────────────────────────────── */
.theme-icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.theme-icon {
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease;
}

/* Dark mode (default) — moon icon, dim white */
.theme-toggle-btn .theme-icon-wrap {
  color: rgba(255, 255, 255, 0.4);
}

.theme-toggle-btn:hover .theme-icon-wrap {
  color: rgba(255, 255, 255, 0.8);
}

.theme-toggle-btn:hover .theme-icon {
  transform: scale(1.15);
}

.theme-toggle-btn:hover {
  background: rgba(255, 255, 255, 0.06);
}

/* Light mode — sun icon, warm golden glow */
body.light-mode .theme-toggle-btn .theme-icon-wrap {
  color: #f5b800 !important;
  filter: drop-shadow(0 0 6px rgba(245, 184, 0, 0.5));
}

body.light-mode .theme-toggle-btn:hover .theme-icon-wrap {
  color: #f0a800 !important;
  filter: drop-shadow(0 0 10px rgba(245, 184, 0, 0.7));
}

body.light-mode .theme-toggle-btn:hover .theme-icon {
  transform: scale(1.15) rotate(20deg);
}

body.light-mode .theme-toggle-btn:hover {
  background: rgba(245, 184, 0, 0.1);
}

/* Spin animation on toggle */
body.theme-transitioning .theme-icon {
  animation: themeIconSpin 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes themeIconSpin {
  0%   { transform: rotate(0deg) scale(1); }
  40%  { transform: rotate(180deg) scale(0.7); }
  100% { transform: rotate(360deg) scale(1); }
}

/* ─── Floating Toggle (for pages without navbar) ────────────────────────── */
.theme-toggle-float {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 9999;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(20, 20, 20, 0.85);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
  padding: 0;
}

.theme-toggle-float .theme-icon-wrap {
  color: rgba(255, 255, 255, 0.45);
}

.theme-toggle-float:hover {
  transform: scale(1.1);
  box-shadow: 0 6px 28px rgba(0, 0, 0, 0.5);
}

.theme-toggle-float:hover .theme-icon-wrap {
  color: rgba(255, 255, 255, 0.8);
}

body.light-mode .theme-toggle-float {
  background: rgba(255, 255, 255, 0.92);
  border-color: rgba(0, 0, 0, 0.08);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
}

body.light-mode .theme-toggle-float .theme-icon-wrap {
  color: #f5b800 !important;
  filter: drop-shadow(0 0 6px rgba(245, 184, 0, 0.5));
}

body.light-mode .theme-toggle-float:hover {
  box-shadow: 0 6px 28px rgba(0, 0, 0, 0.18);
}

/* ─── Admin Sidebar Toggle ──────────────────────────────────────────────── */
.admin-theme-toggle {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.45rem 1rem;
  background: none;
  border: none;
  cursor: pointer;
  width: 100%;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.8rem;
  font-family: 'Inter', sans-serif;
  transition: all 150ms;
  text-align: left;
}

.admin-theme-toggle:hover {
  color: rgba(255, 255, 255, 0.8);
  background: rgba(255, 255, 255, 0.02);
}

.admin-theme-toggle .theme-icon-wrap {
  color: rgba(255, 255, 255, 0.4);
  display: inline-flex;
}

.admin-theme-toggle .theme-icon {
  width: 16px;
  height: 16px;
}

body.light-mode .admin-theme-toggle {
  color: rgba(0, 0, 0, 0.6);
}

body.light-mode .admin-theme-toggle:hover {
  color: rgba(0, 0, 0, 0.8);
  background: rgba(0, 0, 0, 0.04);
}

body.light-mode .admin-theme-toggle .theme-icon-wrap {
  color: #f5b800 !important;
  filter: drop-shadow(0 0 5px rgba(245, 184, 0, 0.4));
}

/* ═══════════════════════════════════════════════════════════════════════════════
   LIGHT MODE OVERRIDES
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ─── CSS Variables Override ────────────────────────────────────────────── */
:root.light-mode,
:root.light-mode body {
  color-scheme: light !important;
}

body.light-mode {
  color-scheme: light;

  /* Platform variables */
  --glass-bg: rgba(255, 255, 255, 0.75);
  --glass-border: rgba(0, 0, 0, 0.08);
  --glass-shine: rgba(0, 0, 0, 0.02);
  --glow-gold: 0 0 40px rgba(220, 38, 38, 0.08), 0 0 80px rgba(220, 38, 38, 0.03);
  --glow-gold-strong: 0 0 30px rgba(220, 38, 38, 0.12), 0 0 60px rgba(220, 38, 38, 0.06);
  --gradient-dark: linear-gradient(180deg, #f0f2f7 0%, #e8eaf1 50%, #f0f2f7 100%);
  --gradient-card: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(248, 249, 252, 0.85) 100%);
  --gradient-hero: linear-gradient(135deg, #f0f2f7 0%, #e4e7ef 40%, #f0f2f7 100%);

  /* Global styles.css color variables — flip dark ↔ light */
  --white: #18181B;
  --gray-900: #18181B;
  --gray-800: #2a3040;
  --gray-700: #3d4555;
  --gray-600: #555e6e;
  --gray-500: #5a6478;
  --gray-400: #6a7588;
  --gray-300: #8895a5;
  --gray-200: #a5afbc;
  --gray-100: #e8eaf1;
  --gray-50: #f0f2f7;
  --black: #f0f2f7;
  --black-light: #e8eaf1;
  --black-lighter: #dfe2ec;
  --black-card: #ffffff;
  --border: #d0d5de;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow: 0 2px 6px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08), 0 2px 4px rgba(0, 0, 0, 0.04);
  --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.1), 0 4px 10px rgba(0, 0, 0, 0.06);
  --shadow-xl: 0 20px 40px rgba(0, 0, 0, 0.12), 0 10px 15px rgba(0, 0, 0, 0.07);
  --shadow-gold: 0 4px 20px rgba(220, 38, 38, 0.12);

  /* Text color variables */
  --text-primary: #18181B;
  --text-secondary: rgba(0, 0, 0, 0.55);
}

/* ─── Body & Background ─────────────────────────────────────────────────── */
body.light-mode {
  background: var(--gradient-dark);
  color: #2a2a3e;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   NUCLEAR TEXT CONTRAST FIX
   Forces ALL elements to inherit dark text from body.light-mode.
   Uses !important to beat 120+ specific white-text selectors in platform.css.
   Specific overrides below re-declare colors for elements that need them.
   ═══════════════════════════════════════════════════════════════════════════════ */
body.light-mode * {
  color: inherit !important;
}

/* ─── Text Hierarchy ────────────────────────────────────────────────────── */
body.light-mode h1,
body.light-mode h2,
body.light-mode h3,
body.light-mode h4,
body.light-mode h5,
body.light-mode h6 {
  color: #18181B !important;
  -webkit-text-fill-color: #18181B !important;
}

/* Remove gradient text effects — invisible in light mode */
body.light-mode .page-content > .container > h2:first-child,
body.light-mode .page-content > .container > .flex > h2,
body.light-mode .page-content > .container > .catalog-header h2,
body.light-mode .hero-title,
body.light-mode .hero-league-name,
body.light-mode .platform-hero-title,
body.light-mode .hero-highlight,
body.light-mode .hero-season-label {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #18181B !important;
  color: #18181B !important;
}

/* Paragraphs / descriptions — slightly muted */
body.light-mode p,
body.light-mode .hero-sub,
body.light-mode .hero-desc {
  color: rgba(0, 0, 0, 0.6) !important;
}

/* Muted / secondary text */
body.light-mode .text-muted,
body.light-mode .text-secondary,
body.light-mode small,
body.light-mode .hint,
body.light-mode .form-hint,
body.light-mode .help-text,
body.light-mode .footer-bottom p,
body.light-mode .hp-powered-by {
  color: rgba(0, 0, 0, 0.4) !important;
}

/* ─── Elements That KEEP White Text ─────────────────────────────────────── */
body.light-mode .btn-primary,
body.light-mode .trial-banner,
body.light-mode .trial-banner a,
body.light-mode .trial-banner span,
body.light-mode .navbar-nav a.active,
body.light-mode .nav-dropdown-toggle.has-active,
body.light-mode select option:checked,
body.light-mode .bubble-out,
body.light-mode .bubble-out span,
body.light-mode .bubble-out small {
  color: #fff !important;
}

/* ─── Accent Color Elements ─────────────────────────────────────────────── */
body.light-mode a:not(.btn):not(.navbar-nav a):not(.nav-dropdown-menu a):not(.sidebar-nav a):not(.navbar-brand):not(.btn-primary):not(.btn-outline):not([class*="nav-"]):not(.sidebar-footer-link):not(.footer-col a) {
  color: #DC2626 !important;
}

body.light-mode .text-accent,
body.light-mode .sidebar-nav a.active {
  color: #DC2626 !important;
}

/* ─── Toggle Button Icons — keep golden ─────────────────────────────────── */
body.light-mode .theme-toggle-btn .theme-icon-wrap {
  color: #f5b800 !important;
}

body.light-mode .theme-toggle-float .theme-icon-wrap {
  color: #f5b800 !important;
}

body.light-mode .admin-theme-toggle .theme-icon-wrap {
  color: #f5b800 !important;
}

/* ─── Material Icons — subtle in content areas ──────────────────────────── */
body.light-mode .material-symbols-outlined {
  color: rgba(0, 0, 0, 0.45) !important;
}

/* Nav icons get parent color */
body.light-mode .navbar-nav .material-symbols-outlined,
body.light-mode .sidebar-nav .material-symbols-outlined {
  color: inherit !important;
}

/* Noise texture — lighter */
body.light-mode .page-wrapper::before {
  opacity: 0.15;
}

/* ─── Navbar ────────────────────────────────────────────────────────────── */
body.light-mode .navbar {
  background: rgba(255, 255, 255, 0.92) !important;
  border-bottom-color: rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04), 0 4px 24px rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .navbar-brand {
  color: #18181B !important;
}

body.light-mode .navbar-nav a {
  color: rgba(0, 0, 0, 0.55) !important;
}

body.light-mode .navbar-nav a:hover {
  color: rgba(0, 0, 0, 0.9) !important;
  background: rgba(0, 0, 0, 0.05) !important;
}

body.light-mode .navbar-nav a.active {
  color: #fff !important;
  background: rgba(220, 38, 38, 0.9) !important;
}

body.light-mode .nav-dropdown-toggle {
  color: rgba(0, 0, 0, 0.55) !important;
}

body.light-mode .nav-dropdown-toggle:hover,
body.light-mode .nav-dropdown.open .nav-dropdown-toggle {
  color: rgba(0, 0, 0, 0.9) !important;
  background: rgba(0, 0, 0, 0.05) !important;
}

body.light-mode .nav-dropdown-toggle.has-active {
  color: #fff !important;
  background: rgba(220, 38, 38, 0.55) !important;
}

body.light-mode .nav-dropdown-menu {
  background: rgba(255, 255, 255, 0.97) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.12) !important;
}

body.light-mode .nav-dropdown-menu a {
  color: rgba(0, 0, 0, 0.65) !important;
}

body.light-mode .nav-dropdown-menu a:hover {
  color: rgba(0, 0, 0, 0.95) !important;
  background: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .navbar-actions::before {
  background: rgba(0, 0, 0, 0.1) !important;
}

body.light-mode .nav-user-name {
  color: rgba(0, 0, 0, 0.6) !important;
}

body.light-mode .navbar-toggle {
  color: #18181B !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
}

body.light-mode .navbar-toggle:hover,
body.light-mode .navbar-toggle.open {
  background: rgba(0, 0, 0, 0.05) !important;
  border-color: rgba(0, 0, 0, 0.2) !important;
  color: #18181B !important;
}

/* Desktop: navbar-nav should be transparent to match navbar bg */
body.light-mode .navbar-nav {
  background: transparent !important;
  box-shadow: none !important;
}

/* Mobile hamburger dropdown panel */
@media (max-width: 960px) {
  body.light-mode .navbar-nav {
    background: rgba(255, 255, 255, 0.98) !important;
    border-top-color: rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 16px 30px rgba(0, 0, 0, 0.1) !important;
  }
}

body.light-mode .navbar-nav-mobile {
  background: transparent !important;
  border-top-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-mode .navbar-nav-mobile a {
  color: rgba(0, 0, 0, 0.7) !important;
}

body.light-mode .navbar-nav-mobile a:hover,
body.light-mode .navbar-nav-mobile a:active {
  color: rgba(0, 0, 0, 0.9) !important;
  background: rgba(0, 0, 0, 0.05) !important;
}

/* ─── Buttons ───────────────────────────────────────────────────────────── */
body.light-mode .btn-primary {
  color: #fff !important;
}

body.light-mode .btn-outline {
  border-color: rgba(220, 38, 38, 0.35) !important;
  color: #DC2626 !important;
  background: rgba(220, 38, 38, 0.04) !important;
}

body.light-mode .btn-outline:hover:not(:disabled) {
  color: #fff !important;
}

body.light-mode .btn-ghost {
  color: rgba(0, 0, 0, 0.55) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
}

body.light-mode .btn-ghost:hover:not(:disabled) {
  background: rgba(0, 0, 0, 0.05) !important;
  color: rgba(0, 0, 0, 0.85) !important;
}

body.light-mode [data-action="logout"] {
  color: rgba(0, 0, 0, 0.55) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
}

body.light-mode [data-action="logout"]:hover {
  color: rgba(0, 0, 0, 0.85) !important;
}

/* ─── Cards ─────────────────────────────────────────────────────────────── */
body.light-mode .card {
  background: var(--gradient-card) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

body.light-mode .card:hover {
  border-color: rgba(220, 38, 38, 0.12) !important;
  box-shadow: 0 6px 28px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

body.light-mode .card-header {
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

/* ─── Footer ────────────────────────────────────────────────────────────── */
body.light-mode .footer {
  background: rgba(255, 255, 255, 0.95) !important;
  border-top-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .footer::before {
  background: linear-gradient(90deg, transparent, rgba(220, 38, 38, 0.1), transparent) !important;
}

body.light-mode .footer-col a {
  color: #18181B !important;
}

body.light-mode .footer-col a:hover {
  color: #000000 !important;
}

body.light-mode .footer-col h5 {
  color: #18181B !important;
  -webkit-text-fill-color: #18181B !important;
}

body.light-mode .footer-bottom {
  border-top-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .footer-contact-info {
  color: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .footer-contact-info a {
  color: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .footer-contact-info a:hover {
  color: rgba(0, 0, 0, 0.8) !important;
}

body.light-mode .hp-powered-by {
  border-color: rgba(0, 0, 0, 0.06) !important;
  background: rgba(0, 0, 0, 0.02) !important;
}

/* ─── Modals ────────────────────────────────────────────────────────────── */
body.light-mode .modal {
  background: rgba(255, 255, 255, 0.97) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .modal-header {
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .modal-footer {
  border-top-color: rgba(0, 0, 0, 0.06) !important;
}

/* ─── Hero Section ──────────────────────────────────────────────────────── */
body.light-mode .platform-hero {
  background: var(--gradient-hero) !important;
}

/* Lighten the custom-bg overlay so dark text is readable */
body.light-mode .platform-hero-bg.has-custom-bg::after {
  background: rgba(255, 255, 255, 0.72) !important;
  backdrop-filter: blur(2px) !important;
}

/* Bottom edge fade: match light background */
body.light-mode .hero-bottom-edge {
  background: linear-gradient(to top, rgba(240, 242, 247, 1) 0%, transparent 100%) !important;
}

/* Season badge */
body.light-mode .platform-hero-season {
  background: rgba(220, 38, 38, 0.08) !important;
  border-color: rgba(220, 38, 38, 0.18) !important;
}

/* Kicker (small text above title) */
body.light-mode .platform-hero-kicker {
  color: rgba(0, 0, 0, 0.55) !important;
  -webkit-text-fill-color: rgba(0, 0, 0, 0.55) !important;
}

/* Subtitle */
body.light-mode .platform-hero-subtitle {
  color: rgba(0, 0, 0, 0.55) !important;
  -webkit-text-fill-color: rgba(0, 0, 0, 0.55) !important;
}

/* Stats bar */
body.light-mode .hero-stats-bar {
  background: rgba(0, 0, 0, 0.05) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-mode .hero-stat-value {
  color: rgba(0, 0, 0, 0.6) !important;
  -webkit-text-fill-color: rgba(0, 0, 0, 0.6) !important;
}

body.light-mode .hero-stat-divider {
  background: rgba(0, 0, 0, 0.1) !important;
}

body.light-mode .hero-stat-pill:hover {
  background: rgba(0, 0, 0, 0.05) !important;
}

/* Hero buttons */
body.light-mode .platform-hero-btn {
  background: #DC2626 !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

body.light-mode .platform-hero-btn-alt {
  border-color: rgba(0, 0, 0, 0.15) !important;
  background: rgba(255, 255, 255, 0.6) !important;
  color: #18181B !important;
  -webkit-text-fill-color: #18181B !important;
}

/* Horizon glow - soften in light mode */
body.light-mode .hero-horizon-glow {
  opacity: 0.4 !important;
}

/* Decorative orbs/rings - reduce visibility in light mode */
body.light-mode .hero-orb,
body.light-mode .hero-ring,
body.light-mode .hero-sparkle {
  opacity: 0.3 !important;
}

/* ─── Notifications ─────────────────────────────────────────────────────── */
body.light-mode .notif-dropdown {
  background: rgba(255, 255, 255, 0.98) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.12) !important;
}

body.light-mode .notif-dropdown-header {
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .notif-item {
  border-bottom-color: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .notif-item:hover {
  background: rgba(0, 0, 0, 0.03) !important;
}

/* ─── Notification Page Light Mode ──────────────────────────────────── */
body.light-mode .notif-stat-number {
  color: #18181B !important;
}
body.light-mode .notif-stat-unread .notif-stat-number {
  color: transparent !important;
}
body.light-mode .notif-stat-label {
  color: rgba(0, 0, 0, 0.45) !important;
}
body.light-mode .notif-filter-btn {
  color: rgba(0, 0, 0, 0.45) !important;
}
body.light-mode .notif-filter-btn:hover {
  color: rgba(0, 0, 0, 0.7) !important;
  background: rgba(0, 0, 0, 0.04) !important;
}
body.light-mode .notif-filter-btn.active {
  color: #0A0A0A !important;
}
body.light-mode .notif-type-chip {
  color: rgba(0, 0, 0, 0.45) !important;
  background: rgba(0, 0, 0, 0.03) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}
body.light-mode .notif-type-chip:hover {
  color: rgba(0, 0, 0, 0.7) !important;
  background: rgba(0, 0, 0, 0.06) !important;
}
body.light-mode .notif-type-chip.active {
  color: #18181B !important;
  background: rgba(220, 38, 38, 0.08) !important;
  border-color: rgba(220, 38, 38, 0.2) !important;
}
body.light-mode .notif-page-group-label {
  color: rgba(0, 0, 0, 0.4) !important;
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}
body.light-mode .notif-page-item-title {
  color: #18181B !important;
}
body.light-mode .notif-page-item-message {
  color: rgba(0, 0, 0, 0.5) !important;
}
body.light-mode .notif-page-item-time {
  color: rgba(0, 0, 0, 0.3) !important;
}
body.light-mode .notif-page-item:hover {
  background: rgba(0, 0, 0, 0.02) !important;
}
body.light-mode .notif-page-item-unread {
  background: rgba(220, 38, 38, 0.03) !important;
}
body.light-mode .notif-page-item-unread:hover {
  background: rgba(220, 38, 38, 0.05) !important;
}
body.light-mode .notif-page-count {
  color: rgba(0, 0, 0, 0.4) !important;
}
body.light-mode .notif-action-btn {
  background: rgba(0, 0, 0, 0.03) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}
body.light-mode .notif-action-btn:hover {
  background: rgba(0, 0, 0, 0.06) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
}
body.light-mode .notif-action-delete:hover {
  background: rgba(239, 68, 68, 0.08) !important;
  border-color: rgba(239, 68, 68, 0.2) !important;
}
body.light-mode .notif-read-check {
  color: rgba(0, 0, 0, 0.2) !important;
}
body.light-mode .notif-page-item-link {
  color: rgba(220, 38, 38, 0.5) !important;
}

/* ─── Wallet ────────────────────────────────────────────────────────────── */
body.light-mode .wallet {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(248, 249, 252, 0.85) 100%) !important;
  border-color: rgba(220, 38, 38, 0.1) !important;
  box-shadow: var(--glow-gold), 0 4px 20px rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .wallet::before {
  background: linear-gradient(90deg, transparent, rgba(220, 38, 38, 0.2), transparent) !important;
}

/* ─── Forms & Inputs ────────────────────────────────────────────────────── */
body.light-mode input,
body.light-mode textarea,
body.light-mode select {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
  color: #18181B !important;
  color-scheme: light !important;
}

body.light-mode input::placeholder,
body.light-mode textarea::placeholder {
  color: rgba(0, 0, 0, 0.35) !important;
}

body.light-mode input:focus,
body.light-mode textarea:focus,
body.light-mode select:focus {
  border-color: rgba(220, 38, 38, 0.4) !important;
  outline-color: rgba(220, 38, 38, 0.3) !important;
}

body.light-mode input[type="date"],
body.light-mode input[type="datetime-local"] {
  color-scheme: light !important;
}

body.light-mode input[type="date"]::-webkit-calendar-picker-indicator,
body.light-mode input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  filter: none !important;
}

/* ─── Tables ────────────────────────────────────────────────────────────── */
body.light-mode table thead th {
  color: rgba(0, 0, 0, 0.5) !important;
  border-bottom-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-mode table tbody tr {
  border-bottom-color: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode table tbody tr:hover {
  background: rgba(0, 0, 0, 0.02) !important;
}

body.light-mode table tbody td {
  color: rgba(0, 0, 0, 0.7) !important;
}

body.light-mode table tbody td strong {
  color: #18181B !important;
}

/* ─── Season & Game Cards ───────────────────────────────────────────────── */
body.light-mode .season-card,
body.light-mode .game-card,
body.light-mode .roster-card,
body.light-mode .coach-card,
body.light-mode .player-card,
body.light-mode .standing-card {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .season-card:hover,
body.light-mode .game-card:hover {
  border-color: rgba(220, 38, 38, 0.12) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
}

/* ─── Tabs ──────────────────────────────────────────────────────────────── */
body.light-mode .coach-tabs,
body.light-mode .tabs,
body.light-mode .tab-nav {
  border-bottom-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-mode .coach-tab,
body.light-mode .tab,
body.light-mode .tab-btn {
  color: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .coach-tab.active,
body.light-mode .tab.active,
body.light-mode .tab-btn.active {
  color: #DC2626 !important;
  border-bottom-color: #DC2626 !important;
}

body.light-mode .coach-tab:hover,
body.light-mode .tab:hover,
body.light-mode .tab-btn:hover {
  color: rgba(0, 0, 0, 0.8) !important;
}

/* ─── Scrollbar ─────────────────────────────────────────────────────────── */
body.light-mode ::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.03) !important;
}

body.light-mode ::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.15) !important;
}

body.light-mode ::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.25) !important;
}

/* ─── Error Page ────────────────────────────────────────────────────────── */
body.light-mode .error-page {
  background: var(--gradient-dark) !important;
}

/* ─── Auth Pages (Login/Signup/Forgot/Reset) ────────────────────────────── */
body.light-mode .login-hero,
body.light-mode .signup-hero,
body.light-mode .auth-hero {
  background: var(--gradient-dark) !important;
}

body.light-mode .login-hero::before,
body.light-mode .signup-hero::before,
body.light-mode .auth-hero::before {
  background: radial-gradient(ellipse at 30% 20%, rgba(220, 38, 38,0.06) 0%, transparent 60%),
              radial-gradient(ellipse at 70% 80%, rgba(220, 38, 38,0.04) 0%, transparent 50%) !important;
}

/* Card container */
body.light-mode .login-card,
body.light-mode .signup-card,
body.light-mode .auth-card {
  background: rgba(255, 255, 255, 0.95) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08) !important;
}

body.light-mode .login-card::before,
body.light-mode .signup-card::before,
body.light-mode .auth-card::before {
  background: linear-gradient(90deg, transparent, rgba(220, 38, 38,0.1), transparent) !important;
}

/* Brand / heading area */
body.light-mode .login-brand h1,
body.light-mode .signup-brand h1 {
  color: #18181B !important;
}

body.light-mode .login-brand h1 span,
body.light-mode .signup-brand h1 span {
  color: var(--gold) !important;
}

body.light-mode .login-brand p,
body.light-mode .signup-brand p {
  color: rgba(0, 0, 0, 0.45) !important;
}

/* Labels */
body.light-mode .login-card .form-label,
body.light-mode .signup-card .form-label,
body.light-mode .auth-card .form-label {
  color: rgba(0, 0, 0, 0.65) !important;
}

/* Inputs */
body.light-mode .login-card .form-control,
body.light-mode .signup-card .form-control,
body.light-mode .auth-card .form-control {
  background: rgba(0, 0, 0, 0.03) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
  color: #18181B !important;
}

body.light-mode .login-card .form-control::placeholder,
body.light-mode .signup-card .form-control::placeholder,
body.light-mode .auth-card .form-control::placeholder {
  color: rgba(0, 0, 0, 0.3) !important;
}

body.light-mode .login-card .form-control:focus,
body.light-mode .signup-card .form-control:focus,
body.light-mode .auth-card .form-control:focus {
  border-color: var(--gold) !important;
  box-shadow: 0 0 0 3px rgba(220, 38, 38,0.1) !important;
}

/* Submit button — keep white text */
body.light-mode .login-btn,
body.light-mode .signup-btn,
body.light-mode .auth-btn {
  color: #fff !important;
}

/* Divider */
body.light-mode .login-divider,
body.light-mode .signup-divider {
  color: rgba(0, 0, 0, 0.3) !important;
}

body.light-mode .login-divider::before,
body.light-mode .login-divider::after,
body.light-mode .signup-divider::before,
body.light-mode .signup-divider::after {
  background: rgba(0, 0, 0, 0.1) !important;
}

/* Google button */
body.light-mode .google-btn {
  background: rgba(0, 0, 0, 0.03) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
  color: #18181B !important;
}

body.light-mode .google-btn:hover {
  background: rgba(0, 0, 0, 0.06) !important;
  border-color: rgba(0, 0, 0, 0.2) !important;
}

/* Footer links (Forgot password / Create account) */
body.light-mode .login-footer-links,
body.light-mode .signup-footer-links {
  color: rgba(0, 0, 0, 0.4) !important;
}

body.light-mode .login-footer-links a,
body.light-mode .signup-footer-links a {
  color: var(--gold) !important;
}

/* Back link */
body.light-mode .login-back,
body.light-mode .signup-back {
  color: rgba(0, 0, 0, 0.4) !important;
}

body.light-mode .login-back:hover,
body.light-mode .signup-back:hover {
  color: var(--gold) !important;
}

/* Powered by */
body.light-mode .login-powered,
body.light-mode .signup-powered {
  color: rgba(0, 0, 0, 0.25) !important;
}

body.light-mode .login-powered a,
body.light-mode .signup-powered a {
  color: rgba(0, 0, 0, 0.35) !important;
}

body.light-mode .login-powered strong span,
body.light-mode .signup-powered strong span {
  color: var(--gold) !important;
}

/* Error message */
body.light-mode .login-error,
body.light-mode .signup-error {
  background: rgba(220,53,69,0.08) !important;
  border-color: rgba(220,53,69,0.2) !important;
  color: #dc3545 !important;
}

/* ─── Alerts / Toasts ───────────────────────────────────────────────────── */
body.light-mode .toast,
body.light-mode .alert {
  background: rgba(255, 255, 255, 0.95) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1) !important;
}

/* ─── Miscellaneous ─────────────────────────────────────────────────────── */
body.light-mode .section-divider,
body.light-mode hr {
  border-color: rgba(0, 0, 0, 0.06) !important;
}

/* Generic dark-bg inline styles */
body.light-mode [style*="background: rgba(23, 27, 39"],
body.light-mode [style*="background:rgba(23, 27, 39"],
body.light-mode [style*="background: rgba(23,27,39"],
body.light-mode [style*="background:rgba(23,27,39"] {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

/* ─── Messages & Chat ───────────────────────────────────────────────────── */
body.light-mode .msg-sidebar,
body.light-mode .chat-sidebar {
  background: rgba(255, 255, 255, 0.95) !important;
  border-right-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .msg-item,
body.light-mode .chat-item {
  border-bottom-color: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .msg-item:hover,
body.light-mode .chat-item:hover {
  background: rgba(0, 0, 0, 0.02) !important;
}

body.light-mode .msg-header,
body.light-mode .chat-header {
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .msg-input,
body.light-mode .chat-input {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  color: #18181B !important;
}

body.light-mode .bubble-out {
  background: rgba(220, 38, 38, 0.9) !important;
  color: #fff !important;
}

body.light-mode .bubble-in {
  background: rgba(0, 0, 0, 0.05) !important;
  color: #18181B !important;
}

/* ─── Score / Checkin Panels ────────────────────────────────────────────── */
body.light-mode .score-panel,
body.light-mode .checkin-panel {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

/* ─── Calendar ──────────────────────────────────────────────────────────── */
body.light-mode .calendar-cell {
  background: rgba(255, 255, 255, 0.8) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

/* ─── Profile / Dashboard / Activity Cards ──────────────────────────────── */
body.light-mode .profile-card,
body.light-mode .dashboard-card,
body.light-mode .activity-card {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

/* ─── Registration Cards ────────────────────────────────────────────────── */
body.light-mode .reg-card,
body.light-mode .registration-card {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

/* ─── Store ─────────────────────────────────────────────────────────────── */
body.light-mode .product-card {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .product-card:hover {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
}

/* ─── Home Registration List ────────────────────────────────────────────── */
body.light-mode .hp-reg-item {
  color: #2a2a3e !important;
  background: rgba(255, 255, 255, 0.5) !important;
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .hp-reg-item:hover {
  background: rgba(255, 255, 255, 0.8) !important;
}

body.light-mode .hp-reg-list {
  border-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-mode .hp-reg-item-name {
  color: #18181B !important;
}

body.light-mode .hp-reg-item-sub,
body.light-mode .hp-reg-item-sub .sep {
  color: rgba(0, 0, 0, 0.45) !important;
}

body.light-mode .hp-reg-item-dates-label,
body.light-mode .hp-reg-item-fee-label {
  color: rgba(0, 0, 0, 0.35) !important;
}

body.light-mode .hp-reg-item-dates-val {
  color: rgba(0, 0, 0, 0.7) !important;
}

body.light-mode .hp-reg-item-fee-amount {
  color: #18181B !important;
}

body.light-mode .hp-reg-item-btn-register {
  color: #fff !important;
}

body.light-mode .hp-reg-item-btn-view {
  background: rgba(0, 0, 0, 0.06) !important;
  color: rgba(0, 0, 0, 0.55) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

/* ─── Support Widget ────────────────────────────────────────────────────── */
body.light-mode .support-widget,
body.light-mode .support-chat-widget {
  background: rgba(255, 255, 255, 0.97) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

/* ─── Schedule Page ─────────────────────────────────────────────────────── */
body.light-mode .schedule-game,
body.light-mode .schedule-row {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .schedule-game:hover,
body.light-mode .schedule-row:hover {
  background: rgba(255, 255, 255, 0.95) !important;
}

/* ─── Home Page Sections ────────────────────────────────────────────────── */
body.light-mode .hp-section-alt {
  background: rgba(0, 0, 0, 0.03) !important;
  backdrop-filter: none !important;
}

body.light-mode .hp-section-header {
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .hp-section-header h2 {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #18181B !important;
  color: #18181B !important;
}

/* ─── Announcement Cards ────────────────────────────────────────────────── */
body.light-mode .hp-announcement-card.card {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .hp-announcement-card.card:hover {
  border-color: rgba(220, 38, 38, 0.1) !important;
}

/* ─── Home Calendar / Schedule Cards ────────────────────────────────────── */
body.light-mode .schedule-item {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .schedule-item:hover {
  background: rgba(255, 255, 255, 0.95) !important;
  border-color: rgba(220, 38, 38, 0.12) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
}

body.light-mode .schedule-item .matchup {
  color: #18181B !important;
}

body.light-mode .schedule-details .meta {
  color: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .schedule-date {
  background: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .schedule-date .month {
  color: var(--gold) !important;
}

body.light-mode .schedule-date .day {
  color: #18181B !important;
}

body.light-mode .hp-game-arrow {
  background: rgba(0, 0, 0, 0.05) !important;
  color: rgba(0, 0, 0, 0.4) !important;
}

body.light-mode .schedule-item:hover .hp-game-arrow {
  background: rgba(220, 38, 38, 0.08) !important;
  color: var(--gold) !important;
}

/* ─── Page Header (Sub-pages) ───────────────────────────────────────────── */
body.light-mode .page-header::before {
  background: radial-gradient(ellipse 50% 60% at 50% 0%, rgba(220, 38, 38,0.04) 0%, transparent 70%) !important;
}

body.light-mode .page-header::after {
  background: linear-gradient(90deg, transparent, rgba(220, 38, 38,0.08), transparent) !important;
}

body.light-mode .page-header-title {
  color: #18181B !important;
}

body.light-mode .page-header-desc {
  color: rgba(0, 0, 0, 0.45) !important;
}

/* ─── Profile Header ───────────────────────────────────────────────────── */
body.light-mode .profile-avatar {
  background: rgba(220, 38, 38, 0.06) !important;
  border-color: rgba(220, 38, 38, 0.15) !important;
}

body.light-mode .profile-name {
  color: #18181B !important;
}

body.light-mode .profile-email {
  color: rgba(0, 0, 0, 0.45) !important;
}

/* ─── Profile Dashboard ─────────────────────────────────────────────────── */
body.light-mode .pd-stat-card {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .pd-stat-card:hover {
  border-color: rgba(220, 38, 38, 0.12) !important;
  background: rgba(255, 255, 255, 0.95) !important;
}

body.light-mode .pd-stat-value {
  color: #18181B !important;
}

body.light-mode .pd-stat-label {
  color: rgba(0, 0, 0, 0.4) !important;
}

/* Child Cards */
body.light-mode .pd-child-card {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .pd-child-card:hover {
  border-color: rgba(0, 0, 0, 0.1) !important;
}

body.light-mode .pd-child-header {
  background: rgba(220, 38, 38, 0.03) !important;
  border-bottom-color: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .pd-child-avatar {
  background: rgba(220, 38, 38, 0.06) !important;
  border-color: rgba(220, 38, 38, 0.12) !important;
}

body.light-mode .pd-child-avatar-initials {
  color: #DC2626 !important;
}

body.light-mode .pd-child-name {
  color: #18181B !important;
}

body.light-mode .pd-child-meta {
  color: rgba(0, 0, 0, 0.4) !important;
}

/* Sections inside child cards */
body.light-mode .pd-section {
  background: rgba(0, 0, 0, 0.02) !important;
  border-color: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .pd-section-header {
  background: rgba(0, 0, 0, 0.03) !important;
  border-bottom-color: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .pd-section-title {
  color: rgba(0, 0, 0, 0.55) !important;
}

body.light-mode .pd-section-content {
  color: rgba(0, 0, 0, 0.6) !important;
}

body.light-mode .pd-no-data {
  color: rgba(0, 0, 0, 0.3) !important;
}

/* Enrollment badges */
body.light-mode .pd-enrollment-badge {
  background: rgba(0, 0, 0, 0.02) !important;
  border-color: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .pd-enrollment-badge:hover {
  background: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .pd-enrollment-label {
  color: rgba(0, 0, 0, 0.7) !important;
}

/* Next Up card */
body.light-mode .pd-next-up {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .pd-next-up-glow {
  opacity: 0.3 !important;
}

body.light-mode .pd-next-up-label {
  color: rgba(0, 0, 0, 0.4) !important;
}

body.light-mode .pd-next-up-title {
  color: #18181B !important;
}

body.light-mode .pd-next-up-meta {
  color: rgba(0, 0, 0, 0.45) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   ADMIN PANEL LIGHT MODE
   ═══════════════════════════════════════════════════════════════════════════════ */

body.light-mode.admin-page {
  background: #f0f2f7 !important;
}

/* Admin sidebar */
body.light-mode .admin-sidebar {
  background: #ffffff !important;
  border-right-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .sidebar-brand-title {
  color: #DC2626 !important;
}

body.light-mode .sidebar-brand-sub {
  color: rgba(0, 0, 0, 0.55) !important;
}

body.light-mode .sidebar-nav a {
  color: rgba(0, 0, 0, 0.6) !important;
}

body.light-mode .sidebar-nav a:hover {
  background: rgba(0, 0, 0, 0.04) !important;
  color: rgba(0, 0, 0, 0.85) !important;
}

body.light-mode .sidebar-nav a.active {
  background: rgba(220, 38, 38, 0.06) !important;
  color: #DC2626 !important;
  border-right-color: #DC2626 !important;
}

body.light-mode .sidebar-nav .drag-handle {
  color: rgba(0, 0, 0, 0.25) !important;
}

body.light-mode .sidebar-footer {
  border-top-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .sidebar-profile-name {
  color: rgba(0, 0, 0, 0.85) !important;
}

body.light-mode .sidebar-profile-role {
  color: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .sidebar-avatar {
  background: rgba(0, 0, 0, 0.06) !important;
  color: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .sidebar-footer-link {
  color: rgba(0, 0, 0, 0.6) !important;
}

body.light-mode .sidebar-footer-link:hover {
  color: rgba(0, 0, 0, 0.85) !important;
  background: rgba(0, 0, 0, 0.03) !important;
}

body.light-mode .sidebar-logout {
  background: rgba(0, 0, 0, 0.04) !important;
  color: rgba(0, 0, 0, 0.6) !important;
}

body.light-mode .sidebar-logout:hover {
  background: rgba(220, 38, 38, 0.08) !important;
  color: #DC2626 !important;
}

/* Admin main content */
body.light-mode .admin-main {
  background: #f0f2f7 !important;
}

body.light-mode .section-header h1 {
  color: #18181B !important;
}

body.light-mode .section-header-sub {
  color: rgba(0, 0, 0, 0.5) !important;
}

/* Admin bento cards */
body.light-mode .bento-card {
  background: rgba(255, 255, 255, 0.9) !important;
  border-left-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-mode .bento-card.accent {
  border-left-color: #DC2626 !important;
}

body.light-mode .bento-label {
  color: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .bento-value {
  color: #18181B !important;
}

body.light-mode .bento-sub {
  color: rgba(0, 0, 0, 0.5) !important;
}

/* Admin panel cards */
body.light-mode .panel-card {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .panel-card h3 {
  color: #18181B !important;
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

/* Admin form controls */
body.light-mode .form-label {
  color: rgba(0, 0, 0, 0.65) !important;
}

body.light-mode .form-control {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  color: #18181B !important;
}

body.light-mode .form-control:focus {
  outline-color: rgba(220, 38, 38, 0.3) !important;
  border-color: rgba(220, 38, 38, 0.3) !important;
}

/* Admin data tables */
body.light-mode .data-table-wrap {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .admin-main .table thead th {
  color: rgba(0, 0, 0, 0.45) !important;
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .admin-main .table tbody tr {
  border-bottom-color: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .admin-main .table tbody tr:hover {
  background: rgba(0, 0, 0, 0.02) !important;
}

body.light-mode .admin-main .table tbody td {
  color: rgba(0, 0, 0, 0.7) !important;
}

body.light-mode .admin-main .table tbody td strong {
  color: #18181B !important;
}

/* Admin buttons */
body.light-mode .admin-main .btn-ghost {
  color: rgba(0, 0, 0, 0.55) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
}

body.light-mode .admin-main .btn-ghost:hover {
  background: rgba(0, 0, 0, 0.05) !important;
  color: rgba(0, 0, 0, 0.85) !important;
}

body.light-mode .admin-main .btn-danger {
  background: rgba(239, 68, 68, 0.08) !important;
}

body.light-mode .admin-main .btn-success {
  background: rgba(34, 197, 94, 0.08) !important;
}

/* ─── Admin Programs panel: sport items, seasons, forms ─────────────────── */
body.light-mode .sport-item {
  background: rgba(0, 0, 0, 0.025) !important;
  border-left-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-mode .sport-item:hover {
  border-left-color: #DC2626 !important;
}

body.light-mode .sport-name {
  color: #18181B !important;
}

body.light-mode .sport-type {
  color: rgba(0, 0, 0, 0.55) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
}

body.light-mode .sport-drag-handle,
body.light-mode .season-drag-handle {
  color: rgba(0, 0, 0, 0.2) !important;
}

body.light-mode .sport-drag-handle:hover,
body.light-mode .season-drag-handle:hover {
  color: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .season-item {
  color: rgba(0, 0, 0, 0.7) !important;
  border-bottom-color: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .inline-form {
  background: rgba(0, 0, 0, 0.025) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-mode .inline-add-form,
body.light-mode .season-edit-form {
  background: rgba(0, 0, 0, 0.02) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-mode .age-group-tag {
  background: rgba(220, 38, 38, 0.06) !important;
  border-color: rgba(220, 38, 38, 0.12) !important;
  color: rgba(0, 0, 0, 0.65) !important;
}

body.light-mode .sport-directors {
  border-top-color: rgba(0, 0, 0, 0.06) !important;
}

/* ─── Admin Announcement cards ─────────────────────────────────────────── */
body.light-mode .announcement-item {
  background: rgba(0, 0, 0, 0.025) !important;
  border-left-color: #DC2626 !important;
}

body.light-mode .announcement-title {
  color: #18181B !important;
}

body.light-mode .announcement-meta {
  color: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .announcement-body {
  color: rgba(0, 0, 0, 0.65) !important;
}

/* ─── Admin Rich Text Editor ───────────────────────────────────────────── */
body.light-mode .rte-wrap {
  border-color: rgba(0, 0, 0, 0.1) !important;
  background: rgba(255, 255, 255, 0.9) !important;
}

/* ─── Admin empty state ────────────────────────────────────────────────── */
body.light-mode .empty-state {
  color: rgba(0, 0, 0, 0.45) !important;
}

/* Admin hamburger */
body.light-mode .admin-hamburger {
  background: rgba(255, 255, 255, 0.95) !important;
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
  color: #18181B !important;
}

body.light-mode .admin-hamburger button {
  color: #18181B !important;
}

/* Quick actions */
body.light-mode #quick-actions-bar {
  background: rgba(255, 255, 255, 0.6) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .qa-btn {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  color: rgba(0, 0, 0, 0.7) !important;
}

body.light-mode .qa-btn:hover {
  background: rgba(255, 255, 255, 1) !important;
  color: rgba(0, 0, 0, 0.9) !important;
}

/* Admin card links */
body.light-mode .admin-card-link .card {
  background: rgba(255, 255, 255, 0.9) !important;
}

body.light-mode .admin-card-link:hover .card {
  border-color: rgba(220, 38, 38, 0.12) !important;
}

/* ─── Dashboard Programs & Seasons Overview ─────────────────────────────── */
body.light-mode .dash-program-card {
  background: rgba(0, 0, 0, 0.025) !important;
  border-left-color: #DC2626 !important;
}

body.light-mode .dash-program-card:hover {
  border-left-color: #ef4444 !important;
}

body.light-mode .dash-program-title {
  color: #18181B !important;
}

body.light-mode .dash-program-type-badge {
  color: rgba(0, 0, 0, 0.55) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  background: rgba(0, 0, 0, 0.04) !important;
}

body.light-mode .dash-prop-label {
  color: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .dash-prop-value {
  color: rgba(0, 0, 0, 0.7) !important;
}

body.light-mode .dash-prop-value strong {
  color: #18181B !important;
}

body.light-mode .dash-season-card {
  background: rgba(0, 0, 0, 0.03) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .dash-season-name {
  color: #18181B !important;
}

body.light-mode .dash-season-status.open {
  background: rgba(34, 197, 94, 0.1) !important;
  color: #16a34a !important;
}

body.light-mode .dash-season-status.upcoming {
  background: rgba(59, 130, 246, 0.1) !important;
  color: #2563eb !important;
}

body.light-mode .dash-season-status.closed {
  background: rgba(239, 68, 68, 0.1) !important;
  color: #dc2626 !important;
}

body.light-mode .dash-season-status.active-season {
  background: rgba(234, 179, 8, 0.1) !important;
  color: #ca8a04 !important;
}

body.light-mode .dash-ag-tag {
  background: rgba(220, 38, 38, 0.06) !important;
  border-color: rgba(220, 38, 38, 0.12) !important;
  color: rgba(0, 0, 0, 0.65) !important;
}

body.light-mode .dash-ag-tag .ag-detail {
  color: rgba(0, 0, 0, 0.5) !important;
}

body.light-mode .dash-no-seasons {
  color: rgba(0, 0, 0, 0.45) !important;
}

body.light-mode .dash-section-divider {
  background: rgba(0, 0, 0, 0.06) !important;
}

/* ─── Admin Travel Programs Section ─────────────────────────────────────── */
body.light-mode .tv-section {
  border-top-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-mode .tv-section-title {
  color: #18181B !important;
}

body.light-mode .tv-section-sub {
  color: rgba(0, 0, 0, 0.45) !important;
}

body.light-mode .tv-inline-form {
  background: rgba(0, 0, 0, 0.02) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-mode .tv-venue-row {
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .tv-venue-name {
  color: #18181B !important;
}

body.light-mode .tv-venue-addr {
  color: rgba(0, 0, 0, 0.55) !important;
}

body.light-mode .tv-venue-notes {
  color: rgba(0, 0, 0, 0.4) !important;
}

body.light-mode .tv-program-card {
  background: rgba(255, 255, 255, 0.9) !important;
}

body.light-mode .tv-sport-type {
  color: rgba(0, 0, 0, 0.45) !important;
}

body.light-mode .tv-prog-desc {
  color: rgba(0, 0, 0, 0.55) !important;
}

body.light-mode .tv-empty-hint {
  color: rgba(0, 0, 0, 0.4) !important;
}

body.light-mode .tv-season-card {
  background: rgba(0, 0, 0, 0.03) !important;
  border-left-color: rgba(220, 38, 38, 0.5) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .tv-season-name {
  color: #18181B !important;
}

body.light-mode .tv-season-dates {
  color: rgba(0, 0, 0, 0.45) !important;
}

body.light-mode .tv-team-card {
  background: rgba(0, 0, 0, 0.025) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .tv-team-name {
  color: #18181B !important;
}

body.light-mode .tv-team-meta {
  color: rgba(0, 0, 0, 0.5) !important;
}

/* ─── Admin footer ───────────────────────────────────────────────────── */
body.light-mode .admin-footer {
  background: #ffffff !important;
  border-top-color: rgba(0, 0, 0, 0.06) !important;
}

body.light-mode .admin-footer-brand {
  color: #DC2626 !important;
}

body.light-mode .admin-footer-links a {
  color: rgba(0, 0, 0, 0.55) !important;
}

body.light-mode .admin-footer-links a:hover {
  color: rgba(0, 0, 0, 0.85) !important;
}

body.light-mode .admin-footer-copy {
  color: rgba(0, 0, 0, 0.45) !important;
}

/* ─── Field/Court Overview Calendar ──────────────────────────────────── */
body.light-mode .fo-month-nav .fo-arrow {
  background: rgba(0, 0, 0, 0.04) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  color: rgba(0, 0, 0, 0.55) !important;
}
body.light-mode .fo-month-nav .fo-arrow:hover {
  background: rgba(220, 38, 38, 0.08) !important;
  color: #DC2626 !important;
  border-color: rgba(220, 38, 38, 0.25) !important;
}
body.light-mode .fo-month-label {
  color: #18181B !important;
}
body.light-mode .fo-cal-grid {
  background: rgba(0, 0, 0, 0.04) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}
body.light-mode .fo-cal-hdr {
  background: rgba(0, 0, 0, 0.06) !important;
  color: rgba(0, 0, 0, 0.55) !important;
}
body.light-mode .fo-cal-day {
  background: rgba(255, 255, 255, 0.85) !important;
}
body.light-mode .fo-cal-day.fo-other-month {
  background: rgba(0, 0, 0, 0.03) !important;
}
body.light-mode .fo-cal-day.fo-today {
  box-shadow: inset 0 0 0 1px rgba(220, 38, 38, 0.35) !important;
}
body.light-mode .fo-day-num {
  color: rgba(0, 0, 0, 0.55) !important;
}
body.light-mode .fo-other-month .fo-day-num {
  color: rgba(0, 0, 0, 0.2) !important;
}
body.light-mode .fo-today .fo-day-num {
  color: #DC2626 !important;
}
body.light-mode .fo-ev-game {
  background: rgba(220, 38, 38, 0.1) !important;
  color: #b91c1c !important;
}
body.light-mode .fo-ev-practice {
  background: rgba(59, 130, 246, 0.08) !important;
  color: #2563eb !important;
}
body.light-mode .fo-ev-more {
  color: rgba(0, 0, 0, 0.55) !important;
}
body.light-mode .fo-ev-more:hover {
  color: rgba(0, 0, 0, 0.75) !important;
}
body.light-mode .fo-legend {
  color: rgba(0, 0, 0, 0.55) !important;
}
body.light-mode .fo-day-detail {
  background: rgba(255, 255, 255, 0.97) !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12) !important;
}
body.light-mode .fo-day-detail h4 {
  color: #18181B !important;
}
body.light-mode .fo-day-detail-event {
  color: rgba(0, 0, 0, 0.75) !important;
}
body.light-mode .fo-day-detail-event.game {
  background: rgba(220, 38, 38, 0.06) !important;
}
body.light-mode .fo-day-detail-event.practice {
  background: rgba(59, 130, 246, 0.06) !important;
}
body.light-mode .fo-day-detail-time {
  color: rgba(0, 0, 0, 0.5) !important;
}
body.light-mode .fo-field-label {
  color: rgba(0, 0, 0, 0.5) !important;
}

/* ─── Fields/Courts Panel (Venues, Field Forms, Availability) ────────── */
body.light-mode .venue-edit-form,
body.light-mode .field-add-form,
body.light-mode .field-edit-form {
  background: rgba(0, 0, 0, 0.025) !important;
  border-color: rgba(220, 38, 38, 0.12) !important;
}
body.light-mode .field-add-form .checkbox-row label,
body.light-mode .field-edit-form .checkbox-row label,
body.light-mode .venue-edit-form .checkbox-row label {
  color: rgba(0, 0, 0, 0.65) !important;
}
body.light-mode .field-edit-form .day-checks label {
  color: rgba(0, 0, 0, 0.6) !important;
}
body.light-mode .da-day-row {
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}
body.light-mode .da-day-label {
  color: rgba(0, 0, 0, 0.7) !important;
}
body.light-mode .da-window-sep {
  color: rgba(0, 0, 0, 0.5) !important;
}
body.light-mode .da-time-select {
  background: rgba(0, 0, 0, 0.03) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
  color: #18181B !important;
}
body.light-mode .da-time-select:hover:not(:disabled) {
  border-color: rgba(0, 0, 0, 0.25) !important;
}
body.light-mode .da-time-select:focus {
  border-color: rgba(220, 38, 38, 0.5) !important;
  box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.08) !important;
}
body.light-mode .da-time-select option {
  background: #ffffff !important;
  color: #18181B !important;
}
body.light-mode .da-closed-label {
  color: rgba(0, 0, 0, 0.5) !important;
}
body.light-mode .da-remove-window-btn {
  color: rgba(0, 0, 0, 0.45) !important;
}
body.light-mode .da-remove-window-btn:hover {
  color: #dc2626 !important;
  background: rgba(220, 38, 38, 0.06) !important;
}
body.light-mode .image-upload-widget .image-preview {
  border-color: rgba(0, 0, 0, 0.15) !important;
  background: rgba(0, 0, 0, 0.02) !important;
}
body.light-mode .venue-image-banner {
  border-color: rgba(0, 0, 0, 0.08) !important;
}
body.light-mode .field-image-thumb {
  border-color: rgba(0, 0, 0, 0.1) !important;
}

/* Inline-styled text in venue/field cards (white text overrides) */
body.light-mode .panel-card h3 span[style*="color:rgba(255,255,255,0.55)"] {
  color: rgba(0, 0, 0, 0.45) !important;
}
body.light-mode .sport-item div[style*="color:rgba(255,255,255,0.65)"] {
  color: rgba(0, 0, 0, 0.55) !important;
}
body.light-mode .field-add-form h4[style*="color:rgba(255,255,255,0.7)"] {
  color: rgba(0, 0, 0, 0.6) !important;
}

/* ─── Dashboard "How to Set Up" step cards (inline-styled) ───────────── */
body.light-mode .panel-card [style*="background:rgba(255,255,255,0.02)"] {
  background: rgba(0, 0, 0, 0.025) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ADMIN – Finder / Spotlight Search
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .finder-dialog {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.12) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.18) !important;
}
body.light-mode .finder-input-wrap {
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .finder-input {
  color: #18181B !important;
  background: transparent !important;
}
body.light-mode .finder-input::placeholder {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .finder-kbd {
  background: rgba(0,0,0,0.05) !important;
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .finder-results {
  background: transparent !important;
}
body.light-mode .finder-group-label {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .finder-item:hover,
body.light-mode .finder-item.active {
  background: rgba(220, 38, 38,0.06) !important;
}
body.light-mode .finder-item-icon {
  background: rgba(0,0,0,0.04) !important;
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .finder-item-title {
  color: #18181B !important;
}
body.light-mode .finder-item-sub {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .finder-item-badge {
  background: rgba(0,0,0,0.06) !important;
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .finder-footer {
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .finder-footer-hint {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .finder-trigger {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: rgba(0,0,0,0.4) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ADMIN – League Cards & Filter Bar
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .league-card {
  background: rgba(255,255,255,0.9) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .league-filter-bar {
  background: rgba(255,255,255,0.7) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .league-filter-bar .filter-group label {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .league-filter-bar .filter-group select,
body.light-mode .league-filter-bar .filter-group input {
  background: rgba(0,0,0,0.03) !important;
  color: #18181B !important;
  border-color: rgba(0,0,0,0.1) !important;
}
body.light-mode .league-filter-bar .filter-group select option {
  background: #ffffff !important;
  color: #18181B !important;
}
body.light-mode .league-program-header {
  background: rgba(220, 38, 38,0.06) !important;
}
body.light-mode .league-program-header .program-title {
  color: #18181B !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ADMIN – Confirm Dialog
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .confirm-dialog {
  background: #ffffff !important;
  border-color: rgba(220, 38, 38,0.15) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.15) !important;
}
body.light-mode .confirm-header {
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .confirm-header h4 {
  color: #18181B !important;
}
body.light-mode .confirm-body {
  color: rgba(0,0,0,0.65) !important;
}
body.light-mode .confirm-body strong {
  color: #18181B !important;
}
body.light-mode .confirm-footer {
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .confirm-footer .btn-cancel {
  background: rgba(0,0,0,0.04) !important;
  color: rgba(0,0,0,0.6) !important;
}
body.light-mode .confirm-footer .btn-cancel:hover {
  background: rgba(0,0,0,0.08) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ADMIN – Search Bar, Logo Preview, Header Image Preview, RTE extras
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .search-bar input,
body.light-mode .search-bar select {
  background: rgba(0,0,0,0.03) !important;
  color: #18181B !important;
  border-color: rgba(0,0,0,0.1) !important;
}
body.light-mode .search-bar input::placeholder {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .search-bar .material-symbols-outlined {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .logo-preview {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .header-image-preview {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .rte-select option {
  background: #ffffff !important;
  color: #18181B !important;
}
body.light-mode .rte-toolbar {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.08) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   VENUE CALENDAR
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .vc-hero-bg {
  background: linear-gradient(135deg, rgba(220, 38, 38,0.06) 0%, rgba(240,242,247,0.97) 55%) !important;
}
body.light-mode .vc-hero h1 {
  color: #18181B !important;
}
body.light-mode .vc-hero-sub {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .vc-control-label {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .vc-select {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.12) !important;
  color: #18181B !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='rgba(0,0,0,0.35)' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
}
body.light-mode .vc-select:hover {
  border-color: rgba(0,0,0,0.2) !important;
  background-color: #f8f8fc !important;
}
body.light-mode .vc-select option {
  background: #ffffff !important;
  color: #18181B !important;
}
body.light-mode .vc-month-btn {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .vc-month-btn:hover {
  background: rgba(220, 38, 38,0.08) !important;
  color: #18181B !important;
  border-color: rgba(220, 38, 38,0.25) !important;
}
body.light-mode .vc-month-label {
  color: #18181B !important;
}
body.light-mode .vc-venue-banner {
  background: linear-gradient(135deg, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.7) 100%) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .vc-venue-name {
  color: #18181B !important;
}
body.light-mode .vc-venue-addr {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .vc-action-btn {
  background: rgba(0,0,0,0.03) !important;
  color: rgba(0,0,0,0.55) !important;
  border-color: rgba(0,0,0,0.1) !important;
}
body.light-mode .vc-action-btn:hover {
  background: rgba(220, 38, 38,0.06) !important;
  color: #18181B !important;
  border-color: rgba(220, 38, 38,0.25) !important;
}
body.light-mode .vc-action-btn.directions {
  border-color: rgba(59,130,246,0.15) !important;
}
body.light-mode .vc-action-btn.directions:hover {
  border-color: rgba(59,130,246,0.3) !important;
  background: rgba(59,130,246,0.06) !important;
  color: #2563eb !important;
}
body.light-mode .vc-action-btn.share {
  border-color: rgba(34,197,94,0.15) !important;
}
body.light-mode .vc-action-btn.share:hover {
  border-color: rgba(34,197,94,0.3) !important;
  background: rgba(34,197,94,0.06) !important;
  color: #16a34a !important;
}
body.light-mode .vc-calendar {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .vc-day-header {
  background: rgba(0,0,0,0.03) !important;
  color: rgba(0,0,0,0.5) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .vc-day {
  background: #ffffff !important;
}
body.light-mode .vc-day:hover {
  background: #f5f5fa !important;
}
body.light-mode .vc-day.today {
  background: rgba(220, 38, 38,0.04) !important;
  box-shadow: inset 0 0 0 1.5px rgba(220, 38, 38,0.25) !important;
}
body.light-mode .vc-day.outside {
  opacity: 0.3 !important;
}
body.light-mode .vc-day-num {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .vc-day.today .vc-day-num {
  color: #DC2626 !important;
  background: rgba(220, 38, 38,0.08) !important;
}
body.light-mode .vc-more-events {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .vc-more-events:hover {
  color: #DC2626 !important;
  background: rgba(220, 38, 38,0.04) !important;
}
body.light-mode .vc-popover {
  background: linear-gradient(180deg, #ffffff 0%, #f8f9fc 100%) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.15), 0 0 0 1px rgba(0,0,0,0.08) !important;
}
body.light-mode .vc-popover-close {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .vc-popover-close:hover {
  color: #18181B !important;
  background: rgba(220, 38, 38,0.08) !important;
  border-color: rgba(220, 38, 38,0.2) !important;
}
body.light-mode .vc-popover h3 {
  color: #18181B !important;
}
body.light-mode .vc-popover-row {
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .vc-popover-row .material-symbols-outlined {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .vc-popover-row span {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .vc-popover-row strong {
  color: #18181B !important;
}
body.light-mode .vc-legend-card {
  background: linear-gradient(135deg, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.7) 100%) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .vc-legend-title {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .vc-legend-item {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .vc-maps-chooser {
  background: linear-gradient(180deg, #ffffff 0%, #f8f9fc 100%) !important;
  box-shadow: 0 -8px 40px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.06) !important;
}
body.light-mode .vc-maps-chooser-title {
  color: #18181B !important;
}
body.light-mode .vc-maps-option {
  border-color: rgba(0,0,0,0.08) !important;
  background: rgba(0,0,0,0.02) !important;
  color: #18181B !important;
}
body.light-mode .vc-maps-option:hover {
  background: rgba(59,130,246,0.05) !important;
  border-color: rgba(59,130,246,0.2) !important;
}
body.light-mode .vc-maps-option-icon.apple {
  background: rgba(0,0,0,0.06) !important;
}
body.light-mode .vc-maps-option-label small {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .vc-maps-cancel {
  background: rgba(0,0,0,0.04) !important;
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .vc-maps-cancel:hover {
  background: rgba(0,0,0,0.08) !important;
  color: #18181B !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   COACH DASHBOARD
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .coach-tabs {
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .coach-tab {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .coach-tab:hover {
  color: rgba(0,0,0,0.6) !important;
}
body.light-mode .coach-tab.active {
  color: #DC2626 !important;
}
body.light-mode .team-selector select {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.12) !important;
  color: #18181B !important;
}
body.light-mode .roster-table th {
  color: rgba(0,0,0,0.4) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .roster-table td {
  color: rgba(0,0,0,0.6) !important;
  border-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .roster-table tr:hover td {
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .roster-table .player-name {
  color: #18181B !important;
}
body.light-mode .roster-table input,
body.light-mode .roster-table select {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}
body.light-mode .game-card {
  background: rgba(255,255,255,0.9) !important;
  border-left-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .game-card:hover {
  border-left-color: #DC2626 !important;
}
body.light-mode .game-card-date {
  color: #18181B !important;
}
body.light-mode .game-card-matchup {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .game-card-venue {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .branding-preview {
  background: rgba(255,255,255,0.9) !important;
}
body.light-mode .branding-logo-preview {
  background: rgba(0,0,0,0.03) !important;
}
body.light-mode .color-swatch {
  border-color: rgba(0,0,0,0.1) !important;
}
body.light-mode .coach-form-label {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .coach-form-control {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}
body.light-mode .coach-form-control option,
body.light-mode select option {
  background: #ffffff !important;
  color: #18181B !important;
}
body.light-mode .btn-ghost {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .btn-ghost:hover {
  color: rgba(0,0,0,0.65) !important;
}
body.light-mode .parent-contact {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .parent-contact .parent-label {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .parent-contact a {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .parent-contact a:hover {
  color: #18181B !important;
}
body.light-mode .parent-contact-row td {
  border-color: rgba(0,0,0,0.06) !important;
}
@media (max-width: 768px) {
  body.light-mode .roster-table tr[data-member-id] {
    background: rgba(255,255,255,0.8) !important;
    border-left-color: rgba(0,0,0,0.08) !important;
  }
  body.light-mode .roster-table tr[data-member-id]:hover {
    border-left-color: #DC2626 !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   CHECK-IN PAGE
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .checkin-container {
  background: #ffffff !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08) !important;
}
body.light-mode .checkin-header {
  background: linear-gradient(135deg, #f8f9fc, #f0f2f7) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .checkin-header p {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .checkin-card {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .checkin-card .player-name {
  color: #18181B !important;
}
body.light-mode .checkin-detail {
  color: rgba(0,0,0,0.6) !important;
}
body.light-mode .checkin-detail strong {
  color: #18181B !important;
}
body.light-mode .btn-checkin-decline {
  color: rgba(0,0,0,0.5) !important;
  border-color: rgba(0,0,0,0.12) !important;
}
body.light-mode .btn-checkin-decline:hover {
  background: rgba(0,0,0,0.04) !important;
  color: rgba(0,0,0,0.7) !important;
}
body.light-mode .result-state p {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .result-state h2 {
  color: #18181B !important;
}
body.light-mode .loading-state p {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .spinner {
  border-color: rgba(0,0,0,0.1) !important;
  border-top-color: #DC2626 !important;
}
body.light-mode .error-state p {
  color: rgba(0,0,0,0.55) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   MESSAGES INBOX (DM)
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .dm-page-title {
  background: linear-gradient(135deg, #18181B 0%, rgba(0,0,0,0.6) 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
body.light-mode .dm-page-sub {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .dm-search-row .material-symbols-outlined {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .dm-search-input {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}
body.light-mode .dm-search-input:focus {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(220, 38, 38,0.35) !important;
}
body.light-mode .dm-search-input::placeholder {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .dm-list {
  border-color: rgba(0,0,0,0.06) !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.85) 100%) !important;
}
body.light-mode .dm-item {
  border-color: rgba(0,0,0,0.05) !important;
}
body.light-mode .dm-item:hover {
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .dm-item.unread {
  background: rgba(220, 38, 38,0.03) !important;
}
body.light-mode .dm-online-dot {
  border-color: #ffffff !important;
}
body.light-mode .dm-item.unread .dm-avatar::after {
  background: #ffffff !important;
}
body.light-mode .dm-item.unread .dm-avatar img {
  border-color: #ffffff !important;
}
body.light-mode .dm-name {
  color: #18181B !important;
}
body.light-mode .dm-item.unread .dm-name {
  color: #000000 !important;
}
body.light-mode .dm-chip.league {
  color: rgba(0,0,0,0.45) !important;
  background: rgba(0,0,0,0.05) !important;
}
body.light-mode .dm-preview {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .dm-item.unread .dm-preview {
  color: rgba(0,0,0,0.65) !important;
}
body.light-mode .dm-time {
  color: rgba(0,0,0,0.35) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   MESSAGES CHAT
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .chat-back {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .chat-hdr {
  background: linear-gradient(180deg, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.01) 100%) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .chat-hdr-name button {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .chat-hdr-name button:hover {
  color: #DC2626 !important;
}
body.light-mode .chat-hdr-meta {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .chat-hdr-actions button {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .chat-hdr-actions button:hover {
  background: rgba(220, 38, 38,0.05) !important;
  border-color: rgba(220, 38, 38,0.15) !important;
}
body.light-mode .chat-title-edit input {
  background: rgba(0,0,0,0.03) !important;
  color: #18181B !important;
}
body.light-mode .chat-title-edit .cancel-btn {
  background: rgba(0,0,0,0.05) !important;
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .chat-drawer {
  background: rgba(0,0,0,0.015) !important;
}
body.light-mode .chat-drawer h4 {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .chat-p-tag {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.06) !important;
  color: rgba(0,0,0,0.6) !important;
}
body.light-mode .chat-p-tag:hover {
  background: rgba(0,0,0,0.05) !important;
}
body.light-mode .chat-msgs {
  background: linear-gradient(180deg, rgba(0,0,0,0.02) 0%, rgba(0,0,0,0.035) 100%) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .chat-msgs::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.1) !important;
}
body.light-mode .chat-date {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .chat-date span {
  background: rgba(0,0,0,0.04) !important;
}
body.light-mode .chat-sender {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .chat-row.other .chat-bubble {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.06) !important;
  color: #18181B !important;
}
body.light-mode .chat-ts {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .chat-attach a.file-dl {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .chat-attach a.file-dl:hover {
  background: rgba(0,0,0,0.06) !important;
}
body.light-mode .chat-file-preview {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .chat-file-preview .cfp-name {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .chat-file-preview .cfp-remove {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .chat-compose {
  background: linear-gradient(180deg, rgba(0,0,0,0.01) 0%, rgba(0,0,0,0.025) 100%) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .compose-attach-btn .material-symbols-outlined {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .compose-input {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: #18181B !important;
}
body.light-mode .compose-input:focus {
  background: rgba(0,0,0,0.04) !important;
}
body.light-mode .compose-input::placeholder {
  color: rgba(0,0,0,0.3) !important;
}

/* ─── Compose (New Conversation) Modal ──────────────────────────────────── */
body.light-mode .compose-overlay {
  background: rgba(0,0,0,0.35) !important;
}
body.light-mode .compose-modal {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.1) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.18) !important;
}
body.light-mode .compose-hdr h3 {
  background: linear-gradient(135deg, #18181B, rgba(0,0,0,0.6)) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}
body.light-mode .compose-close {
  background: rgba(0,0,0,0.05) !important;
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .compose-close:hover {
  background: rgba(220, 38, 38,0.1) !important;
  color: #DC2626 !important;
}
body.light-mode .compose-type-btn {
  border-color: rgba(0,0,0,0.08) !important;
  background: rgba(0,0,0,0.02) !important;
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .compose-type-btn:hover {
  border-color: rgba(0,0,0,0.15) !important;
  color: rgba(0,0,0,0.6) !important;
}
body.light-mode .compose-type-btn.active {
  background: linear-gradient(135deg, rgba(220, 38, 38,0.08), rgba(224,48,80,0.04)) !important;
  border-color: rgba(220, 38, 38,0.25) !important;
  color: #DC2626 !important;
}
body.light-mode .compose-type-hint {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .compose-group-name input {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}
body.light-mode .compose-group-name input:focus {
  border-color: rgba(220, 38, 38,0.35) !important;
}
body.light-mode .compose-search-row .material-symbols-outlined {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .compose-search-input {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}
body.light-mode .compose-search-input:focus {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(220, 38, 38,0.35) !important;
}
body.light-mode .compose-search-input::placeholder {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .compose-pill {
  background: linear-gradient(135deg, rgba(220, 38, 38,0.08), rgba(224,48,80,0.04)) !important;
  border-color: rgba(220, 38, 38,0.15) !important;
  color: rgba(0,0,0,0.7) !important;
}
body.light-mode .compose-pill-remove {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .compose-pill-remove:hover {
  color: #DC2626 !important;
}
body.light-mode .compose-results {
  border-color: rgba(0,0,0,0.06) !important;
  background: rgba(0,0,0,0.015) !important;
}
body.light-mode .compose-results-placeholder {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .compose-result-item {
  border-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .compose-result-item:hover {
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .compose-result-item.selected {
  background: rgba(220, 38, 38,0.04) !important;
}
body.light-mode .compose-result-name {
  color: #18181B !important;
}
body.light-mode .compose-result-check {
  border-color: rgba(0,0,0,0.12) !important;
}
body.light-mode .compose-message-row textarea {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}
body.light-mode .compose-message-row textarea:focus {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(220, 38, 38,0.35) !important;
}
body.light-mode .compose-message-row textarea::placeholder {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .dm-tab {
  border-color: rgba(0,0,0,0.06) !important;
  background: rgba(0,0,0,0.02) !important;
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .dm-tab:hover {
  border-color: rgba(220, 38, 38,0.15) !important;
  color: rgba(0,0,0,0.6) !important;
}
body.light-mode .dm-tab.active {
  background: linear-gradient(135deg, rgba(220, 38, 38,0.08), rgba(224,48,80,0.04)) !important;
  border-color: rgba(220, 38, 38,0.25) !important;
  color: #DC2626 !important;
}
body.light-mode .dm-type-icon {
  color: rgba(0,0,0,0.2) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SCOREKEEPER
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .sk-header h1 {
  color: #18181B !important;
}
body.light-mode .sk-header p {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .sk-header-icon {
  background: rgba(220, 38, 38,0.08) !important;
}
body.light-mode .sk-league-selector label {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .sk-league-selector select {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.12) !important;
  color: #18181B !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='rgba(0,0,0,0.3)' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 1rem center !important;
}
body.light-mode .sk-league-selector select:hover {
  border-color: rgba(0,0,0,0.2) !important;
  background-color: #f8f8fc !important;
}
body.light-mode .sk-league-selector select option {
  background: #ffffff !important;
  color: #18181B !important;
}
body.light-mode .sk-page .panel-card,
body.light-mode .stats-modal .panel-card {
  background: rgba(255,255,255,0.9) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .sk-page .panel-card:hover {
  border-color: rgba(0,0,0,0.12) !important;
}
body.light-mode .sk-page .panel-card h3,
body.light-mode .stats-modal .panel-card h3 {
  color: #18181B !important;
}
body.light-mode .panel-label {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .sk-page .game-card {
  background: rgba(255,255,255,0.9) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .sk-page .game-card:hover {
  background: rgba(255,255,255,1) !important;
  border-color: rgba(0,0,0,0.12) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08) !important;
}
body.light-mode .sk-page .game-card-date {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .sk-page .game-card-matchup {
  color: #18181B !important;
}
body.light-mode .sk-page .game-card-venue {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .score-input {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.12) !important;
  color: #18181B !important;
}
body.light-mode .score-input:hover {
  border-color: rgba(0,0,0,0.2) !important;
}
body.light-mode .stats-modal {
  background: linear-gradient(180deg, #ffffff 0%, #f8f9fc 100%) !important;
  border-color: rgba(0,0,0,0.1) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.15), 0 0 0 1px rgba(0,0,0,0.06) !important;
}
body.light-mode .stats-modal::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.12) !important;
}
body.light-mode .stats-modal-close {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .stats-modal-close:hover {
  background: rgba(0,0,0,0.08) !important;
  color: #18181B !important;
}
body.light-mode .sk-page .btn-ghost,
body.light-mode .stats-modal .btn-ghost {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .sk-page .btn-ghost:hover,
body.light-mode .stats-modal .btn-ghost:hover {
  color: rgba(0,0,0,0.7) !important;
  background: rgba(0,0,0,0.04) !important;
}
body.light-mode .table th {
  color: rgba(0,0,0,0.4) !important;
  border-color: rgba(0,0,0,0.08) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ADMIN – Inline-Styled Modals & Overlays (Light Mode Fixes)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Quick Actions Editor Modal */
body.light-mode #quick-actions-editor-overlay > div {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: rgba(0,0,0,0.75) !important;
}
body.light-mode #quick-actions-editor-overlay h3 {
  color: #18181B !important;
}
body.light-mode #quick-actions-editor-overlay p {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode #quick-actions-editor-overlay label {
  color: rgba(0,0,0,0.7) !important;
}

/* Transfer Modal */
body.light-mode #transfer-modal-overlay > div {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.1) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.15) !important;
  color: rgba(0,0,0,0.75) !important;
}
body.light-mode #transfer-modal-overlay h3,
body.light-mode #transfer-modal-overlay h4 {
  color: #18181B !important;
}
body.light-mode #transfer-modal-overlay p,
body.light-mode #transfer-modal-overlay label {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode #transfer-modal-overlay select,
body.light-mode #transfer-modal-overlay input {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}

/* Search result dropdowns (scorekeeper, owner, tryout, sport-director, coach) */
body.light-mode #sk-user-results,
body.light-mode #owner-user-results,
body.light-mode [id^="tryout-coach-results-"],
body.light-mode [id^="sd-results-"],
body.light-mode [id$="-results"][style*="background:#1"] {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.1) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.1) !important;
  color: rgba(0,0,0,0.75) !important;
}
body.light-mode #sk-user-results div:hover,
body.light-mode #owner-user-results div:hover,
body.light-mode [id^="tryout-coach-results-"] div:hover,
body.light-mode [id^="sd-results-"] div:hover {
  background: rgba(0,0,0,0.04) !important;
}

/* Generic inline dark-bg overlays */
body.light-mode [style*="background:#1a1e2e"],
body.light-mode [style*="background:#1A1F2E"],
body.light-mode [style*="background:#1a1f2e"] {
  background: #ffffff !important;
  color: rgba(0,0,0,0.75) !important;
}

/* Coach results dropdown (travel view) */
body.light-mode #tv-team-coach-results {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: rgba(0,0,0,0.75) !important;
}
body.light-mode #tv-team-coach-results div:hover {
  background: rgba(0,0,0,0.04) !important;
}

/* RTE select options */
body.light-mode .rte-select option {
  background: #ffffff !important;
  color: #18181B !important;
}

/* ─── Dashboard Analytics Charts (Light Mode) ──────────────────────────── */
body.light-mode .dash-chart-card {
  background: rgba(255,255,255,0.9) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .dash-chart-title {
  color: #18181B !important;
}
body.light-mode .dash-chart-title .material-symbols-outlined {
  color: #DC2626 !important;
}
body.light-mode .dash-chart-subtitle {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .dash-chart-value {
  color: #18181B !important;
}
body.light-mode .dash-chart-legend-item {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .dash-chart-empty {
  color: rgba(0,0,0,0.3) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   LEAGUE PAGE (league.html) — Light Mode
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ─── CSS Variable Overrides ──────────────────────────────────────────────── */
body.light-mode .lg-hero,
body.light-mode .lg-list-hero,
body.light-mode #league-list-view,
body.light-mode #league-detail-view {
  --lg-accent: #DC2626;
  --lg-gold: #d97706;
  --lg-bg: #f0f2f7;
  --lg-card: #ffffff;
  --lg-card-border: rgba(0,0,0,0.08);
  --lg-text: #18181B;
  --lg-text-dim: rgba(0,0,0,0.45);
  --lg-text-faint: rgba(0,0,0,0.2);
  --lg-green: #16a34a;
  --lg-red: #dc2626;
}

/* ─── Hero ────────────────────────────────────────────────────────────────── */
body.light-mode .lg-hero {
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fb 50%, #f0f2f7 100%) !important;
  border-color: rgba(0,0,0,0.08) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06) !important;
}
body.light-mode .lg-hero::before {
  background: linear-gradient(90deg, #DC2626 0%, #d97706 50%, #DC2626 100%) !important;
}
body.light-mode .lg-hero::after {
  background: radial-gradient(ellipse at 80% 20%, rgba(197,34,58,0.04) 0%, transparent 60%) !important;
}
body.light-mode .lg-hero-sport { color: rgba(0,0,0,0.45) !important; }
body.light-mode .lg-hero-badge { color: #DC2626 !important; background: rgba(220,38,38,0.08) !important; border-color: rgba(220,38,38,0.18) !important; }
body.light-mode .lg-hero-name { color: #18181B !important; }
body.light-mode .lg-hero-stat-val { color: #18181B !important; }
body.light-mode .lg-hero-stat-lbl { color: rgba(0,0,0,0.4) !important; }
body.light-mode .lg-hero-leader { color: #16a34a !important; }
body.light-mode .lg-hero-leader-sub { color: rgba(0,0,0,0.4) !important; }

/* ─── Tabs ────────────────────────────────────────────────────────────────── */
body.light-mode .lg-tabs {
  background: transparent !important;
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .lg-tab {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .lg-tab:hover {
  color: rgba(0,0,0,0.7) !important;
  background: rgba(0,0,0,0.03) !important;
}
body.light-mode .lg-tab.active {
  color: #DC2626 !important;
  border-bottom-color: #DC2626 !important;
}

/* ─── Section Titles ──────────────────────────────────────────────────────── */
body.light-mode .lg-section-title {
  color: rgba(0,0,0,0.55) !important;
  border-bottom-color: rgba(0,0,0,0.06) !important;
}

/* ─── Standings Table ─────────────────────────────────────────────────────── */
body.light-mode .lg-standings-wrap {
  border-color: rgba(0,0,0,0.08) !important;
  background: #ffffff !important;
}
body.light-mode .lg-standings {
  background: #ffffff !important;
}
body.light-mode .lg-standings thead th {
  background: #f8f9fb !important;
  color: rgba(0,0,0,0.45) !important;
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .lg-standings thead th:first-child {
  background: #f8f9fb !important;
}
body.light-mode .lg-standings thead th:first-child::after {
  background: linear-gradient(90deg, rgba(0,0,0,0.04) 0%, transparent 100%) !important;
}
body.light-mode .lg-standings tbody td {
  color: #3f3f46 !important;
  border-bottom-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .lg-standings tbody td:first-child {
  background: #ffffff !important;
  color: #18181B !important;
}
body.light-mode .lg-standings tbody td:first-child::after {
  background: linear-gradient(90deg, rgba(0,0,0,0.04) 0%, transparent 100%) !important;
}
body.light-mode .lg-standings tbody td:nth-child(2) {
  background: #ffffff !important;
  color: #18181B !important;
}
body.light-mode .lg-standings thead th:nth-child(2) {
  background: #f8f9fb !important;
}
body.light-mode .lg-standings thead th:nth-child(2)::after,
body.light-mode .lg-standings tbody td:nth-child(2)::after {
  background: linear-gradient(90deg, rgba(0,0,0,0.04) 0%, transparent 100%) !important;
}
body.light-mode .lg-standings tbody tr:hover {
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .lg-standings tbody tr:hover td:first-child,
body.light-mode .lg-standings tbody tr:hover td:nth-child(2) {
  background: #f8f9fb !important;
}
body.light-mode .lg-standings .col-record,
body.light-mode .lg-standings .col-pts {
  color: #18181B !important;
}
body.light-mode .lg-standings .col-diff { color: #18181B !important; }
body.light-mode .lg-standings .col-diff.positive { color: #16a34a !important; }
body.light-mode .lg-standings .col-diff.negative { color: #dc2626 !important; }
body.light-mode .lg-standings .col-streak { color: rgba(0,0,0,0.5) !important; }
body.light-mode .lg-standings .col-streak.W { color: #16a34a !important; }
body.light-mode .lg-standings .col-streak.L { color: #dc2626 !important; }
body.light-mode .lg-standings .col-streak.T { color: #d97706 !important; }
body.light-mode .lg-standings .col-winpct { color: #d97706 !important; }
body.light-mode .team-color-dot {
  box-shadow: 0 0 0 2px rgba(0,0,0,0.06) !important;
}
body.light-mode .sortable { color: rgba(0,0,0,0.35) !important; }
body.light-mode .sortable:hover { color: rgba(0,0,0,0.65) !important; }

/* ─── Toggle (Per-Game / Total) ───────────────────────────────────────────── */
body.light-mode .lg-toggle {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .lg-toggle button {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .lg-toggle button.active {
  background: #DC2626 !important;
  color: #fff !important;
}

/* ─── Schedule ────────────────────────────────────────────────────────────── */
body.light-mode .lg-sched-date {
  color: rgba(0,0,0,0.35) !important;
  border-bottom-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .lg-game {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .lg-game:hover {
  border-color: rgba(0,0,0,0.12) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
}
body.light-mode .lg-game-time {
  background: rgba(0,0,0,0.03) !important;
  color: rgba(0,0,0,0.5) !important;
  border-right-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .lg-game-tn { color: #18181B !important; }
body.light-mode .lg-game-at { color: rgba(0,0,0,0.25) !important; }
body.light-mode .lg-game-score-block { color: #18181B !important; }
body.light-mode .lg-game-badge {
  background: rgba(0,0,0,0.04) !important;
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .lg-game-badge.final {
  background: rgba(22,163,74,0.08) !important;
  color: #16a34a !important;
}
body.light-mode .lg-game-badge.upcoming {
  background: rgba(0,0,0,0.04) !important;
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .lg-game-badge.live {
  background: rgba(245,158,11,0.1) !important;
  color: #d97706 !important;
}

/* ─── Stat Leaders ────────────────────────────────────────────────────────── */
body.light-mode .lg-ldr-card {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .lg-ldr-hdr {
  background: #f8f9fb !important;
  border-bottom-color: rgba(0,0,0,0.06) !important;
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .lg-ldr-hdr-title {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .lg-ldr-hdr-mode {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .lg-ldr-row {
  border-bottom-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .lg-ldr-row:hover {
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .lg-ldr-rank {
  color: rgba(0,0,0,0.25) !important;
}
body.light-mode .lg-ldr-rank.gold { color: #d97706 !important; }
body.light-mode .lg-ldr-rank.silver { color: #9ca3af !important; }
body.light-mode .lg-ldr-rank.bronze { color: #b45309 !important; }
body.light-mode .lg-ldr-rank.dim { color: rgba(0,0,0,0.2) !important; }
body.light-mode .lg-ldr-row.featured {
  background: rgba(217,119,6,0.04) !important;
  border-bottom-color: rgba(217,119,6,0.1) !important;
}
body.light-mode .lg-ldr-avatar {
  background: rgba(220,38,38,0.08) !important;
  color: #DC2626 !important;
}
body.light-mode .lg-ldr-name {
  color: #18181B !important;
}
body.light-mode .lg-ldr-team {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .lg-ldr-val {
  color: #18181B !important;
}
body.light-mode .lg-ldr-sub {
  color: rgba(0,0,0,0.35) !important;
}

/* ─── League List ─────────────────────────────────────────────────────────── */
body.light-mode .lg-list-hero {
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fb 50%, #f0f2f7 100%) !important;
  border-color: rgba(0,0,0,0.08) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06) !important;
}
body.light-mode .lg-list-hero h1 { color: #18181B !important; }
body.light-mode .lg-list-hero p { color: rgba(0,0,0,0.45) !important; }
body.light-mode .lg-list {
  background: transparent !important;
}
body.light-mode .lg-card {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .lg-card:hover {
  border-color: rgba(0,0,0,0.15) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06) !important;
}
body.light-mode .lg-card-sport {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .lg-card-name {
  color: #18181B !important;
}
body.light-mode .lg-card-pills {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .lg-card-pill {
  background: rgba(0,0,0,0.04) !important;
  color: rgba(0,0,0,0.55) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .lg-card-stats {
  color: rgba(0,0,0,0.55) !important;
  border-top-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .lg-card-stat-val {
  color: #18181B !important;
}

/* ─── Back Button & Empty State ───────────────────────────────────────────── */
body.light-mode .lg-back {
  color: rgba(0,0,0,0.45) !important;
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .lg-back:hover {
  color: #DC2626 !important;
  background: rgba(0,0,0,0.06) !important;
  border-color: rgba(0,0,0,0.12) !important;
}
body.light-mode .lg-empty {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .lg-empty h3 {
  color: rgba(0,0,0,0.5) !important;
}

/* ─── Name Links ──────────────────────────────────────────────────────────── */
body.light-mode .lg-name-link {
  color: #18181B !important;
}
body.light-mode .lg-name-link:hover {
  color: #DC2626 !important;
}

/* ─── Bracket ─────────────────────────────────────────────────────────────── */
body.light-mode .bracket-wrap {
  scrollbar-color: rgba(0,0,0,0.15) transparent !important;
}
body.light-mode .bracket-wrap::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.15) !important;
}
body.light-mode .bracket-section-title {
  color: rgba(0,0,0,0.5) !important;
  border-bottom-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .bracket-round-label {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .bracket-game {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.08) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
}
body.light-mode .bracket-game:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.06) !important;
  border-color: rgba(0,0,0,0.15) !important;
}
body.light-mode .bracket-game.is-final {
  border-color: rgba(22,163,74,0.25) !important;
  box-shadow: 0 2px 12px rgba(22,163,74,0.06) !important;
}
body.light-mode .bracket-team + .bracket-team {
  border-top-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .bracket-seed {
  color: rgba(0,0,0,0.3) !important;
  background: rgba(0,0,0,0.03) !important;
}
body.light-mode .bracket-team-name {
  color: rgba(0,0,0,0.65) !important;
}
body.light-mode .bracket-score {
  color: rgba(0,0,0,0.4) !important;
  background: rgba(0,0,0,0.03) !important;
}
body.light-mode .bracket-team.winner {
  background: linear-gradient(90deg, rgba(22,163,74,0.06) 0%, rgba(22,163,74,0.02) 100%) !important;
}
body.light-mode .bracket-team.winner .bracket-team-name {
  color: #18181B !important;
}
body.light-mode .bracket-team.winner .bracket-score {
  color: #16a34a !important;
}
body.light-mode .bracket-team.winner .bracket-seed {
  color: #16a34a !important;
}
body.light-mode .bracket-team.loser .bracket-team-name {
  color: rgba(0,0,0,0.3) !important;
  text-decoration-color: rgba(0,0,0,0.15) !important;
}
body.light-mode .bracket-team.loser .bracket-score {
  color: rgba(0,0,0,0.2) !important;
}
body.light-mode .bracket-team.loser .bracket-seed {
  color: rgba(0,0,0,0.15) !important;
}
body.light-mode .bracket-team.tbd .bracket-team-name {
  color: rgba(0,0,0,0.2) !important;
}
body.light-mode .bracket-matchup::after,
body.light-mode .bracket-matchup::before {
  background: rgba(0,0,0,0.1) !important;
}
body.light-mode .bracket-connector {
  background: rgba(0,0,0,0.1) !important;
}
body.light-mode .bracket-champion-name {
  color: #d97706 !important;
}
body.light-mode .bracket-champion-label {
  color: rgba(0,0,0,0.3) !important;
}

/* Round Robin Table */
body.light-mode .bracket-rr-table {
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .bracket-rr-table thead th {
  color: rgba(0,0,0,0.45) !important;
  background: #f8f9fb !important;
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .bracket-rr-table tbody td {
  color: rgba(0,0,0,0.65) !important;
  border-bottom-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .bracket-rr-table .rr-scheduled {
  color: rgba(0,0,0,0.25) !important;
}

/* ─── Box Score Modal ─────────────────────────────────────────────────────── */
body.light-mode .bs-overlay {
  background: rgba(0,0,0,0.45) !important;
}
body.light-mode .bs-modal {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.1) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.15) !important;
}
body.light-mode .bs-modal::before {
  background: rgba(0,0,0,0.15) !important;
}
body.light-mode .bs-header {
  background: linear-gradient(135deg, #1e293b 0%, #334155 50%, #475569 100%) !important;
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .bs-header::before {
  background: linear-gradient(90deg, #DC2626 0%, #d97706 50%, #DC2626 100%) !important;
}
body.light-mode .bs-close {
  background: rgba(255,255,255,0.1) !important;
  border-color: rgba(255,255,255,0.15) !important;
  color: rgba(255,255,255,0.6) !important;
}
body.light-mode .bs-close:hover {
  background: rgba(255,255,255,0.2) !important;
  color: #fff !important;
}
body.light-mode .bs-meta { color: rgba(255,255,255,0.4) !important; }
body.light-mode .bs-team-name { color: #fff !important; }
body.light-mode .bs-team-label { color: rgba(255,255,255,0.35) !important; }
body.light-mode .bs-score-center { color: #fff !important; }
body.light-mode .bs-score-divider { color: rgba(255,255,255,0.2) !important; }
body.light-mode .bs-score-win { color: #4ade80 !important; }
body.light-mode .bs-score-loss { color: #f87171 !important; }
body.light-mode .bs-status-final { color: #4ade80 !important; }
body.light-mode .bs-body {
  background: #ffffff !important;
}
body.light-mode .bs-team-section-title {
  color: rgba(0,0,0,0.5) !important;
  border-bottom-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .bs-table-scroll {
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .bs-table thead th {
  color: rgba(0,0,0,0.4) !important;
  background: #f8f9fb !important;
  border-bottom-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .bs-table thead th:first-child {
  background: #f0f1f4 !important;
}
body.light-mode .bs-table thead th:first-child::after {
  background: linear-gradient(90deg, rgba(0,0,0,0.04) 0%, transparent 100%) !important;
}
body.light-mode .bs-table tbody td {
  color: #3f3f46 !important;
  border-bottom-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .bs-table tbody td:first-child {
  color: #18181B !important;
  background: #ffffff !important;
}
body.light-mode .bs-table tbody td:first-child::after {
  background: linear-gradient(90deg, rgba(0,0,0,0.04) 0%, transparent 100%) !important;
}
body.light-mode .bs-table tbody tr:hover {
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .bs-table .bs-jersey {
  color: #d97706 !important;
}
body.light-mode .bs-table .bs-pos {
  color: rgba(0,0,0,0.25) !important;
}
body.light-mode .bs-table .bs-zero {
  color: rgba(0,0,0,0.12) !important;
}
body.light-mode .bs-table tfoot td {
  color: #d97706 !important;
  border-top-color: rgba(217,119,6,0.12) !important;
  background: rgba(217,119,6,0.04) !important;
}
body.light-mode .bs-table tfoot td:first-child {
  color: rgba(0,0,0,0.45) !important;
  background: rgba(217,119,6,0.06) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   TEAM PAGE (team.html) — Light Mode
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ─── CSS Variable Overrides ──────────────────────────────────────────────── */
body.light-mode [style*="--tm-bg"],
body.light-mode .tm-hero {
  --tm-bg: #f0f2f7;
  --tm-card: #ffffff;
  --tm-card-border: rgba(0,0,0,0.08);
  --tm-text: #18181B;
  --tm-muted: rgba(0,0,0,0.4);
  --tm-gold: #d97706;
  --tm-green: #16a34a;
  --tm-red: #dc2626;
  --tm-accent: #DC2626;
}

/* ─── Hero ────────────────────────────────────────────────────────────────── */
body.light-mode .tm-hero {
  background: linear-gradient(135deg, #1e293b 0%, #334155 50%, #475569 100%) !important;
}
body.light-mode .tm-hero-name { color: #fff !important; }
body.light-mode .tm-hero-badge { color: rgba(255,255,255,0.5) !important; }
body.light-mode .tm-hero-stat-val { color: #fff !important; }
body.light-mode .tm-hero-stat-lbl { color: rgba(255,255,255,0.5) !important; }

/* ─── Tabs ────────────────────────────────────────────────────────────────── */
body.light-mode .tm-tabs {
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .tm-tab {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .tm-tab:hover {
  color: rgba(0,0,0,0.7) !important;
  background: rgba(0,0,0,0.03) !important;
}
body.light-mode .tm-tab.active {
  color: #DC2626 !important;
  border-bottom-color: #DC2626 !important;
}

/* ─── Section Titles ──────────────────────────────────────────────────────── */
body.light-mode .tm-section-title {
  color: rgba(0,0,0,0.55) !important;
  border-bottom-color: rgba(0,0,0,0.06) !important;
}

/* ─── Player Cards ────────────────────────────────────────────────────────── */
body.light-mode .tm-player-card {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .tm-player-card:hover {
  background: #f8f9fb !important;
  border-color: rgba(0,0,0,0.12) !important;
}
body.light-mode .tm-player-name {
  color: #18181B !important;
}
body.light-mode .tm-player-pos {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .tm-player-jersey {
  color: #d97706 !important;
}
body.light-mode .tm-player-stat-val {
  color: #18181B !important;
}
body.light-mode .tm-player-stat-lbl {
  color: rgba(0,0,0,0.35) !important;
}

/* ─── Stats Table ─────────────────────────────────────────────────────────── */
body.light-mode .tm-stats-wrap {
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .tm-stats-table {
  background: #ffffff !important;
}
body.light-mode .tm-stats-table thead th {
  background: #f8f9fb !important;
  color: rgba(0,0,0,0.45) !important;
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .tm-stats-table thead th:first-child {
  background: #f0f1f4 !important;
}
body.light-mode .tm-stats-table thead th:first-child::after {
  background: linear-gradient(90deg, rgba(0,0,0,0.04) 0%, transparent 100%) !important;
}
body.light-mode .tm-stats-table tbody td {
  color: #3f3f46 !important;
  border-bottom-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .tm-stats-table tbody td:first-child {
  background: #ffffff !important;
  color: #18181B !important;
}
body.light-mode .tm-stats-table tbody td:first-child::after {
  background: linear-gradient(90deg, rgba(0,0,0,0.04) 0%, transparent 100%) !important;
}
body.light-mode .tm-stats-table tbody tr:hover {
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .tm-stats-table tfoot td {
  color: #d97706 !important;
  border-top-color: rgba(217,119,6,0.12) !important;
  background: rgba(217,119,6,0.04) !important;
}
body.light-mode .tm-stats-table tfoot td:first-child {
  background: rgba(217,119,6,0.06) !important;
}

/* ─── Schedule Table ──────────────────────────────────────────────────────── */
body.light-mode .tm-sched-wrap {
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .tm-sched-table {
  background: #ffffff !important;
}
body.light-mode .tm-sched-table thead th {
  background: #f8f9fb !important;
  color: rgba(0,0,0,0.45) !important;
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .tm-sched-table tbody td {
  color: #3f3f46 !important;
  border-bottom-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .tm-sched-table tbody tr:hover {
  background: rgba(0,0,0,0.02) !important;
}

/* ─── Back Button ─────────────────────────────────────────────────────────── */
body.light-mode .tm-back {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .tm-back:hover {
  color: #DC2626 !important;
}

/* ─── Toggle ──────────────────────────────────────────────────────────────── */
body.light-mode .tm-toggle {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .tm-toggle button {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .tm-toggle button.active {
  background: #DC2626 !important;
  color: #fff !important;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   PLAYERS PAGE (players.html) — Light Mode
   ═══════════════════════════════════════════════════════════════════════════════ */

/* ─── Hero ────────────────────────────────────────────────────────────────── */
body.light-mode .pp-hero {
  background: linear-gradient(135deg, #1e293b 0%, #334155 50%, #475569 100%) !important;
}
body.light-mode .pp-hero h1 { color: #fff !important; }
body.light-mode .pp-hero-sub { color: rgba(255,255,255,0.5) !important; }

/* ─── Player Search ───────────────────────────────────────────────────────── */
body.light-mode .ps-input {
  background: #ffffff !important;
  color: #18181B !important;
  border-color: rgba(0,0,0,0.1) !important;
}
body.light-mode .ps-input::placeholder {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .ps-dropdown {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.1) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.1) !important;
}
body.light-mode .ps-dd-item {
  border-bottom-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .ps-dd-item:hover {
  background: rgba(0,0,0,0.03) !important;
}
body.light-mode .ps-dd-name {
  color: #18181B !important;
}
body.light-mode .ps-dd-sub {
  color: rgba(0,0,0,0.4) !important;
}

/* ─── Player Name & Info ──────────────────────────────────────────────────── */
body.light-mode .pp-name {
  color: #18181B !important;
}
body.light-mode .pp-team-pill {
  background: rgba(0,0,0,0.04) !important;
  color: rgba(0,0,0,0.6) !important;
  border-color: rgba(0,0,0,0.08) !important;
}

/* ─── Tabs ────────────────────────────────────────────────────────────────── */
body.light-mode .pp-tabs {
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .pp-tab {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .pp-tab:hover {
  color: rgba(0,0,0,0.7) !important;
}
body.light-mode .pp-tab.active {
  color: #DC2626 !important;
  border-bottom-color: #DC2626 !important;
}

/* ─── Section Titles ──────────────────────────────────────────────────────── */
body.light-mode .pp-section-title {
  color: rgba(0,0,0,0.55) !important;
  border-bottom-color: rgba(0,0,0,0.06) !important;
}

/* ─── Highlight Cards ─────────────────────────────────────────────────────── */
body.light-mode .pp-highlight {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .pp-highlight-val {
  color: #18181B !important;
}
body.light-mode .pp-highlight-lbl {
  color: rgba(0,0,0,0.45) !important;
}

/* ─── Stats Table ─────────────────────────────────────────────────────────── */
body.light-mode .pp-stats-wrap {
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .pp-stats-table {
  background: #ffffff !important;
}
body.light-mode .pp-stats-table thead th {
  background: #f8f9fb !important;
  color: rgba(0,0,0,0.45) !important;
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .pp-stats-table thead th:first-child {
  background: #f0f1f4 !important;
}
body.light-mode .pp-stats-table tbody td {
  color: #3f3f46 !important;
  border-bottom-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .pp-stats-table tbody td:first-child {
  color: #18181B !important;
  background: #ffffff !important;
}
body.light-mode .pp-stats-table tbody tr:hover {
  background: rgba(0,0,0,0.02) !important;
}

/* ─── Share Button / Toast ────────────────────────────────────────────────── */
body.light-mode .pp-share-btn {
  background: rgba(0,0,0,0.04) !important;
  color: rgba(0,0,0,0.45) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .pp-share-btn:hover {
  background: rgba(0,0,0,0.08) !important;
  color: rgba(0,0,0,0.7) !important;
}
body.light-mode .pp-share-toast {
  background: #18181B !important;
  color: #fff !important;
}

/* ─── Players Box Score Modal ─────────────────────────────────────────────── */
body.light-mode .pp-bs-overlay {
  background: rgba(0,0,0,0.45) !important;
}
body.light-mode .pp-bs-modal {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.1) !important;
}
body.light-mode .pp-bs-header {
  background: linear-gradient(135deg, #1e293b 0%, #334155 50%, #475569 100%) !important;
}
body.light-mode .pp-bs-close {
  background: rgba(255,255,255,0.1) !important;
  color: rgba(255,255,255,0.6) !important;
}
body.light-mode .pp-bs-meta { color: rgba(255,255,255,0.4) !important; }
body.light-mode .pp-bs-team-name { color: #fff !important; }

/* ═══════════════════════════════════════════════════════════════════════════════
   SCHEDULE PAGE (schedule.html) — Additional Light Mode
   ═══════════════════════════════════════════════════════════════════════════════ */

body.light-mode .catalog-title {
  color: #18181B !important;
}
body.light-mode .catalog-topbar {
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .sport-tab {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .sport-tab:hover {
  color: rgba(0,0,0,0.7) !important;
}
body.light-mode .sport-tab.active {
  color: #DC2626 !important;
  border-color: #DC2626 !important;
}
body.light-mode .league-card-title {
  color: #18181B !important;
}
body.light-mode .league-kicker {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .league-card:hover {
  border-color: rgba(0,0,0,0.15) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,0.08) !important;
}
body.light-mode .league-game-count {
  color: #16a34a !important;
}
body.light-mode .league-card-footer {
  border-top-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .league-meta-label {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .league-meta-value {
  color: #18181B !important;
}
body.light-mode .catalog-filter {
  background: #ffffff !important;
  color: #18181B !important;
  border-color: rgba(0,0,0,0.1) !important;
}
body.light-mode .catalog-filter option {
  background: #ffffff !important;
  color: #18181B !important;
}

/* ─── Selected League View ────────────────────────────────────────────────── */
body.light-mode .schedule-back-link {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .schedule-back-link:hover {
  color: #DC2626 !important;
}
body.light-mode .selected-league-header {
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .selected-league-header h2 {
  color: #18181B !important;
}
body.light-mode .selected-league-header .league-meta {
  color: rgba(0,0,0,0.45) !important;
}

/* ─── Game Detail Expand Panel ────────────────────────────────────────────── */
body.light-mode .schedule-item {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .schedule-item:hover {
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .schedule-item.expanded {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.12) !important;
}
body.light-mode .game-detail-inner {
  border-top-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .game-venue-name {
  color: #18181B !important;
}
body.light-mode .game-venue-address {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .game-venue-field {
  color: rgba(0,0,0,0.5) !important;
}

/* ─── Box Score (Schedule Page) ───────────────────────────────────────────── */
body.light-mode .boxscore-section h4 {
  color: #18181B !important;
}
body.light-mode .boxscore-team-header {
  border-bottom-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .boxscore-team-name {
  color: rgba(0,0,0,0.7) !important;
}
body.light-mode .boxscore-table th {
  color: rgba(0,0,0,0.45) !important;
  background: #f8f9fb !important;
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .boxscore-table td {
  color: rgba(0,0,0,0.65) !important;
  border-bottom-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .boxscore-table td:first-child {
  color: rgba(0,0,0,0.8) !important;
}
body.light-mode .boxscore-table tr:hover td {
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .boxscore-loading {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .boxscore-empty {
  color: rgba(0,0,0,0.3) !important;
}

/* ─── Coach Info (Schedule Page) ──────────────────────────────────────────── */
body.light-mode .game-coaches-section {
  border-top-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .game-coaches-title {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .game-coach-info {
  color: rgba(0,0,0,0.65) !important;
}
body.light-mode .game-coach-info .material-symbols-outlined {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .game-coach-team-label {
  color: rgba(0,0,0,0.35) !important;
}

/* Maps Sheet */
body.light-mode .sched-maps-sheet {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.1) !important;
  box-shadow: 0 -8px 32px rgba(0,0,0,0.1) !important;
}
body.light-mode .sched-maps-title {
  color: #18181B !important;
}
body.light-mode .sched-maps-option {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.06) !important;
  color: #18181B !important;
}
body.light-mode .sched-maps-option:hover {
  background: rgba(0,0,0,0.06) !important;
}
body.light-mode .sched-maps-option .maps-desc {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .sched-maps-label small {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .sched-maps-cancel {
  background: rgba(0,0,0,0.04) !important;
  color: rgba(0,0,0,0.5) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   COACH PAGE (coach.html) — Additional Light Mode
   ═══════════════════════════════════════════════════════════════════════════════ */

body.light-mode .coach-form-label {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .coach-form-control {
  background: #ffffff !important;
  color: #18181B !important;
  border-color: rgba(0,0,0,0.1) !important;
}
body.light-mode .coach-form-control option {
  background: #ffffff !important;
  color: #18181B !important;
}
body.light-mode .roster-table th {
  color: rgba(0,0,0,0.45) !important;
  border-bottom-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .roster-table td {
  color: rgba(0,0,0,0.65) !important;
  border-bottom-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .roster-table .player-name {
  color: #18181B !important;
}
body.light-mode .roster-table input,
body.light-mode .roster-table select {
  background: #ffffff !important;
  color: #18181B !important;
  border-color: rgba(0,0,0,0.1) !important;
}
body.light-mode .branding-preview {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .branding-logo-preview {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .parent-contact {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .parent-contact .parent-label {
  color: rgba(0,0,0,0.3) !important;
}
body.light-mode .parent-contact .btn-dm {
  background: rgba(220,38,38,0.06) !important;
  color: #DC2626 !important;
}
body.light-mode .team-selector select {
  background: #ffffff !important;
  color: #18181B !important;
  border-color: rgba(0,0,0,0.1) !important;
}
body.light-mode #travel-coaching-section {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.06) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════════
   CHECKIN PAGE (checkin.html) — Additional Light Mode
   ═══════════════════════════════════════════════════════════════════════════════ */

body.light-mode .checkin-container {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .checkin-header {
  background: linear-gradient(135deg, #1e293b 0%, #334155 50%, #475569 100%) !important;
}
body.light-mode .checkin-header h2 { color: #fff !important; }
body.light-mode .checkin-header p { color: rgba(255,255,255,0.55) !important; }
body.light-mode .checkin-card {
  background: rgba(0,0,0,0.02) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .checkin-card .player-name {
  color: #18181B !important;
}
body.light-mode .checkin-detail {
  color: rgba(0,0,0,0.6) !important;
}
body.light-mode .checkin-detail strong {
  color: #18181B !important;
}
body.light-mode .result-state p {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .loading-state p {
  color: rgba(0,0,0,0.45) !important;
}

/* Inline-styled white text overrides for modals/popups */
body.light-mode [style*="color:#fafafa"],
body.light-mode [style*="color: #fafafa"],
body.light-mode [style*="color:#fff"],
body.light-mode [style*="color: #fff"],
body.light-mode [style*="color:rgba(255,255,255,0."] {
  color: rgba(0,0,0,0.65) !important;
}
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .table td {
  color: rgba(0,0,0,0.6) !important;
  border-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .table tbody tr:hover {
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .table input[type="number"] {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}
body.light-mode .empty-state {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .empty-state-icon {
  background: rgba(0,0,0,0.04) !important;
}
body.light-mode .empty-state-icon .material-symbols-outlined {
  color: rgba(0,0,0,0.2) !important;
}
body.light-mode .upload-zone {
  border-color: rgba(0,0,0,0.1) !important;
  background: rgba(0,0,0,0.015) !important;
}
body.light-mode .upload-zone:hover {
  border-color: rgba(220, 38, 38,0.25) !important;
  background: rgba(220, 38, 38,0.02) !important;
}
body.light-mode .upload-zone .material-symbols-outlined {
  color: rgba(0,0,0,0.2) !important;
}
body.light-mode .scorecard-chip {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .scorecard-chip:hover {
  background: rgba(0,0,0,0.06) !important;
}
body.light-mode .score-team-label {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .score-vs-divider {
  color: rgba(0,0,0,0.2) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   PLAYERS – Search & Dropdown
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .ps-input {
  color: #18181B !important;
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.12) !important;
}
body.light-mode .ps-input::placeholder {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .ps-input:focus {
  background: rgba(0,0,0,0.04) !important;
}
body.light-mode .ps-search-icon {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .ps-clear {
  background: rgba(0,0,0,0.06) !important;
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .ps-clear:hover {
  background: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}
body.light-mode .ps-dropdown {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.1) !important;
  box-shadow: 0 12px 48px rgba(0,0,0,0.12) !important;
}
body.light-mode .ps-dd-item {
  border-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .ps-dd-item:hover,
body.light-mode .ps-dd-item.ps-active {
  background: rgba(220, 38, 38,0.06) !important;
}
body.light-mode .ps-dd-name {
  color: #18181B !important;
}
body.light-mode .ps-dd-sub {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .ps-dd-empty {
  color: rgba(0,0,0,0.35) !important;
}
body.light-mode .ps-dd-hint {
  color: rgba(0,0,0,0.25) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   PLAYERS – Player Profile
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .pp-hero {
  background: linear-gradient(135deg, #e8eaf0 0%, #d0d5e0 40%, #c2c8d8 100%) !important;
}
body.light-mode .pp-name {
  color: #18181B !important;
}
body.light-mode .pp-team-pill {
  background: rgba(0,0,0,0.06) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}
body.light-mode .pp-team-pill .pp-pos {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .pp-hero-highlight {
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .pp-highlight-lbl {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .pp-tabs {
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .pp-tab {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .pp-tab:hover {
  color: rgba(0,0,0,0.7) !important;
}
body.light-mode .pp-tab.active {
  color: #18181B !important;
}
body.light-mode .pp-section-title {
  color: rgba(0,0,0,0.55) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .pp-stats-table thead th {
  color: rgba(0,0,0,0.45) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .pp-stats-table tbody td {
  color: #18181B !important;
  border-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .pp-stats-table tbody td:first-child {
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .pp-stats-table tfoot td {
  border-color: rgba(255,179,71,0.15) !important;
  background: rgba(255,179,71,0.06) !important;
}
body.light-mode .pp-stats-table tfoot td:first-child {
  color: rgba(0,0,0,0.55) !important;
}
body.light-mode .pp-gamelog-scroll {
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .pp-gamelog-table thead th {
  color: rgba(0,0,0,0.45) !important;
  border-color: rgba(0,0,0,0.08) !important;
  background: #f8f9fc !important;
}
body.light-mode .pp-gamelog-table tbody td {
  color: #18181B !important;
  border-color: rgba(0,0,0,0.04) !important;
}
body.light-mode .pp-gamelog-table tbody td:first-child {
  color: rgba(0,0,0,0.45) !important;
}
body.light-mode .pp-gamelog-table tbody tr:hover {
  background: rgba(0,0,0,0.02) !important;
}
body.light-mode .pp-gamelog-table tbody tr.clickable-row:hover {
  background: rgba(220, 38, 38,0.04) !important;
}
body.light-mode .pp-gamelog-table tbody tr.clickable-row td:first-child::before {
  background: rgba(0,0,0,0.2) !important;
}
body.light-mode .pp-share-btn {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: rgba(0,0,0,0.6) !important;
}
body.light-mode .pp-share-btn:hover {
  background: rgba(220, 38, 38,0.08) !important;
  border-color: rgba(220, 38, 38,0.25) !important;
  color: #18181B !important;
}
body.light-mode .pp-share-toast {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.15) !important;
}

/* Box Score Modal */
body.light-mode .bs-modal {
  background: linear-gradient(145deg, #ffffff 0%, #f8f9fc 100%) !important;
  border-color: rgba(0,0,0,0.1) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.15) !important;
}
body.light-mode .bs-header {
  background: linear-gradient(135deg, #e8eaf0 0%, #d0d5e0 50%, #c2c8d8 100%) !important;
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .bs-close {
  background: rgba(0,0,0,0.06) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: rgba(0,0,0,0.5) !important;
}
body.light-mode .bs-close:hover {
  background: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}
body.light-mode .bs-meta {
  color: rgba(0,0,0,0.4) !important;
}
body.light-mode .bs-team-name {
  color: #18181B !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   STORE – Cart Sidebar & Variants
   ═══════════════════════════════════════════════════════════════════════════ */
body.light-mode .cart-sidebar {
  background: #ffffff !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .cart-header {
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .cart-item {
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .cart-footer {
  border-color: rgba(0,0,0,0.06) !important;
}
body.light-mode .store-card {
  background: rgba(255,255,255,0.95) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .order-card {
  background: rgba(255,255,255,0.95) !important;
  border-color: rgba(0,0,0,0.08) !important;
}
body.light-mode .qty-btn {
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}
body.light-mode .variant-option {
  border-color: rgba(0,0,0,0.1) !important;
  color: #18181B !important;
}

/* ─── Transition for theme switch ───────────────────────────────────────── */
/* ─── My Teams (tc-*) ───────────────────────────────────────────────────── */
body.light-mode .tc {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
}
body.light-mode .tc-header {
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}
body.light-mode .tc-name {
  color: #18181B !important;
}
body.light-mode .tc-tag {
  color: rgba(0, 0, 0, 0.45) !important;
  background: rgba(0, 0, 0, 0.05) !important;
}
body.light-mode .tc-label {
  color: rgba(0, 0, 0, 0.35) !important;
}
body.light-mode .tc-coach-name {
  color: #18181B !important;
}
body.light-mode .tc-coach-link {
  color: #DC2626 !important;
}
body.light-mode .tc-coach-link:hover {
  color: #a81d32 !important;
}
body.light-mode .tc-topbar {
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}
body.light-mode .tc-count {
  color: rgba(0, 0, 0, 0.4) !important;
  background: rgba(0, 0, 0, 0.05) !important;
}
body.light-mode .tc-roster-row {
  border-bottom-color: rgba(0, 0, 0, 0.04) !important;
}
body.light-mode .tc-roster-row:nth-child(odd) {
  background: rgba(0, 0, 0, 0.02) !important;
}
body.light-mode .tc-roster-name {
  color: rgba(0, 0, 0, 0.7) !important;
}
body.light-mode .tc-roster-num {
  color: rgba(0, 0, 0, 0.3) !important;
}
body.light-mode .tc-game-row {
  border-bottom-color: rgba(0, 0, 0, 0.04) !important;
  color: rgba(0, 0, 0, 0.6) !important;
}
body.light-mode .tc-game-date {
  color: rgba(0, 0, 0, 0.4) !important;
}
body.light-mode .tc-game-detail {
  color: rgba(0, 0, 0, 0.7) !important;
}
body.light-mode .tc-game-venue {
  color: rgba(0, 0, 0, 0.35) !important;
}
body.light-mode .tc-empty {
  color: rgba(0, 0, 0, 0.3) !important;
}
body.light-mode .tc-view-all {
  color: #DC2626 !important;
}
body.light-mode .tc-practice-chip {
  color: #16a34a !important;
  background: rgba(34, 197, 94, 0.08) !important;
}
body.light-mode .tc-practice-day-badge {
  color: #16a34a !important;
  background: rgba(34, 197, 94, 0.08) !important;
}
body.light-mode .tc-practice-row {
  border-bottom-color: rgba(0, 0, 0, 0.04) !important;
  color: rgba(0, 0, 0, 0.6) !important;
}
body.light-mode .tc-practice-date {
  color: rgba(0, 0, 0, 0.4) !important;
}
body.light-mode .tc-practice-info {
  color: rgba(0, 0, 0, 0.55) !important;
}
body.light-mode .tc-practice-note {
  color: rgba(0, 0, 0, 0.35) !important;
}
body.light-mode .tc-manage-btn {
  color: #fff !important;
}

body.theme-transitioning,
body.theme-transitioning *,
body.theme-transitioning *::before,
body.theme-transitioning *::after {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease,
              box-shadow 0.3s ease, background 0.3s ease !important;
}