/* ===========================================================
   ESTILO: MUNDIAL  (body.estilo-mundial)
   Se carga SOLO cuando estilo_votacion = MUNDIAL.
   Sobrescribe el look&feel NORMAL de style.css.
   =========================================================== */

/* Fondo del header: gradientes azul/magenta/lima en vez del dorado.
   Lleva !important porque el .bloque-header base ya usa !important. */
body.estilo-mundial .bloque-header {
  background:
    radial-gradient(circle at 20% 30%, rgba(2, 133, 227, 0.12), transparent 42%),
    radial-gradient(circle at 80% 70%, rgba(106, 1, 87, 0.32), transparent 34%),
    radial-gradient(circle at 92% 18%, rgba(131, 150, 1, 0.28), transparent 28%),
    radial-gradient(circle at 15% 85%, rgba(2, 133, 227, 0.20), transparent 30%),
    linear-gradient(135deg, #000814 0%, #020b1f 38%, #021533 68%, #000000 100%) !important;
}

/* Color cálido para los títulos "votá ahora". */
body.estilo-mundial .h1-votá-ahora-style {
  color: #fff6d5 !important;
}

/* Borde multicolor animado (paleta Mundial 2026) en el borde superior e
   inferior del bloque de nominados. Replica el diseño final de la branch
   `mundial` (commits 5696646 + f0f3e92): barras de 4px que se deslizan.
   Antes acá había un marco estático con máscara; se reemplazó por las
   barras animadas para reflejar el look Mundial vigente. */
body.estilo-mundial #votacionabierta-nominados {
  position: relative;
  padding: 2rem;
  overflow: hidden;
}
/* En móvil el padding lateral debe quedar en 0, igual que hace
   .bloc.full-width-bloc (style.css, @media max-width:991px). Como este
   selector lleva un #id, gana por especificidad y, si no lo anulamos,
   los 2rem laterales achican la fila y las tarjetas caen a 1 por fila.
   Con padding-left/right:0 se mantienen 2 por fila como en las ramas
   mundial/planta/repechaje; el padding vertical (barras de colores) queda. */
@media (max-width: 991px) {
  body.estilo-mundial #votacionabierta-nominados {
    padding-left: 0;
    padding-right: 0;
  }
}
body.estilo-mundial #votacionabierta-nominados::before,
body.estilo-mundial #votacionabierta-nominados::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 4px;
  background: repeating-linear-gradient(
    90deg,
    #ff3d00   0px,  #ff3d00   40px,
    #004d43  40px,  #004d43   80px,
    #00e676  80px,  #00e676  120px,
    #c6ff00 120px,  #c6ff00  160px,
    #2962ff 160px,  #2962ff  200px,
    #8e0000 200px,  #8e0000  240px,
    #ffffff 240px,  #ffffff  280px
  );
  background-size: 280px 100%;
  animation: multicolor-slide 4s linear infinite;
  z-index: 5;
  pointer-events: none;
}
body.estilo-mundial #votacionabierta-nominados::before { top: 0; }
body.estilo-mundial #votacionabierta-nominados::after  { bottom: 0; }

@keyframes multicolor-slide {
  0%   { background-position: 0 0; }
  100% { background-position: 280px 0; }
}