/*
 * La Prensa: integración full width para el interactivo de elecciones.
 * Este archivo debe cargarse en la página del artículo (documento padre),
 * no dentro del index-compacto.html del iframe.
 */

/* El identificador del iframe limita estos ajustes a la página que lo incluye. */
@supports selector(body:has(#lp-election-embed)) {
  body:has(#lp-election-embed) .container,
  body:has(#lp-election-embed) .container-fluid,
  body:has(#lp-election-embed) .container-sm,
  body:has(#lp-election-embed) .container-md,
  body:has(#lp-election-embed) .container-lg,
  body:has(#lp-election-embed) .container-xl,
  body:has(#lp-election-embed) .container-xxl {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;
  }

  /* Permite que el bloque a sangre sobresalga de columnas estrechas. */
  body:has(#lp-election-embed) .container:has(#lp-election-embed),
  body:has(#lp-election-embed) .container-fluid:has(#lp-election-embed),
  body:has(#lp-election-embed) .container-sm:has(#lp-election-embed),
  body:has(#lp-election-embed) .container-md:has(#lp-election-embed),
  body:has(#lp-election-embed) .container-lg:has(#lp-election-embed),
  body:has(#lp-election-embed) .container-xl:has(#lp-election-embed),
  body:has(#lp-election-embed) .container-xxl:has(#lp-election-embed) {
    max-width: none !important;
    overflow: visible !important;
  }

  /* Oculta la barra visual del artículo sin bloquear su desplazamiento. */
  html:has(#lp-election-embed),
  body:has(#lp-election-embed) {
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }

  html:has(#lp-election-embed)::-webkit-scrollbar,
  body:has(#lp-election-embed)::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
  }

  /* Mantiene el tratamiento inmersivo usado en el especial de referencia. */
  body:has(#lp-election-embed) #hd-r1,
  body:has(#lp-election-embed) #nav-r0,
  body:has(#lp-election-embed) #nav-r2,
  body:has(#lp-election-embed) #nav-r3 {
    display: none !important;
  }
}

/* Full bleed centrado respecto al viewport, aunque el CMS use una columna. */
#lp-election-embed {
  position: relative !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  isolation: isolate;
}

@supports (width: 100dvw) {
  #lp-election-embed {
    width: 100dvw !important;
    max-width: 100dvw !important;
  }
}

#lp-election-embed iframe {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 75vh !important;
  height: 75dvh !important;
  min-height: 320px !important;
  border: 0 !important;
  margin: 0 !important;
}

@media (max-width: 650px) {
  #lp-election-embed iframe {
    height: 82vh !important;
    height: 82dvh !important;
    min-height: 420px !important;
  }
}