/* Accessibility helpers shared by the open map and the two open analytics
   pages (2026-10-08): the page's own skip links, "Show as table" under every
   chart (static/js/nh_chart_table.js) and the map as a list
   (static/js/open_map_list.js). Self-contained: each colour has a fallback,
   because advanced_analytics.html styles from its own token set. */

/* ---- Skip links: off-screen until focused, then the same box as the
   shell's "Skip to main content" (site.css .skip-link). */
.nh-skip-links .skip-link {
  position: absolute;
  top: -100%;
  left: 0;
  z-index: 10000;
  padding: 12px 20px;
  background: var(--brand-blue-deep, #12355b);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  border-radius: 0 0 6px 0;
}
.nh-skip-links .skip-link:focus,
.nh-skip-links .skip-link:focus-visible { top: 0; outline: 3px solid #ffbf47; outline-offset: 0; }

/* ---- Show as table */
.nh-chart-table { margin: 4px 0 12px; }
.nh-chart-table__toggle {
  background: none;
  border: 0;
  padding: 4px 0;
  color: var(--brand-blue-deep, #1f6d8f);  /* 5.77:1 on white */
  font: inherit;
  font-size: 0.85rem;
  text-decoration: underline;
  cursor: pointer;
}
.nh-chart-table__toggle:focus-visible { outline: 2px solid var(--brand-blue, #1f6fb2); outline-offset: 2px; }
.nh-chart-table__scroll {
  max-height: 320px;
  overflow: auto;
  border: 1px solid rgba(127, 127, 127, 0.35);
  border-radius: 4px;
}
.nh-chart-table__scroll:focus-visible { outline: 2px solid var(--brand-blue, #1f6fb2); outline-offset: 2px; }
.nh-chart-table__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
}
.nh-chart-table__caption {
  caption-side: top;
  text-align: left;
  padding: 6px 8px;
  font-weight: 600;
}
.nh-chart-table__table th,
.nh-chart-table__table td {
  padding: 3px 8px;
  text-align: left;
  border-top: 1px solid rgba(127, 127, 127, 0.2);
  white-space: nowrap;
}
.nh-chart-table__table thead th {
  position: sticky;
  top: 0;
  background: #fff;
  border-top: 0;
}
.nh-chart-table__table tbody th { font-weight: 400; }
.nh-chart-table__table .num { text-align: right; }
.nh-chart-table__note { margin: 4px 0 0; font-size: 0.8rem; opacity: 0.8; }

/* ---- Map as list */
.map-list { margin: 8px 0 12px; }
.map-list__toggle,
.map-list__refresh {
  font: inherit;
  font-size: 0.9rem;
  padding: 6px 12px;
  border: 1px solid rgba(127, 127, 127, 0.5);
  border-radius: 6px;
  background: #fff;
  color: inherit;
  cursor: pointer;
}
.map-list__refresh { margin: 0 0 8px; font-size: 0.82rem; padding: 4px 10px; }
.map-list__toggle:focus-visible,
.map-list__refresh:focus-visible,
.map-list__open:focus-visible { outline: 2px solid var(--brand-blue, #1f6fb2); outline-offset: 2px; }
.map-list__body { margin-top: 8px; }
.map-list__status { margin: 0 0 6px; font-size: 0.88rem; }
.map-list__items {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 420px;
  overflow: auto;
  border: 1px solid rgba(127, 127, 127, 0.3);
  border-radius: 6px;
}
.map-list__item + .map-list__item { border-top: 1px solid rgba(127, 127, 127, 0.2); }
.map-list__open {
  display: block;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border: 0;
  background: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
}
.map-list__open:hover { background: rgba(31, 111, 178, 0.08); }
.map-list__title { display: block; font-weight: 600; }
.map-list__meta { display: block; font-size: 0.82rem; opacity: 0.8; }

/* ---- Dark mode (the site's `body.dark-mode` switch) */
body.dark-mode .nh-chart-table__toggle { color: #79b8ff; }
body.dark-mode .nh-chart-table__table thead th { background: #1f1f1f; }
body.dark-mode .map-list__toggle,
body.dark-mode .map-list__refresh { background: #1f1f1f; }
body.dark-mode .map-list__open:hover { background: rgba(121, 184, 255, 0.12); }

/* ---- Phone: comfortable tap targets */
@media (max-width: 640px) {
  .map-list__toggle, .map-list__refresh { min-height: 44px; }
  .map-list__open { padding: 12px 10px; }
  .nh-chart-table__toggle { min-height: 44px; }
  .map-list__items { max-height: 60vh; }
}

@media print {
  .nh-chart-table__toggle, .map-list { display: none; }
}