/* Painel do 2º turno (apuracao.php) — complementa app.css e apuracao.css */
/* Cor de cada candidato (pelo número, data-c), igual em qualquer lado da tela; .lado0/.lado1 é só a posição */
.t2 .lado0, .t2 .lado1 { --cor: #586C67; --cor-claro: #EDF2F1; }
.t2 [data-c="13"] { --cor: #C8102E; --cor-claro: #FCE8EB; } /* Lula: vermelho */
.t2 [data-c="22"] { --cor: #15803D; --cor-claro: #E6F4EA; } /* Flávio Bolsonaro: verde */
.t2 .trilho i, .t2 .cabo i, .t2 .uf-barra i { transition: width .8s ease; }

.t2-cab { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 24px; margin-bottom: 14px; }
.t2-cab p { margin: 0; color: var(--suave); font-size: .9rem; font-variant-numeric: tabular-nums; }
.t2-cab p.erro-con { color: #7A3D0A; }
.t2-urnas { flex: 1 1 260px; max-width: 420px; }
.t2-urnas .trilho { background: var(--linha); }

/* ---- Os dois candidatos ---- */
.duelo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; margin-bottom: 18px; }
.duelo > .aguarda { grid-column: 1 / -1; background: var(--papel); border-radius: var(--raio); padding: 24px; }
.cand2 { position: relative; display: flex; align-items: center; gap: 18px; background: var(--papel); border-radius: var(--raio);
  padding: 20px; box-shadow: 0 1px 0 var(--linha); border-top: 6px solid var(--cor); }
.cand2.lado1 { flex-direction: row-reverse; text-align: right; }
.cand2.lider { background: linear-gradient(180deg, var(--cor-claro), var(--papel) 70%); }
.cand2 .foto { width: 132px; height: 132px; border-radius: 50%; border: 4px solid var(--cor); font: 700 2.4rem/1 var(--f-titulo);
  display: flex; align-items: center; justify-content: center; overflow: hidden; }
.cand2-txt { min-width: 0; }
.cand2 h2 { margin: 2px 0 0; overflow-wrap: anywhere; font: 700 clamp(1.3rem, 2.6vw, 2.1rem)/1.05 var(--f-titulo); text-transform: uppercase; }
.cand2-sub { margin: 2px 0 0; color: var(--suave); font-weight: 500; }
.cand2-pct { margin: 6px 0 0; font: 700 clamp(2.6rem, 6.5vw, 4.8rem)/1 var(--f-titulo); color: var(--cor); font-variant-numeric: tabular-nums; }
.cand2-v { margin: 4px 0 0; font-size: 1.05rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.cand2-selo { display: inline-block; min-height: 1.5em; font: 700 .75rem/1.5 var(--f-texto); letter-spacing: .06em; text-transform: uppercase; }
.cand2-selo:not(:empty) { padding: 1px 10px; border-radius: 999px; background: var(--cor); color: #fff; }
.cand2-selo.eleito { background: var(--confirma); }
.cand2-selo.eleito::before { content: "✓ "; }

/* Barra dividida entre os dois, com a marca dos 50% */
.cabo { grid-column: 1 / -1; position: relative; display: flex; height: 22px; border-radius: 11px; overflow: hidden; background: var(--linha); }
.cabo i { display: block; height: 100%; }
.cabo i { background: var(--cor); }
.cabo b { position: absolute; left: 50%; top: -2px; bottom: -2px; width: 3px; margin-left: -1.5px; background: #fff; }
.t2-tot { grid-column: 1 / -1; margin: 0; font-size: .88rem; color: var(--suave); font-variant-numeric: tabular-nums; text-align: center; white-space: pre-wrap; }
.duelo .falha { grid-column: 1 / -1; margin: 0; text-align: center; }

/* ---- Por estado ---- */
.t2-estados header { align-items: center; }
.t2-ordem select { min-height: 38px; padding: 4px 10px; border: 2px solid var(--linha); border-radius: 8px; background: var(--papel); }
.t2-leg { display: flex; justify-content: space-between; gap: 12px; margin: -4px 0 8px; font-weight: 600; font-size: .9rem; }
.t2-leg span { display: inline-flex; align-items: center; gap: 6px; }
.t2-leg i { width: 12px; height: 12px; border-radius: 3px; }
.t2-leg i { background: var(--cor); }
.t2-lista { list-style: none; margin: 0; padding: 0; }
.uf { display: grid; grid-template-columns: minmax(150px, 1.3fr) 110px 2fr 110px; align-items: center; gap: 4px 14px;
  padding: 10px 0; border-top: 1px solid var(--linha); font-variant-numeric: tabular-nums; }
.uf-nm strong { display: block; font-weight: 600; line-height: 1.2; }
.uf-pst { font-size: .78rem; color: var(--suave); }
.uf-lado { line-height: 1.15; }
.uf-lado.lado1 { text-align: right; }
.uf-p { display: block; font: 700 1.2rem/1.1 var(--f-titulo); }
.uf-p { color: var(--cor); }
.uf-v { font-size: .8rem; color: var(--suave); }
.uf-lado:not(.na-frente) .uf-p { opacity: .55; }
.uf-barra { display: flex; height: 12px; border-radius: 6px; overflow: hidden; background: var(--linha); }
.uf-barra i { display: block; height: 100%; }
.uf-barra i { background: var(--cor); }
.uf.vazio .uf-barra i { opacity: .25; }
.uf.vazio .uf-p { opacity: .55; }

@media (max-width: 720px) {
  .apu-topo .logo { height: 48px; }
  .apu-topo .topo-txt { min-width: 0; }
  .apu-topo .topo-txt strong { font-size: 1.05rem; }
  .apu-topo .topo-txt span { font-size: .78rem; }
  .duelo { gap: 10px; }
  .cand2 h2 { font-size: 1.15rem; }
  .cand2-pct { font-size: 2.4rem; }
  .cand2-v { font-size: .9rem; }
  .cand2, .cand2.lado1 { flex-direction: column; text-align: center; gap: 8px; padding: 14px 10px; }
  .cand2 .foto { width: 84px; height: 84px; font-size: 1.6rem; }
  .uf { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .uf-nm { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
  .uf-barra { grid-column: 1 / -1; grid-row: 3; }
}