/* Votos por cidade — complementos ao design system (tokens ds-*). */
.ci-pagina, .ci-pagina > *, .ci-pagina .ds-table-scroll { min-width: 0; max-width: 100%; }
.ci-pagina { padding-block: var(--ds-space-24) var(--ds-space-16); }
.ci-texto { margin: 0; color: var(--ds-color-text-secondary); font-size: var(--ds-font-size-14); }
.ci-h2 { font-size: var(--ds-font-size-24); font-weight: var(--ds-font-weight-bold); margin: 0; }
.ci-titulo { display: flex; flex-wrap: wrap; gap: var(--ds-space-12); align-items: center; }
.ci-filtros { display: grid; gap: var(--ds-space-12) var(--ds-space-16); grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); align-items: end; }
.ci-legenda { text-align: start; padding: var(--ds-space-8) var(--ds-space-12); color: var(--ds-color-text-secondary); font-size: var(--ds-font-size-14); }
.ci-pagina td.n, .ci-pagina th.n { text-align: end; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ci-vazio { text-align: center; color: var(--ds-color-text-muted); }
.ci-abas { display: flex; flex-wrap: wrap; gap: var(--ds-space-8); border-bottom: 1px solid var(--ds-color-border-subtle); }
.ci-aba { font: inherit; cursor: pointer; background: none; color: var(--ds-color-text-secondary); border: 0; border-bottom: 3px solid transparent; padding: var(--ds-space-8) var(--ds-space-12); margin-bottom: -1px; }
.ci-aba[aria-selected="true"] { color: var(--ds-color-text-primary); border-bottom-color: var(--ds-color-brand-700); font-weight: var(--ds-font-weight-bold); }
.ci-aba:focus-visible, .ci-ord:focus-visible, .ci-sug:focus-visible { outline: 2px solid var(--ds-color-focus); outline-offset: 2px; }
.ci-busca-cand { position: relative; max-width: 40rem; }
.ci-sugestoes { list-style: none; margin: 0; padding: 0; position: absolute; z-index: 5; inset-inline: 0; top: 100%; max-height: 22rem; overflow-y: auto;
  background: var(--ds-color-bg-surface); border: 1px solid var(--ds-color-border-control); border-radius: var(--ds-radius-control); }
.ci-sug { display: block; width: 100%; text-align: start; font: inherit; cursor: pointer; background: none; border: 0; color: var(--ds-color-text-primary); padding: var(--ds-space-8) var(--ds-space-12); }
.ci-sug:hover, .ci-sug[aria-selected="true"] { background: var(--ds-color-bg-hover); }
.ci-sug small { display: block; color: var(--ds-color-text-secondary); }
.ci-ord { font: inherit; font-weight: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline dotted; }
.ci-ord::after { content: attr(data-seta); margin-inline-start: .25em; }
@media(max-width:700px){
  .ci-pagina{min-height:calc(100svh - var(--cabecalho-altura,110px));gap:10px;padding-block:12px 16px}
  .ci-pagina>header{gap:4px}
  .ci-pagina>header .ds-heading{font-size:var(--ds-font-size-24);line-height:1.15}
  .ci-texto{font-size:13px;line-height:1.3}
  .ci-abas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0}
  .ci-aba{min-width:0;min-height:48px;padding:6px 8px;font-size:var(--ds-font-size-12);line-height:1.25;text-align:center}
  .ci-pagina [role="tabpanel"]{gap:10px}
  .ci-pagina .ds-field label{font-size:var(--ds-font-size-12)}
  .ci-busca-cand{max-width:none}
  .ci-filtros{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .ci-h2{font-size:var(--ds-font-size-18)}
  .ci-titulo{gap:6px}
  .ci-legenda{padding:6px 8px;font-size:var(--ds-font-size-12)}
  .ci-pagina .ds-alert{padding:10px 12px}
  .ci-pagina .ds-alert__title{font-size:var(--ds-font-size-14)}
  .ci-pagina .ds-alert p{font-size:var(--ds-font-size-12);line-height:1.3}
}
