/* ========================================================================== 
   Forecast — neutral, schedule-aware deep dive
   Loads after wp-experience.css and weatherpulse-neutral.css.
   ========================================================================== */

html[data-theme] body.wp-experience.wp-page-forecast #main-scroll,
html[data-theme] body.wp-experience.wp-page-forecast .main-wrapper,
html[data-theme] body.wp-experience.wp-page-forecast .content-backdrop,
html body.wp-experience.wp-page-forecast #main-scroll,
html body.wp-experience.wp-page-forecast .main-wrapper,
html body.wp-experience.wp-page-forecast .content-backdrop {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

html body.wp-experience.wp-page-forecast #main-scroll {
  min-height: 100dvh !important;
}

body.wp-experience.wp-page-forecast .sticky-location-bar {
  isolation: isolate;
  z-index: 92 !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  width: min(calc(100% - 20px), 1220px) !important;
  max-width: 1220px !important;
  min-height: 58px !important;
  margin: max(7px, env(safe-area-inset-top, 0px)) auto 10px !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.62) !important;
  border-radius: 21px !important;
  background: rgba(250, 253, 250, 0.82) !important;
  box-shadow: 0 8px 34px rgba(0, 0, 0, 0.1) !important;
  backdrop-filter: blur(24px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(150%) !important;
}

html[data-theme="night"] body.wp-experience.wp-page-forecast .sticky-location-bar {
  border-color: rgba(255, 255, 255, 0.12) !important;
  background: rgba(17, 17, 17, 0.88) !important;
  box-shadow: 0 10px 36px rgba(0, 0, 0, 0.3) !important;
}

body.wp-experience.wp-page-forecast .sticky-location-bar > .header-spacer:first-child {
  display: none !important;
}

html[data-theme] body.wp-experience.wp-page-forecast .sticky-location-bar .search-pill,
body.wp-experience.wp-page-forecast .sticky-location-bar .search-pill {
  width: 100% !important;
  max-width: none !important;
  min-height: 44px !important;
  justify-content: flex-start !important;
  padding: 8px 10px !important;
  border: 0 !important;
  border-radius: 15px !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-theme] body.wp-experience.wp-page-forecast .sticky-location-bar .search-text,
html[data-theme] body.wp-experience.wp-page-forecast .sticky-location-bar .search-icon,
html[data-theme] body.wp-experience.wp-page-forecast .sticky-location-bar .expand-arrow,
body.wp-experience.wp-page-forecast .sticky-location-bar .search-text,
body.wp-experience.wp-page-forecast .sticky-location-bar .search-icon,
body.wp-experience.wp-page-forecast .sticky-location-bar .expand-arrow,
html[data-theme] body.wp-experience.wp-page-forecast .sticky-location-bar .header-action-btn,
body.wp-experience.wp-page-forecast .sticky-location-bar .header-action-btn {
  color: var(--ds-ink) !important;
}

body.wp-experience.wp-page-forecast .sticky-location-bar .search-text {
  font-size: 1rem !important;
  font-weight: 800 !important;
}

body.wp-experience.wp-page-forecast .sticky-location-bar .header-actions {
  display: flex !important;
  gap: 4px !important;
}

body.wp-experience.wp-page-forecast .sticky-location-bar .header-action-btn {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: var(--ds-faint) !important;
  box-shadow: none !important;
}

/* Bring back the existing live-weather hero without bringing back the phone frame. */
body.wp-experience.wp-page-forecast #weather-engine,
body.wp-experience.wp-page-forecast .hero-spacer,
body.wp-experience.wp-page-forecast .layout-controls-hero {
  display: none !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block {
  position: relative !important;
  display: block !important;
  width: min(calc(100% - 20px), 1240px) !important;
  max-width: 1240px !important;
  height: clamp(270px, 32vw, 410px) !important;
  min-height: 270px !important;
  max-height: 410px !important;
  margin: 0 auto 12px !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: clamp(24px, 3vw, 36px) !important;
  background: #59636b !important;
  box-shadow: var(--ds-shadow) !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block #video-viewport {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: inherit !important;
  background:
    radial-gradient(circle at 82% 14%, rgba(255,255,255,0.24), transparent 23%),
    linear-gradient(145deg, #74828b, #3f484f) !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block #video-viewport::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(90deg, rgba(0,0,0,0.54) 0%, rgba(0,0,0,0.18) 62%, rgba(0,0,0,0.08) 100%);
  pointer-events: none;
}

body.wp-experience.wp-page-forecast .sticky-hero-block #bg-video {
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  object-fit: cover !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block .hero-content-layer,
body.wp-experience.wp-page-forecast .sticky-hero-block .hero-section {
  position: relative !important;
  z-index: 4 !important;
  display: flex !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  max-height: none !important;
  padding: 0 !important;
  border-radius: inherit !important;
  overflow: hidden !important;
  background: transparent !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block .hero-section {
  align-items: flex-end !important;
  padding: clamp(24px, 5vw, 58px) !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block #hero-content {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  gap: 10px !important;
  width: min(100%, 720px) !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block .hero-top-row {
  display: flex !important;
  align-items: flex-end !important;
  gap: clamp(16px, 3vw, 30px) !important;
  margin: 0 !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block .hero-temp-wrap {
  display: flex !important;
  align-items: flex-end !important;
  margin: 0 !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block .hero-temp {
  color: #ffffff !important;
  font-size: clamp(5.2rem, 12vw, 8.8rem) !important;
  font-weight: 850 !important;
  line-height: 0.8 !important;
  letter-spacing: -0.055em !important;
  text-shadow: 0 3px 22px rgba(0, 0, 0, 0.24) !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block .hero-icon {
  width: clamp(58px, 8vw, 88px) !important;
  height: clamp(58px, 8vw, 88px) !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block .hero-details {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 7px 14px !important;
  padding: 0 0 4px !important;
  color: rgba(255, 255, 255, 0.8) !important;
  font-size: 0.85rem !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block .hero-details span {
  color: inherit !important;
  font-weight: 700 !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block .hero-condition {
  margin: 0 !important;
  color: #ffffff !important;
  font-size: clamp(1.45rem, 3.2vw, 2.5rem) !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: -0.035em !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block .last-updated,
body.wp-experience.wp-page-forecast .sticky-hero-block .weather-source-attribution {
  color: rgba(255, 255, 255, 0.7) !important;
}

body.wp-experience.wp-page-forecast .sticky-hero-block.compact,
body.wp-experience.wp-page-forecast .sticky-hero-block.compact .hero-content-layer,
body.wp-experience.wp-page-forecast .sticky-hero-block.compact .hero-section {
  transform: none !important;
}

body.wp-experience.wp-page-forecast .forecast-alert-shell,
body.wp-experience.wp-page-forecast #weather-error-state {
  width: min(calc(100% - 24px), 1180px) !important;
  margin: 0 auto 12px !important;
  padding: 0 !important;
}

body.wp-experience.wp-page-forecast .alert-summary-card,
body.wp-experience.wp-page-forecast .alert-strip {
  border: 1px solid var(--ds-line) !important;
  border-radius: 20px !important;
  background: var(--ds-paper) !important;
  color: var(--ds-ink) !important;
  box-shadow: var(--ds-shadow-soft) !important;
}

body.wp-experience.wp-page-forecast .content-container,
body.wp-experience.wp-page-forecast #content-grid {
  width: min(calc(100% - 24px), 1240px) !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 6px 0 calc(120px + env(safe-area-inset-bottom, 0px)) !important;
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: 18px !important;
}

body.wp-experience.wp-page-forecast #promo-banner,
body.wp-experience.wp-page-forecast #card-forecast-signals,
body.wp-experience.wp-page-forecast .reorder-controls,
body.wp-experience.wp-page-forecast .layout-controls,
body.wp-experience.wp-page-forecast #show-16-day-btn {
  display: none !important;
}

/* Forecast keeps two compact community-partner slots: one near the brief and
   one after the deeper forecast sections. */
body.wp-experience.wp-page-forecast #promo-banner {
  display: block !important;
  grid-column: 1 / -1 !important;
  order: 3 !important;
}
body.wp-experience.wp-page-forecast #card-current-details { order: 1 !important; }
body.wp-experience.wp-page-forecast #forecast-day-planner { order: 2 !important; }
body.wp-experience.wp-page-forecast #card-hourly { order: 4 !important; }
body.wp-experience.wp-page-forecast #card-activities,
body.wp-experience.wp-page-forecast #card-daily { order: 5 !important; }
body.wp-experience.wp-page-forecast #card-aqi { order: 6 !important; }
body.wp-experience.wp-page-forecast #card-events { order: 7 !important; }
body.wp-experience.wp-page-forecast #card-sponsors { order: 8 !important; }

body.wp-experience.wp-page-forecast .forecast-setup[hidden] { display: none !important; }
body.wp-experience.wp-page-forecast .forecast-setup {
  position: fixed !important;
  inset: 0 !important;
  z-index: 220 !important;
  display: grid !important;
  place-items: center !important;
  padding: 18px !important;
  background: rgba(0,0,0,0.48) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-card {
  width: min(100%, 520px) !important;
  padding: clamp(22px, 5vw, 36px) !important;
  border: 1px solid var(--ds-line) !important;
  border-radius: 28px !important;
  background: var(--ds-paper-solid) !important;
  color: var(--ds-ink) !important;
  box-shadow: var(--ds-shadow) !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-card h2 {
  margin: 8px 0 8px !important;
  color: var(--ds-ink) !important;
  font-size: clamp(1.8rem, 5vw, 2.8rem) !important;
  font-weight: 850 !important;
  line-height: 0.98 !important;
  letter-spacing: -0.05em !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-card p {
  margin: 0 0 18px !important;
  color: var(--ds-muted) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-name {
  display: grid !important;
  gap: 7px !important;
  color: var(--ds-muted) !important;
  font-size: 0.75rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-name input {
  width: 100% !important;
  min-height: 50px !important;
  padding: 12px 14px !important;
  border: 1px solid var(--ds-line) !important;
  border-radius: 15px !important;
  background: var(--ds-soft) !important;
  color: var(--ds-ink) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-priorities {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 14px !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-priorities button {
  min-height: 48px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--ds-line) !important;
  border-radius: 15px !important;
  background: var(--ds-soft) !important;
  color: var(--ds-ink) !important;
  font-weight: 800 !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-priorities button.is-selected {
  border-color: var(--ds-accent) !important;
  background: var(--ds-accent) !important;
  color: #ffffff !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-actions {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 10px !important;
  margin-top: 18px !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-skip,
body.wp-experience.wp-page-forecast .forecast-setup-save {
  min-height: 48px !important;
  padding: 10px 16px !important;
  border-radius: 15px !important;
  font-weight: 850 !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-skip {
  border: 0 !important;
  background: transparent !important;
  color: var(--ds-muted) !important;
}
body.wp-experience.wp-page-forecast .forecast-setup-save {
  border: 0 !important;
  background: var(--ds-accent) !important;
  color: #ffffff !important;
}
html[data-theme="night"] body.wp-experience.wp-page-forecast .forecast-setup-save,
html[data-theme="night"] body.wp-experience.wp-page-forecast .forecast-setup-priorities button.is-selected {
  color: #111111 !important;
}

body.wp-experience.wp-page-forecast #content-grid > .card,
body.wp-experience.wp-page-forecast #content-grid > section.card {
  min-width: 0 !important;
  margin: 0 !important;
  padding: clamp(20px, 3vw, 34px) !important;
  overflow: hidden !important;
  border: 1px solid var(--ds-line) !important;
  border-radius: clamp(22px, 3vw, 32px) !important;
  background: var(--ds-paper) !important;
  color: var(--ds-ink) !important;
  box-shadow: var(--ds-shadow-soft) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.wp-experience.wp-page-forecast #card-current-details { grid-column: 1 / -1 !important; order: 1 !important; }
body.wp-experience.wp-page-forecast #card-hourly { grid-column: 1 / -1 !important; order: 2 !important; }
body.wp-experience.wp-page-forecast #card-daily { grid-column: 1 / 8 !important; order: 3 !important; }
body.wp-experience.wp-page-forecast #card-activities { grid-column: 8 / -1 !important; order: 4 !important; }
body.wp-experience.wp-page-forecast #card-aqi { grid-column: 1 / 6 !important; order: 5 !important; }
body.wp-experience.wp-page-forecast #card-events { grid-column: 6 / -1 !important; order: 6 !important; }
body.wp-experience.wp-page-forecast #card-sponsors { grid-column: 1 / -1 !important; order: 7 !important; }

body.wp-experience.wp-page-forecast #card-aqi[hidden] {
  display: none !important;
}

body.wp-experience.wp-page-forecast .forecast-section-note {
  margin: 8px 0 0 !important;
  color: var(--ds-muted) !important;
  font-size: 0.92rem !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

body.wp-experience.wp-page-forecast .forecast-current-detail-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

body.wp-experience.wp-page-forecast .forecast-detail-metric {
  display: flex !important;
  align-items: flex-start !important;
  gap: 11px !important;
  min-width: 0 !important;
  min-height: 116px !important;
  padding: 15px !important;
  border: 1px solid var(--ds-line) !important;
  border-radius: 18px !important;
  background: var(--ds-soft) !important;
  color: var(--ds-ink) !important;
}

body.wp-experience.wp-page-forecast .forecast-detail-metric > .material-icons-round {
  flex: 0 0 auto !important;
  width: 32px !important;
  height: 32px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 11px !important;
  background: var(--ds-paper-solid) !important;
  color: var(--ds-ink) !important;
  font-size: 19px !important;
}

body.wp-experience.wp-page-forecast .forecast-detail-metric > div {
  min-width: 0 !important;
}

body.wp-experience.wp-page-forecast .forecast-detail-metric span:not(.material-icons-round) {
  display: block !important;
  color: var(--ds-muted) !important;
  font-size: 0.7rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

body.wp-experience.wp-page-forecast .forecast-detail-metric strong {
  display: block !important;
  margin-top: 6px !important;
  color: var(--ds-ink) !important;
  font-size: 1.05rem !important;
  font-weight: 850 !important;
  line-height: 1.15 !important;
}

body.wp-experience.wp-page-forecast .forecast-detail-metric small {
  display: block !important;
  margin-top: 5px !important;
  color: var(--ds-muted) !important;
  font-size: 0.76rem !important;
  line-height: 1.3 !important;
}

body.wp-experience.wp-page-forecast .forecast-detail-metric.is-loading {
  min-height: 104px !important;
  background: linear-gradient(90deg, var(--ds-soft), var(--ds-paper-solid), var(--ds-soft)) !important;
  background-size: 200% 100% !important;
}

body.wp-experience.wp-page-forecast .forecast-schedule-context[hidden] {
  display: none !important;
}

body.wp-experience.wp-page-forecast .forecast-schedule-context {
  display: grid !important;
  grid-template-columns: minmax(180px, 0.32fr) minmax(0, 1fr) !important;
  gap: 14px !important;
  margin: 4px 0 16px !important;
  padding: 14px !important;
  border: 1px solid var(--ds-line) !important;
  border-radius: 18px !important;
  background: var(--ds-soft) !important;
}

body.wp-experience.wp-page-forecast .forecast-schedule-head,
body.wp-experience.wp-page-forecast .forecast-schedule-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
}

body.wp-experience.wp-page-forecast .forecast-schedule-head > .material-icons-round,
body.wp-experience.wp-page-forecast .forecast-schedule-item > .material-icons-round {
  flex: 0 0 auto !important;
  color: var(--ds-ink) !important;
}

body.wp-experience.wp-page-forecast .forecast-schedule-head span:not(.material-icons-round),
body.wp-experience.wp-page-forecast .forecast-schedule-item span:not(.material-icons-round) {
  display: block !important;
  color: var(--ds-muted) !important;
  font-size: 0.7rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
}

body.wp-experience.wp-page-forecast .forecast-schedule-head strong,
body.wp-experience.wp-page-forecast .forecast-schedule-item strong {
  display: block !important;
  margin-top: 4px !important;
  color: var(--ds-ink) !important;
  font-size: 0.92rem !important;
  font-weight: 850 !important;
}

body.wp-experience.wp-page-forecast .forecast-schedule-items {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

body.wp-experience.wp-page-forecast .forecast-schedule-item {
  padding: 11px !important;
  border: 1px solid var(--ds-line) !important;
  border-radius: 14px !important;
  background: var(--ds-paper-solid) !important;
}

body.wp-experience.wp-page-forecast .forecast-schedule-item small {
  display: block !important;
  margin-top: 4px !important;
  color: var(--ds-muted) !important;
  font-size: 0.74rem !important;
  line-height: 1.3 !important;
}

body.wp-experience.wp-page-forecast .card-title,
body.wp-experience.wp-page-forecast .wp-planner-title,
body.wp-experience.wp-page-forecast .wp-activity-selected {
  color: var(--ds-ink) !important;
  font-size: clamp(1.35rem, 2.8vw, 2.15rem) !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
}

body.wp-experience.wp-page-forecast .wp-section-kicker,
body.wp-experience.wp-page-forecast .sponsor-spot-label {
  color: var(--ds-muted) !important;
  font-size: 0.7rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.11em !important;
  text-transform: uppercase !important;
}

body.wp-experience.wp-page-forecast .wp-planner-header,
body.wp-experience.wp-page-forecast .wp-activity-forecast-head,
body.wp-experience.wp-page-forecast .card-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 14px !important;
  margin-bottom: 18px !important;
}

body.wp-experience.wp-page-forecast .wp-planner-heading {
  min-width: 0;
}

body.wp-experience.wp-page-forecast .wp-planner-summary,
body.wp-experience.wp-page-forecast .hourly-context-note,
body.wp-experience.wp-page-forecast .wp-activity-summary {
  color: var(--ds-muted) !important;
  font-weight: 650 !important;
  line-height: 1.45 !important;
}

body.wp-experience.wp-page-forecast .wp-plan-chip {
  flex: 0 0 auto;
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 9px 12px !important;
  border: 1px solid var(--ds-line) !important;
  border-radius: 999px !important;
  background: var(--ds-soft) !important;
  color: var(--ds-ink) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
}

body.wp-experience.wp-page-forecast .wp-forecast-mode-strip,
body.wp-experience.wp-page-forecast .wp-activity-tabs {
  display: flex !important;
  gap: 8px !important;
  margin: 16px 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}

body.wp-experience.wp-page-forecast .wp-forecast-mode-strip::-webkit-scrollbar,
body.wp-experience.wp-page-forecast .wp-activity-tabs::-webkit-scrollbar { display: none; }

body.wp-experience.wp-page-forecast .wp-forecast-mode-strip button,
body.wp-experience.wp-page-forecast .wp-activity-tab,
body.wp-experience.wp-page-forecast .hourly-pill,
body.wp-experience.wp-page-forecast .aqi-expand-btn,
body.wp-experience.wp-page-forecast .wp-activity-manage-btn {
  min-height: 42px !important;
  padding: 9px 13px !important;
  border: 1px solid var(--ds-line) !important;
  border-radius: 999px !important;
  background: var(--ds-soft) !important;
  color: var(--ds-ink) !important;
  box-shadow: none !important;
  font-weight: 750 !important;
  white-space: nowrap !important;
}

body.wp-experience.wp-page-forecast .wp-forecast-mode-strip button.is-active,
body.wp-experience.wp-page-forecast .wp-forecast-mode-strip button[aria-pressed="true"],
body.wp-experience.wp-page-forecast .wp-activity-tab.is-active,
body.wp-experience.wp-page-forecast .hourly-pill.active {
  border-color: var(--ds-accent) !important;
  background: var(--ds-accent) !important;
  color: var(--ds-paper-solid) !important;
}

html[data-theme="night"] body.wp-experience.wp-page-forecast .wp-forecast-mode-strip button.is-active,
html[data-theme="night"] body.wp-experience.wp-page-forecast .wp-forecast-mode-strip button[aria-pressed="true"],
html[data-theme="night"] body.wp-experience.wp-page-forecast .wp-activity-tab.is-active,
html[data-theme="night"] body.wp-experience.wp-page-forecast .hourly-pill.active {
  color: #111111 !important;
}

body.wp-experience.wp-page-forecast .wp-decision-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 18px !important;
}

body.wp-experience.wp-page-forecast .wp-decision-card,
body.wp-experience.wp-page-forecast .wp-daypart,
body.wp-experience.wp-page-forecast .wp-activity-factors,
body.wp-experience.wp-page-forecast .aqi-summary,
body.wp-experience.wp-page-forecast .details-panel {
  border: 1px solid var(--ds-line) !important;
  border-radius: 18px !important;
  background: var(--ds-soft) !important;
  color: var(--ds-ink) !important;
  box-shadow: none !important;
}

body.wp-experience.wp-page-forecast .wp-decision-card {
  min-height: 112px !important;
  padding: 15px !important;
}

body.wp-experience.wp-page-forecast .wp-decision-card > span,
body.wp-experience.wp-page-forecast .wp-daypart-time {
  display: block !important;
  margin-bottom: 8px !important;
  color: var(--ds-muted) !important;
  font-size: 0.7rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

body.wp-experience.wp-page-forecast .wp-decision-card strong,
body.wp-experience.wp-page-forecast .wp-daypart strong {
  color: var(--ds-ink) !important;
  font-size: 0.96rem !important;
  line-height: 1.25 !important;
}

body.wp-experience.wp-page-forecast .wp-daypart-strip {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 10px !important;
}

body.wp-experience.wp-page-forecast .wp-daypart {
  padding: 15px !important;
}

body.wp-experience.wp-page-forecast .wp-daypart small {
  display: block !important;
  margin-top: 5px !important;
  color: var(--ds-muted) !important;
  line-height: 1.35 !important;
}

body.wp-experience.wp-page-forecast .wp-alert-context {
  display: none !important;
  align-items: center !important;
  gap: 10px !important;
  margin-top: 12px !important;
  padding: 12px 14px !important;
  border-radius: 16px !important;
  background: rgba(184, 116, 21, 0.12) !important;
  color: var(--ds-ink) !important;
}

body.wp-experience.wp-page-forecast .wp-alert-context.show { display: flex !important; }

body.wp-experience.wp-page-forecast .daily-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
}

body.wp-experience.wp-page-forecast .day-row,
body.wp-experience.wp-page-forecast .hour-row {
  min-height: 62px !important;
  border: 1px solid var(--ds-line) !important;
  border-radius: 16px !important;
  background: var(--ds-soft) !important;
  color: var(--ds-ink) !important;
  box-shadow: none !important;
}

body.wp-experience.wp-page-forecast .day-row * ,
body.wp-experience.wp-page-forecast .hour-row * {
  color: inherit;
}

body.wp-experience.wp-page-forecast .day-row .day-name,
body.wp-experience.wp-page-forecast .day-row .range-temp-text,
body.wp-experience.wp-page-forecast .hour-row .hour-list-temp {
  color: var(--ds-ink) !important;
  font-weight: 800 !important;
}

body.wp-experience.wp-page-forecast .hourly-card { overflow: visible !important; }

body.wp-experience.wp-page-forecast .hourly-controls {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

body.wp-experience.wp-page-forecast .hourly-dropdown {
  z-index: 120 !important;
  border: 1px solid var(--ds-line) !important;
  border-radius: 18px !important;
  background: var(--ds-paper-solid) !important;
  color: var(--ds-ink) !important;
  box-shadow: var(--ds-shadow) !important;
}

body.wp-experience.wp-page-forecast .hourly-dropdown-item {
  color: var(--ds-ink) !important;
}

body.wp-experience.wp-page-forecast .hourly-scroll {
  padding: 8px 0 2px !important;
  overflow-x: auto !important;
  background: transparent !important;
}

body.wp-experience.wp-page-forecast .hour-item {
  min-width: 66px !important;
  margin-right: 6px !important;
  color: var(--ds-ink) !important;
}

body.wp-experience.wp-page-forecast .hour-val-float,
body.wp-experience.wp-page-forecast .hour-time {
  color: var(--ds-ink) !important;
  text-shadow: none !important;
}

body.wp-experience.wp-page-forecast .wp-activity-summary {
  margin: 4px 0 14px !important;
}

body.wp-experience.wp-page-forecast .wp-activity-chart {
  min-width: 0 !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}

body.wp-experience.wp-page-forecast .wp-activity-chart::-webkit-scrollbar { display: none; }

body.wp-experience.wp-page-forecast .wp-activity-scale,
body.wp-experience.wp-page-forecast .wp-activity-bars {
  min-width: 520px !important;
}

body.wp-experience.wp-page-forecast .wp-activity-hour-label {
  color: var(--ds-ink) !important;
  font-weight: 750 !important;
}

body.wp-experience.wp-page-forecast .wp-activity-bar-track {
  border: 1px solid var(--ds-line) !important;
  background: var(--ds-soft) !important;
}

body.wp-experience.wp-page-forecast .wp-activity-factors {
  margin-top: 14px !important;
  padding: 12px !important;
}

body.wp-experience.wp-page-forecast .sponsor-spot {
  min-height: 0 !important;
}

body.wp-experience.wp-page-forecast .sponsor-spot-frame,
body.wp-experience.wp-page-forecast .sponsor-spot-image-stage {
  min-height: 0 !important;
  height: clamp(96px, 14vw, 148px) !important;
  border-radius: 18px !important;
  background: var(--ds-soft) !important;
}

body.wp-experience.wp-page-forecast .sponsor-spot-image {
  object-fit: contain !important;
}

body.wp-experience.wp-page-forecast .sponsor-nav-btn,
body.wp-experience.wp-page-forecast .sponsor-spot-cta,
body.wp-experience.wp-page-forecast .btn,
body.wp-experience.wp-page-forecast .card-action {
  border: 1px solid var(--ds-line) !important;
  background: var(--ds-soft) !important;
  color: var(--ds-ink) !important;
  box-shadow: none !important;
}

body.wp-experience.wp-page-forecast .modal-content,
body.wp-experience.wp-page-forecast .forecast-detail-sheet {
  border-color: var(--ds-line) !important;
  background: var(--ds-paper-solid) !important;
  color: var(--ds-ink) !important;
}

@media (max-width: 759px) {
  body.wp-experience.wp-page-forecast .sticky-location-bar {
    width: calc(100% - 12px) !important;
    margin-bottom: 6px !important;
    padding: 6px !important;
    border-radius: 18px !important;
  }

  body.wp-experience.wp-page-forecast .sticky-location-bar .header-action-btn {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }

  body.wp-experience.wp-page-forecast .sticky-hero-block {
    width: calc(100% - 12px) !important;
    height: 272px !important;
    min-height: 272px !important;
    max-height: 272px !important;
    margin-bottom: 8px !important;
    border-radius: 24px !important;
  }

  body.wp-experience.wp-page-forecast .sticky-hero-block .hero-section {
    padding: 24px 20px !important;
  }

  body.wp-experience.wp-page-forecast .sticky-hero-block .hero-temp {
    font-size: clamp(4.8rem, 23vw, 6.4rem) !important;
  }

  body.wp-experience.wp-page-forecast .sticky-hero-block .hero-icon {
    width: 58px !important;
    height: 58px !important;
  }

  body.wp-experience.wp-page-forecast .sticky-hero-block .hero-details {
    max-width: 130px !important;
    gap: 4px 8px !important;
    font-size: 0.76rem !important;
  }

  body.wp-experience.wp-page-forecast .forecast-alert-shell,
  body.wp-experience.wp-page-forecast #weather-error-state {
    width: calc(100% - 12px) !important;
    margin-bottom: 8px !important;
  }

  body.wp-experience.wp-page-forecast .content-container,
  body.wp-experience.wp-page-forecast #content-grid {
    width: calc(100% - 12px) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 9px !important;
    padding-top: 0 !important;
  }

  body.wp-experience.wp-page-forecast #content-grid > .card,
  body.wp-experience.wp-page-forecast #content-grid > section.card {
    width: 100% !important;
    padding: 18px !important;
    border-radius: 22px !important;
  }

  body.wp-experience.wp-page-forecast #card-current-details { order: 1 !important; }
  body.wp-experience.wp-page-forecast #card-hourly { order: 2 !important; }
  body.wp-experience.wp-page-forecast #card-daily { order: 3 !important; }
  body.wp-experience.wp-page-forecast #card-activities { order: 4 !important; }
  body.wp-experience.wp-page-forecast #card-aqi { order: 5 !important; }
  body.wp-experience.wp-page-forecast #card-events { order: 6 !important; }
  body.wp-experience.wp-page-forecast #card-sponsors { order: 7 !important; }

  body.wp-experience.wp-page-forecast .wp-planner-header,
  body.wp-experience.wp-page-forecast .card-header {
    margin-bottom: 14px !important;
  }

  body.wp-experience.wp-page-forecast .wp-planner-title,
  body.wp-experience.wp-page-forecast .card-title,
  body.wp-experience.wp-page-forecast .wp-activity-selected {
    font-size: 1.45rem !important;
  }

  body.wp-experience.wp-page-forecast .wp-plan-chip {
    max-width: 42% !important;
    padding: 8px 10px !important;
  }

  body.wp-experience.wp-page-forecast .wp-decision-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  body.wp-experience.wp-page-forecast .forecast-current-detail-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  body.wp-experience.wp-page-forecast .forecast-detail-metric {
    min-height: 106px !important;
    padding: 12px !important;
    gap: 8px !important;
  }

  body.wp-experience.wp-page-forecast .forecast-detail-metric > .material-icons-round {
    width: 29px !important;
    height: 29px !important;
    font-size: 17px !important;
  }

  body.wp-experience.wp-page-forecast .forecast-schedule-context {
    grid-template-columns: 1fr !important;
  }

  body.wp-experience.wp-page-forecast .forecast-schedule-items {
    display: flex !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
  }

  body.wp-experience.wp-page-forecast .forecast-schedule-items::-webkit-scrollbar { display: none; }

  body.wp-experience.wp-page-forecast .forecast-schedule-item {
    flex: 0 0 min(86%, 280px) !important;
  }

  body.wp-experience.wp-page-forecast .wp-decision-card {
    min-height: 105px !important;
    padding: 13px !important;
  }

  body.wp-experience.wp-page-forecast .wp-daypart-strip {
    display: flex !important;
    overflow-x: auto !important;
    scroll-snap-type: x proximity;
    scrollbar-width: none !important;
  }

  body.wp-experience.wp-page-forecast .wp-daypart-strip::-webkit-scrollbar { display: none; }

  body.wp-experience.wp-page-forecast .wp-daypart {
    flex: 0 0 min(78%, 260px) !important;
    scroll-snap-align: start;
  }

  body.wp-experience.wp-page-forecast .hourly-controls {
    align-items: flex-end !important;
  }

  body.wp-experience.wp-page-forecast .hourly-pill {
    max-width: 190px !important;
  }

  body.wp-experience.wp-page-forecast .sponsor-spot-frame,
  body.wp-experience.wp-page-forecast .sponsor-spot-image-stage {
    height: 104px !important;
  }

  body.wp-experience.wp-page-forecast #promo-banner {
    order: 3 !important;
  }
  body.wp-experience.wp-page-forecast #card-current-details { order: 1 !important; }
  body.wp-experience.wp-page-forecast #forecast-day-planner { order: 2 !important; }
  body.wp-experience.wp-page-forecast #card-hourly { order: 4 !important; }
  body.wp-experience.wp-page-forecast #card-activities { order: 5 !important; }
  body.wp-experience.wp-page-forecast #card-daily { order: 6 !important; }
  body.wp-experience.wp-page-forecast #card-aqi { order: 6 !important; }
  body.wp-experience.wp-page-forecast #card-events { order: 7 !important; }
  body.wp-experience.wp-page-forecast #card-sponsors { order: 8 !important; }
}

@media (max-width: 390px) {
  body.wp-experience.wp-page-forecast .sticky-hero-block .hero-details {
    display: grid !important;
    grid-template-columns: auto auto !important;
  }

  body.wp-experience.wp-page-forecast .wp-plan-chip {
    max-width: 46% !important;
    font-size: 0.72rem !important;
  }

  body.wp-experience.wp-page-forecast .day-row {
    padding-inline: 9px !important;
  }
}

@media (min-width: 760px) {
  html body.wp-experience.wp-page-forecast:not(.wp-shell-embedded-nav) #main-scroll,
  html body.wp-experience.wp-page-forecast:not(.wp-shell-embedded-nav) .main-wrapper,
  html body.wp-experience.wp-page-forecast:not(.wp-shell-embedded-nav) .content-backdrop {
    width: 100% !important;
    max-width: none !important;
  }
}

body.wp-experience.wp-page-forecast.wp-shell-embedded-nav #main-scroll,
body.wp-experience.wp-page-forecast.wp-shell-embedded-nav .main-wrapper,
body.wp-experience.wp-page-forecast.wp-shell-embedded-nav .content-backdrop,
body.wp-experience.wp-page-forecast.wp-shell-embedded-nav .content-container {
  max-width: 560px !important;
  margin-inline: auto !important;
}

@media (prefers-reduced-motion: reduce) {
  body.wp-experience.wp-page-forecast .sticky-hero-block #bg-video,
  body.wp-experience.wp-page-forecast .sticky-hero-block,
  body.wp-experience.wp-page-forecast .card,
  body.wp-experience.wp-page-forecast button {
    transition: none !important;
  }
}
