.testata-pagina { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.testata-pagina p { margin-bottom: 0; color: var(--attenuato); }
.griglia-kpi { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; margin-bottom: 20px; }
.scheda-kpi, .pannello, .scheda-modulo { border: 1px solid var(--bordo); border-radius: var(--raggio); background: var(--superficie); box-shadow: var(--ombra); }
.scheda-kpi { padding: 20px; }
.scheda-kpi span, .scheda-kpi strong, .scheda-kpi small { display: block; }
.scheda-kpi span { color: var(--attenuato); font-size: .8rem; }
.scheda-kpi strong { margin: 5px 0; color: var(--blu-950); font-size: 1.8rem; }
.pannello { padding: 22px; }
.pannello-titolo { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.pannello-titolo p { margin-bottom: 0; color: var(--attenuato); font-size: .86rem; }
.griglia-due-colonne { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.lista-metriche, .lista-elementi { display: grid; gap: 2px; }
.riga-metrica, .riga-elemento { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--bordo); }
.riga-metrica:last-child, .riga-elemento:last-child { border-bottom: 0; }
.riga-metrica strong { font-size: 1.05rem; }
.badge { display: inline-flex; align-items: center; padding: 5px 9px; border-radius: 999px; font-size: .72rem; font-weight: 800; white-space: nowrap; }
.badge-basso { color: var(--verde); background: var(--verde-sfondo); }
.badge-medio { color: var(--giallo); background: var(--giallo-sfondo); }
.badge-alto { color: var(--rosso); background: var(--rosso-sfondo); }
.badge-neutro { color: var(--attenuato); background: #eef2f6; }
.griglia-dettagli { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.campo-lettura { padding-bottom: 14px; border-bottom: 1px solid var(--bordo); }
.campo-lettura span, .campo-lettura strong { display: block; }
.campo-lettura span { margin-bottom: 5px; color: var(--attenuato); font-size: .75rem; }
.griglia-moduli { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
.scheda-modulo { padding: 20px; }
.scheda-modulo .numero-grande { display: block; margin: 14px 0 8px; font-size: 2rem; color: var(--blu-950); }
.scheda-modulo p { margin-bottom: 0; color: var(--attenuato); font-size: .85rem; }
.avviso { margin-bottom: 20px; padding: 14px 16px; border-radius: 10px; }
.avviso-info { color: #24539e; background: var(--blu-100); }
.avviso-errore { color: var(--rosso); background: var(--rosso-sfondo); }
.margine-alto { margin-top: 20px; }
.lista-passaggi { margin-bottom: 0; padding-left: 22px; }
.lista-passaggi li { padding: 5px 0; }
.testo-attenuato, .stato-vuoto { color: var(--attenuato); }
.tabella-contenitore { overflow: hidden; }
.campo-ricerca { width: min(420px, 100%); margin-bottom: 16px; padding: 10px 12px; border: 1px solid var(--bordo); border-radius: 9px; }
.tabella-dati { width: 100%; border-collapse: collapse; }
.tabella-dati th, .tabella-dati td { padding: 12px 10px; border-bottom: 1px solid var(--bordo); text-align: left; vertical-align: top; }
.tabella-dati th { color: var(--attenuato); font-size: .72rem; text-transform: uppercase; }
.tabella-dati td { font-size: .84rem; }
@media (max-width: 1200px) { .griglia-kpi { grid-template-columns: repeat(2,1fr); } .griglia-moduli { grid-template-columns: repeat(2,1fr); } .griglia-dettagli { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 760px) { .griglia-kpi, .griglia-due-colonne, .griglia-moduli, .griglia-dettagli { grid-template-columns: 1fr; } .tabella-contenitore { overflow-x: auto; } .tabella-dati { min-width: 900px; } }

/* =========================================================
   FILTRI TABELLE
   ========================================================= */

.barra-filtri-trattamenti {
    display: grid;
    grid-template-columns:
        minmax(240px, 2fr)
        repeat(4, minmax(140px, 1fr))
        minmax(100px, .7fr);
    gap: 14px;
    align-items: end;
}

.campo-filtro {
    min-width: 0;
}

.campo-filtro label {
    display: block;
    margin-bottom: 6px;
    color: var(--attenuato);
    font-size: .75rem;
    font-weight: 700;
}

.campo-filtro input,
.campo-filtro select {
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;

    border: 1px solid var(--bordo);
    border-radius: 9px;

    background: var(--superficie);
    color: var(--testo);

    outline: none;
}

.campo-filtro input:focus,
.campo-filtro select:focus {
    border-color: var(--blu-600);
    box-shadow: 0 0 0 3px rgba(47, 111, 228, .12);
}

.campo-filtro-compatto {
    max-width: 130px;
}

.azioni-filtri {
    display: flex;
    grid-column: 1 / -1;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 2px;
}

.pulsante {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;

    padding: 9px 14px;

    border: 1px solid transparent;
    border-radius: 9px;

    font-size: .82rem;
    font-weight: 700;
    line-height: 1;

    cursor: pointer;
    text-decoration: none;
}

.pulsante:hover {
    text-decoration: none;
}

.pulsante-primario {
    border-color: var(--blu-600);
    background: var(--blu-600);
    color: #ffffff;
}

.pulsante-primario:hover {
    background: var(--blu-700);
    color: #ffffff;
}

.pulsante-secondario {
    border-color: var(--bordo);
    background: var(--superficie);
    color: var(--testo);
}

.pulsante-secondario:hover {
    border-color: #cbd3df;
    background: #f8fafc;
    color: var(--testo);
}


/* =========================================================
   RIEPILOGO TABELLA
   ========================================================= */

.riepilogo-tabella {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    margin-bottom: 14px;
}

.riepilogo-tabella strong,
.riepilogo-tabella span {
    display: block;
}

.riepilogo-tabella strong {
    color: var(--blu-950);
    font-size: .9rem;
}

.riepilogo-tabella span {
    margin-top: 3px;
    color: var(--attenuato);
    font-size: .75rem;
}


/* =========================================================
   PAGINAZIONE
   ========================================================= */

.paginazione {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;

    padding-top: 18px;
}

.paginazione-riepilogo {
    color: var(--attenuato);
    font-size: .78rem;
}

.paginazione-azioni {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.pulsante-paginazione {
    display: inline-flex;
    min-width: 36px;
    min-height: 36px;
    align-items: center;
    justify-content: center;

    padding: 7px 10px;

    border: 1px solid var(--bordo);
    border-radius: 8px;

    background: var(--superficie);
    color: var(--testo);

    font-size: .76rem;
    font-weight: 700;
    text-decoration: none;
}

.pulsante-paginazione:hover {
    border-color: var(--blu-600);
    color: var(--blu-600);
    text-decoration: none;
}

.pulsante-paginazione.attivo {
    border-color: var(--blu-600);
    background: var(--blu-600);
    color: #ffffff;
}

.pulsante-paginazione.disabilitato {
    cursor: not-allowed;
    opacity: .45;
}


/* =========================================================
   RESPONSIVE FILTRI
   ========================================================= */

@media (max-width: 1350px) {
    .barra-filtri-trattamenti {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .campo-filtro-ricerca {
        grid-column: span 2;
    }

    .campo-filtro-compatto {
        max-width: none;
    }
}

@media (max-width: 900px) {
    .barra-filtri-trattamenti {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .campo-filtro-ricerca {
        grid-column: 1 / -1;
    }

    .paginazione {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 620px) {
    .barra-filtri-trattamenti {
        grid-template-columns: 1fr;
    }

    .campo-filtro-ricerca {
        grid-column: auto;
    }

    .azioni-filtri {
        flex-direction: column;
    }

    .azioni-filtri .pulsante {
        width: 100%;
    }
}

/* =========================================================
   DETTAGLIO TRATTAMENTO
   ========================================================= */

.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;

    margin-bottom: 18px;

    color: var(--attenuato);
    font-size: .76rem;
}

.breadcrumb a {
    color: var(--blu-600);
    text-decoration: none;
}

.breadcrumb a:hover {
    text-decoration: underline;
}

.testata-pagina-con-azioni {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}

.testata-pagina-azioni {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    gap: 10px;
}

.griglia-riepilogo-trattamento {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;

    margin-top: 22px;
}

.scheda-riepilogo {
    min-width: 0;
    padding: 18px;

    border: 1px solid var(--bordo);
    border-radius: 12px;

    background: var(--superficie);
}

.scheda-riepilogo-etichetta {
    display: block;

    margin-bottom: 8px;

    color: var(--attenuato);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.scheda-riepilogo strong {
    color: var(--blu-950);
    font-size: 1rem;
}

.griglia-dettaglio-trattamento {
    display: grid;
    grid-template-columns:
        minmax(0, 2fr)
        minmax(280px, 1fr);
    gap: 18px;
    align-items: start;
}

.intestazione-pannello {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;

    margin-bottom: 18px;
}

.intestazione-pannello h2 {
    margin: 0;
    font-size: 1.05rem;
}

.elenco-dettaglio {
    display: grid;
    gap: 0;

    margin: 0;
}

.elenco-dettaglio > div {
    padding: 15px 0;
    border-top: 1px solid var(--bordo);
}

.elenco-dettaglio > div:first-child {
    padding-top: 0;
    border-top: 0;
}

.elenco-dettaglio dt {
    margin-bottom: 6px;

    color: var(--attenuato);
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.elenco-dettaglio dd {
    margin: 0;

    color: var(--testo);
    font-size: .88rem;
    line-height: 1.55;
}

.elenco-dettaglio-orizzontale {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.elenco-dettaglio-orizzontale > div {
    padding: 0;
    border-top: 0;
}

.link-trattamento {
    display: inline-block;

    color: var(--blu-950);
    font-weight: 700;
    text-decoration: none;
}

.link-trattamento:hover {
    color: var(--blu-600);
    text-decoration: underline;
}

.colonna-azioni {
    width: 90px;
    text-align: right;
}

.pulsante-azione-tabella {
    display: inline-flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;

    padding: 6px 10px;

    border: 1px solid var(--bordo);
    border-radius: 7px;

    background: var(--superficie);
    color: var(--blu-600);

    font-size: .72rem;
    font-weight: 700;
    text-decoration: none;
}

.pulsante-azione-tabella:hover {
    border-color: var(--blu-600);
    background: #f7faff;
    text-decoration: none;
}

@media (max-width: 1100px) {
    .griglia-riepilogo-trattamento {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .griglia-dettaglio-trattamento {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .testata-pagina-con-azioni {
        flex-direction: column;
    }

    .griglia-riepilogo-trattamento {
        grid-template-columns: 1fr;
    }

    .elenco-dettaglio-orizzontale {
        grid-template-columns: 1fr;
    }
}


.griglia-ambito-trattamento {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.blocco-informativo {
    min-width: 0;
    padding: 18px;

    border: 1px solid var(--bordo);
    border-radius: 11px;

    background: #f8fafc;
}

.blocco-informativo h3 {
    margin: 0 0 12px;

    color: var(--blu-950);
    font-size: .9rem;
}

.testo-informativo {
    color: var(--testo);
    font-size: .84rem;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

@media (max-width: 1000px) {
    .griglia-ambito-trattamento {
        grid-template-columns: 1fr;
    }
}

.elenco-elementi-collegati {
    display: grid;
    gap: 10px;
}

.elemento-collegato {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;

    padding: 12px;

    border: 1px solid var(--bordo);
    border-radius: 9px;

    background: var(--superficie);
}

.elemento-collegato strong {
    display: block;

    color: var(--blu-950);
    font-size: .82rem;
}

.elemento-collegato p {
    margin: 5px 0 0;

    color: var(--attenuato);
    font-size: .75rem;
    line-height: 1.45;
}

.elemento-collegato-badge {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.griglia-banche-trattamento {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.scheda-banca-trattamento {
    min-width: 0;
    padding: 18px;

    border: 1px solid var(--bordo);
    border-radius: 11px;

    background: #f8fafc;
}

.scheda-banca-testata {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.scheda-banca-testata h3 {
    margin: 0;

    color: var(--blu-950);
    font-size: .92rem;
}

.scheda-banca-testata > div > span {
    display: block;

    margin-top: 4px;

    color: var(--attenuato);
    font-size: .72rem;
}

.scheda-banca-trattamento > p {
    margin: 14px 0 0;

    color: var(--testo);
    font-size: .82rem;
    line-height: 1.55;
}

.dettaglio-banca-trattamento {
    margin: 14px 0 0;
}

.dettaglio-banca-trattamento dt {
    color: var(--attenuato);
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
}

.dettaglio-banca-trattamento dd {
    margin: 4px 0 0;

    color: var(--testo);
    font-size: .8rem;
}

.nota-collegamento {
    margin-top: 14px;
    padding: 10px 12px;

    border-radius: 8px;

    background: #eef4ff;
    color: var(--blu-900);

    font-size: .76rem;
    line-height: 1.5;
}

.stato-vuoto-compatto {
    padding: 24px;
}

@media (max-width: 1000px) {
    .griglia-banche-trattamento {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .elemento-collegato {
        flex-direction: column;
    }

    .elemento-collegato-badge {
        justify-content: flex-start;
    }

    .scheda-banca-testata {
        flex-direction: column;
    }
}

.badge-banca-dati {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 14px;
}

.nota-elemento-collegato {
    margin-top: 8px !important;
    padding-top: 8px;

    border-top: 1px dashed var(--bordo);

    color: var(--blu-700) !important;
    font-style: italic;
}

.nota-collegamento strong {
    display: block;
    margin-bottom: 5px;

    font-size: .7rem;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.messaggio-form {
    margin-bottom: 20px;
    padding: 14px 16px;

    border: 1px solid transparent;
    border-radius: 10px;

    font-size: .92rem;
    line-height: 1.5;
}

.messaggio-form-successo {
    border-color: #a7d8b8;
    background: #edf9f1;
    color: #1f6b3c;
}

.messaggio-form-errore {
    border-color: #efb4b4;
    background: #fff1f1;
    color: #9f2929;
}

.griglia-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.campo-form {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.campo-form-esteso {
    grid-column: 1 / -1;
}

.campo-form label {
    font-size: .84rem;
    font-weight: 700;
}

.campo-form input,
.campo-form select,
.campo-form textarea {
    width: 100%;
    padding: 11px 12px;

    border: 1px solid var(--bordo);
    border-radius: 8px;

    background: #fff;
    color: inherit;
    font: inherit;
}

.campo-form textarea {
    resize: vertical;
}

.griglia-opzioni-trattamento {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.opzione-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    padding: 16px;

    border: 1px solid var(--bordo);
    border-radius: 10px;

    cursor: pointer;
}

.opzione-checkbox input {
    margin-top: 4px;
}

.opzione-checkbox span {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.opzione-checkbox small {
    color: var(--testo-secondario);
    line-height: 1.45;
}

.azioni-form {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

@media (max-width: 760px) {
    .griglia-form,
    .griglia-opzioni-trattamento {
        grid-template-columns: 1fr;
    }

    .azioni-form {
        flex-direction: column-reverse;
    }

    .azioni-form .pulsante {
        width: 100%;
        justify-content: center;
    }
}

.elenco-banche-selezionabili {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.scheda-banca-selezionabile {
    padding: 16px;

    border: 1px solid var(--bordo);
    border-radius: 12px;

    background: #fff;
}

.scheda-banca-selezionabile-testata {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.selezione-banca-principale {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    flex: 1;
    cursor: pointer;
}

.selezione-banca-principale input {
    margin-top: 4px;
}

.selezione-banca-principale span {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.selezione-banca-principale small {
    color: var(--testo-secondario);
    line-height: 1.45;
}

.campi-banca-collegata {
    display: grid;
    grid-template-columns: minmax(180px, .7fr) minmax(0, 1.3fr);
    gap: 16px;

    margin-top: 16px;
    padding-top: 16px;

    border-top: 1px solid var(--bordo);
}

[x-cloak] {
    display: none !important;
}

@media (max-width: 760px) {
    .scheda-banca-selezionabile-testata {
        flex-direction: column;
    }

    .campi-banca-collegata {
        grid-template-columns: 1fr;
    }
}

.elenco-misure-selezionabili {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.scheda-misura-selezionabile {
    padding: 16px;

    border: 1px solid var(--bordo);
    border-radius: 12px;

    background: #fff;
}

.scheda-misura-selezionabile-testata {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.selezione-misura-principale {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    flex: 1;
    cursor: pointer;
}

.selezione-misura-principale input {
    margin-top: 4px;
}

.selezione-misura-principale span {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.selezione-misura-principale small {
    color: var(--testo-secondario);
    line-height: 1.45;
}

.campi-misura-collegata {
    display: grid;
    grid-template-columns: minmax(210px, .7fr) minmax(0, 1.3fr);
    gap: 16px;

    margin-top: 16px;
    padding-top: 16px;

    border-top: 1px solid var(--bordo);
}

@media (max-width: 760px) {
    .scheda-misura-selezionabile-testata {
        flex-direction: column;
    }

    .campi-misura-collegata {
        grid-template-columns: 1fr;
    }
}

.griglia-rischio {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(300px, .6fr);
    gap: 22px;
}

.griglia-valori-rischio {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.gruppo-scelta-rischio {
    display: flex;
    flex-direction: column;
    gap: 10px;

    margin: 0;
    padding: 0;

    border: 0;
}

.gruppo-scelta-rischio legend {
    margin-bottom: 10px;

    font-size: .9rem;
    font-weight: 700;
}

.scelta-rischio {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    padding: 14px;

    border: 1px solid var(--bordo);
    border-radius: 10px;

    background: #fff;
    cursor: pointer;
}

.scelta-rischio:hover {
    border-color: var(--blu-300);
    background: var(--blu-50);
}

.scelta-rischio input {
    margin-top: 4px;
}

.scelta-rischio span {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.scelta-rischio small {
    color: var(--testo-secondario);
    line-height: 1.4;
}

.riepilogo-calcolo-rischio {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.riepilogo-calcolo-rischio > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    padding: 16px;

    border: 1px solid var(--bordo);
    border-radius: 10px;

    background: var(--sfondo-secondario);
}

.riepilogo-calcolo-rischio strong {
    font-size: 1.45rem;
}

.elenco-criticita-rischio {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.criticita-rischio {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;

    padding: 12px 0;

    border-bottom: 1px solid var(--bordo);
}

.criticita-rischio:last-child {
    border-bottom: 0;
}

.criticita-rischio span {
    color: var(--testo-secondario);
}

.criticita-rischio strong {
    font-size: 1.05rem;
}

@media (max-width: 980px) {
    .griglia-rischio {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .griglia-valori-rischio,
    .riepilogo-calcolo-rischio {
        grid-template-columns: 1fr;
    }
}

.azioni-segnalazione-conformita {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.form-stato-conformita {
    display: flex;
    align-items: center;
    gap: 8px;
}

.form-stato-conformita select {
    min-width: 155px;
}

@media (max-width: 760px) {
    .azioni-segnalazione-conformita,
    .form-stato-conformita {
        width: 100%;
    }

    .form-stato-conformita {
        align-items: stretch;
        flex-direction: column;
    }

    .form-stato-conformita select,
    .form-stato-conformita .pulsante {
        width: 100%;
    }
}

.griglia-riepilogo-documenti {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.griglia-riepilogo-documenti article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;

    padding: 15px;

    border: 1px solid var(--bordo);
    border-radius: 10px;

    background: var(--sfondo-secondario);
}

.griglia-riepilogo-documenti span {
    color: var(--testo-secondario);
}

.griglia-riepilogo-documenti strong {
    font-size: 1.25rem;
}

.griglia-modelli-documento {
    display: grid;
    grid-template-columns: repeat(
        auto-fill,
        minmax(280px, 1fr)
    );
    gap: 16px;
}

.scheda-modello-documento {
    display: flex;
    flex-direction: column;
    gap: 10px;

    padding: 18px;

    border: 1px solid var(--bordo);
    border-radius: 12px;

    background: #fff;
}

.scheda-modello-documento h3,
.scheda-modello-documento p {
    margin: 0;
}

.scheda-modello-documento p,
.scheda-modello-documento small {
    color: var(--testo-secondario);
    line-height: 1.45;
}

.azioni-scheda {
    margin-top: auto;
}

@media (max-width: 760px) {
    .griglia-riepilogo-documenti {
        grid-template-columns: 1fr;
    }
}

.azioni-documento {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

@media (max-width: 760px) {
    .azioni-documento {
        width: 100%;
        justify-content: stretch;
    }

    .azioni-documento .pulsante {
        flex: 1;
        text-align: center;
    }
}

.contenuto-documento {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.azioni-formati-documento {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
}

.gruppo-formato-documento {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.etichetta-formato-documento {
    min-width: 46px;

    color: var(--testo-secondario);
    font-size: 0.75rem;
    font-weight: 700;
    text-align: right;
}

@media (max-width: 760px) {
    .azioni-formati-documento {
        width: 100%;
        align-items: stretch;
    }

    .gruppo-formato-documento {
        display: grid;
        grid-template-columns: 46px 1fr 1fr;
        width: 100%;
    }

    .etichetta-formato-documento {
        align-self: center;
        text-align: left;
    }

    .gruppo-formato-documento .pulsante {
        width: 100%;
        text-align: center;
    }
}

.form-stato-documento {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;

    margin-bottom: 4px;
}

.form-stato-documento select {
    min-width: 145px;
}

@media (max-width: 760px) {
    .form-stato-documento {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 100%;
    }

    .form-stato-documento select,
    .form-stato-documento .pulsante {
        width: 100%;
    }
}


/* =========================================================
   CONFORMITÀ
   ========================================================= */

.lista-segnalazioni-conformita {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.scheda-segnalazione-conformita {
    padding: 18px;

    border: 1px solid var(--bordo, #dfe5ec);
    border-radius: 12px;

    background: #ffffff;
}

.testata-segnalazione-conformita {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;

    margin-bottom: 10px;
}

.scheda-segnalazione-conformita h3 {
    margin: 0 0 8px;
}

.scheda-segnalazione-conformita p {
    margin: 0;
}

.suggerimento-conformita {
    display: flex;
    flex-direction: column;
    gap: 4px;

    margin-top: 14px;
    padding: 12px 14px;

    border-left: 4px solid #2f6ecb;
    border-radius: 7px;

    background: #f3f7fd;
}

.azioni-segnalazione-conformita {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;

    margin-top: 16px;
}

.form-stato-conformita {
    display: flex;
    align-items: center;
    gap: 8px;
}

.form-stato-conformita select {
    min-width: 155px;
}

.badge-gravita {
    display: inline-block;
    padding: 4px 10px;

    border-radius: 999px;

    font-size: 0.75rem;
    font-weight: 700;
}

.badge-bloccante {
    background: #fde8e7;
    color: #a51d17;
}

.badge-alta {
    background: #fdf0e3;
    color: #b94d00;
}

.badge-media {
    background: #fff7d6;
    color: #8a6500;
}

.badge-bassa {
    background: #e9f7ef;
    color: #176b3a;
}

.badge-info {
    background: #e9f2fd;
    color: #245f9e;
}

@media (max-width: 760px) {
    .testata-segnalazione-conformita {
        flex-direction: column;
    }

    .azioni-segnalazione-conformita,
    .form-stato-conformita {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .form-stato-conformita select,
    .form-stato-conformita .pulsante,
    .azioni-segnalazione-conformita > .pulsante {
        width: 100%;
    }
}

    
/* =========================================================
   CATALOGO TRATTAMENTI
   ========================================================= */

.griglia-catalogo-trattamenti {
    display: grid;
    grid-template-columns:
        repeat(auto-fit, minmax(310px, 1fr));
    gap: 16px;
}

.scheda-catalogo-trattamento {
    display: flex;
    flex-direction: column;
    gap: 14px;

    padding: 18px;

    border: 1px solid var(--bordo, #dfe5ec);
    border-radius: 12px;

    background: #fff;
}

.scheda-catalogo-disabilitata {
    opacity: 0.72;
    background: #f8fafc;
}

.testata-scheda-catalogo {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.testata-scheda-catalogo h3 {
    margin: 0 0 8px;
}

.selettore-catalogo {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    white-space: nowrap;
    cursor: pointer;
}

.dettagli-catalogo {
    display: grid;
    gap: 10px;

    margin: 0;
}

.dettagli-catalogo div {
    padding-top: 10px;
    border-top: 1px solid var(--bordo, #e5e7eb);
}

.dettagli-catalogo dt {
    margin-bottom: 4px;
    font-size: 0.8rem;
    font-weight: 700;
}

.dettagli-catalogo dd {
    margin: 0;
    font-size: 0.9rem;
}

.barra-azione-catalogo {
    position: sticky;
    bottom: 16px;
    z-index: 10;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    margin-top: 24px;
    padding: 15px 18px;

    border: 1px solid var(--bordo, #dfe5ec);
    border-radius: 12px;

    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 8px 26px rgba(15, 23, 42, 0.12);
}

.badge-avviso {
    background: #fff7d6;
    color: #8a6500;
}

.badge-successo {
    background: #e9f7ef;
    color: #176b3a;
}

@media (max-width: 700px) {
    .testata-scheda-catalogo,
    .barra-azione-catalogo {
        align-items: stretch;
        flex-direction: column;
    }

    .barra-azione-catalogo .pulsante {
        width: 100%;
    }
}