:root,
html[data-theme="light"] {
  color-scheme: light;
  --ww-bg: #F6F0E4;
  --ww-card: #FFFDF8;
  --ww-card-elevated: #FFFFFF;
  --ww-text: #22170F;
  --ww-muted: #6D5F4F;
  --ww-border: rgba(67, 47, 31, .14);
  --ww-border-strong: rgba(67, 47, 31, .24);
  --ww-primary: #2F7D62;
  --ww-warm: #E37A2D;
  --bg: var(--ww-bg);
  --surface: var(--ww-card);
  --surface-2: #FDF7EA;
  --surface-soft: #FBF5EA;
  --cream: var(--ww-card);
  --card: var(--ww-card);
  --card-elevated: var(--ww-card-elevated);
  --text: var(--ww-text);
  --ink: var(--ww-text);
  --ink-soft: #3A281D;
  --muted: var(--ww-muted);
  --text-2: var(--ww-muted);
  --text-3: #8A7A64;
  --faint: #9A8871;
  --line: var(--ww-border);
  --border: var(--ww-border);
  --border-med: var(--ww-border-strong);
  --line-strong: var(--ww-border-strong);
  --leaf: var(--ww-primary);
  --water: #1F7A9D;
  --sun: var(--ww-warm);
  --orange: var(--ww-warm);
  --warm-accent: var(--ww-warm);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --ww-bg: #0B1220;
  --ww-card: #152033;
  --ww-card-elevated: #1D2A40;
  --ww-text: #F8FAFC;
  --ww-muted: #CBD5E1;
  --ww-border: rgba(255, 255, 255, .12);
  --ww-border-strong: rgba(255, 255, 255, .2);
  --ww-primary: #34D399;
  --ww-warm: #FBBF24;
  --bg: var(--ww-bg);
  --surface: var(--ww-card);
  --surface-2: var(--ww-card-elevated);
  --surface-soft: var(--ww-card-elevated);
  --cream: var(--ww-card);
  --card: var(--ww-card);
  --card-elevated: var(--ww-card-elevated);
  --text: var(--ww-text);
  --ink: var(--ww-text);
  --ink-soft: var(--ww-text);
  --muted: var(--ww-muted);
  --text-2: var(--ww-muted);
  --text-3: #AEBBCB;
  --faint: #94A3B8;
  --line: var(--ww-border);
  --border: var(--ww-border);
  --border-med: var(--ww-border-strong);
  --line-strong: var(--ww-border-strong);
  --leaf: var(--ww-primary);
  --leaf-bg: rgba(52, 211, 153, .14);
  --leaf-soft: rgba(52, 211, 153, .14);
  --leaf-border: rgba(52, 211, 153, .28);
  --water: #38BDF8;
  --water-bg: rgba(56, 189, 248, .14);
  --water-soft: rgba(56, 189, 248, .14);
  --water-border: rgba(56, 189, 248, .28);
  --sun: var(--ww-warm);
  --orange: var(--ww-warm);
  --sun-bg: rgba(251, 191, 36, .14);
  --sun-soft: rgba(251, 191, 36, .14);
  --sun-border: rgba(251, 191, 36, .32);
  --amber: var(--ww-warm);
  --amber-bg: rgba(251, 191, 36, .14);
  --amber-border: rgba(251, 191, 36, .3);
  --rose: #FDA4AF;
  --rose-bg: rgba(253, 164, 175, .14);
  --rose-border: rgba(253, 164, 175, .26);
  --plum: #C4B5FD;
  --plum-bg: rgba(196, 181, 253, .14);
  --plum-border: rgba(196, 181, 253, .28);
  --shadow: 0 24px 70px rgba(0, 0, 0, .32);
  --shadow-soft: 0 24px 70px rgba(0, 0, 0, .32);
  --shadow-card: 0 14px 38px rgba(0, 0, 0, .24);
  --card-shadow: 0 14px 38px rgba(0, 0, 0, .24);
  --shadow-hover: 0 22px 54px rgba(0, 0, 0, .36);
  background: var(--ww-bg);
}

html.weekend-wild-theme-ready *,
html.weekend-wild-theme-ready *::before,
html.weekend-wild-theme-ready *::after {
  transition:
    background-color 200ms ease,
    color 200ms ease,
    border-color 200ms ease;
}

body {
  background-color: var(--bg);
  color: var(--text);
}

html[data-theme="dark"] body {
  background:
    radial-gradient(circle at 12% 0%, rgba(52, 211, 153, .12), transparent 28rem),
    radial-gradient(circle at 100% 8%, rgba(251, 191, 36, .1), transparent 26rem),
    var(--bg) !important;
  color: var(--text) !important;
}

.ww-theme-control {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.ww-theme-options {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface) 84%, transparent);
  box-shadow: 0 8px 20px rgba(20, 15, 10, .08);
}

.ww-theme-toggle {
  min-height: 38px;
  padding: 4px 4px 4px 12px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--text);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font: inherit;
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

.ww-theme-toggle:hover,
.ww-theme-toggle:focus-visible {
  outline: 2px solid transparent;
  box-shadow: 0 0 0 2px var(--ww-primary);
}

.ww-theme-toggle-track {
  width: 46px;
  height: 28px;
  padding: 3px;
  border-radius: 999px;
  background: rgba(80, 60, 20, .18);
  display: inline-flex;
  align-items: center;
  transition: background-color 200ms ease;
}

.ww-theme-toggle-thumb {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(20, 15, 10, .2);
  transform: translateX(0);
  transition: transform 200ms ease, background-color 200ms ease;
}

.ww-theme-toggle[aria-checked="true"] .ww-theme-toggle-track {
  background: var(--ww-primary);
}

.ww-theme-toggle[aria-checked="true"] .ww-theme-toggle-thumb {
  transform: translateX(18px);
}

html[data-theme="dark"] .ww-theme-toggle {
  color: #F8FAFC;
}

html[data-theme="dark"] .ww-theme-toggle-track {
  background: rgba(148, 163, 184, .28);
}

html[data-theme="dark"] .ww-theme-toggle[aria-checked="true"] .ww-theme-toggle-track {
  background: #34D399;
}

.ww-theme-option {
  min-height: 34px;
  border: 0;
  border-radius: 999px;
  padding: 0 10px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

.ww-theme-option:hover,
.ww-theme-option:focus-visible {
  color: var(--text);
  background: var(--surface-2);
  outline: 2px solid transparent;
  box-shadow: 0 0 0 2px var(--ww-primary);
}

.ww-theme-option[aria-pressed="true"] {
  background: var(--text);
  color: var(--surface);
}

html[data-theme="dark"] .ww-theme-option[aria-pressed="true"] {
  background: var(--ww-primary);
  color: #062018;
}

.ww-theme-label {
  max-width: 17rem;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.25;
}

.ww-theme-mobile {
  display: none;
  width: min(1180px, calc(100% - 28px));
  margin: 10px auto 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
}

.site-header .ww-theme-desktop,
.atlas-header .ww-theme-desktop,
.topbar .ww-theme-desktop,
.header .ww-theme-desktop {
  flex: 0 0 auto;
}

.site-header > .ww-theme-desktop,
.atlas-header > .ww-theme-desktop,
.topbar > .ww-theme-desktop,
.header > .ww-theme-desktop {
  position: absolute;
  top: 18px;
  right: clamp(18px, 3vw, 44px);
  z-index: 3;
  margin-left: 0;
  align-self: auto;
  justify-self: auto;
  order: 98;
}

.site-header > .ww-theme-desktop .ww-theme-label,
.atlas-header > .ww-theme-desktop .ww-theme-label,
.topbar > .ww-theme-desktop .ww-theme-label,
.header > .ww-theme-desktop .ww-theme-label {
  display: none;
}

@media (min-width: 901px) {
  .site-header:has(> .ww-theme-desktop),
  .atlas-header:has(> .ww-theme-desktop),
  .topbar:has(> .ww-theme-desktop),
  .header:has(> .ww-theme-desktop) {
    padding-right: clamp(1rem, 3vw, 2.5rem) !important;
  }

  .site-header:has(> .ww-theme-desktop) .nav-links,
  .atlas-header:has(> .ww-theme-desktop) .atlas-nav,
  .topbar:has(> .ww-theme-desktop) .nav,
  .header:has(> .ww-theme-desktop) .nav {
    margin-left: 0 !important;
    padding-right: clamp(190px, 15vw, 250px) !important;
  }
}

@media (min-width: 901px) {
  body:has(#activity-map) .site-header:has(> .ww-theme-desktop) {
    width: min(1920px, calc(100% - 32px)) !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    column-gap: clamp(14px, 2vw, 28px);
    row-gap: 10px;
    min-height: 74px;
    padding: 10px clamp(18px, 3vw, 44px) !important;
    border-radius: 999px;
  }

  body:has(#activity-map) .site-header:has(> .ww-theme-desktop) .logo {
    grid-column: 1;
  }

  body:has(#activity-map) .site-header:has(> .ww-theme-desktop) .nav-links {
    grid-column: 2;
    min-width: 0;
    margin-left: 0 !important;
    padding: 4px !important;
    justify-content: center;
    flex-wrap: wrap;
  }

  body:has(#activity-map) .site-header:has(> .ww-theme-desktop) .nav-links a {
    flex: 0 0 auto;
  }

  body:has(#activity-map) .site-header:has(> .ww-theme-desktop) > .ww-theme-desktop {
    position: static !important;
    grid-column: 3;
    justify-self: end;
    align-self: center;
    margin-left: 0 !important;
    max-width: 100%;
  }

  body:has(#activity-map) .site-header:has(> .ww-theme-desktop) > .ww-theme-desktop .ww-theme-options {
    max-width: 100%;
  }
}

@media (min-width: 901px) and (max-width: 1320px) {
  body:has(#activity-map) .site-header:has(> .ww-theme-desktop) {
    grid-template-columns: auto 1fr;
    border-radius: 34px;
  }

  body:has(#activity-map) .site-header:has(> .ww-theme-desktop) .nav-links {
    grid-column: 2;
    justify-content: flex-end;
  }

  body:has(#activity-map) .site-header:has(> .ww-theme-desktop) > .ww-theme-desktop {
    grid-column: 1 / -1;
    justify-self: end;
  }
}

html[data-theme="dark"] .site-header,
html[data-theme="dark"] .atlas-header,
html[data-theme="dark"] .topbar,
html[data-theme="dark"] .mobile-action-bar,
html[data-theme="dark"] .nav-links,
html[data-theme="dark"] .atlas-nav {
  background: color-mix(in srgb, var(--surface) 88%, transparent) !important;
  border-color: var(--line) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] .logo span,
html[data-theme="dark"] .atlas-logo span,
html[data-theme="dark"] .nav-cta,
html[data-theme="dark"] .atlas-nav-cta,
html[data-theme="dark"] .cta,
html[data-theme="dark"] .btn.dark,
html[data-theme="dark"] .hero-button.primary,
html[data-theme="dark"] .activity-actions a:first-child {
  background: var(--ww-primary) !important;
  border-color: var(--ww-primary) !important;
  color: #062018 !important;
}

html[data-theme="dark"] .site-header a,
html[data-theme="dark"] .atlas-header a,
html[data-theme="dark"] .topbar a,
html[data-theme="dark"] nav a {
  color: var(--text);
}

html[data-theme="dark"] .nav-links a:hover,
html[data-theme="dark"] .nav-links a.active,
html[data-theme="dark"] .atlas-nav a:hover,
html[data-theme="dark"] .atlas-nav a:focus-visible {
  background: var(--surface-2) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] :is(
  .section,
  .card,
  .activity-card,
  .hotel-card,
  .itinerary-card,
  .faq-item,
  .related-card,
  .fact,
  .love,
  .pick,
  .stat,
  .day,
  .map-card,
  .results-card,
  .activity-card,
  .planner-card,
  .filter-panel,
  .modal,
  .site-search-results,
  .search-wrap,
  .atlas-card,
  .atlas-panel,
  .atlas-section,
  .hotel,
  .quick-card,
  .empty
) {
  background-color: var(--surface) !important;
  border-color: var(--line) !important;
  color: var(--text) !important;
  box-shadow: var(--shadow-card, 0 14px 38px rgba(0, 0, 0, .24)) !important;
}

html[data-theme="dark"] :is(.hero, .atlas-hero) {
  border-color: var(--line) !important;
}

html[data-theme="dark"] :is(
  .results-head,
  .card-body,
  .media-needed,
  .day,
  .search-row,
  .saved-counter,
  .mobile-action-bar a,
  .mobile-action-bar button
) {
  background-color: var(--surface-2) !important;
  border-color: var(--line) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] :is(p, .lede, .lead, .hero-sub, .activity-meta, .activity-desc, .eyebrow + p, .fact span, .love span, .stat span, .hotel-card p, .itinerary-card p, .faq-item p, .section p, .atlas-lede, .atlas-meta) {
  color: var(--muted) !important;
}

html[data-theme="dark"] :is(.eyebrow, .kicker, .atlas-kicker) {
  background: rgba(251, 191, 36, .14) !important;
  border-color: rgba(251, 191, 36, .3) !important;
  color: var(--ww-warm) !important;
}

html[data-theme="dark"] :is(input, textarea, select) {
  background: var(--surface-2) !important;
  border-color: var(--line-strong) !important;
  color: var(--text) !important;
  color-scheme: dark;
  caret-color: var(--ww-primary);
}

html[data-theme="dark"] :is(input, textarea, select)::placeholder {
  color: #94A3B8 !important;
  opacity: 1;
}

html[data-theme="dark"] :is(button, .btn, .chip, .tag, .amenity, .hero-button, .activity-actions a) {
  border-color: var(--line) !important;
}

html[data-theme="dark"] :is(.chip, .tag, .amenity) {
  background: var(--surface-2) !important;
  color: var(--muted) !important;
}

html[data-theme="dark"] :is(.chip.active, .filter-chip.active, [aria-pressed="true"].chip) {
  background: var(--ww-primary) !important;
  border-color: var(--ww-primary) !important;
  color: #062018 !important;
}

html[data-theme="dark"] :is(a, button, input, textarea, select):focus-visible {
  outline: 3px solid var(--ww-warm) !important;
  outline-offset: 3px;
}

html[data-theme="dark"] :is(.btn:hover, .hero-button:hover, .activity-actions a:hover, button:hover) {
  filter: brightness(1.08);
}

html[data-theme="dark"] .mapboxgl-popup-content {
  background: var(--surface) !important;
  color: var(--text) !important;
  border: 1px solid var(--line);
}

html[data-theme="dark"] .mapboxgl-popup-tip {
  border-top-color: var(--surface) !important;
  border-bottom-color: var(--surface) !important;
}

@media (max-width: 760px) {
  .site-header .ww-theme-desktop,
  .atlas-header .ww-theme-desktop,
  .topbar .ww-theme-desktop,
  .header .ww-theme-desktop {
    display: none;
  }

  .ww-theme-mobile {
    display: grid;
  }

  .ww-theme-mobile .ww-theme-options {
    width: 100%;
    justify-content: space-between;
  }

  .ww-theme-mobile .ww-theme-option {
    flex: 1 1 0;
  }
}

/* Premium dark-mode polish: override older inline page gradients and hard-coded whites. */
html[data-theme="dark"] .site-header .ww-theme-desktop .ww-theme-label,
html[data-theme="dark"] .atlas-header .ww-theme-desktop .ww-theme-label,
html[data-theme="dark"] .topbar .ww-theme-desktop .ww-theme-label,
html[data-theme="dark"] .header .ww-theme-desktop .ww-theme-label {
  display: none !important;
}

html[data-theme="dark"] .site-header .ww-theme-desktop .ww-theme-options,
html[data-theme="dark"] .atlas-header .ww-theme-desktop .ww-theme-options,
html[data-theme="dark"] .topbar .ww-theme-desktop .ww-theme-options,
html[data-theme="dark"] .header .ww-theme-desktop .ww-theme-options {
  box-shadow: none !important;
}

html[data-theme="dark"] :is(.site-header, .atlas-header, .topbar, .header) {
  background: rgba(21, 32, 51, .94) !important;
  border-color: rgba(255, 255, 255, .14) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .28) !important;
}

html[data-theme="dark"] :is(.nav-links, .atlas-nav, .nav) {
  background: rgba(29, 42, 64, .72) !important;
  border-color: rgba(255, 255, 255, .12) !important;
}

html[data-theme="dark"] :is(.nav-links a, .atlas-nav a, .nav a) {
  color: #E2E8F0 !important;
}

html[data-theme="dark"] :is(.nav-links a:hover, .nav-links a.active, .atlas-nav a:hover, .atlas-nav a:focus-visible, .nav a:hover, .nav a[aria-current="page"]) {
  background: #24324A !important;
  color: #FFFFFF !important;
}

html[data-theme="dark"] :is(
  .hero,
  .section,
  .feature-card,
  .quick-card,
  .hero-card,
  .mission-card,
  .story-card,
  .guide-card,
  .hotel-hero,
  .hotel-search-panel,
  .hotel-hero-side,
  .hero-search-card,
  .collection-card,
  .destination-card,
  .destination-card-body,
  .hotel-detail-panel,
  .airbnb-card,
  .hotel-card,
  .walk-card,
  .map-panel,
  .filters,
  .facts,
  .map-list-item,
  .card,
  .activity-card,
  .itinerary-card,
  .faq-item,
  .related-card,
  .fact,
  .love,
  .pick,
  .stat,
  .day,
  .map-card,
  .results-card,
  .planner-card,
  .filter-panel,
  .modal,
  .site-search-results,
  .search-wrap,
  .atlas-card,
  .atlas-panel,
  .atlas-section,
  .hotel,
  .empty
) {
  background: linear-gradient(145deg, #152033, #111B2D) !important;
  border-color: rgba(255, 255, 255, .14) !important;
  color: #F8FAFC !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .28) !important;
}

html[data-theme="dark"] :is(
  .results-head,
  .card-body,
  .media-needed,
  .search-row,
  .saved-counter,
  .saved-pill,
  .map-fallback div,
  .map-note,
  .credit,
  .hero-photo figcaption,
  .mobile-action-bar a,
  .mobile-action-bar button
) {
  background: #1D2A40 !important;
  border-color: rgba(255, 255, 255, .14) !important;
  color: #F8FAFC !important;
}

html[data-theme="dark"] :is(.map-fallback, .media-needed) {
  background: linear-gradient(145deg, #111B2D, #1D2A40) !important;
}

html[data-theme="dark"] :is(
  h1,
  h2,
  h3,
  h4,
  strong,
  .logo,
  .brand,
  .atlas-logo,
  .activity-title,
  .card-title,
  .fact strong,
  .map-list-copy strong
) {
  color: #F8FAFC !important;
}

html[data-theme="dark"] :is(
  p,
  .lede,
  .lead,
  .hero-sub,
  .hero p,
  .activity-meta,
  .activity-desc,
  .eyebrow + p,
  .fact span,
  .love span,
  .stat span,
  .hotel-card p,
  .itinerary-card p,
  .faq-item p,
  .section p,
  .section-head p,
  .walk-body p,
  .map-list-copy span,
  .atlas-lede,
  .atlas-meta
) {
  color: #CBD5E1 !important;
}

html[data-theme="dark"] :is(input, textarea, select) {
  background: #0F1A2C !important;
  border-color: rgba(255, 255, 255, .22) !important;
  color: #F8FAFC !important;
  color-scheme: dark;
}

html[data-theme="dark"] select option,
html[data-theme="dark"] select optgroup {
  background: #0B1220 !important;
  color: #F8FAFC !important;
}

html[data-theme="dark"] select option:checked {
  background: #34D399 !important;
  color: #062018 !important;
}

html[data-theme="dark"] :is(input, textarea, select)::placeholder {
  color: #A8B5C8 !important;
}

html[data-theme="dark"] :is(
  .btn,
  .hero-button,
  .card-actions a,
  .card-actions button,
  .activity-actions a,
  .map-list-link,
  .mobile-action-bar a,
  .mobile-action-bar button
) {
  background: #F8FAFC !important;
  color: #111827 !important;
  border-color: rgba(248, 250, 252, .9) !important;
}

html[data-theme="dark"] :is(
  .btn.primary,
  .btn.dark,
  .hero-button.primary,
  .nav-cta,
  .atlas-nav-cta,
  .cta,
  .card-actions a:first-child,
  .activity-actions a:first-child,
  .save-btn.saved,
  .pin,
  .map-list-number,
  .ww-theme-option[aria-pressed="true"]
) {
  background: #34D399 !important;
  color: #062018 !important;
  border-color: #34D399 !important;
}

html[data-theme="dark"] :is(.chip, .tag, .amenity, .quick-links a) {
  background: #24324A !important;
  color: #E2E8F0 !important;
  border-color: rgba(255, 255, 255, .14) !important;
}

html[data-theme="dark"] :is(.chip.active, .filter-chip.active, [aria-pressed="true"].chip) {
  background: #34D399 !important;
  color: #062018 !important;
  border-color: #34D399 !important;
}

html[data-theme="dark"] :is(.eyebrow, .kicker, .atlas-kicker, .area) {
  background: rgba(251, 191, 36, .14) !important;
  border-color: rgba(251, 191, 36, .34) !important;
  color: #FBBF24 !important;
}

html[data-theme="dark"] :is([disabled], .disabled, [aria-disabled="true"]) {
  opacity: .65 !important;
  color: #64748B !important;
}

/* Homepage planner and result cards have bespoke inline styles; keep them dark too. */
html[data-theme="dark"] :is(
  #planner,
  .planner-shell,
  .homepage-feature-section,
  .trending-section,
  .explore-destinations-section,
  .guide-city-panel,
  .home-recommended-map,
  .home-map-head,
  .map-help-card,
  .map-selected-card,
  .hotel-shell,
  .hotel-card-body,
  .filter-card,
  .filter-toolbar,
  .filters-bar,
  .age-filter,
  .playground-panel,
  .quick-finders,
  .wild-wheel-panel,
  .wild-result-shell,
  .wild-wheel-inline-result,
  .wild-result-card,
  .wild-result-empty,
  .wild-result-metric,
  .wild-treat-card,
  .wild-share-card,
  .decision-action,
  .newsletter-panel,
  .plan-card,
  .day-card,
  .card-content,
  .share-panel,
  .quick-info-grid,
  .card-highlight,
  .partner-panel,
  .kit-card,
  .partner-card
) {
  background: linear-gradient(145deg, #152033, #111B2D) !important;
  border-color: rgba(255, 255, 255, .14) !important;
  color: #F8FAFC !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .28) !important;
}

html[data-theme="dark"] :is(
  .homepage-section-head p,
  .filter-toolbar span,
  .filter-help,
  .card-location,
  .card-meta,
  .card-note,
  .wild-result-card p,
  .wild-result-metric span,
  .wild-treat-card p,
  .wild-share-card p,
  .decision-action span,
  .hotel-description,
  .hotel-area,
  .affiliate-disclosure
) {
  color: #CBD5E1 !important;
}

html[data-theme="dark"] :is(
  .hotel-city-btn,
  .hotel-filter,
  .hotel-action,
  .card-action,
  .wild-result-cta,
  .wild-treat-card button,
  .clear-filters-btn,
  .filter-toggle-btn
) {
  background: #F8FAFC !important;
  border-color: rgba(248, 250, 252, .9) !important;
  color: #111827 !important;
}

html[data-theme="dark"] :is(
  .hotel-city-btn.active,
  .hotel-filter.active,
  .hotel-action.primary,
  .card-action.primary,
  .wild-result-cta.primary,
  .decision-action.primary
) {
  background: #34D399 !important;
  border-color: #34D399 !important;
  color: #062018 !important;
}

html[data-theme="dark"] :is(
  button[disabled],
  a[aria-disabled="true"],
  .hotel-action[aria-disabled="true"],
  .card-action[aria-disabled="true"],
  .wild-result-cta[aria-disabled="true"]
) {
  background: #1D2A40 !important;
  border-color: rgba(255, 255, 255, .14) !important;
  color: #94A3B8 !important;
  opacity: 1 !important;
}

/* Final homepage dark palette pass: remove pale panels and keep contrast stable. */
html[data-theme="dark"] body#top {
  --ww-home-bg: #0B1120;
  --ww-home-surface: #101A2C;
  --ww-home-card: #172033;
  --ww-home-elevated: #1D2A40;
  --ww-home-input: #0F172A;
  --ww-home-text: #F8FAFC;
  --ww-home-muted: #CBD5E1;
  --ww-home-subtle: #94A3B8;
  --ww-home-border: rgba(148, 163, 184, .26);
  --ww-home-primary: #34D399;
  --ww-home-primary-text: #052016;
  --ww-home-warm: #FBBF24;
  background:
    radial-gradient(circle at 12% 0%, rgba(52, 211, 153, .10), transparent 26rem),
    radial-gradient(circle at 98% 10%, rgba(56, 189, 248, .08), transparent 24rem),
    var(--ww-home-bg) !important;
  color: var(--ww-home-text) !important;
}

html[data-theme="dark"] body#top :is(
  .hero,
  .site-header,
  .top-nav,
  .weekend-planner,
  #planner,
  .planner-shell,
  .hero-location-card,
  .wild-wheel-section,
  .wild-wheel-panel,
  .wild-result-shell,
  .wild-wheel-inline-result,
  .wild-result-card,
  .wild-result-empty,
  .wild-result-metric,
  .wild-treat-card,
  .wild-share-card,
  .homepage-feature-section,
  .trending-section,
  .explore-destinations-section,
  .guide-city-panel,
  .home-recommended-map,
  .home-map-head,
  .map-help-card,
  .map-selected-card,
  .hotel-shell,
  .hotel-card,
  .hotel-card-body,
  .filter-card,
  .filter-toolbar,
  .filters-bar,
  .age-filter,
  .playground-panel,
  .quick-finders,
  .decision-action,
  .newsletter-panel,
  .plan-card,
  .day-card,
  .card-content,
  .share-panel,
  .quick-info-grid,
  .quick-info-grid span,
  .card-highlight,
  .partner-panel,
  .kit-card,
  .partner-card,
  .result-pagination,
  .parent-tip
) {
  background: linear-gradient(145deg, var(--ww-home-card), var(--ww-home-surface)) !important;
  border-color: var(--ww-home-border) !important;
  color: var(--ww-home-text) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .30) !important;
}

html[data-theme="dark"] body#top :is(
  .hero-eyebrow,
  .planner-heading .eyebrow,
  .homepage-section-head .eyebrow,
  .card-date,
  .area,
  .kicker,
  .setting-badge,
  .best-for-badge,
  .tag,
  .wild-result-meta span,
  .hotel-amenity,
  .hotel-price,
  .hotel-best,
  .map-pin-tag,
  .map-count-note
) {
  background: rgba(52, 211, 153, .13) !important;
  border-color: rgba(52, 211, 153, .32) !important;
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body#top :is(
  h1,
  h2,
  h3,
  h4,
  .logo,
  .brand,
  .homepage-section-head h2,
  .planner-heading h2,
  .wild-wheel-head h2,
  .card-title,
  .card-content h3,
  .day-card h3,
  .wild-result-card h3,
  .wild-result-empty strong,
  .wild-treat-card h3,
  .wild-share-card h3,
  .filter-card legend
) {
  color: var(--ww-home-text) !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body#top :is(
  p,
  .hero-sub,
  .planner-heading p,
  .homepage-section-head p,
  .wild-wheel-head p,
  .decision-carousel-head span,
  .hero-location-copy,
  .hero-location-copy span,
  .wild-result-card p,
  .wild-result-metric span,
  .wild-treat-card p,
  .wild-share-card p,
  .card-location,
  .card-meta,
  .card-note,
  .card-summary,
  .parent-tip,
  .location-status,
  .filter-help,
  .result-pagination-label,
  .hotel-description,
  .hotel-area,
  .affiliate-disclosure
) {
  color: var(--ww-home-muted) !important;
}

html[data-theme="dark"] body#top .wild-wheel-kicker {
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body#top .wild-wheel-kicker::before {
  background: linear-gradient(90deg, #60A5FA, #C084FC, #34D399);
}

html[data-theme="dark"] body#top .wild-wheel-helper strong {
  color: #C4B5FD !important;
}

html[data-theme="dark"] body#top :is(
  input,
  select,
  textarea,
  .search-bar,
  .search-input,
  .hero-search,
  .planner-search,
  .location-input,
  .hero-location-card input
) {
  background: var(--ww-home-input) !important;
  border-color: rgba(148, 163, 184, .34) !important;
  color: var(--ww-home-text) !important;
  color-scheme: dark;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04) !important;
}

html[data-theme="dark"] body#top select option,
html[data-theme="dark"] body#top select optgroup {
  background: #0B1220 !important;
  color: #F8FAFC !important;
}

html[data-theme="dark"] body#top select option:checked {
  background: #34D399 !important;
  color: #062018 !important;
}

html[data-theme="dark"] body#top :is(input, select, textarea)::placeholder {
  color: var(--ww-home-subtle) !important;
  opacity: 1 !important;
}

html[data-theme="dark"] body#top :is(
  button,
  .hero-button,
  .decision-action,
  .location-btn,
  .wild-wheel-filter,
  .wild-kids-toggle,
  .wild-wheel-option,
  .wild-result-cta,
  .card-action,
  .share-option,
  .hotel-action,
  .hotel-filter,
  .hotel-city-btn,
  .filter-toggle-btn,
  .clear-filters-btn,
  .result-page-btn
) {
  background: var(--ww-home-elevated) !important;
  border-color: var(--ww-home-border) !important;
  color: var(--ww-home-text) !important;
}

html[data-theme="dark"] body#top :is(
  button:hover,
  .hero-button:hover,
  .decision-action:hover,
  .location-btn:hover,
  .wild-wheel-filter:hover,
  .wild-kids-toggle:hover,
  .wild-wheel-option:hover,
  .wild-result-cta:hover,
  .card-action:hover,
  .share-option:hover,
  .hotel-action:hover,
  .hotel-filter:hover,
  .hotel-city-btn:hover,
  .filter-toggle-btn:hover,
  .clear-filters-btn:hover,
  .result-page-btn:hover
) {
  border-color: rgba(52, 211, 153, .52) !important;
  color: #FFFFFF !important;
}

html[data-theme="dark"] body#top :is(
  .primary,
  .hero-button.primary,
  .decision-action.primary,
  .location-btn.primary,
  .location-btn.active,
  .wild-wheel-filter.active,
  .wild-kids-toggle[aria-pressed="true"],
  .wild-wheel-option.active,
  .wild-spin-button,
  .wild-result-cta.primary,
  .card-action.primary,
  .hotel-action.primary,
  .hotel-filter.active,
  .hotel-city-btn.active,
  .result-page-btn.active,
  .result-page-btn[aria-current="page"]
) {
  background: var(--ww-home-primary) !important;
  border-color: var(--ww-home-primary) !important;
  color: var(--ww-home-primary-text) !important;
  box-shadow: 0 14px 34px rgba(52, 211, 153, .24) !important;
}

html[data-theme="dark"] body#top :is(
  button[disabled],
  .result-page-btn[disabled],
  .card-action[aria-disabled="true"],
  .hotel-action[aria-disabled="true"],
  .wild-result-cta[aria-disabled="true"]
) {
  background: rgba(29, 42, 64, .66) !important;
  border-color: rgba(148, 163, 184, .18) !important;
  color: var(--ww-home-subtle) !important;
  opacity: 1 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body#top :is(
  .card-image,
  .city-card-media,
  .wild-result-hero,
  .hotel-image,
  .map-fallback,
  .media-needed,
  .placeholder-card,
  .activity-image-placeholder
) {
  background: linear-gradient(135deg, #1D2A40, #0F172A) !important;
  border-color: var(--ww-home-border) !important;
  color: var(--ww-home-muted) !important;
}

html[data-theme="dark"] body#top :is(
  .image-credit,
  .hotel-image-label,
  .share-copy-fallback
) {
  background: rgba(15, 23, 42, .9) !important;
  color: #E2E8F0 !important;
  border-color: rgba(148, 163, 184, .24) !important;
}

html[data-theme="dark"] body#top .image-credit :is(a, span) {
  background: rgba(15, 23, 42, .78) !important;
  border: 1px solid rgba(226, 232, 240, .18) !important;
  color: #F8FAFC !important;
  box-shadow: 0 6px 18px rgba(2, 6, 23, .22);
}

html[data-theme="dark"] body#top .image-credit a:is(:hover, :focus-visible) {
  background: rgba(30, 41, 59, .92) !important;
  color: #A7F3D0 !important;
  text-decoration: none;
}

html[data-theme="dark"] body#top .mobile-action-bar {
  background: rgba(11, 17, 32, .94) !important;
  border-color: var(--ww-home-border) !important;
  box-shadow: 0 -18px 40px rgba(0, 0, 0, .34) !important;
}

html[data-theme="dark"] body#top .mobile-action-bar :is(a, button) {
  background: var(--ww-home-elevated) !important;
  border-color: var(--ww-home-border) !important;
  color: var(--ww-home-text) !important;
}

html[data-theme="dark"] body#top .mobile-action-bar :is(a, button):is(:hover, :focus-visible) {
  border-color: rgba(52, 211, 153, .56) !important;
  outline-color: rgba(52, 211, 153, .5) !important;
}

html[data-theme="dark"] body#top .site-header {
  background: rgba(15, 23, 42, .82) !important;
  border-color: var(--ww-home-border) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
}

html[data-theme="dark"] body#top .nav-links {
  background: rgba(29, 42, 64, .54) !important;
  border: 1px solid rgba(148, 163, 184, .18) !important;
}

html[data-theme="dark"] body#top .nav-links a {
  color: var(--ww-home-muted) !important;
  border: 1px solid transparent !important;
}

html[data-theme="dark"] body#top .nav-links a:is(:hover, :focus-visible) {
  background: rgba(29, 42, 64, .92) !important;
  border-color: rgba(52, 211, 153, .42) !important;
  color: var(--ww-home-text) !important;
}

html[data-theme="dark"] body#top .nav-links a:is(.ww-current-section, .active, [aria-current="page"]),
html[data-theme="dark"] body#top .mobile-action-bar :is(.ww-current-section, .active, [aria-current="page"]) {
  background: var(--ww-home-primary) !important;
  border-color: var(--ww-home-primary) !important;
  color: var(--ww-home-primary-text) !important;
}

html[data-theme="dark"] body#top .nav-links .nav-cta {
  background: var(--ww-home-primary) !important;
  border-color: var(--ww-home-primary) !important;
  color: var(--ww-home-primary-text) !important;
}

/* Homepage hero spacing guardrail: keep content inset and prevent the next section from tucking underneath. */
body#top .hero {
  box-sizing: border-box !important;
  width: min(1760px, calc(100% - clamp(32px, 5vw, 96px))) !important;
  max-width: 1760px !important;
  margin: clamp(20px, 3vw, 48px) auto clamp(32px, 4vw, 72px) !important;
  padding: clamp(28px, 4vw, 64px) !important;
}

body#top .hero > div:first-child {
  min-width: 0 !important;
}

body#top .hero h1 {
  overflow-wrap: normal !important;
  text-wrap: balance;
}

body#top .hero-media {
  min-width: 0 !important;
}

body#top .hero + .section-divider {
  display: block !important;
  height: clamp(18px, 2.5vw, 44px) !important;
  border-top: 0 !important;
  padding: 0 !important;
}

body#top #planner.planner-shell {
  margin-top: clamp(28px, 3vw, 56px) !important;
}

body#top .wild-wheel-section {
  margin-top: clamp(28px, 3vw, 56px) !important;
}

html[data-theme="dark"] body#top .activity-legal-note,
html[data-theme="dark"] body:has(#activity-map) .disclaimer {
  background: linear-gradient(145deg, rgba(20, 31, 51, .96), rgba(15, 23, 42, .96)) !important;
  border-color: rgba(148, 163, 184, .24) !important;
  color: #CBD5E1 !important;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .28) !important;
}

html[data-theme="dark"] body#top .activity-legal-note p,
html[data-theme="dark"] body:has(#activity-map) .disclaimer {
  color: #CBD5E1 !important;
}

html[data-theme="dark"] body#top .guide-location-form {
  background: linear-gradient(145deg, rgba(20, 31, 51, .96), rgba(15, 23, 42, .96)) !important;
  border-color: rgba(148, 163, 184, .24) !important;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .28) !important;
}

html[data-theme="dark"] body#top .guide-location-field span {
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body#top :is(.guide-location-field input, #guide-location-input) {
  background: #0B1220 !important;
  border-color: rgba(148, 163, 184, .34) !important;
  color: #F8FAFC !important;
}

html[data-theme="dark"] body#top .guide-location-field input::placeholder {
  color: #94A3B8 !important;
}

html[data-theme="dark"] body#top :is(.guide-location-submit, .guide-location-use) {
  background: #1D2A40 !important;
  border-color: rgba(148, 163, 184, .26) !important;
  color: #F8FAFC !important;
}

html[data-theme="dark"] body#top .guide-location-submit {
  background: #34D399 !important;
  border-color: #34D399 !important;
  color: #052016 !important;
}

html[data-theme="dark"] body#top :is(
  .homepage-section-head .eyebrow,
  .section-heading .eyebrow,
  .partner-panel .eyebrow
) {
  display: inline-flex !important;
  width: fit-content !important;
  max-width: 100% !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  background: rgba(52, 211, 153, .13) !important;
  border: 1px solid rgba(52, 211, 153, .32) !important;
  color: #A7F3D0 !important;
}

@media (min-width: 980px) {
  body#top .hero > div:first-child {
    grid-template-columns: minmax(0, .9fr) minmax(480px, 1fr) !important;
    column-gap: clamp(36px, 4.5vw, 78px) !important;
  }
}

@media (max-width: 760px) {
  body#top .hero {
    width: min(100% - 24px, 720px) !important;
    margin-top: 16px !important;
    padding: 22px !important;
  }
}

/* Activity map dark mode inspired by modern gallery patterns: deep canvas, lifted panels, restrained accent. */
html[data-theme="dark"] body:has(#activity-map) {
  --ww-map-bg: #080D18;
  --ww-map-surface: #0F172A;
  --ww-map-card: #141F33;
  --ww-map-elevated: #1B2940;
  --ww-map-text: #F8FAFC;
  --ww-map-muted: #CBD5E1;
  --ww-map-subtle: #93A4BA;
  --ww-map-line: rgba(148, 163, 184, .24);
  --ww-map-primary: #34D399;
  --ww-map-primary-text: #052016;
  --ww-map-warm: #FBBF24;
  background:
    radial-gradient(circle at 18% -4%, rgba(52, 211, 153, .13), transparent 22rem),
    radial-gradient(circle at 92% 4%, rgba(56, 189, 248, .10), transparent 24rem),
    linear-gradient(180deg, #0B1220 0%, var(--ww-map-bg) 56%, #070B14 100%) !important;
  color: var(--ww-map-text) !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(
  .site-header,
  .hero,
  .search-panel,
  .map-card,
  .results-card,
  .activity-card,
  .disclaimer
) {
  background: linear-gradient(145deg, rgba(20, 31, 51, .96), rgba(15, 23, 42, .96)) !important;
  border-color: var(--ww-map-line) !important;
  color: var(--ww-map-text) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .30) !important;
}

html[data-theme="dark"] body:has(#activity-map) .site-header {
  background: rgba(15, 23, 42, .78) !important;
  backdrop-filter: blur(18px) saturate(135%);
}

html[data-theme="dark"] body:has(#activity-map) .nav-links {
  background: rgba(27, 41, 64, .72) !important;
  border: 1px solid rgba(148, 163, 184, .18);
}

html[data-theme="dark"] body:has(#activity-map) :is(.nav-links a, .logo) {
  color: var(--ww-map-muted) !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(.nav-links a:hover, .nav-links a.active, .nav-links .nav-cta) {
  background: var(--ww-map-primary) !important;
  color: var(--ww-map-primary-text) !important;
}

html[data-theme="dark"] body:has(#activity-map) .logo span {
  background: var(--ww-map-primary) !important;
  color: var(--ww-map-primary-text) !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(h1, h2, h3, .activity-title, .results-head h2) {
  color: var(--ww-map-text) !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(
  .hero-copy,
  .status,
  .results-head p,
  .activity-meta,
  .activity-desc,
  .disclaimer,
  footer
) {
  color: var(--ww-map-muted) !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(.eyebrow, .search-panel label) {
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body:has(#activity-map) .eyebrow {
  display: inline-flex;
  width: fit-content;
  padding: 5px 10px;
  border: 1px solid rgba(52, 211, 153, .28);
  border-radius: 999px;
  background: rgba(52, 211, 153, .10) !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(input, textarea, select) {
  background: #0B1220 !important;
  border-color: rgba(148, 163, 184, .34) !important;
  color: var(--ww-map-text) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .035) !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(input, textarea, select)::placeholder {
  color: var(--ww-map-subtle) !important;
  opacity: 1 !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(button, .button, .activity-actions a) {
  background: var(--ww-map-elevated) !important;
  border-color: rgba(148, 163, 184, .28) !important;
  color: var(--ww-map-text) !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(button:hover, .button:hover, .activity-actions a:hover) {
  border-color: rgba(52, 211, 153, .58) !important;
  color: #FFFFFF !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(.primary, .chip.active, .activity-actions a:first-child) {
  background: var(--ww-map-primary) !important;
  border-color: var(--ww-map-primary) !important;
  color: var(--ww-map-primary-text) !important;
  box-shadow: 0 16px 34px rgba(52, 211, 153, .22) !important;
}

html[data-theme="dark"] body:has(#activity-map) .activity-card.active {
  background: linear-gradient(145deg, rgba(29, 42, 64, .98), rgba(16, 26, 44, .98)) !important;
  border-color: rgba(52, 211, 153, .54) !important;
  box-shadow: 0 18px 42px rgba(52, 211, 153, .13) !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(.num, .pin) {
  background: var(--ww-map-primary) !important;
  border-color: rgba(255, 255, 255, .92) !important;
  color: var(--ww-map-primary-text) !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(.pin.active, .activity-card.active .num) {
  background: var(--ww-map-warm) !important;
  color: #1A1300 !important;
}

html[data-theme="dark"] body:has(#activity-map) #activity-map {
  background: #0B1220 !important;
}

html[data-theme="dark"] body:has(#activity-map) :is(
  .mapboxgl-ctrl-group,
  .mapboxgl-popup-content
) {
  background: rgba(15, 23, 42, .94) !important;
  border: 1px solid var(--ww-map-line) !important;
  color: var(--ww-map-text) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .38) !important;
}

html[data-theme="dark"] body:has(#activity-map) .mapboxgl-ctrl-group button {
  background: transparent !important;
  color: var(--ww-map-text) !important;
}

html[data-theme="dark"] body:has(#activity-map) .mapboxgl-popup-tip {
  border-top-color: rgba(15, 23, 42, .94) !important;
}

/* Generic current nav state for simple section pages. */
html[data-theme="dark"] :is(.nav-links, .atlas-nav, .nav) a:is(.ww-current-section, [aria-current="page"]) {
  background: #34D399 !important;
  border-color: #34D399 !important;
  color: #052016 !important;
}

/* Quick wins dark mode: compact editorial cards on a polished night canvas. */
html[data-theme="dark"] body:has(.joy-grid) {
  --ww-joy-bg: #080D18;
  --ww-joy-surface: #0F172A;
  --ww-joy-card: #141F33;
  --ww-joy-elevated: #1B2940;
  --ww-joy-text: #F8FAFC;
  --ww-joy-muted: #CBD5E1;
  --ww-joy-line: rgba(148, 163, 184, .24);
  --ww-joy-primary: #34D399;
  --ww-joy-primary-text: #052016;
  background:
    radial-gradient(circle at 12% -6%, rgba(52, 211, 153, .12), transparent 22rem),
    radial-gradient(circle at 88% 4%, rgba(251, 191, 36, .08), transparent 20rem),
    linear-gradient(180deg, #0B1220 0%, var(--ww-joy-bg) 60%, #070B14 100%) !important;
  color: var(--ww-joy-text) !important;
}

html[data-theme="dark"] body:has(.joy-grid) :is(
  .site-header,
  .hero,
  .section,
  .joy-card
) {
  background: linear-gradient(145deg, rgba(20, 31, 51, .96), rgba(15, 23, 42, .96)) !important;
  border-color: var(--ww-joy-line) !important;
  color: var(--ww-joy-text) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .30) !important;
}

html[data-theme="dark"] body:has(.joy-grid) .site-header {
  background: rgba(15, 23, 42, .82) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
}

html[data-theme="dark"] body:has(.joy-grid) .nav-links {
  background: rgba(29, 42, 64, .54) !important;
  border: 1px solid rgba(148, 163, 184, .18) !important;
  border-radius: 999px;
  padding: 4px;
}

html[data-theme="dark"] body:has(.joy-grid) :is(.nav-links a, .logo) {
  color: var(--ww-joy-muted) !important;
}

html[data-theme="dark"] body:has(.joy-grid) .logo span {
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body:has(.joy-grid) .nav-links a {
  border: 1px solid transparent !important;
  border-radius: 999px;
  padding: 8px 10px;
}

html[data-theme="dark"] body:has(.joy-grid) .nav-links a:is(:hover, :focus-visible) {
  background: var(--ww-joy-elevated) !important;
  border-color: rgba(52, 211, 153, .42) !important;
  color: var(--ww-joy-text) !important;
}

html[data-theme="dark"] body:has(.joy-grid) .nav-links a:is(.ww-current-section, [aria-current="page"]),
html[data-theme="dark"] body:has(.joy-grid) .nav-links .nav-cta,
html[data-theme="dark"] body:has(.joy-grid) .button.primary {
  background: var(--ww-joy-primary) !important;
  border-color: var(--ww-joy-primary) !important;
  color: var(--ww-joy-primary-text) !important;
  box-shadow: 0 16px 34px rgba(52, 211, 153, .22) !important;
}

html[data-theme="dark"] body:has(.joy-grid) :is(h1, h2, h3) {
  color: var(--ww-joy-text) !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body:has(.joy-grid) :is(.hero p:not(.eyebrow), .section-head p, .joy-card p, footer) {
  color: var(--ww-joy-muted) !important;
}

html[data-theme="dark"] body:has(.joy-grid) .eyebrow {
  display: inline-flex;
  width: fit-content;
  padding: 5px 10px;
  border: 1px solid rgba(52, 211, 153, .28);
  border-radius: 999px;
  background: rgba(52, 211, 153, .10) !important;
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body:has(.joy-grid) :is(.button, .ww-theme-option) {
  background: var(--ww-joy-elevated) !important;
  border-color: var(--ww-joy-line) !important;
  color: var(--ww-joy-text) !important;
}

html[data-theme="dark"] body:has(.joy-grid) :is(.button:hover, .button:focus-visible, .ww-theme-option:hover, .ww-theme-option:focus-visible) {
  border-color: rgba(52, 211, 153, .52) !important;
}

/* Events dark mode: calendar, cards, map, and popovers stay on the same night system. */
html[data-theme="dark"] body:has(#events-grid) {
  --ww-events-bg: #080D18;
  --ww-events-surface: #0F172A;
  --ww-events-card: #141F33;
  --ww-events-elevated: #1B2940;
  --ww-events-text: #F8FAFC;
  --ww-events-muted: #CBD5E1;
  --ww-events-subtle: #93A4BA;
  --ww-events-line: rgba(148, 163, 184, .24);
  --ww-events-primary: #34D399;
  --ww-events-primary-text: #052016;
  --ww-events-warm: #FBBF24;
  background:
    radial-gradient(circle at 12% -6%, rgba(52, 211, 153, .12), transparent 22rem),
    radial-gradient(circle at 88% 2%, rgba(251, 191, 36, .09), transparent 20rem),
    linear-gradient(180deg, #0B1220 0%, var(--ww-events-bg) 58%, #070B14 100%) !important;
  color: var(--ww-events-text) !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(
  .header,
  .hero,
  .hero-panel,
  .filters,
  .section:not(.newsletter),
  .event-shortcuts article,
  .event-card,
  .event-expanded,
  .day,
  .calendar-event-card,
  .share-panel,
  .calendar-panel,
  .event-map-frame,
  .event-map-frame .map-selected
) {
  background: linear-gradient(145deg, rgba(20, 31, 51, .96), rgba(15, 23, 42, .96)) !important;
  border-color: var(--ww-events-line) !important;
  color: var(--ww-events-text) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .30) !important;
}

html[data-theme="dark"] body:has(#events-grid) .header {
  background: rgba(15, 23, 42, .82) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
}

html[data-theme="dark"] body:has(#events-grid) .nav {
  background: rgba(29, 42, 64, .54) !important;
  border: 1px solid rgba(148, 163, 184, .18) !important;
  border-radius: 999px;
  padding: 4px;
}

html[data-theme="dark"] body:has(#events-grid) :is(.nav a, .logo) {
  color: var(--ww-events-muted) !important;
}

html[data-theme="dark"] body:has(#events-grid) .logo span {
  background: var(--ww-events-primary) !important;
  color: var(--ww-events-primary-text) !important;
}

html[data-theme="dark"] body:has(#events-grid) .nav a {
  border: 1px solid transparent !important;
}

html[data-theme="dark"] body:has(#events-grid) .nav a:is(:hover, :focus-visible) {
  background: var(--ww-events-elevated) !important;
  border-color: rgba(52, 211, 153, .42) !important;
  color: var(--ww-events-text) !important;
}

html[data-theme="dark"] body:has(#events-grid) .nav a:is(.ww-current-section, [aria-current="page"]),
html[data-theme="dark"] body:has(#events-grid) :is(.chip.active, .action.primary, .calendar-event-actions a:first-child) {
  background: var(--ww-events-primary) !important;
  border-color: var(--ww-events-primary) !important;
  color: var(--ww-events-primary-text) !important;
  box-shadow: 0 16px 34px rgba(52, 211, 153, .22) !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(h1, h2, h3, .event-shortcuts strong, .event-expanded strong, .share-panel strong, .calendar-panel strong, .calendar-event-title) {
  color: var(--ww-events-text) !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(
  .hero p,
  .section-head p,
  .meta,
  .event-card p,
  .event-expanded span,
  .calendar-event-meta,
  .calendar-event-tip,
  .day span,
  .event-shortcuts p,
  .event-map-frame .map-selected small,
  footer.section
) {
  color: var(--ww-events-muted) !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(.eyebrow, .event-date, .event-shortcuts span, .event-map-frame .map-selected span) {
  background: rgba(52, 211, 153, .10) !important;
  border: 1px solid rgba(52, 211, 153, .28) !important;
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(.badge, .badge:nth-child(2n)) {
  background: rgba(52, 211, 153, .12) !important;
  border: 1px solid rgba(52, 211, 153, .28) !important;
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(
  .chip,
  .action,
  .calendar-event-actions a,
  .calendar-event-actions button,
  .share-options a,
  .share-options button,
  .calendar-options a,
  .calendar-options button,
  .newsletter button
) {
  background: var(--ww-events-elevated) !important;
  border-color: var(--ww-events-line) !important;
  color: var(--ww-events-text) !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(
  .chip:hover,
  .action:hover,
  .calendar-event-actions a:hover,
  .calendar-event-actions button:hover,
  .share-options a:hover,
  .share-options button:hover,
  .calendar-options a:hover,
  .calendar-options button:hover
) {
  border-color: rgba(52, 211, 153, .52) !important;
  color: #FFFFFF !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(.event-card.expanded, .calendar-event-card.expanded, .calendar .day.expanded) {
  background: linear-gradient(145deg, rgba(29, 42, 64, .98), rgba(16, 26, 44, .98)) !important;
  border-color: rgba(52, 211, 153, .48) !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(.share-panel::after, .calendar-panel::after) {
  background: #0F172A !important;
  border-color: var(--ww-events-line) !important;
}

html[data-theme="dark"] body:has(#events-grid) .event-map-canvas {
  background: #0B1220 !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(.event-map-empty, .share-copy-fallback, input) {
  background: #0B1220 !important;
  border-color: rgba(148, 163, 184, .34) !important;
  color: var(--ww-events-text) !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(input)::placeholder {
  color: var(--ww-events-subtle) !important;
}

html[data-theme="dark"] body:has(#events-grid) .newsletter {
  background: linear-gradient(145deg, #10251F, #0F172A) !important;
  border-color: rgba(52, 211, 153, .30) !important;
  color: var(--ww-events-text) !important;
}

html[data-theme="dark"] body:has(#events-grid) .newsletter p {
  color: var(--ww-events-muted) !important;
}

html[data-theme="dark"] body:has(#events-grid) :is(.mapboxgl-ctrl-group, .mapboxgl-popup-content) {
  background: rgba(15, 23, 42, .94) !important;
  border: 1px solid var(--ww-events-line) !important;
  color: var(--ww-events-text) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .38) !important;
}

html[data-theme="dark"] body:has(#events-grid) .mapbox-pin span {
  background: var(--ww-events-primary) !important;
  border-color: rgba(255, 255, 255, .9) !important;
  color: var(--ww-events-primary-text) !important;
}

/* Final dark-mode cleanup for city hubs and planner cards that ship their own light surfaces. */
html[data-theme="dark"] body:has(.cities-discovery-section) {
  --ww-city-bg: #080D18;
  --ww-city-surface: #101A2C;
  --ww-city-card: #141F33;
  --ww-city-elevated: #1C2A40;
  --ww-city-text: #F8FAFC;
  --ww-city-muted: #CBD5E1;
  --ww-city-subtle: #9FB0C6;
  --ww-city-line: rgba(148, 163, 184, .26);
  --ww-city-primary: #34D399;
  --ww-city-primary-text: #052016;
  --ww-city-warm: #FBBF24;
  background:
    radial-gradient(circle at 12% -6%, rgba(52, 211, 153, .13), transparent 23rem),
    radial-gradient(circle at 86% 0%, rgba(251, 191, 36, .08), transparent 22rem),
    linear-gradient(180deg, #0B1220 0%, var(--ww-city-bg) 62%, #070B14 100%) !important;
  color: var(--ww-city-text) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .atlas-hero {
  background:
    linear-gradient(90deg, rgba(8, 13, 24, .90), rgba(8, 13, 24, .58) 54%, rgba(8, 13, 24, .38)),
    linear-gradient(180deg, rgba(8, 13, 24, .14), rgba(8, 13, 24, .72)),
    var(--hero) !important;
  background-size: cover !important;
  background-position: center !important;
  border-color: rgba(255, 255, 255, .14) !important;
  color: var(--ww-city-text) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .atlas-hero p {
  color: var(--ww-city-muted) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) :is(
  .hero-panel,
  .cities-filter-panel,
  .cities-map-panel,
  .cities-map-header,
  .destination-results-head,
  .card,
  .card-body
) {
  background: linear-gradient(145deg, rgba(20, 31, 51, .98), rgba(15, 23, 42, .98)) !important;
  border-color: var(--ww-city-line) !important;
  color: var(--ww-city-text) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .32) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .cities-map-header {
  border-bottom: 1px solid var(--ww-city-line) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) :is(h1, h2, h3, strong, .card h3) {
  color: var(--ww-city-text) !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) :is(
  p,
  .meta,
  .hero-panel span,
  .cities-filter-panel p,
  .section-head > p,
  .map-provider-note
) {
  color: var(--ww-city-muted) !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) :is(.atlas-kicker, .section .atlas-kicker) {
  display: inline-flex !important;
  width: fit-content !important;
  padding: 6px 10px !important;
  border: 1px solid rgba(52, 211, 153, .28) !important;
  border-radius: 999px !important;
  background: rgba(52, 211, 153, .12) !important;
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) :is(input, select) {
  background: #0B1220 !important;
  border-color: rgba(148, 163, 184, .36) !important;
  color: var(--ww-city-text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) :is(input, select)::placeholder {
  color: var(--ww-city-subtle) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) :is(input, select):focus {
  border-color: rgba(52, 211, 153, .70) !important;
  box-shadow: 0 0 0 4px rgba(52, 211, 153, .16) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) :is(
  .badge,
  .cities-map-header > span,
  #destination-count
) {
  background: rgba(52, 211, 153, .13) !important;
  border: 1px solid rgba(52, 211, 153, .30) !important;
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .badge:nth-child(2n),
html[data-theme="dark"] body:has(.cities-discovery-section) .badge:nth-child(3n) {
  background: rgba(251, 191, 36, .12) !important;
  border-color: rgba(251, 191, 36, .30) !important;
  color: #FDE68A !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) :is(.btn, button, .cities-mobile-view-toggle button) {
  background: var(--ww-city-elevated) !important;
  border-color: var(--ww-city-line) !important;
  color: var(--ww-city-text) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .mapbox-pin,
html[data-theme="dark"] body:has(.cities-discovery-section) .mapbox-pin:is(:hover, :focus-visible) {
  width: 44px !important;
  height: 54px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .mapbox-pin span {
  background:
    radial-gradient(circle at 32% 26%, rgba(255, 255, 255, .55), transparent 28%),
    linear-gradient(135deg, #38BDF8 0%, #2DD4BF 100%) !important;
  border: 3px solid #071827 !important;
  color: #071827 !important;
  box-shadow:
    0 0 0 4px rgba(45, 212, 191, .20),
    0 14px 26px rgba(0, 0, 0, .32) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .mapbox-pin::after {
  background: linear-gradient(135deg, #2DD4BF 0%, #38BDF8 100%) !important;
  border-color: #071827 !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .mapbox-pin:is(.active, :hover, :focus-visible) span {
  background:
    radial-gradient(circle at 32% 26%, rgba(255, 255, 255, .58), transparent 28%),
    linear-gradient(135deg, #FBBF24 0%, #FB7185 100%) !important;
  color: #21150f !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .mapbox-pin:is(.active, :hover, :focus-visible)::after {
  background: linear-gradient(135deg, #FBBF24 0%, #FB7185 100%) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .mapbox-pin small {
  background: rgba(15, 23, 42, .96) !important;
  border-color: rgba(148, 163, 184, .24) !important;
  color: #F8FAFC !important;
  box-shadow: 0 14px 28px rgba(0, 0, 0, .36) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .mapbox-pin small::after {
  background: rgba(15, 23, 42, .96) !important;
  border-color: rgba(148, 163, 184, .24) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .destination-map-number {
  background:
    radial-gradient(circle at 32% 26%, rgba(255, 255, 255, .55), transparent 28%),
    linear-gradient(135deg, #38BDF8 0%, #2DD4BF 100%) !important;
  border-color: #071827 !important;
  color: #071827 !important;
  box-shadow:
    0 0 0 4px rgba(45, 212, 191, .20),
    0 14px 26px rgba(0, 0, 0, .32) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) :is(.btn.primary, #clear-city-filters, .cities-mobile-view-toggle button.active) {
  background: var(--ww-city-primary) !important;
  border-color: var(--ww-city-primary) !important;
  color: var(--ww-city-primary-text) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) :is(.btn:hover, button:hover, .card:hover, .card:focus-visible) {
  border-color: rgba(52, 211, 153, .52) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .card.destination-card-highlight {
  border: 2px solid rgba(52, 211, 153, .86) !important;
  box-shadow:
    0 0 0 4px rgba(52, 211, 153, .22),
    0 28px 72px rgba(0, 0, 0, .40) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .card.destination-card-highlight::after {
  background: #34D399 !important;
  border-color: rgba(52, 211, 153, .78) !important;
  color: #062018 !important;
  box-shadow: 0 14px 28px rgba(0, 0, 0, .34) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .mapboxgl-ctrl-group {
  background: rgba(248, 250, 252, .96) !important;
  border-color: rgba(15, 23, 42, .18) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) button.mapbox-pin,
html[data-theme="dark"] body:has(.cities-discovery-section) button.mapbox-pin:is(.active, :hover, :focus-visible) {
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body#top :is(
  .pain-btn,
  .play-btn,
  .fbtn,
  .age-btn,
  .budget-btn,
  .distance-btn,
  .weather-btn,
  .area-btn,
  .view-btn,
  .planner-choice,
  .day-rescue-btn,
  .mobile-filter-btn
) {
  background: #162238 !important;
  border: 1px solid rgba(148, 163, 184, .30) !important;
  color: #E2E8F0 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body#top :is(
  .pain-btn:hover,
  .play-btn:hover,
  .fbtn:hover,
  .age-btn:hover,
  .budget-btn:hover,
  .distance-btn:hover,
  .weather-btn:hover,
  .area-btn:hover,
  .view-btn:hover,
  .planner-choice:hover,
  .day-rescue-btn:hover,
  .mobile-filter-btn:hover
) {
  border-color: rgba(52, 211, 153, .55) !important;
  color: #FFFFFF !important;
}

html[data-theme="dark"] body#top :is(
  .pain-btn.active,
  .play-btn.active,
  .fbtn.active,
  .age-btn.active,
  .budget-btn.active,
  .distance-btn.active,
  .weather-btn.active,
  .area-btn.active,
  .view-btn.active,
  .planner-choice.active,
  .day-rescue-btn.active,
  .mobile-filter-btn.active
) {
  background: #34D399 !important;
  border-color: #34D399 !important;
  color: #052016 !important;
  box-shadow: 0 14px 30px rgba(52, 211, 153, .22) !important;
}

html[data-theme="dark"] body#top :is(
  .city-card,
  .destination-card,
  .result-card,
  .activity-result-card,
  .decision-card,
  .weekend-card,
  .activity-card
) {
  background: linear-gradient(145deg, rgba(20, 31, 51, .98), rgba(15, 23, 42, .98)) !important;
  border-color: rgba(148, 163, 184, .26) !important;
  color: #F8FAFC !important;
  box-shadow: 0 22px 54px rgba(0, 0, 0, .30) !important;
}

html[data-theme="dark"] body#top :is(
  .city-card,
  .destination-card,
  .result-card,
  .activity-result-card,
  .decision-card,
  .weekend-card,
  .activity-card
) :is(h3, h4, strong) {
  color: #F8FAFC !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body#top :is(
  .city-card,
  .destination-card,
  .result-card,
  .activity-result-card,
  .decision-card,
  .weekend-card,
  .activity-card
) :is(p, span, small, .meta, .photo-hint) {
  color: #CBD5E1 !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body#top :is(
  .city-card,
  .destination-card,
  .result-card,
  .activity-result-card,
  .decision-card,
  .weekend-card,
  .activity-card
) :is(a, button, .btn, .hero-button) {
  background: #1C2A40 !important;
  border-color: rgba(148, 163, 184, .30) !important;
  color: #F8FAFC !important;
}

html[data-theme="dark"] body#top :is(
  .city-card,
  .destination-card,
  .result-card,
  .activity-result-card,
  .decision-card,
  .weekend-card,
  .activity-card
) :is(a:hover, button:hover, .btn:hover, .hero-button:hover) {
  border-color: rgba(52, 211, 153, .52) !important;
  color: #FFFFFF !important;
}

html[data-theme="dark"] body#top :is(.destination-status, .badge, .tag, .chip) {
  background: rgba(52, 211, 153, .13) !important;
  border: 1px solid rgba(52, 211, 153, .30) !important;
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body:has(.city-shell) {
  --ww-city-page-bg: #080D18;
  --ww-city-page-surface: #101A2C;
  --ww-city-page-card: #141F33;
  --ww-city-page-elevated: #1C2A40;
  --ww-city-page-text: #F8FAFC;
  --ww-city-page-muted: #CBD5E1;
  --ww-city-page-line: rgba(148, 163, 184, .26);
  --ww-city-page-primary: #34D399;
  --ww-city-page-primary-text: #052016;
  background:
    radial-gradient(circle at 12% -6%, rgba(52, 211, 153, .13), transparent 23rem),
    linear-gradient(180deg, #0B1220 0%, var(--ww-city-page-bg) 62%, #070B14 100%) !important;
  color: var(--ww-city-page-text) !important;
}

html[data-theme="dark"] body:has(.city-shell) .city-hero {
  background:
    linear-gradient(90deg, rgba(8, 13, 24, .90), rgba(8, 13, 24, .56) 54%, rgba(8, 13, 24, .34)),
    linear-gradient(180deg, rgba(8, 13, 24, .10), rgba(8, 13, 24, .70)),
    var(--hero) !important;
  background-size: cover !important;
  background-position: center !important;
  border-color: rgba(255, 255, 255, .14) !important;
}

html[data-theme="dark"] body:has(.city-shell) :is(
  .city-shell .hero-panel,
  .city-quick-pick-section,
  .city-quick-card,
  .city-map-section,
  .city-map-card,
  .parent-planning-section,
  .selected-city-header,
  .activity-card,
  .guide-card,
  .hotel-card
) {
  background: linear-gradient(145deg, rgba(20, 31, 51, .98), rgba(15, 23, 42, .98)) !important;
  border-color: var(--ww-city-page-line) !important;
  color: var(--ww-city-page-text) !important;
  box-shadow: 0 22px 54px rgba(0, 0, 0, .30) !important;
}

html[data-theme="dark"] body:has(.city-shell) :is(
  h1,
  h2,
  h3,
  strong,
  .city-quick-card strong,
  .city-shell .hero-panel strong
) {
  color: var(--ww-city-page-text) !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body:has(.city-shell) :is(
  p,
  .city-quick-card p,
  .city-shell .hero-panel span,
  .section-head p,
  .meta,
  .map-provider-note
) {
  color: var(--ww-city-page-muted) !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body:has(.city-shell) :is(.atlas-kicker, .section .atlas-kicker) {
  display: inline-flex !important;
  width: fit-content !important;
  padding: 6px 10px !important;
  border: 1px solid rgba(52, 211, 153, .28) !important;
  border-radius: 999px !important;
  background: rgba(52, 211, 153, .12) !important;
  color: #A7F3D0 !important;
}

html[data-theme="dark"] body:has(.city-shell) :is(
  .city-quick-chip,
  .btn,
  .city-quick-card .btn,
  button,
  a.btn
) {
  background: var(--ww-city-page-elevated) !important;
  border-color: var(--ww-city-page-line) !important;
  color: var(--ww-city-page-text) !important;
}

html[data-theme="dark"] body:has(.city-shell) :is(
  .city-quick-chip.active,
  .city-quick-chip:hover,
  .city-quick-chip:focus-visible,
  .btn.primary,
  .city-quick-number
) {
  background: var(--ww-city-page-primary) !important;
  border-color: var(--ww-city-page-primary) !important;
  color: var(--ww-city-page-primary-text) !important;
}

html[data-theme="dark"] body:has(.city-shell) :is(.badge, .tag, .chip, .destination-status) {
  background: rgba(52, 211, 153, .13) !important;
  border: 1px solid rgba(52, 211, 153, .30) !important;
  color: #A7F3D0 !important;
}

html[data-theme="dark"] :is(.ww-theme-control, .ww-theme-mobile, .ww-theme-options) .ww-theme-option {
  background: transparent !important;
  border-color: transparent !important;
  color: #CBD5E1 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] :is(.ww-theme-control, .ww-theme-mobile, .ww-theme-options) .ww-theme-option:is(:hover, :focus-visible) {
  background: rgba(148, 163, 184, .14) !important;
  border-color: rgba(148, 163, 184, .22) !important;
  color: #F8FAFC !important;
}

html[data-theme="dark"] :is(.ww-theme-control, .ww-theme-mobile, .ww-theme-options) .ww-theme-option.is-active,
html[data-theme="dark"] :is(.ww-theme-control, .ww-theme-mobile, .ww-theme-options) .ww-theme-option[aria-pressed="true"] {
  background: #34D399 !important;
  border-color: #34D399 !important;
  color: #052016 !important;
}

html[data-theme="dark"] body:has(.city-shell) .ww-theme-options .ww-theme-option[aria-pressed="true"],
html[data-theme="dark"] body:has(.cities-discovery-section) .ww-theme-options .ww-theme-option[aria-pressed="true"] {
  background: #34D399 !important;
  border-color: #34D399 !important;
  color: #052016 !important;
}

html[data-theme="dark"] .city-quick-pick-section,
html[data-theme="dark"] .city-quick-card {
  background: linear-gradient(145deg, rgba(20, 31, 51, .98), rgba(15, 23, 42, .98)) !important;
  border-color: rgba(148, 163, 184, .26) !important;
  color: #F8FAFC !important;
  box-shadow: 0 22px 54px rgba(0, 0, 0, .30) !important;
}

html[data-theme="dark"] .city-quick-card strong {
  color: #F8FAFC !important;
  text-shadow: none !important;
}

html[data-theme="dark"] .city-quick-card p {
  color: #CBD5E1 !important;
  text-shadow: none !important;
}

html[data-theme="dark"] .city-quick-card .btn,
html[data-theme="dark"] .city-quick-chip {
  background: #1C2A40 !important;
  border-color: rgba(148, 163, 184, .30) !important;
  color: #F8FAFC !important;
}

html[data-theme="dark"] .city-quick-chip.active,
html[data-theme="dark"] .city-quick-chip:hover,
html[data-theme="dark"] .city-quick-chip:focus-visible {
  background: #34D399 !important;
  border-color: #34D399 !important;
  color: #052016 !important;
}

@media (min-width: 901px) {
  .atlas-header:has(> .ww-theme-desktop) {
    min-height: 118px !important;
    align-items: flex-end !important;
    padding: 64px 24px 16px !important;
    border-radius: 34px !important;
  }

  .atlas-header:has(> .ww-theme-desktop) .atlas-logo {
    position: absolute !important;
    top: 24px !important;
    left: 24px !important;
    z-index: 4 !important;
  }

  .atlas-header > .ww-theme-desktop {
    top: 14px !important;
    right: 24px !important;
    z-index: 4 !important;
  }

  .atlas-header:has(> .ww-theme-desktop) .atlas-nav {
    width: 100% !important;
    margin-left: 0 !important;
    padding: 6px !important;
    padding-right: 6px !important;
  }
}

@media (max-width: 760px) {
  body#top .site-header {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px 14px 14px !important;
  }

  body#top .site-header .logo {
    flex: 0 0 auto !important;
  }

  body#top .site-header .saved-counter {
    margin-left: auto !important;
  }

  body#top .site-header .nav-links {
    order: 5 !important;
    display: flex !important;
    flex: 1 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 4px 0 0 !important;
    padding: 6px !important;
    gap: 6px !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border-radius: 999px !important;
    scrollbar-width: none !important;
  }

  body#top .site-header .nav-links::-webkit-scrollbar {
    display: none !important;
  }

  body#top .site-header .nav-links a {
    flex: 0 0 auto !important;
    min-height: 34px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 12px !important;
    white-space: nowrap !important;
  }
}

html[data-theme="dark"] body:has(#hotel-grid) :is(.filter-panel, .results-bar) {
  background: linear-gradient(145deg, rgba(20, 31, 51, .98), rgba(15, 23, 42, .98)) !important;
  border-color: rgba(148, 163, 184, .28) !important;
  color: #F8FAFC !important;
  box-shadow: 0 20px 46px rgba(0, 0, 0, .30) !important;
}

html[data-theme="dark"] body:has(#hotel-grid) .filter-panel strong,
html[data-theme="dark"] body:has(#hotel-grid) .results-bar span {
  color: #F8FAFC !important;
}

html[data-theme="dark"] body:has(#hotel-grid) .filter-btn {
  background: #1C2A40 !important;
  border-color: rgba(148, 163, 184, .30) !important;
  color: #E2E8F0 !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body:has(#hotel-grid) .filter-btn:is(:hover, :focus-visible) {
  border-color: rgba(52, 211, 153, .56) !important;
  color: #FFFFFF !important;
  outline-color: rgba(52, 211, 153, .5) !important;
}

html[data-theme="dark"] body:has(#hotel-grid) .filter-btn.active {
  background: #34D399 !important;
  border-color: #34D399 !important;
  color: #052016 !important;
}

html[data-theme="dark"] body:has(#hotel-grid) #clear-hotels {
  background: #0F172A !important;
  border-color: rgba(148, 163, 184, .36) !important;
  color: #F8FAFC !important;
}

html[data-theme="dark"] body:has(#hotel-grid) .hotel-page-shell .hotel-destination-hero {
  background:
    radial-gradient(circle at 0% 0%, rgba(221, 121, 47, .16), transparent 24rem),
    radial-gradient(circle at 100% 20%, rgba(32, 114, 142, .1), transparent 22rem),
    linear-gradient(135deg, rgba(255, 253, 248, .98), rgba(251, 245, 234, .9)) !important;
  border-color: #E8DFD2 !important;
  color: #21150F !important;
  box-shadow: 0 20px 52px rgba(36, 20, 13, .10) !important;
}

html[data-theme="dark"] body:has(#hotel-grid) .hotel-page-shell .hotel-destination-hero .atlas-kicker {
  background: rgba(255, 241, 204, .94) !important;
  border-color: rgba(242, 106, 33, .16) !important;
  color: #A74612 !important;
}

html[data-theme="dark"] body:has(#hotel-grid) .hotel-page-shell .hotel-destination-hero h1 {
  color: #21150F !important;
  text-shadow: none !important;
}

html[data-theme="dark"] body:has(#hotel-grid) .hotel-page-shell .hotel-destination-hero p:not(.atlas-kicker) {
  color: #5F5245 !important;
}

html[data-theme="dark"] body:has(.about-flow) :is(.intro-card, .mission-band, .side-card, .find-list li) {
  background: linear-gradient(145deg, rgba(20, 31, 51, .98), rgba(15, 23, 42, .98)) !important;
  border-color: rgba(148, 163, 184, .28) !important;
  color: #F8FAFC !important;
  box-shadow: 0 20px 46px rgba(0, 0, 0, .30) !important;
}

html[data-theme="dark"] body:has(.about-flow) :is(.intro-card, .mission-band p, .side-card span, .find-list li) {
  color: #CBD5E1 !important;
}

html[data-theme="dark"] body:has(.about-flow) :is(.quote, .side-card strong) {
  color: #F8FAFC !important;
}

html[data-theme="dark"] body:has(.about-flow) .hero-media figcaption {
  background: rgba(15, 23, 42, .88) !important;
  border: 1px solid rgba(148, 163, 184, .28) !important;
  color: #F8FAFC !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .cities-mobile-view-toggle {
  background: linear-gradient(145deg, rgba(20, 31, 51, .98), rgba(15, 23, 42, .98)) !important;
  border-color: rgba(148, 163, 184, .28) !important;
  color: #F8FAFC !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .cities-mobile-view-toggle button:not(.active) {
  background: #1C2A40 !important;
  border-color: rgba(148, 163, 184, .30) !important;
  color: #E2E8F0 !important;
}

body:has(.cities-discovery-section) .card.destination-card-highlight {
  border-width: 2px !important;
  border-style: solid !important;
  border-color: rgba(20, 184, 166, .82) !important;
}

html[data-theme="dark"] body:has(.cities-discovery-section) .card.destination-card-highlight {
  border-color: rgba(52, 211, 153, .86) !important;
}

body:has(.cities-discovery-section) button.mapbox-pin,
body:has(.cities-discovery-section) button.mapbox-pin:is(.active, :hover, :focus-visible) {
  -webkit-appearance: none !important;
  appearance: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}

@media (max-width: 760px) {
  body#top > .ww-theme-mobile {
    display: none !important;
  }

  body#top .site-header > .ww-theme-desktop {
    display: block !important;
  }

  body#top .mobile-action-bar {
    display: none !important;
  }

  body#top .site-header .nav-links {
    display: none !important;
  }

  body#top .site-header.nav-open .nav-links {
    display: grid !important;
  }
}