/* =========================================================================
   Alzati e Fattura — la finestra del filmato

   Queste regole stavano dentro `recensioni.css`, il foglio della sezione
   interviste della landing biglietti. Ma la finestra non appartiene a quella
   sezione: la costruisce `video.js`, la usano **due** sezioni — le interviste e
   le testimonianze partner — e vive attaccata al `body`, fuori da tutte e due.

   Tenendola lì dentro, la landing Partner apriva il filmato senza uno straccio
   di stile: `position: static`, nessun z-index, il riquadro largo quanto la
   pagina piazzato **sotto il footer**, seimila pixel più in basso di dove stava
   chi aveva cliccato. Per chi guardava, il clic sul play non faceva niente.

   Sta qui perché è di chi carica `video.js`: chiunque dichiari `aef-video`
   fra gli script dichiara `aef-video` anche fra i fogli.
   ========================================================================= */

/* =========================================================================
   LA FINESTRA DEL VIDEO

   Dal 2026-08-15 le interviste non partono più dentro la scheda ma qui sopra,
   su richiesta del cliente. La finestra sta attaccata al `body`, fuori dalla
   sezione: le sue regole devono quindi bastare a se stesse, senza contare su
   nessuna variabile o contenitore della sezione recensioni.
   ========================================================================= */
.aef-lightbox {
  position: fixed;
  inset: 0;
  z-index: 999999;   /* sopra la barra in alto, che sta a 9999 */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.aef-lightbox[hidden] { display: none; }

.aef-lightbox__sfondo {
  position: absolute;
  inset: 0;
  background: rgba(3, 15, 15, 0.88);
  backdrop-filter: blur(4px);
}

/* Mentre la finestra è aperta la pagina dietro non scorre: altrimenti il dito
   sul telefono muove la pagina invece del video. */
.aef-lightbox-aperta,
.aef-lightbox-aperta body { overflow: hidden; }

.aef-lightbox__box {
  position: relative;
  width: min(1100px, 100%);
  max-height: calc(100vh - 48px);
  aspect-ratio: 16 / 9;
  /* Niente `overflow: hidden` qui: sopra i 767px il tasto per chiudere sta
     **fuori** dal riquadro, quaranta pixel più in alto, e questo lo ritagliava.
     La finestra si apriva senza nessuna ✕ visibile: si usciva solo con Esc o
     col clic fuori, e chi non lo sa resta dentro.
     Gli angoli arrotondati li ritaglia il riquadro del filmato, che è l'unica
     cosa che ne aveva bisogno. */
  background: #000000;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.6);
}

.aef-lightbox__video {
  border-radius: 14px;
  overflow: hidden;
}

.aef-lightbox__video,
.aef-lightbox__video iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

.aef-lightbox__chiudi {
  position: absolute;
  top: -44px;
  right: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.12);
  color: #FFFFFF;
  cursor: pointer;
  transition: background-color .18s ease;
}

.aef-lightbox__chiudi:hover,
.aef-lightbox__chiudi:focus { background: rgba(255, 255, 255, 0.26); }

.aef-lightbox__chiudi:focus-visible {
  outline: 3px solid #00E27B;
  outline-offset: 3px;
}

/* Su telefono lo spazio sopra non c'è: il tasto va dentro, in alto a destra. */
@media (max-width: 767px) {
  .aef-lightbox { padding: 16px; }
  .aef-lightbox__chiudi {
    top: 8px;
    right: 8px;
    background: rgba(0, 0, 0, 0.55);
  }
}
