/* ==========================================================================
   Ward Reservation Weather — Modern theme overlay
   ========================================================================== */
html.theme-modern {
  --wx-bg: #e8eef2;
  --wx-ink: #1c2b36;
  --wx-muted: #5a6f7d;
  --wx-line: #c9d6df;
  --wx-panel: #ffffff;
  --wx-accent: #1f6f8b;
  --wx-accent2: #2a9d8f;
  --wx-warm: #c45c26;
  --wx-header: #143447;
  --wx-radius: 14px;
  --wx-shadow: 0 10px 30px rgba(20, 52, 71, 0.08);
  --wx-font: "Figtree", "Segoe UI", sans-serif;
  --wx-display: "Fraunces", Georgia, serif;
  --wx-sidebar: 10.5em;
  --wx-page-gutter: 12px;
  --wx-page-max: 1480px;
  /* Center rail fills #main-copy; modules stay locked together at 100% */
  --wx-col: 100%;
}
html.theme-modern body {
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(42,157,143,0.18), transparent 55%),
    radial-gradient(900px 500px at 100% 0%, rgba(31,111,139,0.16), transparent 50%),
    linear-gradient(180deg, #dfe8ee 0%, var(--wx-bg) 40%, #d7e2ea 100%) !important;
  color: var(--wx-ink) !important;
  font-family: var(--wx-font) !important;
  font-size: 15px !important;
}
html.theme-modern #page {
  max-width: min(96vw, var(--wx-page-max)) !important;
  width: 100% !important;
  margin: 18px auto !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html.theme-modern #header {
  background: linear-gradient(135deg, #0f2a38 0%, #1f6f8b 55%, #2a9d8b 120%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--wx-radius) !important;
  box-shadow: var(--wx-shadow) !important;
  padding: 14px 18px 0 18px !important;
  margin: 0 12px 14px 12px !important;
  overflow: visible !important;
  min-height: 0 !important;
  height: auto !important;
}
html.theme-modern #header::after {
  content: "";
  display: table;
  clear: both;
}
html.theme-modern #header .headerTitle,
html.theme-modern #header .headerTitle a {
  font-family: var(--wx-display) !important;
  font-size: 1.6rem !important;
  font-weight: 700 !important;
  color: #fff !important;
  text-decoration: none !important;
  letter-spacing: -0.02em !important;
  text-shadow: none !important;
  line-height: 1.2 !important;
}
html.theme-modern #header .headerTemp,
html.theme-modern #header .headerTemp #ajaxbigtemp {
  color: #fff !important;
  font-family: var(--wx-display) !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
}
html.theme-modern #header .subHeader,
html.theme-modern #header .subHeaderRight {
  color: rgba(255,255,255,0.92) !important;
  background: rgba(0,0,0,0.18) !important;
  font-size: 0.9rem !important;
  line-height: 1.35 !important;
}
html.theme-modern #header .subHeaderRight,
html.theme-modern #header .subHeaderRight * {
  font-size: 0.85rem !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
}
html.theme-modern #header .wx-theme-toggle {
  background: rgba(255,255,255,0.14);
  border-color: rgba(255,255,255,0.22);
}
html.theme-modern #header .wx-theme-toggle .wx-theme-label { color: rgba(255,255,255,0.8); }
html.theme-modern #header .wx-theme-toggle .wx-theme-opt { color: #fff; }
html.theme-modern #header .wx-theme-toggle .wx-theme-opt.active {
  background: #fff;
  color: #143447;
}

html.theme-modern .leftSideBar {
  background: var(--wx-panel) !important;
  border: 1px solid var(--wx-line) !important;
  border-radius: var(--wx-radius) !important;
  box-shadow: var(--wx-shadow) !important;
  margin: 0 0 14px 12px !important;
  padding: 8px 6px !important;
  width: 9.5em !important;
  float: left !important;
  clear: left !important;
}
html.theme-modern .leftSideBar a {
  border-radius: 8px !important;
  padding: 7px 8px !important;
  color: var(--wx-ink) !important;
  font-weight: 600 !important;
}
html.theme-modern .leftSideBar a:hover {
  background: #e7f3f1 !important;
  color: var(--wx-accent) !important;
}
/* Flyout menu: opaque panels that clear the Navigation column */
html.theme-modern .leftSideBar {
  overflow: visible !important;
  position: relative;
  z-index: 40;
}
html.theme-modern .flyoutmenu {
  position: relative;
  z-index: 50;
  overflow: visible !important;
}
html.theme-modern .flyoutmenu ul {
  padding-left: 0 !important;
  width: auto !important;
  overflow: visible !important;
}
html.theme-modern .flyoutmenu > ul {
  width: 100% !important;
}
html.theme-modern .flyoutmenu li {
  float: none !important;
  width: 100% !important;
  margin: 0 0 5px 0 !important;
  overflow: visible !important;
  background-color: #ffffff !important;
  background-image: none !important;
  position: relative;
}
html.theme-modern .flyoutmenu li:not(.sub) {
  background-image: none !important;
}
html.theme-modern .flyoutmenu li.sub {
  background-image: url(icons-modern/flyout-sub.svg) !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-color: #ffffff !important;
}
html.theme-modern .flyoutmenu a,
html.theme-modern .flyoutmenu a:visited {
  border: 1px solid #1a1a1a !important;
  border-width: 1px !important;
  width: auto !important;
  box-sizing: border-box !important;
  line-height: 1.35 !important;
  background-color: #ffffff !important;
}
html.theme-modern .flyoutmenu li:hover > a,
html.theme-modern .flyoutmenu a:hover,
html.theme-modern .flyoutmenu a:active,
html.theme-modern .flyoutmenu a:focus {
  background-color: #e7f3f1 !important;
  color: var(--wx-accent) !important;
}
html.theme-modern .flyoutmenu li ul {
  visibility: hidden;
  left: calc(100% + 10px) !important;
  top: 0 !important;
  margin: 0 !important;
  padding: 8px !important;
  width: max-content !important;
  min-width: 13em !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid var(--wx-line, #c5d0da) !important;
  border-radius: 8px !important;
  box-shadow: 0 10px 28px rgba(20, 40, 60, 0.22) !important;
  z-index: 1000 !important;
}
html.theme-modern .flyoutmenu li:hover > ul,
html.theme-modern .flyoutmenu li:focus-within > ul {
  visibility: visible !important;
}
html.theme-modern .flyoutmenu li ul li {
  width: 100% !important;
  margin: 0 0 4px 0 !important;
  background: #ffffff !important;
  background-image: none !important;
}
html.theme-modern .flyoutmenu li ul a,
html.theme-modern .flyoutmenu li ul a:visited {
  width: auto !important;
  min-width: 12em !important;
  background: #ffffff !important;
  color: var(--wx-ink, #143447) !important;
}
html.theme-modern .sideMenuTitle,
html.theme-modern .menuTitle,
html.theme-modern .sideBarTitle {
  background: transparent !important;
  color: var(--wx-muted) !important;
  font-size: 0.72rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  border: none !important;
  margin: 2px 2px 8px 2px !important;
  padding: 0 2px !important;
}
html.theme-modern form[name="style"],
html.theme-modern #stylechooser,
html.theme-modern .styleSelectors {
  display: none !important;
}
/* Keep Mobile site return link visible under modern (Style/Widescreen are hidden) */
html.theme-modern .wx-mobile-site-nav {
  display: block !important;
  margin: 4px 0 8px 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
html.theme-modern .wx-mobile-site-nav a {
  display: block !important;
}

/* BFC so content never clears below the sidebar (fixes huge center gap) */
html.theme-modern #main-copy {
  background: transparent !important;
  border: none !important;
  margin: 0 var(--wx-page-gutter) 20px var(--wx-sidebar) !important;
  padding: 0 0 12px 0 !important;
  text-align: left !important;
  display: flow-root !important;
  overflow: visible !important;
  min-height: 0 !important;
  height: auto !important;
}
/* Layout wrappers only — NEVER apply display:block to tr.column-* (breaks trends tables) */
html.theme-modern div.column-dark,
html.theme-modern div.column-light {
  background: transparent !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
}
/* Center column: one shared rail for Windy, charts, dashboard */
html.theme-modern div.column-dark {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}
html.theme-modern div.column-dark > div[align="center"],
html.theme-modern div.column-dark > center,
html.theme-modern div.column-dark div[align="center"] {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
html.theme-modern div.column-dark > br,
html.theme-modern div.column-dark div[align="center"] > br {
  display: none !important;
}
html.theme-modern div.column-dark table[width="99%"],
html.theme-modern div.column-dark table[width="99%"] td {
  width: 100% !important;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Trends / almanac tables: restore real table-row layout + zebra striping */
html.theme-modern #main-copy table[width="99%"] {
  width: 100% !important;
  max-width: none !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: auto !important;
  background: var(--wx-panel) !important;
  border: 1px solid var(--wx-line) !important;
  border-radius: var(--wx-radius) !important;
  box-shadow: var(--wx-shadow) !important;
  overflow: hidden;
  margin: 0 0 14px 0 !important;
}
html.theme-modern tr.table-top {
  display: table-row !important;
  background: var(--wx-header) !important;
  color: #fff !important;
  font-weight: 600 !important;
  border: none !important;
}
html.theme-modern tr.table-top td {
  display: table-cell !important;
  background: var(--wx-header) !important;
  color: #fff !important;
  font-weight: 600 !important;
  border: none !important;
  padding: 8px 6px !important;
  text-align: center !important;
  vertical-align: middle !important;
}
html.theme-modern tr.column-light,
html.theme-modern tr.column-dark {
  display: table-row !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  border: none !important;
  box-shadow: none !important;
}
html.theme-modern tr.column-light {
  background: #f3f8fa !important;
}
html.theme-modern tr.column-dark {
  background: #ffffff !important;
}
html.theme-modern tr.column-light td,
html.theme-modern tr.column-dark td {
  display: table-cell !important;
  padding: 7px 6px !important;
  border-bottom: 1px solid var(--wx-line) !important;
  vertical-align: middle !important;
  color: var(--wx-ink) !important;
}
/* ajax-dashboard.php hardcodes style="width:632px" — force same rail */
html.theme-modern .ajaxDashboard {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}
/* Windy home embed only — do not apply to NWS radar iframe */
html.theme-modern #main-copy .wx-windy-wrap {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 6px 0;
  border-radius: var(--wx-radius);
  box-shadow: var(--wx-shadow);
  overflow: hidden;
  box-sizing: border-box;
}
html.theme-modern #main-copy .wx-windy-wrap iframe[src*="windy.com"],
html.theme-modern #main-copy iframe[src*="windy.com"] {
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  aspect-ratio: 8 / 3; /* matches Windy 640x240 */
  min-height: 220px;
  border: 0 !important;
  border-radius: 0;
  display: block;
  margin: 0;
  box-sizing: border-box;
  box-shadow: none;
}

/* Desktop NWS radar — fill available column; JS sets exact HAniS pixel size */
html.theme-modern #selectorsarea .center {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}
html.theme-modern iframe[name="wxradarshanis"] {
  aspect-ratio: auto !important;
  min-height: 0 !important;
  max-width: 100% !important;
  border: 0 !important;
  border-radius: var(--wx-radius);
  display: block;
  margin: 0 auto 8px auto;
  box-sizing: border-box;
  box-shadow: var(--wx-shadow);
}
html.theme-modern #main-copy img[src*="spacer.gif"] {
  display: none !important;
}

/* Shared module panel sizing — every block fills the rail */
html.theme-modern .windHistory,
html.theme-modern .rainHistory,
html.theme-modern .windVane,
html.theme-modern #main-copy table[width="620"] {
  width: 100% !important;
  max-width: none !important;
  margin: 10px 0 !important;
  box-sizing: border-box !important;
  background: var(--wx-panel) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  border: 1px solid var(--wx-line) !important;
  border-radius: var(--wx-radius) !important;
  overflow: hidden;
  box-shadow: var(--wx-shadow) !important;
}
html.theme-modern .windHistory #whCanvas,
html.theme-modern .rainHistory #rhCanvas {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}
html.theme-modern .windHistory #whCanvas,
html.theme-modern .rainHistory #rhCanvas {
  height: clamp(180px, 22vw, 260px) !important;
}
html.theme-modern .windVane .wv-wrap,
html.theme-modern .windVane .wv-svg {
  margin-left: auto;
  margin-right: auto;
}

/* Nested dashboard / forecast tables fill parent — no second card chrome */
html.theme-modern #main-copy table[width="620"] table[width="620"],
html.theme-modern #main-copy table[width="620"] table {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  overflow: visible !important;
}
html.theme-modern #main-copy table[width="620"] td {
  box-sizing: border-box !important;
}
html.theme-modern #main-copy table[width="620"] > tbody > tr > td:has(> table[width="620"]),
html.theme-modern #main-copy table[width="620"] > tr > td:has(> table[width="620"]) {
  padding: 0 !important;
}
html.theme-modern .ajaxDashboard > table[width="620"] {
  border-spacing: 0 !important;
}

html.theme-modern .datahead,
html.theme-modern td.datahead,
html.theme-modern th.datahead {
  background: var(--wx-header) !important;
  color: #fff !important;
  font-family: var(--wx-font) !important;
  font-weight: 600 !important;
  border: none !important;
  padding: 10px 12px !important;
}
html.theme-modern td.data1 {
  border-color: var(--wx-line) !important;
  color: var(--wx-ink) !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
html.theme-modern a { color: var(--wx-accent) !important; }
html.theme-modern a:hover { color: var(--wx-warm) !important; }

html.theme-modern .wh-btn,
html.theme-modern .rh-btn {
  border-radius: 999px !important;
  border-color: var(--wx-accent) !important;
  color: var(--wx-accent) !important;
  background: #eef7f6 !important;
}
html.theme-modern .wh-btn.active,
html.theme-modern .rh-btn.active {
  background: var(--wx-accent) !important;
  color: #fff !important;
}
html.theme-modern #whCanvas,
html.theme-modern #rhCanvas {
  background: #f3f8fa !important;
  border-color: var(--wx-line) !important;
  border-radius: 10px !important;
}

html.theme-modern img[src*="icons-modern"] {
  width: 58px;
  height: 58px;
  object-fit: contain;
  border-radius: 12px !important;
  background: linear-gradient(160deg, #f7fbfd, #e8f2f4) !important;
  padding: 4px !important;
  box-shadow: 0 2px 8px rgba(20,52,71,0.08) !important;
  vertical-align: middle;
}
html.theme-modern img[src*="thermometer"] {
  border-radius: 12px;
  background: linear-gradient(160deg, #f7fbfd, #e8f2f4);
  padding: 4px 2px;
  box-shadow: 0 2px 8px rgba(20,52,71,0.08);
}

html.theme-modern #footer {
  background: transparent !important;
  border: none !important;
  color: var(--wx-muted) !important;
  text-align: center !important;
  padding: 8px 12px 24px 12px !important;
  clear: both !important;
}

/* Forecast details page — fluid width + clearer summary / detail layout */
html.theme-modern #main-copy table[style*="width:"],
html.theme-modern #main-copy table.wx-fcst-summary,
html.theme-modern #main-copy table.wx-fcst-details,
html.theme-modern #main-copy table.wx-fcst-icons {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}
html.theme-modern #main-copy > table.wx-fcst-summary,
html.theme-modern #main-copy > table.wx-fcst-details,
html.theme-modern #main-copy > table[style*="width:"] {
  margin: 0 0 16px 0 !important;
  background: var(--wx-panel);
  border: 1px solid var(--wx-line) !important;
  border-radius: var(--wx-radius) !important;
  box-shadow: var(--wx-shadow) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  padding: 14px 16px !important;
}
html.theme-modern #main-copy > table.wx-fcst-summary > tbody > tr > td,
html.theme-modern #main-copy > table.wx-fcst-summary > tr > td {
  padding: 6px 4px 10px 4px;
}
html.theme-modern #main-copy > table.wx-fcst-summary b {
  font-family: var(--wx-font);
  font-weight: 700;
  color: var(--wx-ink);
}
html.theme-modern #main-copy > table.wx-fcst-summary span[style*="green"] {
  color: var(--wx-accent2) !important;
}

/* Icon summary grid: equal columns, breathing room, period cards */
html.theme-modern table.wx-fcst-icons {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  margin: 8px 0 0 0 !important;
  padding: 0 !important;
  table-layout: fixed !important;
  border-collapse: separate !important;
  border-spacing: 10px 12px !important;
  width: 100% !important;
}
html.theme-modern table.wx-fcst-icons td {
  width: auto !important;
  text-align: center !important;
  vertical-align: top !important;
  line-height: 1.35 !important;
  font-size: 0.92rem !important;
  color: var(--wx-ink) !important;
}
/* Icon rows: period cards spaced across the width */
html.theme-modern table.wx-fcst-icons tr:nth-child(1) td,
html.theme-modern table.wx-fcst-icons tr:nth-child(4) td {
  padding: 12px 8px 8px 8px !important;
  background: #f3f8fa !important;
  border: 1px solid var(--wx-line) !important;
  border-bottom: none !important;
  border-radius: 12px 12px 0 0 !important;
}
/* Temp rows: continue the same card under each icon */
html.theme-modern table.wx-fcst-icons tr:nth-child(2) td,
html.theme-modern table.wx-fcst-icons tr:nth-child(5) td {
  padding: 0 8px 12px 8px !important;
  background: #f3f8fa !important;
  border: 1px solid var(--wx-line) !important;
  border-top: none !important;
  border-radius: 0 0 12px 12px !important;
  font-weight: 600 !important;
  color: var(--wx-header) !important;
}
/* Spacer row between day/night bands */
html.theme-modern table.wx-fcst-icons td[colspan],
html.theme-modern table.wx-fcst-icons tr:nth-child(3) td {
  background: transparent !important;
  border: none !important;
  padding: 6px 0 !important;
  height: 10px;
  border-radius: 0 !important;
}
html.theme-modern table.wx-fcst-icons img {
  display: block !important;
  margin: 0 auto 6px auto !important;
  width: 64px !important;
  height: 64px !important;
  object-fit: contain !important;
}
/* Old single-row icon layout fallback */
html.theme-modern table.wx-fcst-icons tr[valign] td,
html.theme-modern table.wx-fcst-icons tr[align] td {
  padding: 10px 6px !important;
  background: #f3f8fa !important;
  border: 1px solid var(--wx-line) !important;
  border-radius: 12px !important;
}

/* Period detail list — zebra rows like Daily Stats */
html.theme-modern table.wx-fcst-details {
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  overflow: hidden;
  padding: 0 !important;
}
html.theme-modern table.wx-fcst-details tr.wx-fcst-row-even td,
html.theme-modern table.wx-fcst-details tr:nth-child(odd) td {
  background: #f3f8fa !important;
}
html.theme-modern table.wx-fcst-details tr.wx-fcst-row-odd td,
html.theme-modern table.wx-fcst-details tr:nth-child(even) td {
  background: #ffffff !important;
}
html.theme-modern table.wx-fcst-details td {
  padding: 12px 14px !important;
  border-bottom: 1px solid var(--wx-line) !important;
  vertical-align: top !important;
  color: var(--wx-ink) !important;
  line-height: 1.45 !important;
}
html.theme-modern table.wx-fcst-details td.wx-fcst-period,
html.theme-modern table.wx-fcst-details td:first-child {
  width: 22% !important;
  font-weight: 600 !important;
  color: var(--wx-header) !important;
  border-right: 1px solid var(--wx-line) !important;
}
html.theme-modern table.wx-fcst-details td.wx-fcst-period b,
html.theme-modern table.wx-fcst-details td:first-child b {
  font-family: var(--wx-font);
  font-size: 0.98rem;
  color: var(--wx-header) !important;
}
html.theme-modern table.wx-fcst-details td.wx-fcst-text,
html.theme-modern table.wx-fcst-details td:last-child {
  width: 78% !important;
  font-size: 0.95rem !important;
}
html.theme-modern #main-copy > p {
  max-width: none;
  width: 100%;
  box-sizing: border-box;
}


/* ===== Earthquake activity page (wxquake.php) ===== */
html.theme-modern #main-copy.wx-quake {
  text-align: center !important;
}
html.theme-modern #main-copy.wx-quake .quake,
html.theme-modern #main-copy.wx-quake p.quake {
  width: 100% !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
  text-align: center !important;
  color: var(--wx-ink) !important;
}
html.theme-modern #main-copy.wx-quake #map-container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto 14px auto !important;
  padding: 0 !important;
  border: 1px solid var(--wx-line) !important;
  border-radius: var(--wx-radius) !important;
  box-shadow: var(--wx-shadow) !important;
  background: var(--wx-panel) !important;
  overflow: hidden;
  box-sizing: border-box !important;
}
html.theme-modern #main-copy.wx-quake #map {
  width: 100% !important;
  max-width: none !important;
  height: clamp(400px, 58vh, 620px) !important;
  margin: 0 !important;
  text-align: left !important;
}
html.theme-modern #main-copy.wx-quake table.quake,
html.theme-modern #main-copy.wx-quake table.sortable {
  width: 100% !important;
  max-width: none !important;
  margin: 12px auto 8px auto !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  background: var(--wx-panel) !important;
  border: 1px solid var(--wx-line) !important;
  border-radius: var(--wx-radius) !important;
  box-shadow: var(--wx-shadow) !important;
  overflow: hidden;
  text-align: left !important;
  table-layout: auto !important;
}
html.theme-modern #main-copy.wx-quake table.quake thead th,
html.theme-modern #main-copy.wx-quake table.sortable thead th {
  background: var(--wx-header) !important;
  color: #fff !important;
  font-family: var(--wx-font) !important;
  font-weight: 600 !important;
  padding: 10px 12px !important;
  border: none !important;
  text-align: center !important;
  vertical-align: middle !important;
  white-space: nowrap;
}
html.theme-modern #main-copy.wx-quake table.quake tbody tr:nth-child(odd) td {
  background: #f3f8fa !important;
}
html.theme-modern #main-copy.wx-quake table.quake tbody tr:nth-child(even) td {
  background: #ffffff !important;
}
html.theme-modern #main-copy.wx-quake table.quake tbody td {
  padding: 10px 12px !important;
  border-bottom: 1px solid var(--wx-line) !important;
  color: var(--wx-ink) !important;
  vertical-align: middle !important;
  font-size: 0.95rem !important;
}
html.theme-modern #main-copy.wx-quake table.quake tbody td[align="left"],
html.theme-modern #main-copy.wx-quake table.quake tbody td:first-child {
  text-align: left !important;
}
html.theme-modern #main-copy.wx-quake table.quake tbody td[align="center"] {
  text-align: center !important;
}
html.theme-modern #main-copy.wx-quake table.quake a {
  color: var(--wx-accent) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
html.theme-modern #main-copy.wx-quake table.quake a:hover {
  color: var(--wx-warm) !important;
  text-decoration: underline !important;
}
html.theme-modern #main-copy.wx-quake noscript p,
html.theme-modern #main-copy.wx-quake > p {
  text-align: center !important;
  color: var(--wx-muted) !important;
}

html.theme-modern .alertBox,
html.theme-modern .advisoryBox,
html.theme-modern #alertBox {
  border-radius: var(--wx-radius) !important;
  border: 1px solid var(--wx-line) !important;
  box-shadow: var(--wx-shadow) !important;
  overflow: hidden;
  margin: 0 var(--wx-page-gutter) 10px var(--wx-sidebar) !important;
  display: flow-root;
  width: auto !important;
  max-width: none !important;
  box-sizing: border-box !important;
  background: var(--wx-panel) !important;
  padding: 12px 14px !important;
  color: var(--wx-ink) !important;
}
/* Advisory page content is already inside #main-copy — don't double-offset */
html.theme-modern #main-copy.wx-advisories .advisoryBox,
html.theme-modern #main-copy .advisoryBox {
  margin: 0 0 14px 0 !important;
}

/* ===== Advisories page (wxadvisory.php) ===== */
html.theme-modern #main-copy.wx-advisories {
  width: auto !important;
}
html.theme-modern #main-copy.wx-advisories > h3,
html.theme-modern .wx-nws-summary-title h3 {
  font-family: var(--wx-display) !important;
  font-size: 1.45rem !important;
  font-weight: 700 !important;
  color: var(--wx-header) !important;
  margin: 0 0 6px 0 !important;
  letter-spacing: -0.02em;
}
html.theme-modern .wx-nws-summary-title p {
  margin: 0 !important;
  color: var(--wx-muted) !important;
  font-size: 0.92rem !important;
}
html.theme-modern .wx-nws-summary {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 16px 0 !important;
}
html.theme-modern table.wx-nws-summary-head,
html.theme-modern table.wx-nws-summary-body {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 12px 0 !important;
  border: 1px solid var(--wx-line) !important;
  border-radius: var(--wx-radius) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  box-shadow: var(--wx-shadow) !important;
  overflow: hidden;
  background: var(--wx-panel) !important;
}
html.theme-modern table.wx-nws-summary-head td.wx-nws-summary-title,
html.theme-modern table.wx-nws-summary-head td {
  background: linear-gradient(135deg, #0f2a38 0%, #1f6f8b 70%) !important;
  color: #fff !important;
  padding: 16px 18px !important;
  text-align: center !important;
  border: none !important;
}
html.theme-modern table.wx-nws-summary-head h3 {
  color: #fff !important;
  margin: 0 0 4px 0 !important;
}
html.theme-modern table.wx-nws-summary-head p {
  color: rgba(255,255,255,0.88) !important;
}
html.theme-modern table.wx-nws-summary-body tr.wx-nws-summary-meta td {
  background: #f3f8fa !important;
  color: var(--wx-muted) !important;
  font-size: 0.88rem !important;
  padding: 10px 14px !important;
  border-bottom: 1px solid var(--wx-line) !important;
  text-align: center !important;
}
html.theme-modern table.wx-nws-summary-body tr.wx-nws-summary-meta hr {
  display: none !important;
}
html.theme-modern table.wx-nws-summary-body tr.wx-nws-alert-row:nth-child(even) td {
  background: #ffffff !important;
}
html.theme-modern table.wx-nws-summary-body tr.wx-nws-alert-row:nth-child(odd) td {
  background: #f3f8fa !important;
}
html.theme-modern table.wx-nws-summary-body tr.wx-nws-alert-row td {
  padding: 12px 14px !important;
  border-bottom: 1px solid var(--wx-line) !important;
  color: var(--wx-ink) !important;
  line-height: 1.45 !important;
  font-size: 0.95rem !important;
}
html.theme-modern table.wx-nws-summary-body tr.wx-nws-alert-row td b {
  font-family: var(--wx-font);
  color: var(--wx-header) !important;
  font-size: 1rem !important;
}
html.theme-modern table.wx-nws-summary-body a {
  color: var(--wx-accent) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
html.theme-modern table.wx-nws-summary-body a:hover {
  color: var(--wx-warm) !important;
  text-decoration: underline !important;
}
html.theme-modern .wx-advisories-map {
  margin: 16px 0 !important;
  background: var(--wx-panel);
  border: 1px solid var(--wx-line);
  border-radius: var(--wx-radius);
  box-shadow: var(--wx-shadow);
  padding: 12px;
  text-align: center;
  overflow: hidden;
}
html.theme-modern .wx-advisories-map img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  display: block;
  margin: 0 auto;
  border-radius: 8px;
}
html.theme-modern .wx-advisories-legend {
  margin: 12px 0 8px 0;
  background: var(--wx-panel);
  border: 1px solid var(--wx-line);
  border-radius: var(--wx-radius);
  box-shadow: var(--wx-shadow);
  padding: 12px 14px;
  overflow-x: auto;
}
html.theme-modern .wx-advisories-legend table {
  width: 100% !important;
  max-width: none !important;
  border-collapse: collapse !important;
}
html.theme-modern .wx-advisories-legend td,
html.theme-modern .wx-advisories-legend th {
  padding: 6px 8px !important;
  border-bottom: 1px solid var(--wx-line) !important;
  color: var(--wx-ink) !important;
  font-size: 0.9rem !important;
}
html.theme-modern .column-dark small,
html.theme-modern .ajaxDashboard > small {
  display: block;
  width: 100%;
  margin: 4px 0;
  text-align: center;
  color: var(--wx-muted);
}
