/* ============================================
   2026 Money pages (/money-2026/, /es/money-2026/)
   Loaded after style.min.css. Hand-authored; uses only the site tokens.
   ============================================ */

/* --- Hero as-of line and added limit notes --- */
.data-page-hero .m26-asof { max-width: 72ch; margin: 20px 0 0; }

.m26-note,
.m26-prose .m26-note {
  max-width: 72ch;
  margin: 12px 0 28px;
  padding: 12px 16px;
  background: var(--white);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--forest);
  border-radius: 2px;
  font-family: var(--font-ui);
  font-size: var(--fs-small);
  line-height: 1.55;
  color: var(--ink);
}

/* --- Prose converted from the audit pages --- */
.m26-prose { line-height: var(--lh); color: var(--ink); }

.m26-prose p,
.m26-prose ul,
.m26-prose ol { max-width: 72ch; margin: 0 0 16px; }

.m26-prose h2 { margin: 48px 0 14px; }
.m26-prose h3 { margin: 32px 0 10px; }
.m26-prose > :first-child { margin-top: 0; }

.m26-prose ul { list-style: disc; padding-left: 1.4em; }
.m26-prose ol { list-style: decimal; padding-left: 1.6em; }
.m26-prose li + li { margin-top: 6px; }
.m26-prose li > ul,
.m26-prose li > ol { margin: 6px 0 0; }
.m26-prose strong { font-weight: 700; }

/* Long names, IDs and URLs wrap instead of pushing the page wider than a 320px screen. */
.m26-prose p,
.m26-prose li { overflow-wrap: break-word; }

.m26-prose code {
  font-family: var(--font-mono);
  font-size: 0.85em;
  padding: 1px 5px;
  background: var(--white);
  border: 1px solid var(--rule);
  border-radius: 2px;
  overflow-wrap: anywhere;
}

/* Forest and ink are close in lightness, so prose links need an underline. */
.m26-prose a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }

/* --- Tables inside prose: one data-table component.
       Full width, no nested vertical scroll box, sideways scroll when a table is wider than
       the screen (with an edge shadow as the cue); tables of 5+ columns (.m26-wide) stack into
       labelled rows on phones, and 8+ columns (.m26-bleed) widen past the text column on desktop --- */
.m26-prose .table-wrapper {
  max-height: none;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  overscroll-behavior-y: auto;
  margin: 16px 0 28px;
  /* Scroll cue, no JS: soft shadows fixed to the box edges (scroll) that the white fades at the
     ends of the content (local) cover once the reader reaches that end. */
  background:
    linear-gradient(to right, var(--white) 30%, rgba(253, 250, 245, 0)) left center / 28px 100% no-repeat local,
    linear-gradient(to left, var(--white) 30%, rgba(253, 250, 245, 0)) right center / 28px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%, rgba(30, 58, 47, 0.22), rgba(30, 58, 47, 0)) left center / 12px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, rgba(30, 58, 47, 0.22), rgba(30, 58, 47, 0)) right center / 12px 100% no-repeat scroll,
    var(--white);
}

.m26-prose table { width: 100%; }
.m26-prose th { position: static; cursor: default; user-select: auto; }
.m26-prose th:hover { color: var(--muted); }
.m26-prose td,
.m26-prose tbody th { min-width: 6.5rem; }
.m26-prose td.col-amount { white-space: nowrap; }

/* Column headers wrap instead of forcing a wide table; money columns are right-aligned
   (the status text in a money column is right-aligned too, and quieter). */
.m26-prose thead th { white-space: normal; vertical-align: bottom; line-height: 1.3; font-size: 0.72rem; letter-spacing: 0.06em; }
.m26-prose table.m26-wide thead th { min-width: 7rem; }
.m26-prose thead th.m26-num,
.m26-prose td.m26-num { text-align: right; }
.m26-prose .table-wrapper caption { font-size: 0.72rem; }
.m26-prose td.m26-na { font-size: 0.9rem; white-space: normal; }

/* An ISO date never splits mid-date; a range breaks only at " to " / " a ". */
.m26-nb { white-space: nowrap; }

/* A caption that repeats the heading right above it stays for screen readers only. */
.m26-prose caption.m26-cap-dup {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: clip;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* Row headers read as body text, not as the site's small-caps column headers. */
.m26-prose tbody th {
  background: transparent;
  border-bottom: 1px solid var(--rule);
  padding: 12px 16px;
  font-family: var(--font-body);
  font-size: inherit;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.4;
  color: var(--ink);
  white-space: normal;
}

.m26-prose tbody tr:last-child th { border-bottom: none; }

/* Links inside cells get a 44px-tall tap area without moving the text. */
.m26-prose td a,
.m26-prose tbody th a { padding-block: 12px; }

/* Column dictionary on the methodology page: the column names are code-like. */
.m26-prose table.m26-dict tbody :is(th, td):first-child {
  font-family: var(--font-mono);
  font-size: var(--fs-small);
  overflow-wrap: anywhere;
}

/* Tablet and up: the name column stays in view while the figures scroll sideways.
   (A table whose ID column comes first, like the committee index, keeps its columns as they are.) */
@media (min-width: 641px) {
  .m26-prose table.m26-wide:not(.m26-idfirst) tr > th:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    min-width: 9rem;
    max-width: 14rem;
    white-space: normal;
    background: var(--white);
    box-shadow: 1px 0 0 var(--rule);
  }

  .m26-prose table.m26-wide:not(.m26-idfirst) thead tr > th:first-child { background: var(--cream); z-index: 2; }
}

/* Desktop: tables of 8 or more columns break out of the text column (never past the screen). */
@media (min-width: 1100px) {
  .m26-prose .table-wrapper.m26-bleed {
    --bleed: min(1400px, 100vw - 64px);
    width: var(--bleed);
    max-width: none;
    margin-left: calc(50% - var(--bleed) / 2);
  }
}

/* Narrow tables on tablets and phones: cells may shrink below the desktop minimum. */
@media (max-width: 767px) {
  .m26-prose table:not(.m26-wide) :is(td, tbody th) { min-width: 0; }
  .m26-prose table:not(.m26-wide) td.col-amount { min-width: 5.5rem; }
}

@media (max-width: 480px) {
  .m26-prose td,
  .m26-prose tbody th { font-size: 0.9rem; }

  /* Tighter cell padding and no minimum figure width, so a three-column table fits a 375px screen
     without sideways scrolling (the figures themselves never wrap). */
  .m26-prose td,
  .m26-prose th,
  .m26-prose tbody th { padding-left: 10px; padding-right: 10px; }

  .m26-prose table:not(.m26-wide) td.col-amount { min-width: 0; }
}

/* Phones: a wide table becomes one card per row. The name comes first, every figure sits under its
   own label (data-label), and the column headers stay in the page for assistive technology. */
@media (max-width: 640px) {
  .m26-prose .table-wrapper:has(> table.m26-wide) { overflow: visible; background: var(--white); }

  .m26-prose table.m26-wide,
  .m26-prose table.m26-wide tbody { display: block; }

  .m26-prose table.m26-wide caption { display: block; text-align: left; }

  .m26-prose table.m26-wide thead {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: clip;
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .m26-prose table.m26-wide tbody tr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 16px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--rule);
  }

  .m26-prose table.m26-wide tbody tr:last-child { border-bottom: 0; }

  .m26-prose table.m26-wide tbody tr > * {
    display: block;
    min-width: 0;
    max-width: none;
    padding: 0;
    border: 0;
    text-align: left;
    white-space: normal;
    position: static;
    box-shadow: none;
    background: none;
    line-height: 1.4;
    overflow-wrap: break-word;
  }

  .m26-prose table.m26-wide tbody th { grid-column: 1 / -1; order: -1; font-weight: 600; }
  .m26-prose table.m26-dict tbody td { grid-column: 1 / -1; }
  .m26-prose table.m26-wide td:empty { display: none; }

  .m26-prose table.m26-wide td::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 2px;
    font: 500 0.7rem/1.3 var(--font-mono);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--muted);
  }
}

/* --- Empty sections stay listed but read quietly, so a page without a statement is short --- */
.m26-prose .m26-empty { color: var(--muted); font-size: var(--fs-small); margin: 0 0 8px; }
.m26-prose h2:has(+ .m26-empty) { font-size: var(--fs-h3); margin-top: 28px; color: var(--muted); }

/* The earlier-year history reads as subordinate to the 2026 sections above it. */
.m26-prose h2.m26-earlier { margin-top: 64px; padding-top: 24px; border-top: 1px solid var(--rule); color: var(--muted); }

/* --- Jump chips at the top of a long page (no scroll-margin: the page already offsets anchors) --- */
.m26-toc ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 32px; padding: 0; list-style: none; }

.m26-toc a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  max-width: 22rem;
  padding: 6px 14px;
  border: 1px solid var(--rule);
  border-radius: 999px;
  background: var(--white);
  color: var(--ink);
  font: 500 0.75rem/1.3 var(--font-mono);
  text-decoration: none;
}

.m26-toc a:hover { border-color: var(--forest); color: var(--forest); }
.m26-toc a:focus-visible { outline: 2px solid var(--forest); outline-offset: 2px; }

@media (max-width: 767px) {
  .m26-toc ul { flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; padding-bottom: 8px; scroll-snap-type: x proximity; }
  .m26-toc li { flex: none; scroll-snap-align: start; }
  .m26-toc a { white-space: nowrap; max-width: none; }
}

/* --- Top of candidate and committee pages --- */
/* A long committee name takes 3 to 4 lines, not 6 or 7. */
.data-page-hero-headline--name {
  font-size: clamp(1.75rem, 1.1rem + 2vw, 2.75rem);
  line-height: 1.12;
  letter-spacing: -0.02em;
  max-width: 30ch;
  overflow-wrap: anywhere;
}

/* The leading facts (IDs, coverage, office, links) sit in one quiet panel. */
.m26-facts {
  max-width: 72ch;
  margin: 0 0 32px;
  padding: 14px 18px;
  background: var(--white);
  border: 1px solid var(--rule);
  border-radius: 2px;
  font-family: var(--font-ui);
  font-size: var(--fs-small);
  line-height: 1.55;
}

.m26-facts p { margin: 0 0 6px; }
.m26-facts p:last-child { margin-bottom: 0; }

/* "No matched committee" and "no current-year statement": a plain status panel, not a limit note. */
.m26-status,
.m26-prose .m26-status {
  max-width: 72ch;
  margin: 0 0 24px;
  padding: 14px 18px;
  background: var(--white);
  border: 1px solid var(--rule);
  border-left: 3px solid var(--muted);
  border-radius: 2px;
  font-family: var(--font-ui);
  line-height: 1.55;
}

/* One quiet line under a table. */
.m26-prose .m26-aside { font-family: var(--font-ui); font-size: var(--fs-small); color: var(--muted); }

/* --- Landing link grid (children are the site's a.card.card-link) --- */
.m26-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: var(--gap);
  margin: 32px 0;
  padding: 0;
  list-style: none;
}

/* The cards sit right under the hero on the landing page. */
.m26-cards { margin-top: 24px; }

.m26-cards > li { display: flex; }
.m26-cards > li > .card-link,
.m26-cards > .card-link { width: 100%; height: 100%; }

/* --- Data downloads list (methodology page) --- */
.m26-downloads,
.m26-prose .m26-downloads { max-width: 72ch; margin: 16px 0 24px; padding: 0; list-style: none; }

.m26-downloads li,
.m26-prose .m26-downloads li + li { margin: 0; padding: 12px 0; border-bottom: 1px dashed var(--rule); }

.m26-downloads a { font-family: var(--font-mono); font-size: var(--fs-small); font-weight: 500; }

/* ============================================
   Explorer host classes (#salinas-money-explorer)
   The explorer's own <style> block comes after this file in <head>, so
   rules that must beat it carry one more type or class selector.
   ============================================ */
#salinas-money-explorer { margin: 0 0 16px; }
#salinas-money-explorer h2 { margin: 0 0 8px; }
#salinas-money-explorer h3 { margin: 24px 0 8px; }
#salinas-money-explorer p { max-width: 72ch; margin: 16px 0 8px; }
#salinas-money-explorer hr { border: 0; border-top: 1px solid var(--rule); margin: 32px 0 8px; }

/* The site's section + section gap would misalign the two-column grid. */
#salinas-money-explorer .flow-grid > section { margin-top: 0; min-width: 0; }

/* Figures fill a grid: two per row on phones, more on wide screens. */
#salinas-money-explorer div.metric-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 16px; }
#salinas-money-explorer div.metric-row > div { flex: none; }

/* The as-of line in the explorer script replaces the static one; the static line stays as the no-script fallback. */
#salinas-money-explorer #salinas-asof-static:has(+ #salinas-asof:not(:empty)) { display: none; }

/* Which committee and view the figures below belong to (also names the committee on a printout). */
#salinas-money-explorer .m26-context { max-width: none; margin: 0 0 12px; }

/* A missing value is a plain status word, not a figure. */
#salinas-money-explorer .m26-na { font-family: var(--font-body); font-style: italic; font-weight: 400; color: var(--muted); }

#salinas-money-explorer .text-small { font-family: var(--font-ui); font-size: var(--fs-small); line-height: 1.5; }
#salinas-money-explorer .text-muted { color: var(--muted); }
#salinas-money-explorer .text-end { text-align: right; }
#salinas-money-explorer .tabular-nums { font-variant-numeric: tabular-nums; }

#salinas-money-explorer .metric-row .tabular-nums {
  font-family: var(--font-mono);
  font-size: 1.125rem;
  font-weight: 500;
  color: var(--forest);
}

/* Controls */
#salinas-money-explorer .viz-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 16px 24px;
  margin: 20px 0 24px;
}

#salinas-money-explorer .form-label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1 1 220px;
  min-width: 0;
  font-family: var(--font-mono);
  font-size: var(--fs-small);
  font-weight: 500;
  color: var(--muted);
}

#salinas-money-explorer .form-label:first-child { flex-grow: 2; }

/* Same look as the site's .filter-bar select (arrow copied from it). */
#salinas-money-explorer .form-select {
  width: 100%;
  max-width: 100%;
  min-height: 44px;
  padding: 8px 36px 8px 12px;
  font-family: var(--font-ui);
  font-size: var(--fs-body);
  color: var(--ink);
  background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%237A7468' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E") no-repeat right 12px center;
  border: 1px solid var(--rule);
  border-radius: 2px;
  appearance: none;
  cursor: pointer;
  transition: border-color 0.15s;
}

#salinas-money-explorer .form-select { border-color: var(--muted); }

#salinas-money-explorer .form-select:hover,
#salinas-money-explorer .form-select:focus { border-color: var(--forest); }

/* The committee picker is not used by the candidate comparison. */
#salinas-money-explorer .form-select:disabled { opacity: 0.55; cursor: not-allowed; }

/* Party names: text-like buttons in the link color. 44px tap target at every
   width (same as the site's phone rule), left-aligned, wrapping. */
#salinas-money-explorer .btn {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  max-width: 100%;
  margin: 0;
  padding: 4px 0;
  border: 0;
  background: none;
  font: inherit;
  line-height: 1.35;
  text-align: left;
  white-space: normal;
  cursor: pointer;
}

#salinas-money-explorer .btn-ghost {
  color: var(--forest);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

#salinas-money-explorer .btn-ghost:hover { color: var(--accent-hover); text-decoration-thickness: 2px; }
#salinas-money-explorer .btn-ghost:focus-visible { outline: 2px solid var(--forest); outline-offset: 2px; }

/* The close button opens the details panel, so the rule below it sits close. */
#salinas-money-explorer #salinas-detail hr { margin-top: 8px; }

/* Tables scroll sideways instead of squeezing: break-word (not anywhere)
   keeps amounts and words whole, and cells keep a readable minimum width.
   The edge shadows are the scroll cue (same technique as the prose tables, on the cream page). */
#salinas-money-explorer .table-responsive {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  margin: 8px 0 12px;
  background:
    linear-gradient(to right, var(--cream) 30%, rgba(244, 239, 228, 0)) left center / 28px 100% no-repeat local,
    linear-gradient(to left, var(--cream) 30%, rgba(244, 239, 228, 0)) right center / 28px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%, rgba(30, 58, 47, 0.22), rgba(30, 58, 47, 0)) left center / 12px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, rgba(30, 58, 47, 0.22), rgba(30, 58, 47, 0)) right center / 12px 100% no-repeat scroll,
    var(--cream);
}

#salinas-money-explorer .table-responsive:focus-visible { outline: 2px solid var(--forest); outline-offset: 2px; }
#salinas-money-explorer .table { width: 100%; border-collapse: collapse; }

/* Not sticky, not sortable-looking. */
#salinas-money-explorer .table th { position: static; cursor: default; user-select: auto; white-space: normal; vertical-align: bottom; }
#salinas-money-explorer .table th:hover { color: var(--muted); }
#salinas-money-explorer .table th.text-end { text-align: right; }
#salinas-money-explorer .table td { min-width: 6.5rem; overflow-wrap: break-word; vertical-align: middle; }
#salinas-money-explorer .table td.text-end { font-variant-numeric: tabular-nums; white-space: nowrap; }
#salinas-money-explorer .table-sm th,
#salinas-money-explorer .table-sm td { padding: 8px 10px; }

/* The name column is the row header: body text, not a small-caps column header. */
#salinas-money-explorer .table tbody th {
  font-family: var(--font-ui);
  font-size: inherit;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  text-align: left;
  vertical-align: middle;
  background: none;
  color: var(--ink);
  white-space: normal;
}

/* The 8-column candidate comparison keeps the candidate name in view while the figures scroll. */
#salinas-money-explorer .table:has(thead th:nth-child(5)) tr > :first-child {
  position: sticky;
  left: 0;
  z-index: 1;
  min-width: 8.5rem;
  background: var(--cream);
  box-shadow: 1px 0 0 var(--rule);
}

/* Rows with a name button need room for the button's focus ring (the last row is not clipped). */
#salinas-money-explorer .table-sm :is(td, th):has(> .btn) { padding-top: 5px; padding-bottom: 5px; }

/* Filing references panel */
#salinas-money-explorer .sources { margin: 12px 0 0; }
#salinas-money-explorer .sources summary { padding: 10px 0; font-family: var(--font-ui); font-size: var(--fs-small); color: var(--forest); cursor: pointer; }

@media (max-width: 767px) {
  #salinas-money-explorer .table th { font-size: 0.75rem; letter-spacing: 0.06em; }
}

@media (max-width: 480px) {
  #salinas-money-explorer .viz-controls { gap: 12px; }
  #salinas-money-explorer .form-label { flex-basis: 100%; }
}

/* --- Print: nothing clipped --- */
@media print {
  .m26-prose .table-wrapper,
  #salinas-money-explorer .table-responsive { overflow: visible; max-height: none; border: 0; }

  .m26-prose table,
  #salinas-money-explorer .table { font-size: 8pt; }

  .m26-prose th,
  .m26-prose td,
  .m26-prose tbody th,
  #salinas-money-explorer .table th,
  #salinas-money-explorer .table td { min-width: 0; padding: 4px 6px; white-space: normal; }

  .m26-prose tr,
  #salinas-money-explorer .table tr { break-inside: avoid; }

  .m26-prose th,
  .m26-prose thead th { letter-spacing: 0; font-size: 7pt; overflow-wrap: anywhere; }
  .m26-prose tbody th { overflow-wrap: break-word; }
  .m26-prose td.col-amount { white-space: normal; font-size: inherit; }
  .m26-prose td.m26-na { font-size: inherit; }
  .m26-prose table.m26-wide { font-size: 7pt; }
  .m26-prose table.m26-wide th,
  .m26-prose table.m26-wide td { padding: 3px 4px; }
  .m26-prose tr > th:first-child,
  .m26-prose table.m26-wide:not(.m26-idfirst) tr > th:first-child { position: static; box-shadow: none; }
  .m26-prose table.m26-wide thead th,
  .m26-prose table.m26-wide:not(.m26-idfirst) tr > th:first-child { min-width: 0; max-width: none; }
  .m26-prose .table-wrapper.m26-bleed { width: auto; margin-left: 0; }
  .m26-prose .table-wrapper { background: none; }

  #salinas-money-explorer .table-responsive { background: none; }
  #salinas-money-explorer .table:has(thead th:nth-child(5)) tr > :first-child { position: static; box-shadow: none; }
  #salinas-money-explorer .table td.text-end { white-space: normal; }

  .m26-note { background: none; }
  .m26-facts,
  .m26-status { background: none; }
  #salinas-money-explorer .btn-ghost { color: var(--ink); }
  #salinas-money-explorer .form-select { background-image: none; }
}