/* Zentracode — light theme (global overrides) */

[data-theme="light"] {
  color-scheme: light;
  --site-bg: #ffffff;
  --site-bg-frost: rgba(255, 255, 255, 0.96);
  --site-surface-top: #ffffff;
  --site-surface-bottom: #f8fafc;
  --site-surface: #ffffff;
  --site-surface-gradient: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.98) 0%,
    rgba(248, 250, 252, 0.98) 100%
  );
  --site-raised: #f1f5f9;
  --site-raised-gradient: linear-gradient(
    180deg,
    rgba(248, 250, 252, 0.98) 0%,
    rgba(241, 245, 249, 0.98) 100%
  );
  --site-elevated: #e2e8f0;
  --site-elevated-gradient: linear-gradient(
    180deg,
    rgba(241, 245, 249, 0.98) 0%,
    rgba(226, 232, 240, 0.98) 100%
  );
  --site-deep: #e2e8f0;
  --site-panel-gradient: linear-gradient(
    165deg,
    rgba(255, 255, 255, 0.98) 0%,
    rgba(248, 250, 252, 0.98) 55%,
    rgba(238, 243, 250, 0.98) 100%
  );
  --site-shell-gradient: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  --site-border: rgba(15, 23, 42, 0.1);
  --site-border-soft: rgba(15, 23, 42, 0.06);
  --site-text: #0f172a;
  --site-text-muted: #475569;
  --site-text-soft: #64748b;
  --site-accent: #4096ff;
  --site-accent-hover: #69b1ff;
  --site-accent-active: #1677ff;
  --site-accent-bright: #91caff;
  --site-accent-muted: #1677ff;
  --site-accent-deep: #0958d8;
  --site-accent-red: #4096ff;
  --site-accent-red-hover: #69b1ff;
  --site-accent-red-active: #1677ff;
  --site-accent-red-bright: #91caff;
  --site-accent-red-deep: #0958d8;
}

[data-theme="light"] .k-site {
  color: var(--site-text);
}

[data-theme="light"] .site-layout,
[data-theme="light"] .site-main,
[data-theme="light"] .k-page,
[data-theme="light"] .k-page-outlet,
[data-theme="light"] #page-outlet {
  color: var(--site-text);
}

/* —— Tailwind text utilities —— */
[data-theme="light"] .text-white {
  color: var(--site-text) !important;
}
[data-theme="light"] .text-slate-100 {
  color: #1e293b !important;
}
[data-theme="light"] .text-slate-200,
[data-theme="light"] .text-slate-300 {
  color: #334155 !important;
}
[data-theme="light"] .text-slate-400,
[data-theme="light"] .text-slate-500,
[data-theme="light"] .text-slate-600 {
  color: var(--site-text-soft) !important;
}
[data-theme="light"] .text-zinc-100,
[data-theme="light"] .text-zinc-200,
[data-theme="light"] .text-zinc-300 {
  color: var(--site-text) !important;
}
[data-theme="light"] .text-gray-100,
[data-theme="light"] .text-gray-200,
[data-theme="light"] .text-gray-300 {
  color: #334155 !important;
}
[data-theme="light"] .text-gray-400,
[data-theme="light"] .text-gray-500 {
  color: var(--site-text-soft) !important;
}
[data-theme="light"] .text-sky-50,
[data-theme="light"] .text-sky-100 {
  color: #0369a1 !important;
}
[data-theme="light"] .text-sky-200,
[data-theme="light"] .text-sky-200\/95 {
  color: #0284c7 !important;
}
[data-theme="light"] .text-accent {
  color: #1677ff !important;
}
[data-theme="light"] .text-accent-bright,
[data-theme="light"] .text-accent-bright\/90,
[data-theme="light"] .text-accent-bright\/55 {
  color: #0958d8 !important;
}
[data-theme="light"] .text-accent\/90 {
  color: #1677ff !important;
}
[data-theme="light"] .text-white\/15,
[data-theme="light"] .text-white\/20 {
  color: rgba(15, 23, 42, 0.2) !important;
}
[data-theme="light"] .text-amber-100,
[data-theme="light"] .text-amber-200,
[data-theme="light"] .text-cyan-200,
[data-theme="light"] .text-emerald-200,
[data-theme="light"] .text-emerald-300,
[data-theme="light"] .text-fuchsia-100,
[data-theme="light"] .text-fuchsia-200,
[data-theme="light"] .text-indigo-200,
[data-theme="light"] .text-violet-200,
[data-theme="light"] .text-violet-400,
[data-theme="light"] .text-rose-200,
[data-theme="light"] .text-rose-300 {
  color: var(--site-text-muted) !important;
}
[data-theme="light"] .text-\[\#e8f2fc\] {
  color: #003eb3 !important;
}
[data-theme="light"] .text-\[\#69b1ff\] {
  color: #1677ff !important;
}
[data-theme="light"] .text-\[\#91caff\] {
  color: #0958d8 !important;
}
[data-theme="light"] .text-\[\#003eb3\] {
  color: #003eb3 !important;
}
[data-theme="light"] .hover\:text-white:hover,
[data-theme="light"] .group:hover .group-hover\:text-white,
[data-theme="light"] .group:hover .group-hover\:text-slate-300 {
  color: var(--site-text) !important;
}
[data-theme="light"] .hover\:text-slate-300:hover,
[data-theme="light"] .hover\:text-slate-400:hover,
[data-theme="light"] .hover\:text-accent:hover,
[data-theme="light"] .hover\:text-accent-bright:hover {
  color: #334155 !important;
}

/* Keep light text on accent gradient badges (primary buttons → site-buttons.css) */
[data-theme="light"] .from-accent\/95.text-white,
[data-theme="light"] .from-accent\/95.text-white svg,
[data-theme="light"] .bg-gradient-to-br.from-accent\/95.text-white,
[data-theme="light"] .bg-gradient-to-br.from-accent\/95.text-white svg,
[data-theme="light"] .sponsor-card-badge,
[data-theme="light"] .leaderboard-podium__badge--gold,
[data-theme="light"] .leaderboard-podium__badge--bronze {
  color: #f8fafc !important;
}
[data-theme="light"] .leaderboard-podium__badge--silver {
  color: #1e293b !important;
}
[data-theme="light"] .text-\[\#1a1410\] {
  color: #0f172a !important;
}

/* Semantic status colors (readable on light bg) */
[data-theme="light"] .text-red-50,
[data-theme="light"] .text-red-100 {
  color: #cc1818 !important;
}
[data-theme="light"] .text-red-200 {
  color: #e01a1a !important;
}
[data-theme="light"] .text-emerald-400,
[data-theme="light"] .text-green-400 {
  color: #047857 !important;
}
[data-theme="light"] .text-amber-400 {
  color: #b45309 !important;
}

/* —— Dark hex backgrounds → light surfaces —— */
[data-theme="light"] .bg-\[\#181f2e\],
[data-theme="light"] .bg-\[\#181f2e\]\/82 {
  background-color: var(--site-bg) !important;
}
[data-theme="light"] .bg-\[\#181f2e\]\/75 {
  background-color: rgba(15, 23, 42, 0.35) !important;
}
[data-theme="light"] .bg-\[\#181f2e\]\/96,
[data-theme="light"] .site-header.bg-\[\#181f2e\]\/96 {
  background-color: var(--site-bg-frost) !important;
}
[data-theme="light"] .bg-\[\#1e2739\],
[data-theme="light"] .bg-\[\#1e2739\]\/95 {
  background-color: var(--site-surface) !important;
}
[data-theme="light"] .bg-\[\#252f44\],
[data-theme="light"] .bg-\[\#1e2532\],
[data-theme="light"] .bg-\[\#1e2a3d\] {
  background-color: var(--site-raised) !important;
}
[data-theme="light"] .bg-\[\#2c374f\] {
  background-color: var(--site-elevated) !important;
}
[data-theme="light"] .bg-\[\#2e3544\],
[data-theme="light"] .bg-\[\#2a3a52\] {
  background-color: #e2e8f0 !important;
}
[data-theme="light"] .bg-\[\#141a28\],
[data-theme="light"] .bg-\[\#0a0f16\],
[data-theme="light"] .bg-\[\#0c121c\],
[data-theme="light"] .bg-\[\#0d1117\] {
  background-color: var(--site-deep) !important;
}
[data-theme="light"] .bg-\[\#161b22\],
[data-theme="light"] .bg-\[\#131820\],
[data-theme="light"] .bg-\[\#1c2128\],
[data-theme="light"] .bg-\[\#151518\] {
  background-color: var(--site-raised) !important;
}
[data-theme="light"] .hover\:bg-\[\#252f44\]:hover,
[data-theme="light"] .hover\:bg-\[\#2c374f\]:hover {
  background-color: var(--site-raised) !important;
}
[data-theme="light"] .group-hover\:bg-\[\#2c374f\]:is(:where(.group):hover *) {
  background-color: var(--site-elevated) !important;
}

[data-theme="light"] .bg-brand,
[data-theme="light"] .bg-brand-50,
[data-theme="light"] .bg-brand-50\/40,
[data-theme="light"] .bg-brand-50\/50 {
  background-color: var(--site-surface) !important;
}
[data-theme="light"] .bg-black\/40,
[data-theme="light"] .bg-black\/50,
[data-theme="light"] .bg-black\/70 {
  background-color: rgba(15, 23, 42, 0.06) !important;
}
[data-theme="light"] .bg-white\/\[0\.03\],
[data-theme="light"] .bg-white\/\[0\.04\],
[data-theme="light"] .bg-white\/\[0\.05\],
[data-theme="light"] .bg-white\/\[0\.06\] {
  background-color: rgba(22, 119, 255, 0.06) !important;
}
[data-theme="light"] .hover\:bg-white\/\[0\.06\]:hover,
[data-theme="light"] .hover\:bg-white\/\[0\.09\]:hover {
  background-color: rgba(22, 119, 255, 0.1) !important;
}
[data-theme="light"] .bg-red-950\/20,
[data-theme="light"] .bg-red-950\/25 {
  background-color: rgba(254, 226, 226, 0.85) !important;
}
[data-theme="light"] .bg-sky-950\/95 {
  background-color: rgba(224, 242, 254, 0.95) !important;
}
[data-theme="light"] .bg-accent\/10,
[data-theme="light"] .bg-accent\/20,
[data-theme="light"] .hover\:bg-accent\/25:hover {
  background-color: rgba(22, 119, 255, 0.12) !important;
}
[data-theme="light"] .from-sky-500\/\[0\.15\] {
  --tw-gradient-from: rgba(56, 189, 248, 0.12) var(--tw-gradient-from-position) !important;
}
[data-theme="light"] .to-sky-600\/\[0\.08\] {
  --tw-gradient-to: rgba(14, 165, 233, 0.08) var(--tw-gradient-to-position) !important;
}

/* Gradient stops (marquee fades, game cards) */
[data-theme="light"] .from-\[\#1e2739\] {
  --tw-gradient-from: var(--site-surface) var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
[data-theme="light"] .via-\[\#1e2739\],
[data-theme="light"] .to-\[\#1e2739\] {
  --tw-gradient-to: var(--site-surface) var(--tw-gradient-to-position) !important;
}
[data-theme="light"] .from-\[\#181f2e\],
[data-theme="light"] .to-\[\#181f2e\] {
  --tw-gradient-from: var(--site-bg) var(--tw-gradient-from-position) !important;
  --tw-gradient-to: var(--site-bg) var(--tw-gradient-to-position) !important;
}
[data-theme="light"] .via-\[rgba\(15\,24\,40\,0\.25\)\] {
  --tw-gradient-via: rgba(238, 243, 250, 0.5) var(--tw-gradient-via-position) !important;
}
[data-theme="light"] .to-\[\#181f2e\]\/96 {
  --tw-gradient-to: var(--site-bg-frost) var(--tw-gradient-to-position) !important;
}

/* Borders & rings */
[data-theme="light"] .border-\[rgba\(56\,89\,130\,0\.12\)\],
[data-theme="light"] .border-\[rgba\(56\,89\,130\,0\.14\)\],
[data-theme="light"] .border-\[rgba\(56\,89\,130\,0\.2\)\],
[data-theme="light"] .border-\[rgba\(56\,89\,130\,0\.22\)\],
[data-theme="light"] .border-\[rgba\(56\,89\,130\,0\.24\)\],
[data-theme="light"] .border-\[rgba\(56\,89\,130\,0\.28\)\],
[data-theme="light"] .border-white\/10,
[data-theme="light"] .border-white\/\[0\.06\],
[data-theme="light"] .border-white\/\[0\.07\],
[data-theme="light"] .border-white\/\[0\.08\] {
  border-color: var(--site-border-soft) !important;
}
[data-theme="light"] .ring-white\/\[0\.04\],
[data-theme="light"] .ring-white\/\[0\.05\],
[data-theme="light"] .ring-white\/\[0\.06\],
[data-theme="light"] .ring-black\/30,
[data-theme="light"] .ring-black\/50 {
  --tw-ring-color: rgba(22, 119, 255, 0.12) !important;
}
[data-theme="light"] .ring-white\/15 {
  --tw-ring-color: rgba(22, 119, 255, 0.2) !important;
}

/* Shell */
[data-theme="light"] .site-header,
[data-theme="light"] .k-header.site-header {
  background: var(--site-bg-frost) !important;
  border-bottom-color: var(--site-border-soft) !important;
  box-shadow: 0 1px 0 rgba(22, 119, 255, 0.08), 0 8px 24px -12px rgba(15, 23, 42, 0.1) !important;
}
[data-theme="light"] #sidebar.site-sidebar,
[data-theme="light"] .site-sidebar {
  background: var(--site-surface) !important;
  border-right-color: var(--site-border-soft) !important;
  box-shadow: 0 12px 40px -16px rgba(15, 23, 42, 0.1) !important;
}
[data-theme="light"] .site-sidebar__backdrop,
[data-theme="light"] #sidebar-backdrop.site-sidebar__backdrop {
  background: rgba(15, 23, 42, 0.35) !important;
}
[data-theme="light"] .site-bottom-nav,
[data-theme="light"] .k-bottom-nav.site-bottom-nav {
  background: var(--site-bg-frost) !important;
  border-top-color: var(--site-border-soft) !important;
}
[data-theme="light"] .site-footer,
[data-theme="light"] .k-footer.site-footer {
  background: linear-gradient(180deg, var(--site-surface) 0%, var(--site-bg) 100%) !important;
}
[data-theme="light"] .shadow-panel {
  box-shadow: 0 12px 40px -16px rgba(15, 23, 42, 0.12) !important;
}

/* Sidebar nav active */
[data-theme="light"] .sidebar-link.text-white,
[data-theme="light"] a.sidebar-link.border-l-\[\#4096ff\] {
  color: #0f172a !important;
}
[data-theme="light"] .nav-icon-wrap.bg-\[\#4096ff\]\/20 {
  background-color: rgba(22, 119, 255, 0.14) !important;
  color: #4096ff !important;
}

/* Theme toggle icons */
[data-theme="light"] .site-theme-toggle__icon--light {
  display: block;
}
[data-theme="light"] .site-theme-toggle__icon--dark {
  display: none;
}
.site-theme-toggle__icon--light {
  display: none;
}

/* Modals & overlays */
[data-theme="light"] .auth-modal-backdrop,
[data-theme="light"] .k-modal--backdrop {
  background: rgba(15, 23, 42, 0.35) !important;
}
[data-theme="light"] .auth-modal-panel,
[data-theme="light"] .k-modal__panel {
  background: var(--site-surface) !important;
  border-color: var(--site-border-soft) !important;
}

/* Panels (shared class patterns in JS) */
[data-theme="light"] .home-recent-winners,
[data-theme="light"] .home-quick-actions,
[data-theme="light"] .home-logo-marquee,
[data-theme="light"] .sponsor-card,
[data-theme="light"] .home-social-mobile-strip__box {
  background: var(--site-surface) !important;
  border-color: var(--site-border-soft) !important;
}
[data-theme="light"] .home-winner-marquee-chip {
  background: var(--site-raised) !important;
  border-color: var(--site-border-soft) !important;
}

/* Sponsor cards — logos & promo text (white assets for dark UI) */
[data-theme="light"] .sponsor-card .sponsor-card-logo {
  filter: brightness(0) saturate(100%) drop-shadow(0 2px 10px rgba(15, 23, 42, 0.12));
  opacity: 0.88 !important;
}
[data-theme="light"] .sponsor-card:hover .sponsor-card-logo {
  opacity: 0.96 !important;
}
[data-theme="light"] .sponsor-card .sponsor-card-head .text-slate-100,
[data-theme="light"] .sponsor-card .sponsor-logo-fallback {
  color: #0f172a !important;
}
[data-theme="light"] .sponsor-card .sponsor-card-link .text-white {
  color: #0f172a !important;
}
[data-theme="light"] .sponsor-card .text-slate-400\/95 {
  color: #475569 !important;
}
[data-theme="light"] .sponsor-card .sponsor-card-badge {
  color: #ffffff !important;
}

[data-theme="light"] .route-loading__spinner {
  border-color: rgba(22, 119, 255, 0.15) !important;
  border-top-color: var(--site-accent) !important;
}
[data-theme="light"] .skeleton-shimmer {
  background: linear-gradient(
    90deg,
    rgba(22, 119, 255, 0.06) 25%,
    rgba(22, 119, 255, 0.12) 50%,
    rgba(22, 119, 255, 0.06) 75%
  ) !important;
  background-size: 200% 100% !important;
}