/* Theme surfaces share the same layout and untouched Bharat Esports Hub artwork. */
:root { color-scheme: light; }

.nav-actions { display: flex; align-items: center; flex: 0 0 auto; gap: 12px; }
.theme-toggle {
  position: fixed;
  z-index: 70;
  right: calc(16px + env(safe-area-inset-right, 0px));
  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: var(--ink);
  background: transparent;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color .25s ease, opacity .2s ease, visibility .2s ease;
}
.theme-toggle::before {
  content: "";
  position: absolute;
  inset: 3px;
  border: 1px solid var(--line);
  border-radius: inherit;
  background: var(--paper);
  box-shadow: 0 3px 12px rgba(12,20,36,.14), 0 1px 2px rgba(12,20,36,.06);
  transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.theme-toggle::after {
  content: attr(data-tooltip);
  position: absolute;
  right: 0;
  bottom: calc(100% + 7px);
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: var(--ink);
  background: var(--paper);
  box-shadow: 0 3px 12px rgba(12,20,36,.1);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transform: translateY(3px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.theme-toggle > span { position: relative; display: grid; place-items: center; }
.theme-toggle .beh-icon { width: 18px; height: 18px; stroke-width: 1.75; transition: transform .5s var(--ease); }
.theme-toggle:focus-visible { outline-offset: 4px; }
.theme-toggle:focus-visible::after { opacity: 1; visibility: visible; transform: none; }
.theme-toggle[data-current-theme="dark"]::before { border-color: #455263; }
.menu-open .theme-toggle,
.reading .theme-toggle { opacity: 0; visibility: hidden; pointer-events: none; }

body,
.site-header,
.site-footer,
.trust-strip,
.section.tinted,
.section.dark,
.tab-bar,
.reader-dialog,
.reader-close,
.field input,
.field select,
.field textarea {
  transition: color .25s ease, background-color .25s ease, border-color .25s ease, box-shadow .25s ease;
}

[data-theme="dark"] {
  color-scheme: dark;
  --ink: #eef3fa;
  --muted: #a9b5c5;
  --orange: #ff9c55;
  --saffron: #ff8a2b;
  --orange-soft: #2c2018;
  --green: #6bdda1;
  --green-soft: #142c24;
  --line: #2b3745;
  --paper: #090e14;
  --wash: #101720;
  --shadow: 0 22px 60px rgba(0,0,0,.3);
}

[data-theme="dark"] ::selection { color: #0c1424; background: #ffb877; }
[data-theme="dark"] :focus-visible { outline-color: #6bdda1; }
[data-theme="dark"] .skip-link { color: #0c1424; background: #ffb46f; }

[data-theme="dark"] .site-header {
  background: rgba(9,14,20,.94);
  border-bottom-color: #26313e;
}
[data-theme="dark"] .brand .brand-logo-light { display: none; }
[data-theme="dark"] .brand .brand-logo-dark { display: block; }
[data-theme="dark"] .nav-links a.active { color: #ffaf72; }
[data-theme="dark"] .theme-toggle { color: #ffb16e; }
[data-theme="dark"] .theme-toggle::before { background: #17212d; box-shadow: 0 4px 15px rgba(0,0,0,.35); }
[data-theme="dark"] .menu-backdrop { background: rgba(0,0,0,.65); }

[data-theme="dark"] .hero { --hero-image: var(--hero-dark); --hero-image-png: var(--hero-dark-png); }
[data-theme="dark"] .hero::after {
  background: linear-gradient(90deg, #090e14 0%, rgba(9,14,20,.6) 29%, rgba(9,14,20,0) 61%);
}
[data-theme="dark"] .hero-copy > p { color: #bdc7d4; }
[data-theme="dark"] .accent { color: #ff9c55; }
[data-theme="dark"] .accent-green { color: #6bdda1; }
[data-theme="dark"] .hero-note { color: #abb8c8; }
[data-theme="dark"] .pulse { box-shadow: 0 0 0 5px rgba(107,221,161,.13); }

[data-theme="dark"] .button,
[data-theme="dark"] .nav-cta,
[data-theme="dark"] .nav-links .mobile-partner {
  color: #111820;
  background: #ff8a2b;
}
[data-theme="dark"] .button.secondary {
  color: #eef3fa;
  border-color: #516071;
  background: rgba(20,30,42,.88);
}
[data-theme="dark"] .button.green { color: #0a1a12; background: #6bdda1; }
[data-theme="dark"] .button.secondary:hover { border-color: #b2becd; }

[data-theme="dark"] .trust-strip { background: #0d141d; }
[data-theme="dark"] .section.dark { color: #eef3fa; background: #111b27; }
[data-theme="dark"] .section.dark .section-head p,
[data-theme="dark"] .section.dark .lead { color: #afbdcd; }
[data-theme="dark"] .purpose-card,
[data-theme="dark"] .content-card,
[data-theme="dark"] .contact-form { background: #141e2a; }
[data-theme="dark"] .purpose-card:nth-child(even) .icon-box { border-color: #244839; }
[data-theme="dark"] .icon-box { border-color: #53341e; }
[data-theme="dark"] .feature-image { background: #172330; }
[data-theme="dark"] .card-media { background: #172330; }
[data-theme="dark"] .card-media .tag { color: #eef3fa; background: rgba(9,14,20,.9); }
[data-theme="dark"] .meta { color: #a9b5c5; }
[data-theme="dark"] .tab-bar { background: #111b27; }
[data-theme="dark"] .tab.active { color: #0c1424; background: #ffad6c; }
[data-theme="dark"] .logo-wall { border-color: #344151; }
[data-theme="dark"] .logo-wall span { color: #dbe5f1; border-color: #344151; }
[data-theme="dark"] .timeline article::before { background: #101720; }
[data-theme="dark"] .quote-panel { color: #eef3fa; background: #172331; }
[data-theme="dark"] .quote-copy p { color: #b0bdcd; }
[data-theme="dark"] .quote-mark { color: #111820; background: linear-gradient(145deg, #ff8a2b, #ffc079); }

[data-theme="dark"] .field label { color: #c4cfdd; }
[data-theme="dark"] .field input,
[data-theme="dark"] .field select,
[data-theme="dark"] .field textarea {
  color: #eef3fa;
  border-color: #475565;
  background: #0c141e;
}
[data-theme="dark"] .field input::placeholder,
[data-theme="dark"] .field textarea::placeholder { color: #929fb1; opacity: 1; }
[data-theme="dark"] .field select option { color: #eef3fa; background: #101a26; }
[data-theme="dark"] .field input:focus,
[data-theme="dark"] .field select:focus,
[data-theme="dark"] .field textarea:focus {
  border-color: #ffad6c;
  box-shadow: 0 0 0 4px rgba(255,156,85,.13);
}
[data-theme="dark"] .email-draft { border-color: #385e4a; background: #142c24; }
[data-theme="dark"] .reader-dialog { color: #eef3fa; background: #111b27; }
[data-theme="dark"] .reader-close { color: #eef3fa; background: #1c2a39; }
[data-theme="dark"] .reader-content .reader-intro { color: #c5d0df; }
[data-theme="dark"] .reader-dialog::backdrop { background: rgba(0,0,0,.72); }

[data-theme="dark"] .cta-band { color: #111820; background: linear-gradient(110deg, #ff8a2b, #ffb46f); }
[data-theme="dark"] .cta-band .button { color: #111820; background: #fff6eb; }
[data-theme="dark"] .site-footer { color: #c7d1de; background: #070b10; }
[data-theme="dark"] .footer-brand p { color: #aab6c6; }
[data-theme="dark"] .footer-col a { color: #b8c5d6; }
[data-theme="dark"] .footer-bottom { color: #aab7c7; border-color: #273341; }
[data-theme="dark"] .socials a { border-color: #45576b; }

@media (max-width: 1200px) {
  .nav-actions { gap: 10px; }
  [data-theme="dark"] .nav-links { background: #101923; box-shadow: 0 25px 40px rgba(0,0,0,.3); }
}

@media (max-width: 720px) {
  .nav-actions { gap: 5px; }
}

@media (hover: hover) and (pointer: fine) {
  .theme-toggle:hover { color: var(--orange); }
  .theme-toggle:hover::before { border-color: var(--orange); box-shadow: 0 4px 16px rgba(12,20,36,.16), 0 0 0 3px var(--orange-soft); }
  .theme-toggle:hover::after { opacity: 1; visibility: visible; transform: none; }
  .theme-toggle:hover .beh-icon { transform: rotate(18deg); }
  [data-theme="dark"] a.purpose-card:hover { border-color: #a06135; }
  [data-theme="dark"] .button:hover,
  [data-theme="dark"] .nav-cta:hover { box-shadow: 0 9px 26px rgba(255,138,43,.15); }
  [data-theme="dark"] .button.secondary:hover { box-shadow: none; }
  [data-theme="dark"] .socials a:hover { color: #fff; background: #213449; }
}

@media (prefers-reduced-motion: reduce) {
  .theme-toggle,
  .theme-toggle::before,
  .theme-toggle::after,
  .theme-toggle .beh-icon,
  body,
  .site-header,
  .site-footer,
  .trust-strip,
  .section.tinted,
  .section.dark,
  .tab-bar,
  .reader-dialog,
  .reader-close,
  .field input,
  .field select,
  .field textarea { transition: none; }
}
