/* Looks the public site adds to the hub's Legislation explorer and bill page (static/hub/css/legislative.css, bill.css: synced). Hand-written; the sync never touches it. */

/* The server-built filter form and pager (for readers without scripts and for crawlers) go away when the hub's script runs; the hub's own filter bar
   and tabs, which need the script to fill them, stay hidden until it does. flag.js sets data-audience on <html> when scripts run. */
html[data-audience="public"] .ssr-only { display: none; }
html:not([data-audience="public"]) .hub-leg #filterBar,
html:not([data-audience="public"]) .hub-leg #tabNav { display: none; }

/* The owner's rule (2026-10-02): no big-number stat tiles. The Stats tab's summary is one sentence: the number is bold, not large. */
.hub-leg .stat-summary { font-size: 15px; margin: 6px 0 4px; }
.hub-leg .stat-summary .n { color: inherit; font-weight: 600; }

.hub-leg .lede { color: var(--muted); font-size: 13.5px; margin: 0 0 12px; max-width: 70ch; }
.hub-leg .hub-more { margin: -8px 0 14px; }
.hub-leg .hub-credit { margin: 22px 0 0; padding-top: 12px; border-top: 1px solid var(--border); color: var(--faint); font-size: 11.5px; }
.hub-leg .ex-actions a.mini { margin-left: auto; font-size: 11.5px; padding: 5px 10px; color: var(--muted); border: 1px solid var(--control-border);
  border-radius: 5px; text-decoration: none; display: inline-flex; align-items: center; min-height: 28px; }
.hub-leg .ex-actions a.mini:hover { color: var(--gold); border-color: var(--gold); }

/* no style attribute on the page (CSP): what the hub set inline */
.hub-leg #bCount { margin: 0; }

/* The explorer's hearing pill: the hub's Testimony pill (testimony.css button.tbadge), under the bill number, for a bill tied to a published hearing
   that has video. It opens the hub's popup (leg-api.js snippet); without the script it links to the hearings on the bill's page. */
.hub-leg #bTable td.bl a.hv-pill { display: table; margin: 6px 0 0; padding: 2px 10px; font-size: 12px; line-height: 1.5; white-space: nowrap;
  border-radius: 999px; border: 1px solid var(--border-strong); background: var(--sunken); color: var(--text); text-decoration: none; font-weight: 600; }
.hub-leg #bTable td.bl a.hv-pill:hover { border-color: var(--gold); }
.hub-leg #bTable td.bl a.hv-pill:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; }
/* a bill tied to several hearings: choose one, then it plays in the hub's popup (leg-api.js snippet). The dialog sits on <body>, outside .hub-leg. */
dialog.hv-choose { width: min(520px, calc(100vw - 32px)); padding: 0; border: 1px solid var(--border); border-radius: 10px;
  background: var(--panel); color: var(--text); }
dialog.hv-choose::backdrop { background: rgba(0, 0, 0, .55); }
dialog.hv-choose .hv-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 14px;
  border-bottom: 1px solid var(--border); }
dialog.hv-choose .hv-close { border: 0; background: none; color: var(--muted); font-size: 22px; line-height: 1; cursor: pointer; }
dialog.hv-choose ul { list-style: none; margin: 0; padding: 8px; }
dialog.hv-choose li button { display: block; width: 100%; text-align: left; padding: 9px 10px; border: 1px solid transparent; border-radius: 8px;
  background: none; color: var(--text); font: inherit; cursor: pointer; }
dialog.hv-choose li button:hover, dialog.hv-choose li button:focus-visible { border-color: var(--border); background: var(--panel2, rgba(127,127,127,.08)); }
dialog.hv-choose li button span { display: block; color: var(--muted); font-size: 13px; margin-top: 2px; }
dialog.hv-choose .hint { margin: 0; padding: 4px 16px 14px; }