/* pj-base: l'aspetto comune di area riservata e gestione.
   Solo variabili del progetto, niente colori scritti qui e niente opacity.
   Il progetto deve definire, in ogni tema: --fondo --superficie --campo --testo --testo-2
   --linea --bordo-campo --accento --pulsante --pulsante-testo --errore --ok --fuoco.
   Caratteri e spazi in rem: il testo cresce con il pannello «Aspetto». */

.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.trappola{position:absolute;left:-100vw;top:auto;width:1px;height:1px;overflow:hidden}
.contenitore.stretto{max-width:34rem}
.a-capo{overflow-wrap:anywhere;word-break:break-word}

/* barra di chi gestisce e messaggi */
.barra-gestione{background:var(--superficie);border-bottom:2px solid var(--accento);font-size:.9rem}
.barra-gestione p{display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:center;margin:0;padding:.45rem 0}
.ruolo,.etichetta{display:inline-block;border:1px solid var(--accento);color:var(--testo);border-radius:.25rem;
  padding:0 .4rem;font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.messaggi{margin-top:1rem}
.messaggio{border:1px solid var(--linea);border-left:.4rem solid var(--ok);background:var(--superficie);padding:.6rem .9rem;border-radius:.3rem}
.messaggio-error{border-left-color:var(--errore)}

/* moduli */
.modulo{max-width:34rem}
.modulo.largo{max-width:none}
.campo{margin:0 0 1.1rem}
.campo a{overflow-wrap:anywhere;word-break:break-all}
.campo label{display:block;font-weight:600;margin-bottom:.3rem}
.campo .obbligatorio{font-weight:400;color:var(--testo-2)}
.campo .aiuto{margin:.1rem 0 .4rem;color:var(--testo-2);font-size:.92rem}
.campo input:not([type=checkbox]):not([type=radio]),.campo select,.campo textarea,
.cerca input,.tabella input:not([type=checkbox]),.tabella select{
  width:100%;max-width:100%;box-sizing:border-box;font:inherit;color:var(--testo);background:var(--campo);
  border:2px solid var(--bordo-campo);border-radius:.3rem;padding:.5rem .6rem}
.campo textarea{min-height:6rem}
.campo.spunta{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.campo.spunta label{display:inline;margin:0}
.campo.spunta .aiuto{flex-basis:100%}
.campo input[type=checkbox],.tabella input[type=checkbox]{width:1.3rem;height:1.3rem;accent-color:var(--accento)}
.con-errore input,.con-errore select,.con-errore textarea{border-color:var(--errore)}
.errore{color:var(--errore);font-weight:600;margin:.2rem 0 .4rem}
.riepilogo-errori{border:2px solid var(--errore);border-left-width:.5rem;background:var(--superficie);padding:.4rem 1rem;margin:0 0 1.2rem;border-radius:.3rem}
.avviso{border:2px solid var(--accento);padding:.5rem .9rem;border-radius:.3rem}
:focus-visible{outline:3px solid var(--fuoco);outline-offset:2px}

/* pulsanti */
.pulsante{display:inline-block;font:inherit;font-weight:600;cursor:pointer;text-decoration:none;
  color:var(--testo);background:var(--superficie);border:2px solid var(--bordo-campo);border-radius:.35rem;padding:.5rem 1rem;line-height:1.3}
.pulsante:hover{border-color:var(--accento)}
.pulsante.primario{color:var(--pulsante-testo);background:var(--pulsante);border-color:var(--pulsante)}
.pulsante.primario:hover{text-decoration:underline}
.pulsante.piccolo{font-size:.88rem;padding:.25rem .6rem}
.pulsante[aria-busy=true]{cursor:progress}

/* gestione */
.gestione{padding-bottom:2rem}
.gestione-avviso{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;border:1px solid var(--accento);border-radius:.45rem;
  padding:.7rem 1rem;margin:1rem 0 1.1rem;color:var(--testo-2);font-size:.92rem}
.gestione-menu ul,.schede{display:flex;flex-wrap:wrap;gap:.3rem;list-style:none;margin:0 0 1.5rem;padding:0 0 .8rem;border-bottom:1px solid var(--linea)}
.gestione-menu a,.schede a{display:inline-block;padding:.35rem .75rem;border:1px solid var(--linea);border-radius:.35rem;
  color:var(--testo);text-decoration:none;font-size:.92rem}
.gestione-menu a:hover,.schede a:hover{border-color:var(--accento);text-decoration:underline}
.gestione-menu a[aria-current=page],.schede a[aria-current=page]{border:2px solid var(--accento);font-weight:700;background:var(--superficie)}
.gestione-menu .a-destra{margin-left:auto}
.sotto{color:var(--testo-2);margin-top:-.3rem}
.nota{color:var(--testo-2);font-size:.92rem}
.numeri{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr));gap:.8rem;list-style:none;padding:0}
.numeri li{border:1px solid var(--linea);border-radius:.45rem;padding:.8rem 1rem;background:var(--superficie)}
.numeri .n{display:block;font-size:1.8rem;font-weight:700;color:var(--testo)}
.elenco{padding-left:1.2rem}
.elenco li{margin:.35rem 0;overflow-wrap:anywhere}
.in-riga{display:inline-flex;flex-wrap:wrap;gap:.3rem;margin:0 0 0 .5rem;vertical-align:middle}
.cerca{display:flex;flex-wrap:wrap;gap:.5rem;align-items:flex-end;margin:0 0 1rem}
.cerca label{flex-basis:100%;font-weight:600}
.cerca input{flex:1 1 12rem;width:auto}
.voci{display:grid;gap:.1rem;margin:0 0 1.5rem}
.voci div{display:grid;grid-template-columns:minmax(0,12rem) minmax(0,1fr);gap:1rem;padding:.45rem 0;border-bottom:1px solid var(--linea)}
.voci dt{font-weight:700}
.voci dd{margin:0;overflow-wrap:anywhere}
@media (max-width:40em){.voci div{grid-template-columns:minmax(0,1fr);gap:.1rem}}
.etichetta-sezione{font-weight:700;margin:.6rem 0 0}

/* tabelle: scorrono nel loro riquadro invece di allargare la pagina */
.tabella{position:relative;overflow-x:auto;margin:0 0 1.5rem;border:1px solid var(--linea);border-radius:.35rem}
.tabella table{border-collapse:collapse;width:100%;min-width:32rem}
.tabella th,.tabella td{text-align:left;vertical-align:top;padding:.5rem .7rem;border-bottom:1px solid var(--linea)}
.tabella thead th{background:var(--superficie)}
.tabella .azioni{display:flex;flex-wrap:wrap;gap:.3rem}
.tabella .azioni form{margin:0}
.tabella form{margin:.3rem 0 0}

/* documenti e pagine */
.pagina{padding-bottom:2rem}
.attacco{font-size:1.15rem;color:var(--testo-2)}
.aggiornata{color:var(--testo-2);font-size:.9rem;margin-top:2rem}
.documento{max-width:48rem;overflow-wrap:break-word}
.documento pre{overflow-x:auto;background:var(--superficie);border:1px solid var(--linea);padding:.7rem;border-radius:.3rem}
.documento code{overflow-wrap:anywhere}
.documento blockquote{border-left:.3rem solid var(--accento);margin:1rem 0;padding:.1rem 1rem;background:var(--superficie)}
.indice-documento{border:1px solid var(--linea);border-radius:.35rem;padding:.4rem 1rem;margin:0 0 1.5rem;background:var(--superficie);max-width:48rem}
.indice-documento ul{padding-left:1.1rem}
.indice-documento a{overflow-wrap:anywhere}
.indice-titolo{font-weight:700;margin:.4rem 0}