/*! =============================================================================
 *  © 2026 Renzo Núñez · RonBStudio — "Perú Elige 2026 · Segunda Vuelta".
 *  Todos los derechos reservados. Código propietario: queda prohibida su copia,
 *  redistribución, ingeniería inversa o uso no autorizado, total o parcial.
 *  https://www.ronbstudio.com
 * ============================================================================= */
/* =============================================================================
 *  Proyecto      : Perú Elige 2026 — Segunda Vuelta
 *  Archivo       : refresh-indicator.css
 *  Descripción   : Estilos del indicador de auto-refresco (refresh-indicator.js).
 *                  Línea discreta y centrada bajo el race header: punto verde
 *                  que late + cuenta regresiva a la próxima actualización.
 *  Autor         : Renzo Núñez · RonBStudio
 *  Versión       : 0.1.15.70
 * ===========================================================================*/

.autorefresh {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: 0.5rem auto 0;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--c-mv-ink-muted, #64748b);
}

.autorefresh__dot {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #16a34a;
  box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.5);
  animation: autorefresh-pulse 2.4s ease-in-out infinite;
}
.autorefresh__dot--ping { animation: autorefresh-ping 0.9s ease-out; }

@keyframes autorefresh-pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.4; }
}
@keyframes autorefresh-ping {
  0%   { box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.55); }
  100% { box-shadow: 0 0 0 10px rgba(22, 163, 74, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .autorefresh__dot,
  .autorefresh__dot--ping { animation: none; }
}