/* Contenedor responsivo del iframe */
.penalty-embed {
  position: relative;
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  overflow: hidden;
  line-height: 0;         /* evita gaps por inline-block */
  isolation: isolate;     /* aisla z-index/filters del contenido */
}

/* Fallback: “traba” de relación de aspecto por padding
   (el shortcode setea padding-top inline en .penalty-embed__ratio) */
.penalty-embed__ratio {
  width: 100%;
  padding-top: 56.25%;    /* será sobrescrito inline desde el shortcode */
}

/* Iframe ocupa todo el contenedor (fallback con padding) */
.penalty-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  background: transparent;
  touch-action: manipulation;      /* mejora interacción táctil */
  -ms-touch-action: manipulation;
}

/* Navegadores modernos: usamos aspect-ratio y desactivamos el padding hack */
@supports (aspect-ratio: 16 / 9) {
  .penalty-embed__ratio { display: none; }

  .penalty-embed iframe {
    position: static;
    width: 100%;
    height: auto;
    aspect-ratio: var(--pge-aspect, 16 / 9); /* si el plugin lo define inline, tiene prioridad */
  }
}

/* Ajustes útiles para popups de Elementor */
.elementor-popup-modal .dialog-widget-content .penalty-embed {
  padding: 0;
}