/* Finestra di lettura delle informative.
   Il documento resta una pagina a se' e viene mostrato in un iframe: cosi' conserva la
   propria formattazione sia sopra le pagine del percorso di iscrizione sia sopra quelle
   del sito, che hanno fogli di stile diversi fra loro.
   Gli stili stanno in un file perche' le pagine del percorso dichiarano style-src 'self':
   uno stile inline verrebbe bloccato. */

dialog.finestraInformativa {
  width: min(60rem, 94vw);
  height: min(85vh, 60rem);
  max-width: none;
  max-height: none;
  padding: 0;
  border: 0;
  border-radius: .5rem;
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, .35);
  overflow: hidden;
  background: #fff;
  color: #1a1a1a;
}
dialog.finestraInformativa::backdrop { background: rgba(0, 0, 0, .55); }

.finestraInformativa__inquadratura { display: flex; flex-direction: column; height: 100%; }

.finestraInformativa__barra {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .6rem .85rem;
  border-bottom: 1px solid #d8d8d8;
  background: #f4f5f7;
  font: inherit;
  font-size: .95rem;
}
.finestraInformativa__titolo {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}
.finestraInformativa__apri { flex: 0 0 auto; color: #1d4ed8; }
.finestraInformativa__chiudi {
  flex: 0 0 auto;
  cursor: pointer;
  border: 1px solid #b9bcc2;
  border-radius: .25rem;
  background: #fff;
  padding: .3rem .7rem;
  font: inherit;
  color: inherit;
}
.finestraInformativa__chiudi:hover { background: #ebedf0; }
.finestraInformativa__apri:focus-visible,
.finestraInformativa__chiudi:focus-visible { outline: 2px solid #1d4ed8; outline-offset: 2px; }

.finestraInformativa__documento { flex: 1 1 auto; width: 100%; border: 0; display: block; }

/* Su schermo stretto la finestra prende tutto lo spazio: un documento lungo con tabelle
   dentro un riquadro piccolo non si legge. */
@media (max-width: 40rem) {
  dialog.finestraInformativa { width: 100vw; height: 100vh; border-radius: 0; }
  .finestraInformativa__apri { display: none; }
}
