/* calendar.css - /calendar/ (prefix cal-). Tokens only; loaded after state-legislatures.css and
   state-courts.css (map call-outs, as-of line, closed Sources list). One colour per election type group
   (calendar_pages.GROUPS), mapped onto existing tokens so dark mode follows them. */

.cal-top, .cal-tl { --cal-general: var(--pc-text); --cal-primary: var(--pc-court-nonpartisan);
    --cal-presidential: var(--pc-court-partisan); --cal-runoff: var(--pc-accent);
    --cal-special: var(--pc-court-legislative); --cal-spring: var(--pc-court-retention); }
.cal-g-general { --c: var(--cal-general); }
.cal-g-primary { --c: var(--cal-primary); }
.cal-g-presidential { --c: var(--cal-presidential); }
.cal-g-runoff { --c: var(--cal-runoff); }
.cal-g-special { --c: var(--cal-special); }
.cal-g-spring { --c: var(--cal-spring); }

/* Type marker: a filled dot; hollow when the election is held only if needed */
.cal-mk { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--c); flex-shrink: 0;
    box-sizing: border-box; }
.cal-mk.is-cond { background: transparent; border: 2px solid var(--c); }
.cal-key { display: flex; align-items: center; gap: 7px; margin: 6px 0 0; }

/* Filters */
.cal-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 0 0 18px; }
.cal-types { display: flex; flex-wrap: wrap; gap: 6px; }
.cal-types .pc-btn { display: inline-flex; align-items: center; gap: 7px; }
.cal-types .pc-btn.is-active .cal-mk { box-shadow: 0 0 0 1.5px var(--pc-on-ink); }

/* Month strip: one column per month, stacked bar by type, count above */
.cal-strip { display: flex; align-items: flex-end; gap: 2px; margin: 0 0 14px; padding-bottom: 16px;
    border-bottom: 1px solid var(--pc-border); max-width: 960px; }
.cal-sm { position: relative; flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: stretch;
    justify-content: flex-end; gap: 3px; padding: 0 0 2px; margin: 0; border: 0; border-bottom: 2px solid transparent;
    background: none; cursor: pointer; font-family: var(--pc-sans); color: var(--pc-text-meta); }
.cal-sm:disabled { cursor: default; }
.cal-sm:not(:disabled):hover .cal-sb { opacity: 0.8; }
.cal-sm.is-active { border-bottom-color: var(--pc-text); color: var(--pc-text); }
.cal-sm:focus-visible { outline: 2px solid var(--pc-text); outline-offset: 1px; }
.cal-sn { font-size: 11px; font-weight: 700; text-align: center; font-variant-numeric: tabular-nums; color: var(--pc-text-body);
    min-height: 13px; line-height: 13px; }
.cal-sb { display: flex; flex-direction: column-reverse; min-height: 0; margin: 0 auto; width: 100%; max-width: 26px; }
.cal-sb i { display: block; min-height: 2px; background: var(--c); }
.cal-sl { font-size: 11px; text-align: center; line-height: 1; }
.cal-sm.is-active .cal-sl { font-weight: 700; }
.cal-sy { position: absolute; left: 0; top: 100%; margin-top: 4px; font-size: 11px; font-weight: 600; color: var(--pc-text-meta);
    white-space: nowrap; }

/* Map */
.cal-map-wrap { max-width: 820px; }
.cal-map-title { font-family: var(--pc-sans); font-size: 15px; font-weight: 700; color: var(--pc-text); margin: 18px 0 4px; }
.cal-map path.us-state.cal-s, .cal-map rect.cal-s { fill: var(--pc-border-light); }
.cal-map path.us-state.cal-s[class*="cal-g-"], .cal-map rect.cal-s[class*="cal-g-"] { fill: var(--c); }
.cal-map .cal-ml { fill: var(--pc-text-meta); }
.cal-map .cal-ml[class*="cal-l-"] { fill: var(--pc-court-on); }
.cal-map .cal-ml.cal-l-general { fill: var(--pc-on-ink); }
.cal-map .cal-ml.cal-l-spring { fill: var(--pc-text); }
body.dark-mode .cal-map .cal-ml.cal-l-spring { fill: var(--pc-on-ink); }
.cal-map .sl-co-label { font-weight: 700; }

/* Timeline: month heading, then one block per date with its rows */
.cal-tl .pc-section-title { margin-bottom: 4px; }
.cal-month { margin: 0 0 6px; max-width: 880px; }
.cal-mh { font-family: var(--pc-sans); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em;
    color: var(--pc-text-meta); margin: 22px 0 0; padding-bottom: 6px; border-bottom: 2px solid var(--pc-text); }
.cal-day { display: grid; grid-template-columns: 52px minmax(0, 1fr); border-bottom: 1px solid var(--pc-border-light); }
.cal-date { padding: 10px 0; font-family: var(--pc-sans); line-height: 1.1; }
.cal-date b { display: block; font-size: 22px; font-weight: 700; color: var(--pc-text); font-variant-numeric: tabular-nums; }
.cal-date span { font-size: 11px; color: var(--pc-text-meta); text-transform: uppercase; letter-spacing: 0.05em; }
.cal-rows { list-style: none; margin: 0; padding: 0; }
.cal-row { display: grid; grid-template-columns: 14px 150px minmax(0, 1fr); gap: 0 10px; align-items: baseline; padding: 9px 0;
    font-family: var(--pc-sans); font-size: 14px; color: var(--pc-text-body); line-height: 1.35; }
.cal-row + .cal-row { border-top: 1px solid var(--pc-border-light); }
.cal-row .cal-mk { position: relative; top: 1px; }
.cal-st { font-weight: 700; color: var(--pc-text); }
.cal-st a { color: var(--pc-text); text-decoration: none; }
.cal-st a:hover { text-decoration: underline; text-underline-offset: 2px; }
.cal-tag { margin-left: 6px; font-size: 12px; color: var(--pc-text-meta); }
.cal-page { margin-left: 8px; font-size: 13px; font-weight: 600; color: var(--pc-text); text-underline-offset: 2px; }
.cal-off { display: block; font-size: 12px; color: var(--pc-text-meta); margin-top: 1px; }
.cal-nd .cal-rows { border-bottom: 1px solid var(--pc-border-light); }
.cal-nd .cal-row { grid-template-columns: 14px 150px minmax(0, 1fr); }
.cal-tl [hidden], .cal-empty[hidden] { display: none; }

@media (max-width: 768px) {
    .cal-filters { gap: 8px; }
    .cal-types .pc-btn { padding: 6px 9px; font-size: 12px; }
    .cal-strip { gap: 1px; }
    .cal-sn { font-size: 9px; }
    .cal-sl { font-size: 10px; }
    .cal-day { grid-template-columns: 40px minmax(0, 1fr); }
    .cal-date b { font-size: 19px; }
    .cal-row, .cal-nd .cal-row { grid-template-columns: 12px minmax(0, 1fr); }
    .cal-row .cal-what { grid-column: 2; }
    .cal-map-title { margin-top: 14px; }
}