/* TSE Apuração — Estilos base
 * Todas as cores usam custom properties sobrescritíveis pelo tema do cliente.
 * Para customizar: .tse-apuracao-widget { --tse-primary: #sua-cor; }
 */

.tse-apuracao-widget {
    --tse-primary:    #003366;
    --tse-eleito:     #007A33;
    --tse-turno2:     #A16207;
    --tse-turno2-bg:  #FEF3C7;
    --tse-bg:         #ffffff;
    --tse-bg-alt:     #f5f7fa;
    --tse-border:     #dde2ea;
    --tse-text:       #1a2a3a;
    --tse-muted:      #5a6a7a;
    --tse-radius:     10px;
    --tse-font:       -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --tse-mono:       "SFMono-Regular", Consolas, "Liberation Mono", monospace;

    font-family:  var(--tse-font);
    background:   var(--tse-bg);
    border:       1px solid var(--tse-border);
    border-radius: var(--tse-radius);
    overflow:     hidden;
    margin:       24px 0;
    box-shadow:   0 1px 4px rgba(0,0,0,.06);
}

/* ── Cabeçalho ── */
.tse-header {
    display:         flex;
    align-items:     flex-start;
    justify-content: space-between;
    gap:             12px;
    padding:         18px 20px 14px;
    background:      var(--tse-primary);
    flex-wrap:       wrap;
}

.tse-titulo {
    font-size:   17px;
    font-weight: 700;
    color:       #fff;
    margin:      0 0 8px;
    line-height: 1.2;
}

.tse-apurado {
    display:     flex;
    align-items: center;
    gap:         8px;
}

.tse-apurado-barra {
    width:           120px;
    height:          6px;
    background:      rgba(255,255,255,.25);
    border-radius:   3px;
    overflow:        hidden;
}

.tse-apurado-fill {
    height:          100%;
    background:      #fff;
    border-radius:   3px;
    transition:      width .5s ease;
    min-width:       2px;
}

.tse-apurado-label {
    font-size:  12px;
    color:      rgba(255,255,255,.85);
    white-space: nowrap;
}

.tse-header-right {
    display:     flex;
    align-items: center;
    gap:         8px;
    flex-wrap:   wrap;
}

.tse-ao-vivo {
    display:         inline-flex;
    align-items:     center;
    gap:             5px;
    font-size:       11px;
    font-weight:     600;
    letter-spacing:  .04em;
    text-transform:  uppercase;
    background:      rgba(255,255,255,.15);
    color:           #fff;
    padding:         3px 10px;
    border-radius:   20px;
    border:          1px solid rgba(255,255,255,.3);
}

.tse-pulse {
    width:            7px;
    height:           7px;
    border-radius:    50%;
    background:       #f87171;
    display:          inline-block;
    animation:        tse-pulse 1.4s ease-in-out infinite;
}

@keyframes tse-pulse {
    0%, 100% { opacity: 1; transform: scale(1);   }
    50%       { opacity: .5; transform: scale(.8); }
}

.tse-status {
    font-size:  11px;
    color:      rgba(255,255,255,.75);
}

/* ── Conteúdo ── */
.tse-content {
    padding: 0;
}

.tse-vazio,
.tse-erro {
    padding:   32px 20px;
    text-align: center;
    color:     var(--tse-muted);
    font-size: 14px;
}

.tse-erro {
    color: #b91c1c;
}

.tse-loading-spinner {
    display:       inline-block;
    width:         18px;
    height:        18px;
    border:        2px solid var(--tse-border);
    border-top-color: var(--tse-primary);
    border-radius: 50%;
    animation:     tse-spin .7s linear infinite;
    vertical-align: middle;
    margin-right:  8px;
}

@keyframes tse-spin {
    to { transform: rotate(360deg); }
}

/* ── Lista de candidatos ── */
.tse-lista {
    list-style: none;
    margin:     0;
    padding:    0;
}

.tse-candidato {
    display:         flex;
    align-items:     center;
    gap:             12px;
    padding:         12px 20px;
    border-bottom:   1px solid var(--tse-border);
    transition:      background .15s;
}

.tse-candidato:last-child {
    border-bottom: none;
}

.tse-candidato:hover {
    background: var(--tse-bg-alt);
}

.tse-candidato.tse-eleito {
    background: color-mix(in srgb, var(--tse-eleito) 7%, transparent);
}

.tse-candidato.tse-eleito:hover {
    background: color-mix(in srgb, var(--tse-eleito) 12%, transparent);
}

.tse-cand-posicao {
    font-family:     var(--tse-mono);
    font-size:       11px;
    color:           var(--tse-muted);
    width:           22px;
    text-align:      right;
    flex-shrink:     0;
    font-variant-numeric: tabular-nums;
}

.tse-cand-info {
    flex:    1;
    min-width: 0;
}

.tse-cand-top {
    display:     flex;
    align-items: baseline;
    gap:         6px;
    flex-wrap:   wrap;
    margin-bottom: 6px;
}

.tse-cand-numero {
    font-family:     var(--tse-mono);
    font-size:       12px;
    font-weight:     600;
    color:           var(--tse-primary);
    background:      color-mix(in srgb, var(--tse-primary) 10%, transparent);
    padding:         1px 6px;
    border-radius:   4px;
    flex-shrink:     0;
}

.tse-cand-nome {
    font-size:   14px;
    font-weight: 600;
    color:       var(--tse-text);
    white-space: nowrap;
    overflow:    hidden;
    text-overflow: ellipsis;
    max-width:   260px;
}

.tse-cand-partido {
    font-size:  12px;
    color:      var(--tse-muted);
    flex-shrink: 0;
}

.tse-badge-eleito {
    font-size:       10px;
    font-weight:     700;
    letter-spacing:  .06em;
    text-transform:  uppercase;
    color:           var(--tse-eleito);
    background:      color-mix(in srgb, var(--tse-eleito) 12%, transparent);
    border:          1px solid color-mix(in srgb, var(--tse-eleito) 30%, transparent);
    padding:         2px 7px;
    border-radius:   4px;
    flex-shrink:     0;
}

.tse-badge-status {
	display: inline-flex;
	align-items: center;
	padding: 2px 7px;
	border-radius: 999px;
	background: #eef0f2;
	color: #50575e;
	font-size: 11px;
	font-weight: 700;
}

/* Situação "2º turno": distinta de "Não eleito" — o candidato ainda disputa, não está fora. */
.tse-badge-turno2 {
	background: var(--tse-turno2-bg);
	color: var(--tse-turno2);
	border: 1px solid color-mix(in srgb, var(--tse-turno2) 35%, transparent);
}

.tse-cand-barra-wrap {
    height:          5px;
    background:      var(--tse-border);
    border-radius:   3px;
    overflow:        hidden;
}

.tse-cand-barra {
    height:          100%;
    background:      var(--tse-primary);
    border-radius:   3px;
    transition:      width .6s ease;
    min-width:       2px;
}

.tse-eleito .tse-cand-barra {
    background: var(--tse-eleito);
}

.tse-cand-votos {
    display:         flex;
    flex-direction:  column;
    align-items:     flex-end;
    flex-shrink:     0;
    min-width:       80px;
}

.tse-votos-num {
    font-family:     var(--tse-mono);
    font-size:       14px;
    font-weight:     600;
    color:           var(--tse-text);
    font-variant-numeric: tabular-nums;
}

.tse-votos-pct {
    font-size:  12px;
    color:      var(--tse-muted);
    font-variant-numeric: tabular-nums;
}

/* ── Rodapé ── */
.tse-footer {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding:         10px 20px;
    background:      var(--tse-bg-alt);
    border-top:      1px solid var(--tse-border);
    gap:             12px;
    flex-wrap:       wrap;
}

.tse-fonte,
.tse-atualizado {
    font-size: 11px;
    color:     var(--tse-muted);
}

.tse-timestamp {
    font-family: var(--tse-mono);
}

/* ── Responsivo ── */
@media (max-width: 600px) {
    .tse-header {
        flex-direction: column;
        gap:            10px;
    }

    .tse-candidato {
        padding:   10px 14px;
        gap:       8px;
    }

    .tse-cand-nome {
        max-width: 160px;
    }

    .tse-cand-votos {
        min-width: 60px;
    }

    .tse-apurado-barra {
        width: 80px;
    }

    .tse-footer {
        flex-direction: column;
        align-items:    flex-start;
        gap:            4px;
    }
}

/* [tse_apuracao_card] — card compacto com o líder de uma disputa.
 * Marcação flat de propósito: cada classe faz uma coisa só, pra ser
 * fácil de sobrescrever sem precisar entender o resto do componente.
 */
.tse-card {
	font-family:   var(--tse-font);
	background:    var(--tse-bg, #fff);
	border:        1px solid var(--tse-border, #dde2ea);
	border-radius: var(--tse-radius, 10px);
	padding:       14px 16px;
	max-width:     360px;
}

.tse-card-header {
	display:         flex;
	justify-content: space-between;
	align-items:     baseline;
	gap:             8px;
	margin-bottom:   10px;
}

.tse-card-cargo {
	font-weight: 700;
	font-size:   13px;
	color:       var(--tse-text, #1a2a3a);
}

.tse-card-pct {
	font-size: 12px;
	color:     var(--tse-muted, #5a6a7a);
}

.tse-card-vazio {
	font-size: 13px;
	color:     var(--tse-muted, #5a6a7a);
	padding:   8px 0;
}

.tse-card-lider {
	display:     flex;
	align-items: center;
	gap:         10px;
}

.tse-card-foto {
	width:        44px;
	height:       44px;
	border-radius: 50%;
	object-fit:   cover;
	flex-shrink:  0;
	background:   var(--tse-bg-alt, #f5f7fa);
}

.tse-card-info {
	flex:     1;
	min-width: 0;
}

.tse-card-nome-linha {
	display:      flex;
	align-items:  baseline;
	gap:          6px;
}

.tse-card-numero {
	font-family: var(--tse-mono);
	font-weight: 700;
	color:       var(--tse-primary, #003366);
	font-size:   12px;
}

.tse-card-nome {
	font-weight:    600;
	font-size:      14px;
	white-space:    nowrap;
	overflow:       hidden;
	text-overflow:  ellipsis;
}

.tse-card-partido {
	font-size: 12px;
	color:     var(--tse-muted, #5a6a7a);
}

.tse-card-percentual {
	font-family: var(--tse-mono);
	font-weight: 700;
	font-size:   16px;
	color:       var(--tse-text, #1a2a3a);
	flex-shrink: 0;
}

.tse-card-lider.tse-eleito .tse-card-percentual { color: var(--tse-eleito); }
.tse-card-lider.tse-segundo-turno .tse-card-percentual { color: var(--tse-turno2); }

.tse-card-barra-wrap {
	height:        5px;
	background:    var(--tse-border, #dde2ea);
	border-radius: 3px;
	overflow:      hidden;
	margin:        10px 0 8px;
}

.tse-card-barra {
	height:     100%;
	background: var(--tse-primary, #003366);
}

.tse-card-lider.tse-eleito ~ .tse-card-barra-wrap .tse-card-barra { background: var(--tse-eleito); }
.tse-card-lider.tse-segundo-turno ~ .tse-card-barra-wrap .tse-card-barra { background: var(--tse-turno2); }

.tse-card-rodape {
	display:         flex;
	justify-content: space-between;
	align-items:     center;
	gap:             8px;
}

/* [tse_apuracao_card limite=">1"]: título e "% apurado" aparecem uma vez só,
 * para a disputa inteira — não repetidos em cada card. Mesmo padrão de
 * cabeçalho de seção usado no resto do site (<header class="apuracao__header">
 * com <h2> dentro). O h2 do tema costuma ser pensado pra seção de página
 * inteira (grande, com margem própria) — aqui ele fica dentro de um card
 * estreito, então resetamos o essencial pra não estourar o layout,
 * mantendo cor/peso que o tema já define globalmente pra h2.
 */
.tse-card-secao .apuracao__header {
	display:         flex;
	justify-content: space-between;
	align-items:     baseline;
	gap:             8px;
	margin:          0 0 10px;
	padding:         0;
	border:          0;
	background:      none;
}

.tse-card-secao .apuracao__header h2 {
	margin:      0;
	font-size:   15px;
	line-height: 1.3;
}

.tse-card-secao-pct {
	font-size: 12px;
	color:     var(--tse-muted, #5a6a7a);
	flex-shrink: 0;
}

/* N cards iguais lado a lado. Default simples de sobrescrever — passe
 * `classe="sua-classe"` no shortcode para plugar num grid que já existe no
 * tema (ela entra no elemento de fora: `.tse-card-secao` ou este `.tse-card-grid`). */
.tse-card-grid {
	display:  flex;
	flex-wrap: wrap;
	gap:      12px;
}

.tse-card-grid .tse-card { flex: 1 1 260px; }

.tse-card-status-texto,
.tse-card-atualizado {
	font-size: 11px;
	color:     var(--tse-muted, #5a6a7a);
}

.tse-card-atualizado.tse-dados-atrasados {
	color:       #b45309;
	font-weight: 600;
}

/* Candidate directory */
.ae-catalog,.ae-candidate-profile{font-family:var(--tse-font,Arial,sans-serif);max-width:1180px;margin:32px auto;color:#172033}.ae-catalog-kicker{color:#0068b3;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.ae-catalog h1,.ae-candidate-profile h1{font-size:clamp(28px,4vw,44px);margin:4px 0 10px}.ae-catalog-filters{display:grid;grid-template-columns:2fr 1fr .6fr 1fr auto;gap:10px;padding:18px;background:#f0f4f8;border-radius:12px;margin:24px 0}.ae-catalog-filters input,.ae-catalog-filters select,.ae-catalog-filters button{min-height:44px;border:1px solid #cbd5e1;border-radius:7px;padding:0 12px;font:inherit}.ae-catalog-filters button{background:#0068b3;color:#fff;border:0;font-weight:700;cursor:pointer}.ae-catalog-count{font-weight:600}.ae-catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.ae-candidate-card{display:flex;gap:14px;border:1px solid #dbe3ec;border-radius:12px;padding:14px;background:#fff}.ae-candidate-card img,.ae-candidate-avatar,.ae-candidate-profile header img{width:76px;height:76px;border-radius:50%;object-fit:cover;background:#e8eef5;flex:0 0 76px}.ae-candidate-avatar{display:grid;place-items:center;font-size:28px}.ae-candidate-card h2{font-size:18px;margin:5px 0}.ae-candidate-card h2 a{color:#172033;text-decoration:none}.ae-candidate-card p,.ae-candidate-card small{margin:4px 0;color:#526174}.ae-candidate-number,.ae-candidate-profile header span{font-weight:800;color:#0068b3}.ae-catalog-empty{padding:24px;text-align:center;background:#f8fafc;border-radius:10px}.ae-candidate-profile>a{color:#0068b3;font-weight:700}.ae-candidate-profile header{display:flex;gap:20px;align-items:center;padding:28px 0;border-bottom:1px solid #dbe3ec}.ae-candidate-profile header img{width:130px;height:130px;flex-basis:130px}.ae-candidate-profile dl{display:grid;grid-template-columns:180px 1fr;gap:12px}.ae-candidate-profile dt{font-weight:700}.ae-candidate-profile dd{margin:0}@media(max-width:760px){.ae-catalog-filters{grid-template-columns:1fr}.ae-catalog-grid{grid-template-columns:1fr}.ae-candidate-profile header{align-items:flex-start}.ae-candidate-profile header img{width:90px;height:90px;flex-basis:90px}.ae-candidate-profile dl{grid-template-columns:1fr;gap:4px}}

/* ── Transição de atualização ── */
.tse-atualizando .tse-candidato {
    animation: tse-flash .4s ease;
}

@keyframes tse-flash {
    0%   { opacity: 1; }
    40%  { opacity: .5; }
    100% { opacity: 1; }
}