/* Wrapper del reproductor Twitch (iframe sin SDK) */
.tvda-twitch-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  background:#000;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 2px 8px rgba(0,0,0,.4);
}

/* Iframe ocupa todo el contenedor */
.tvda-twitch-wrapper iframe {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  background:#000;
}

/* Overlay de carga */
.tvda-twitch-loading {
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:radial-gradient(rgba(0,0,0,.65), rgba(0,0,0,.9));
  transition:opacity .3s ease;
  z-index:2;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Arial;
  padding:0 1rem;
  text-align:center;
  color:#eee;
  pointer-events: none; /* añade esta línea */
}

.tvda-twitch-loading.tvda-hide {
  opacity:0;
  pointer-events:none;
}

/* Modo reducido movimiento */
@media (prefers-reduced-motion: reduce) {
  .tvda-twitch-loading { transition:none; }
}

/* Ajuste opcional para pequeño alto (móviles muy horizontales) */
@media (max-height: 420px) {
  .tvda-twitch-wrapper { aspect-ratio:auto; height:320px; }
}

/* Dark/Light contraste (si tu sistema aplica clases) */
.dark .tvda-twitch-wrapper { box-shadow:0 2px 10px rgba(0,0,0,.6); }
.light .tvda-twitch-wrapper { box-shadow:0 2px 8px rgba(0,0,0,.25); }