/* Grid Lounge — Daylight Paddock
   Native light-first theme layer. This file intentionally follows the legacy
   stylesheet while templates are migrated from historical utility class names. */

:root {
  color-scheme: light;
  --canvas: #f6f3ed;
  --canvas-alt: #ede9e1;
  --surface: #fff;
  --surface-raised: #fffdfa;
  --ink: #10233f;
  --ink-soft: #526174;
  --ink-faint: #738094;
  --line: #d7d3ca;
  --line-strong: #b9c1ca;
  --navy: #0f3d7a;
  --blue: #147fd1;
  --orange: #e8472a;
  --orange-bright: #ff5e40;
  --violet: #5d3a8a;
  --night: #07101f;
  --shadow-sm: 0 8px 24px rgba(16, 35, 63, 0.08);
  --shadow-lg: 0 24px 70px rgba(16, 35, 63, 0.14);
}

html { background: var(--canvas); overflow-x: hidden; }

body {
  color: var(--ink);
  background:
    linear-gradient(90deg, rgba(15, 61, 122, 0.035) 1px, transparent 1px) 50% 0 / 80px 80px,
    var(--canvas);
  overflow-x: hidden;
}

main, main > section, main > div { min-width: 0; max-width: 100%; }
img, video, svg { max-width: 100%; }
p, h1, h2, h3, h4 { overflow-wrap: break-word; }

::selection { color: #fff; background: var(--navy); }

:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid rgba(20, 127, 209, 0.5);
  outline-offset: 3px;
}

/* Light canvas and alternating surfaces */
[class~="bg-[#07101f]"],
[class~="bg-[#060e1a]"],
[class~="bg-[#060e1c]"] { background-color: var(--canvas) !important; }

[class~="bg-[#0d1b2e]"],
[class~="bg-[#0d1e30]"] { background-color: var(--surface-raised) !important; }

section:nth-of-type(even)[class~="bg-[#07101f]"],
section:nth-of-type(even)[class~="bg-[#060e1a]"],
section:nth-of-type(even)[class~="bg-[#060e1c]"] { background-color: var(--canvas-alt) !important; }

/* Native light type hierarchy */
[class~="text-white"], [class~="text-white/90"], [class~="text-white/80"] { color: var(--ink) !important; }
[class~="text-white/75"], [class~="text-white/70"], [class~="text-white/65"], [class~="text-white/60"] { color: var(--ink-soft) !important; }
[class~="text-white/55"], [class~="text-white/50"], [class~="text-white/45"], [class~="text-white/40"],
[class~="text-white/35"], [class~="text-white/30"], [class~="text-white/25"], [class~="text-white/20"] { color: var(--ink-faint) !important; }

[class~="text-[#FF5E40]"] { color: var(--orange) !important; }
[class~="bg-[#FF5E40]"] { background-color: var(--orange) !important; }
[class~="border-[#FF5E40]"] { border-color: var(--orange) !important; }

/* Cards, controls, dividers, and translucent legacy surfaces */
[class~="bg-white/10"], [class~="bg-white/[0.10]"], [class~="bg-white/[0.07]"], [class~="bg-white/[0.06]"],
[class~="bg-white/[0.05]"], [class~="bg-white/[0.04]"], [class~="bg-white/[0.03]"] {
  background-color: rgba(255, 255, 255, 0.78) !important;
}

[class~="border-white/25"], [class~="border-white/20"], [class~="border-white/15"],
[class~="border-white/[0.15]"], [class~="border-white/[0.14]"], [class~="border-white/[0.12]"],
[class~="border-white/[0.10]"], [class~="border-white/[0.08]"], [class~="border-white/[0.07]"],
[class~="border-white/[0.06]"], [class~="border-white/[0.05]"], [class~="border-white/[0.04]"],
[class~="border-white/5"] { border-color: var(--line) !important; }

input:not([type="checkbox"]):not([type="radio"]), select, textarea {
  color: var(--ink) !important;
  background: var(--surface) !important;
  border-color: var(--line-strong) !important;
  box-shadow: inset 0 1px 0 rgba(16, 35, 63, 0.03);
}

input::placeholder, textarea::placeholder { color: var(--ink-faint) !important; opacity: 1; }
select option { color: var(--ink); background: var(--surface); }

/* Cards receive depth without gaming-style glow. */
:where(article, section) [class~="rounded-2xl"][class*="border"] {
  box-shadow: var(--shadow-sm);
}

.animate-glow-breathe { animation: none !important; box-shadow: 0 8px 24px rgba(232, 71, 42, 0.24); }

.text-gradient-orange {
  background: linear-gradient(120deg, var(--orange), #b92e18);
  -webkit-background-clip: text;
  background-clip: text;
}

/* Photo and video stages intentionally remain inverse. */
section:has(> [class~="absolute"] img),
section:has(> [class~="absolute"] video),
section:has(> [class~="absolute"][class~="inset-0"] > img),
section:has(> [class~="absolute"][class~="inset-0"] > video) {
  background-color: var(--night) !important;
}

section:has(> [class~="absolute"] img) [class~="text-white"],
section:has(> [class~="absolute"] img) [class~="text-white/90"],
section:has(> [class~="absolute"] img) [class~="text-white/80"],
section:has(> [class~="absolute"] video) [class~="text-white"],
section:has(> [class~="absolute"] video) [class~="text-white/90"],
section:has(> [class~="absolute"] video) [class~="text-white/80"] { color: #fff !important; }

section:has(> [class~="absolute"] img) [class~="text-white/75"],
section:has(> [class~="absolute"] img) [class~="text-white/70"],
section:has(> [class~="absolute"] img) [class~="text-white/65"],
section:has(> [class~="absolute"] img) [class~="text-white/60"],
section:has(> [class~="absolute"] video) [class~="text-white/75"],
section:has(> [class~="absolute"] video) [class~="text-white/70"],
section:has(> [class~="absolute"] video) [class~="text-white/65"],
section:has(> [class~="absolute"] video) [class~="text-white/60"] { color: rgba(255, 255, 255, 0.76) !important; }

section:has(> [class~="absolute"] img) [class~="bg-white/10"],
section:has(> [class~="absolute"] img) [class~="bg-white/[0.10]"],
section:has(> [class~="absolute"] img) [class~="bg-white/[0.07]"],
section:has(> [class~="absolute"] img) [class~="bg-white/[0.06]"],
section:has(> [class~="absolute"] img) [class~="bg-white/[0.05]"],
section:has(> [class~="absolute"] img) [class~="bg-white/[0.04]"],
section:has(> [class~="absolute"] img) [class~="bg-white/[0.03]"],
section:has(> [class~="absolute"] video) [class~="bg-white/10"],
section:has(> [class~="absolute"] video) [class~="bg-white/[0.10]"],
section:has(> [class~="absolute"] video) [class~="bg-white/[0.07]"],
section:has(> [class~="absolute"] video) [class~="bg-white/[0.06]"],
section:has(> [class~="absolute"] video) [class~="bg-white/[0.05]"],
section:has(> [class~="absolute"] video) [class~="bg-white/[0.04]"],
section:has(> [class~="absolute"] video) [class~="bg-white/[0.03]"] {
  background-color: rgba(7, 16, 31, 0.58) !important;
}

/* The home ticker is intentionally quiet, but not washed out. */
.animate-marquee [class*="text-violet"], .animate-marquee-slow [class*="text-violet"] {
  color: rgba(15, 61, 122, 0.62) !important;
}

/* Image cards with overlaid captions also stay inverse. */
:where(div, article):has(> img[class~="absolute"]) [class~="text-white"] { color: #fff !important; }
:where(div, article):has(> img[class~="absolute"]) [class~="text-white/75"],
:where(div, article):has(> img[class~="absolute"]) [class~="text-white/70"],
:where(div, article):has(> img[class~="absolute"]) [class~="text-white/65"],
:where(div, article):has(> img[class~="absolute"]) [class~="text-white/60"] { color: rgba(255, 255, 255, 0.76) !important; }

/* Header and navigation */
#site-topbar {
  background: rgba(246, 243, 237, 0.96) !important;
  border-color: var(--line) !important;
  backdrop-filter: blur(18px);
}

#main-header.is-scrolled,
#main-header[class~="bg-[#07101f]"] {
  color: var(--ink);
  background: rgba(246, 243, 237, 0.94) !important;
  border-color: var(--line) !important;
  box-shadow: 0 8px 30px rgba(16, 35, 63, 0.08);
  backdrop-filter: blur(18px);
}

#main-header.is-scrolled [class*="text-white"],
#main-header[class~="bg-[#07101f]"] [class*="text-white"] { color: var(--ink) !important; }

.site-logo { position: relative; width: 172px; height: 40px; }
.site-logo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; transition: opacity 180ms ease; }
.site-logo__default { opacity: 0; }
.site-logo__inverse { opacity: 1; }
#main-header.is-scrolled .site-logo__default, #main-header[class~="bg-[#07101f]"] .site-logo__default { opacity: 1; }
#main-header.is-scrolled .site-logo__inverse, #main-header[class~="bg-[#07101f]"] .site-logo__inverse { opacity: 0; }

.dropdown-panel {
  color: var(--ink);
  background: rgba(255, 255, 255, 0.98) !important;
  border-color: var(--line) !important;
  box-shadow: var(--shadow-lg) !important;
}

.dropdown-panel [class*="text-white"] { color: var(--ink-soft) !important; }
.dropdown-panel a:hover { color: var(--navy) !important; background: var(--canvas-alt) !important; }

.mobile-drawer {
  color: var(--ink);
  background: var(--canvas) !important;
}
.mobile-drawer [class*="text-white"] { color: var(--ink-soft) !important; }

.nav-item-active, .nav-memberships-active { color: var(--ink) !important; }
.nav-item-active::after { background: linear-gradient(90deg, var(--violet), var(--blue)); }
.nav-dropdown-active { color: var(--navy) !important; }

/* Footer becomes the one substantial night anchor. */
footer[class~="bg-[#07101f]"] { background: var(--night) !important; }
footer [class~="text-white"], footer [class~="text-white/90"], footer [class~="text-white/80"] { color: #fff !important; }
footer [class~="text-white/75"], footer [class~="text-white/70"], footer [class~="text-white/65"], footer [class~="text-white/60"] { color: rgba(255,255,255,.72) !important; }
footer [class~="text-white/55"], footer [class~="text-white/50"], footer [class~="text-white/45"], footer [class~="text-white/40"], footer [class~="text-white/30"], footer [class~="text-white/25"], footer [class~="text-white/20"] { color: rgba(255,255,255,.5) !important; }
footer [class*="border-white"] { border-color: rgba(255,255,255,.12) !important; }

@media (max-width: 1023px) {
  #main-header { background: rgba(246, 243, 237, 0.94) !important; backdrop-filter: blur(18px); }
  #main-header [class*="text-white"] { color: var(--ink) !important; }
  #main-header .site-logo__default { opacity: 1; }
  #main-header .site-logo__inverse { opacity: 0; }
}

@media (max-width: 639px) {
  #main-header > div { padding-inline: 1.5rem !important; }
  .site-logo { width: 160px; }
  main section > [class~="w-full"] { width: 100%; max-width: 100%; }
  main [class~="w-full"] { min-width: 0; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
}