/*! =============================================================================
 *  © 2026 Renzo Núñez · RonBStudio — "Perú Elige 2026 · Segunda Vuelta".
 *  Código propietario. https://www.ronbstudio.com
 * ============================================================================= */
/* =============================================================================
 *  voto-exterior.css — "Keiko: el impacto del Interior y el Exterior".
 *  Tres barras en votos (exterior rojo / interior naranja + bandera / delta verde
 *  + check) sobre la tarjeta Manto Vivo. Leyenda visible + nota colapsada.
 *  v0.1.16.246
 * ===========================================================================*/

.voto-exterior-section { padding: 0 1rem; }

.vext {
  max-width: 760px;
  margin: 1.4rem auto 0;
  background: var(--c-mv-bg-card, #fff);
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 16px;
  padding: 1.25rem 1.4rem 1.1rem;
  box-shadow: 0 2px 16px rgba(15, 23, 42, 0.05);
}

.vext__head { margin-bottom: 0.7rem; text-align: center; }
.vext__title {
  margin: 0;
  font-family: var(--font-serif, Georgia, "Times New Roman", serif);
  font-size: 1.2rem; font-weight: 800; letter-spacing: -0.01em; line-height: 1.18;
  color: var(--c-mv-ink, #1e293b);
}
.vext__sub { margin: 0.32rem 0 0; font-size: 0.82rem; line-height: 1.5; color: var(--c-mv-ink-soft, #64748b); }

.vext__chart { display: block; width: 100%; height: auto; margin: 0 auto; max-width: 640px; }
.vext__zero { stroke: var(--c-mv-ink-soft, #64748b); stroke-width: 1.2; }
.vext__zerolab { fill: var(--c-mv-ink-muted, #94a3b8); font-size: 10.5px; }
.vext__divider { stroke: rgba(15, 23, 42, 0.14); stroke-width: 1; stroke-dasharray: 4 4; }
.vext__grouplab { fill: var(--c-mv-ink-soft, #64748b); font-size: 11.5px; font-weight: 600; }
.vext__grouplab--res { fill: #0f6e56; }
.vext__collab { fill: var(--c-mv-ink, #1e293b); font-size: 12.5px; font-weight: 700; }
.vext__colsub { fill: var(--c-mv-ink-soft, #64748b); font-size: 11px; }

.vext__callout {
  margin: 0.6rem auto 0; max-width: 660px;
  background: rgba(15, 23, 42, 0.03); border-radius: 12px;
  padding: 0.7rem 1rem;
  font-size: 0.84rem; line-height: 1.55; color: var(--c-mv-ink-soft, #64748b); text-align: center;
}
.vext__callout b { font-weight: 800; }

.vext__note { margin: 0.85rem auto 0; max-width: 660px; }
.vext__note > summary {
  cursor: pointer; list-style: none;
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 0.72rem; font-weight: 600; color: var(--c-mv-ink-muted, #94a3b8);
  user-select: none;
}
.vext__note > summary::-webkit-details-marker { display: none; }
.vext__note > summary::before {
  content: "\25B8"; font-size: 0.7rem; transition: transform 0.18s ease;
}
.vext__note[open] > summary::before { transform: rotate(90deg); }
.vext__note > p {
  margin: 0.5rem 0 0; padding-top: 0.55rem;
  border-top: 1px solid rgba(15, 23, 42, 0.07);
  font-size: 0.66rem; line-height: 1.55; color: var(--c-mv-ink-soft, #64748b);
}

@media (max-width: 520px) {
  .vext { padding: 1.05rem 0.9rem 0.95rem; }
}