/*
 * cortinilla-puerta.css — Estilos específicos de la variante HORIZONTAL
 * v3.3: solo contiene las reglas que diferencian a esta variante.
 *       Todos los estilos comunes están en cortinilla-shared.css.
 */

/* ── Cortinas HORIZONTALES ─────────────────────────────────────────────── */
.cortinilla-curtain {
  position: fixed;
  top: 0;
  width: 50vw;
  height: 100vh;
  background-image: var(--curtain-image);
  background-repeat: no-repeat;
  z-index: 1000;
  transition: transform var(--velocidad-cortina, 1.5s) cubic-bezier(0.25, 0.46, 0.45, 0.94); /* v3.8 */
}

.cortinilla-curtain-left {
  left: 0;
  background-position: 0% center;
  background-size: 200% 100%;
}

.cortinilla-curtain-right {
  right: 0;
  background-position: 100% center;
  background-size: 200% 100%;
}


.cortinilla-curtain.slide-out-left {
  transform: translateX(-100%) scale(1.05);
}

.cortinilla-curtain.slide-out-right {
  transform: translateX(100%) scale(1.05);
}

/* ── Botón de audio — tamaño y posición de esta variante ───────────────── */
.cortinilla-audio-control {
  left: 10px;
  /* v1.6.1: 45→50px — más fácil de tocar en móvil (recomendación Apple 44+). */
  width: 50px;
  height: 50px;
}