/* Zoeken: tijdlijn per maand en treffers per vergadering. Alleen tokens uit site.css en partijkleuren. */

/* één gemeente kiezen staat tussen de bron-woorden; gekozen = wit met een streep, zoals de andere woorden */
.gsel .bare { width: 9.5rem; height: 30px; }
.gsel.on .bare { border-bottom: 2px solid var(--tx); }
/* op polibase.nl: de bronnen buiten Nederland staan op world */
a.opt { text-decoration: none; }

/* voorbeelden als er nog niets is gezocht */
.alts.ex { margin-top: 28px; }
.alts.ex a { font-family: var(--sans); font-size: 16px; font-weight: 500; letter-spacing: 0; color: var(--tx3); }

/* ---------- tijdlijn ---------- */
.tl { margin: 30px 0 0; }
.tl-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 0; margin: 0 0 12px; font: 500 15px/1.4 var(--sans); color: var(--tx3); }
.tl-h b { margin: 0 4px 0 0; font: 650 24px/1 var(--disp); color: var(--tx); font-variant-numeric: tabular-nums; }
.tl-h b + b, .tl-h b:not(:first-child) { margin-left: 4px; }
.tl-x { margin-left: 16px; padding: 2px 0; font: 600 var(--bf)/1.1 var(--disp); letter-spacing: 0.02em; color: var(--tx); text-decoration: none; border-bottom: 2px solid var(--tx); }
.tl-x:hover { color: var(--hit); border-color: var(--hit); }
.tl-scroll { overflow-x: auto; scrollbar-width: none; }
.tl-scroll::-webkit-scrollbar { display: none; }
.tl-bars, .tl-ticks { display: grid; grid-template-columns: repeat(var(--n), minmax(7px, 1fr)); gap: 2px; min-width: calc(var(--n) * 9px); max-width: min(100%, calc(var(--n) * 72px)); }
.tl-bars { height: 72px; align-items: end; border-bottom: 1px solid var(--line2); }
.tb { position: relative; height: 100%; padding: 0; border: 0; background: none; display: flex; align-items: flex-end; }
.tb i { display: block; width: 100%; height: var(--h); min-height: 0; border-radius: 1px 1px 0 0; background: var(--tx4); transition: background-color 0.15s; }
.tb:hover i, .tb:focus-visible i { background: var(--tx); }
.tb.on i { background: var(--hit); }
.tb.nil { cursor: default; }
.tb:focus-visible { outline-offset: 1px; }
.tl-ticks { margin-top: 5px; }
.tt { font: 500 11.5px/1.25 var(--sans); color: var(--tx4); white-space: nowrap; overflow: visible; }
.tt b { display: block; font-weight: 600; color: var(--tx3); }

/* ---------- treffers per vergadering ---------- */
.mgs { margin: 26px 0 0; padding: 0; list-style: none; }
.mg { display: grid; grid-template-columns: minmax(14rem, 22rem) minmax(0, 1fr); gap: 8px var(--g2); padding: 22px 0 24px; border-top: 1px solid var(--line); animation: rise 0.32s var(--ease) both; }
.mgs > .mg:last-child { border-bottom: 1px solid var(--line); }
.mg-h { min-width: 0; }
.mg-t { margin: 0; font: 600 clamp(21px, 1.9vw, 25px)/1.12 var(--disp); letter-spacing: 0.003em; overflow-wrap: anywhere; }
.mg-t a { color: var(--tx); text-decoration: none; }
.mg-t a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 5px; text-decoration-color: var(--tx3); }
.mg-m { margin: 6px 0 0; font: 500 14.5px/1.45 var(--sans); color: var(--tx3); font-variant-numeric: tabular-nums; }
.mg-m > * + *::before { content: '·'; margin: 0 7px; color: var(--tx4); }
.mg-s { color: var(--tx2); font-weight: 600; text-decoration: none; }
a.mg-s:hover { color: var(--tx); text-decoration: underline; text-underline-offset: 3px; }
.mg-hits { grid-column: 2; margin: 0; padding: 0; list-style: none; max-width: calc(var(--measure) + 5rem); }
.mh { position: relative; padding: 0 0 14px; }
.mh + .mh { padding-top: 12px; border-top: 1px solid var(--line); }
.mh-a { display: grid; grid-template-columns: 4.6rem minmax(0, 1fr); gap: 0 14px; color: inherit; text-decoration: none; }
.mh-t { padding-top: 3px; font: 500 14px/1.4 var(--sans); color: var(--tx3); font-variant-numeric: tabular-nums; }
.mh-x { font: 400 18px/1.55 var(--sans); color: var(--tx); text-wrap: pretty; }
.mh-x .gap { color: var(--tx4); }
.mh-a:hover .mh-x { color: #fff; }
.mh-a:hover .mh-t { color: var(--tx); }
.mh-a:focus-visible { outline-offset: 4px; }
/* zonder tijd (vergaderingen zonder beeldtijd): geen lege kolom */
.mh.no-t .mh-a { grid-template-columns: minmax(0, 1fr); }
.mh.no-t .mh-w { margin-left: 0; }
.mh-w { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 8px; margin: 6px 0 0 calc(4.6rem + 14px); padding-left: 9px; border-left: 3px solid var(--pc, var(--tx4)); font: 600 16px/1.2 var(--disp); letter-spacing: 0.01em; color: var(--tx2); }
.mh-w a { color: inherit; text-decoration: none; }
.mh-w a:hover { color: var(--tx); text-decoration: underline; text-underline-offset: 3px; }
.mh-p { font: 500 13px/1.3 var(--sans); letter-spacing: 0; color: var(--tx3); }
.mg-more { grid-column: 2; justify-self: start; padding: 6px 0; border: 0; background: none; font: 600 var(--bf)/1.1 var(--disp); letter-spacing: 0.02em; color: var(--tx3); }
.mg-more:hover { color: var(--tx); }
p.mg-more, p.mg-more:hover { color: var(--tx3); font: 500 14.5px/1.4 var(--sans); letter-spacing: 0; }
.mg-cut a { color: var(--tx2); }
.tl-off { margin: 0; font: 500 14.5px/1.4 var(--sans); color: var(--tx4); }

@media (max-width: 960px) {
  .mg { grid-template-columns: minmax(0, 1fr); }
  .mg-hits, .mg-more { grid-column: 1; }
  .mg-hits { margin-top: 10px; }
}
@media (max-width: 640px) {
  .tl { margin-top: 20px; }
  .tl-bars { height: 56px; }
  .mh-a { grid-template-columns: 3.6rem minmax(0, 1fr); gap: 0 10px; }
  .mh-w { margin-left: calc(3.6rem + 10px); }
  .mh.no-t .mh-w { margin-left: 0; }
  .mh-x { font-size: 17px; }
  .gsel .bare { width: 8.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .mg { animation: none; }
  .tb i { transition: none; }
}