/* Election bar in the sticky header (template-parts/apuracao-placar.php), every page, only on election night.
   Dark bar in every theme; the same reserved height in every state (64 px on phones, 48 px from 900 px), so a state
   change never pushes the page. Candidate initials sit on chips in their own color with white text (red 4.99:1,
   blue 5.93:1); the live dot is #D7263D, blinking every 1.2 s (still with reduced motion). */
.apu-placar {
  --apu-placar-bg: #0b1220;
  --apu-placar-muted: #b8c2d3;
  position: relative;
  display: block;
  min-height: 64px;
  border-block: 1px solid #000;
  color: #fff;
  background: var(--apu-placar-bg);
  text-decoration: none;
}
.apu-placar:hover, .apu-placar:focus-visible { color: #fff; }
.apu-placar:focus-visible { outline: 3px solid #ffd76a; outline-offset: -3px; }
.apu-placar-inner { display: grid; align-content: center; gap: .3rem; width: min(calc(100% - 1.5rem), 1200px); min-height: 62px; margin-inline: auto; padding-block: .35rem; font-size: .82rem; line-height: 1.2; font-variant-numeric: tabular-nums; }

.apu-placar-tag { display: inline-flex; align-items: center; gap: .35rem; justify-self: start; padding: .14rem .5rem; border-radius: .3rem; color: #fff; background: #ffffff1f; font-size: .7rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.apu-placar-tag--live { border: 1px solid #d7263d; background: #d7263d29; }
.apu-placar-dot { width: .55rem; height: .55rem; border-radius: 50%; background: #d7263d; animation: apu-placar-blink 1.2s ease-in-out infinite; }
@keyframes apu-placar-blink { 0%, 100% { opacity: 1; } 50% { opacity: .2; } }

/* Live: line 1 = tag, counted share, time; line 2 = candidate, counted-share bar, candidate. */
.apu-placar-l1 { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.apu-placar-urnas { margin-left: auto; white-space: nowrap; }
.apu-placar-urnas b { font-size: .95rem; font-weight: 800; }
.apu-placar-eleicoes { display: none; color: var(--apu-placar-muted); }
.apu-placar-hora { color: var(--apu-placar-muted); font-size: .72rem; white-space: nowrap; }
.apu-placar-hora-label { display: none; }
.apu-placar.is-stale .apu-placar-hora-label { display: inline; }
.apu-placar.is-stale .apu-placar-hora { color: #ffd76a; }
.apu-placar-l2 { display: grid; grid-template-columns: auto minmax(3rem, 1fr) auto; align-items: center; gap: .5rem; min-width: 0; }
.apu-placar-cand { display: inline-flex; align-items: center; gap: .3rem; white-space: nowrap; }
.apu-placar-cand b { font-size: .95rem; font-weight: 800; }
.apu-placar-ini { padding: .08rem .3rem; border-radius: .25rem; color: #fff; background: var(--apu-cor, #4a5563); font-size: .68rem; font-weight: 800; text-decoration: none; letter-spacing: .02em; }
.apu-placar-selo { display: none; padding: 0 .3rem; border: 1px solid #ffffffa6; border-radius: 1rem; font-size: .58rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.apu-placar-cand.is-lider .apu-placar-selo { display: inline-block; }
.apu-placar-espera { grid-column: 1 / -1; color: var(--apu-placar-muted); }

/* Countdown and elected */
.apu-placar--contagem .apu-placar-inner, .apu-placar--eleito .apu-placar-inner { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .6rem; }
.apu-placar-text { min-width: 0; }
.apu-placar-falta b { font-weight: 800; }
.apu-placar--eleito { background: var(--apu-cor, #16843f); }
.apu-placar-tag--eleito { color: var(--apu-cor, #16843f); background: #fff; }
.apu-placar--eleito .apu-placar-text { font-size: .95rem; }
.apu-placar-cta { margin-left: auto; font-weight: 800; white-space: nowrap; }

@media (min-width: 900px) {
  .apu-placar, .apu-placar-inner { min-height: 48px; }
  .apu-placar--ao-vivo .apu-placar-inner { grid-template-columns: auto minmax(0, 1fr); column-gap: 1.25rem; }
  .apu-placar-l1 { gap: .9rem; }
  .apu-placar-eleicoes { display: inline; }
  .apu-placar--ao-vivo .apu-placar-l1 { grid-column: 1; }
  .apu-placar--ao-vivo .apu-placar-l2 { grid-column: 2; grid-row: 1; }
  .apu-placar-urnas { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .apu-placar-dot { animation: none; }
  }

/* Line 2: valid votes split between the two (blue | red, proportional), a white hairline between them. The counted
   share is the thin bar on the bottom edge, full width, sliding at each reading that changed. */
.apu-placar-duelo { display: flex; height: .5rem; min-width: 3rem; border-radius: 1rem; background: #ffffff2e; overflow: hidden; }
.apu-placar-duelo span { display: block; height: 100%; transition: width .8s ease; }
.apu-placar-duelo span + span { box-shadow: inset 2px 0 0 var(--apu-placar-bg); }
.apu-placar-duelo--vazio { grid-column: 1 / -1; }
.apu-placar-urnasbar { position: absolute; right: 0; bottom: 0; left: 0; height: 4px; background: #ffffff1f; }
.apu-placar-urnasbar span { display: block; height: 100%; background: #2fd06f; transition: width .8s ease; }
.apu-placar-foto { width: 24px; height: 24px; border-radius: 50%; box-shadow: 0 0 0 2px var(--apu-cor, #4a5563); object-fit: cover; background: #ffffff2e; }

/* Padrão v3 (docs/DESIGN-APURACAO.md): AO VIVO vermelho cheio com bolinha branca piscando, LIDERA cinza-escuro,
   ELEITO verde; avatar padrão com anel branco. */
.apu-placar-tag--live { border: 0; color: #fff; background: #d7263d; }
.apu-placar-tag--live .apu-placar-dot { background: #fff; }
.apu-placar-selo { padding: 0 .3rem; border: 0; border-radius: .3rem; color: #fff; background: #374151; }
.apu-placar-tag--eleito { color: #fff; background: #16a34a; }
.apu-placar-foto { box-sizing: content-box; width: 22px; height: 22px; border: 2px solid #fff; background: var(--apu-cor, #4a5563); box-shadow: none; }
/* Nome ao lado da foto na faixa a partir de 600 px (em 360 px a faixa de 64 px não comporta: nome no alt da foto). */
.apu-placar-nome { display: none; font-weight: 700; white-space: nowrap; }
@media (min-width: 600px) { .apu-placar-nome { display: inline; } }
