/* Pannelli: font di Bootstrap Italia serviti in locale (niente CDN né caricamento via JavaScript) e pochi ritocchi. */
@font-face { font-family: "Titillium Web"; font-style: normal; font-weight: 300; font-display: swap;
  src: url("bootstrap-italia/fonts/Titillium_Web/titillium-web-v10-latin-ext_latin-300.woff2") format("woff2"); }
@font-face { font-family: "Titillium Web"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("bootstrap-italia/fonts/Titillium_Web/titillium-web-v10-latin-ext_latin-regular.woff2") format("woff2"); }
@font-face { font-family: "Titillium Web"; font-style: italic; font-weight: 400; font-display: swap;
  src: url("bootstrap-italia/fonts/Titillium_Web/titillium-web-v10-latin-ext_latin-italic.woff2") format("woff2"); }
@font-face { font-family: "Titillium Web"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("bootstrap-italia/fonts/Titillium_Web/titillium-web-v10-latin-ext_latin-600.woff2") format("woff2"); }
@font-face { font-family: "Titillium Web"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("bootstrap-italia/fonts/Titillium_Web/titillium-web-v10-latin-ext_latin-700.woff2") format("woff2"); }
@font-face { font-family: "Roboto Mono"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("bootstrap-italia/fonts/Roboto_Mono/roboto-mono-v13-latin-ext_latin-regular.woff2") format("woff2"); }
@font-face { font-family: "Roboto Mono"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("bootstrap-italia/fonts/Roboto_Mono/roboto-mono-v13-latin-ext_latin-700.woff2") format("woff2"); }
@font-face { font-family: "Lora"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("bootstrap-italia/fonts/Lora/lora-v20-latin-ext_latin-regular.woff2") format("woff2"); }
@font-face { font-family: "Lora"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("bootstrap-italia/fonts/Lora/lora-v20-latin-ext_latin-700.woff2") format("woff2"); }

.pannello-json { white-space: pre-wrap; word-break: break-word; max-height: 20rem; overflow: auto; font-size: .8rem; margin: 0; }
.pannello-chiave { font-family: "Roboto Mono", monospace; font-size: .9rem; }
.pannello-scheda dd { word-break: break-word; }
.pannello-matrice td, .pannello-matrice th { white-space: nowrap; }
.pannello-icona-menu { font-size: 1.5rem; line-height: 1; }
/* Riquadri con bordo leggero e campi con etichetta sopra (non flottante) e bordo completo. */
.pannello-card { border: 1px solid #d9dadb; border-radius: 8px; box-shadow: 0 1px 3px rgba(0, 0, 0, .06); overflow: hidden; }
.pannello-card .table thead th { background: #f2f4f6; color: #17324d; font-size: .875rem; border-bottom: 1px solid #d9dadb; }
.pannello-operatori th, .pannello-operatori td { padding: .75rem 1rem; }
.pannello-card .table-responsive { margin-bottom: 0; padding-bottom: 0; }
.pannello-card .table-responsive > .table { margin-bottom: 0; }
.pannello-modulo .form-label { display: block; margin-bottom: .375rem; font-size: .9375rem; color: #17324d; }
.pannello-modulo input.form-control.pannello-input,
.pannello-modulo select.form-select,
.pannello-operatori select.form-select { border: 1px solid #8a98a6; border-radius: 4px; height: 2.5rem; padding: .375rem 2rem .375rem .75rem; font-size: 1rem; background-color: #fff; box-shadow: none; }
.pannello-modulo input.form-control.pannello-input { padding-right: .75rem; }
.pannello-operatori select.form-select { height: 2.25rem; min-width: 9rem; font-size: .9375rem; }
.pannello-modulo input.form-control.pannello-input:focus,
.pannello-modulo select.form-select:focus,
.pannello-operatori select.form-select:focus { border-color: #06c; outline: 2px solid #f90; outline-offset: 2px; }
.pannello-etichetta { display: inline-block; padding: .1rem .5rem; border-radius: 1rem; font-size: .75rem; font-weight: 600; line-height: 1.4; vertical-align: middle; font-family: "Titillium Web", sans-serif; }
.pannello-etichetta-avviso { background: #fff3cd; color: #664d03; border: 1px solid #e6c55c; }

/* Struttura */
#contenuto:focus { outline: none; }
.pannello-ente { color: #fff; }
.pannello-utente { color: #fff; margin-right: 1rem; display: inline-flex; align-items: center; gap: .25rem; font-size: .875rem; }
.it-header-slim-right-zone { display: flex; align-items: center; }
.breadcrumb-container { margin-bottom: 1rem; }
.breadcrumb-container .breadcrumb { padding: 0; background: none; }
.pannello-sottotitolo { color: #455b71; }
.pannello-nessuno { color: #455b71; background: #f2f4f6; border: 1px dashed #b6bfc8; border-radius: 8px; padding: .75rem 1rem; }
.pannello-vuoto { color: #5b6f82; }
.pannello-id { font-family: "Roboto Mono", monospace; font-size: .8125rem; color: #17324d; background: none; padding: 0; word-break: break-all; }
main section > h2 { padding-bottom: .375rem; border-bottom: 2px solid #e6e9f2; }

/* Tabelle */
.pannello-card .table th, .pannello-card .table td { padding: .75rem 1rem; vertical-align: middle; }
.pannello-card .table tbody th { font-weight: 600; }
.pannello-card .table tbody tr:last-child th, .pannello-card .table tbody tr:last-child td { border-bottom: 0; }
.pannello-card .table form { margin: 0; }
.pannello-azioni-cella { text-align: right; white-space: nowrap; }

/* Moduli: etichetta sopra e bordo completo ovunque, senza etichette flottanti */
.pannello-form { display: block; padding: 1.5rem; }
.pannello-form:after, .pannello-card:after { display: none; }
.pannello-form > .btn, .pannello-form > .row + .row, .pannello-form > fieldset + .btn { margin-top: 1rem; }
.pannello-form > .form-check { margin-top: 1rem; }
.pannello-form > .form-check + .form-check { margin-top: .25rem; }
.pannello-form > .form-check + .btn { margin-top: 1rem; }
.pannello-campo { margin: 0; }
.pannello-campo .form-label { display: block; margin-bottom: .375rem; font-size: .9375rem; color: #17324d; position: static; transform: none; }
.pannello-campo .form-text { color: #455b71; font-size: .8125rem; margin-top: .25rem; }
.pannello-obbligatorio { color: #a61b2b; }
input.form-control.pannello-input, select.form-select.pannello-select { display: block; width: 100%; height: 2.5rem; border: 1px solid #8a98a6; border-radius: 4px; padding: .375rem .75rem; font-size: 1rem; font-weight: 400; color: #17324d; background-color: #fff; box-shadow: none; }
select.form-select.pannello-select { padding-right: 2rem; }
input.form-control.pannello-input[readonly] { background-color: #f2f4f6; }
input.form-control.pannello-input:focus, select.form-select.pannello-select:focus { border-color: #06c; outline: 2px solid #f90; outline-offset: 2px; box-shadow: none; }
input.form-control.pannello-input.is-invalid, select.form-select.pannello-select.is-invalid { border-color: #a61b2b; background-image: none; }
.pannello-campo .invalid-feedback { color: #a61b2b; font-size: .875rem; margin-top: .25rem; }
.pannello-celle-azione { display: flex; gap: .5rem; align-items: center; justify-content: flex-end; }
.pannello-celle-azione .pannello-input { width: 10rem; height: 2.25rem; font-size: .9375rem; }

/* Schede */
.pannello-scheda-corpo { padding: 1.5rem; }
.pannello-scheda-titolo { font-size: 1rem; font-weight: 700; color: #17324d; margin: 1.5rem 0 .75rem; padding-bottom: .25rem; border-bottom: 1px solid #d9dadb; }
.pannello-scheda-titolo:first-child { margin-top: 0; }
.pannello-scheda { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1rem 1.5rem; margin: 0; }
.pannello-dato-largo { grid-column: 1 / -1; }
.pannello-scheda dt { font-size: .8125rem; font-weight: 600; color: #455b71; margin-bottom: .125rem; }
.pannello-scheda dd { margin: 0; word-break: break-word; }
.pannello-annidato { display: grid; grid-template-columns: max-content 1fr; gap: .125rem .75rem; margin: 0; font-size: .9375rem; }
.pannello-annidato dt { font-weight: 600; color: #455b71; }
.pannello-annidato dd { margin: 0; overflow-wrap: anywhere; }
.table .pannello-annidato dd { overflow-wrap: normal; word-break: normal; }
.pannello-colonna-valori { min-width: 22rem; }
.pannello-differenze summary { cursor: pointer; color: #06c; font-weight: 600; font-size: .9375rem; }
.pannello-differenze .table { font-size: .875rem; background: transparent; }
.pannello-differenze .table th, .pannello-differenze .table td { padding: .3rem .5rem; vertical-align: top; }
.pannello-differenze .table tbody th { font-weight: 600; color: #455b71; white-space: nowrap; }
.pannello-differenze .table td { overflow-wrap: anywhere; }
.pannello-periodo { margin-top: .25rem; font-size: .8125rem; color: #5c6f82; white-space: nowrap; }
.pannello-elenco { list-style: none; padding: 0; margin: .25rem 0 0; }
.pannello-elenco > li + li { margin-top: .5rem; padding-top: .5rem; border-top: 1px solid #e6e9f2; }

/* Stati: testo sempre presente, contrasto almeno 4,5:1 */
.pannello-stato-verde { background: #e3f4e9; color: #0b5d2b; border: 1px solid #7cc09a; }
.pannello-stato-arancio { background: #fff3cd; color: #664d03; border: 1px solid #e6c55c; }
.pannello-stato-blu { background: #e6f0fa; color: #004080; border: 1px solid #8fb8e0; }
.pannello-stato-grigio { background: #eef0f2; color: #3f4b57; border: 1px solid #b6bfc8; }
.pannello-stato-rosso { background: #fbe9eb; color: #8f1322; border: 1px solid #e3a0a8; }
.pannello-stato-viola { background: #f1e9f8; color: #5a2a82; border: 1px solid #bb9bd6; }
.pannello-stato-neutro { background: #fff; color: #17324d; border: 1px solid #8a98a6; }

/* Cruscotto */
.pannello-contatore { height: 100%; }
.pannello-contatore .card-body { display: flex; flex-direction: column; gap: .25rem; padding: 1.25rem 1.5rem; height: 100%; }
.pannello-contatore-testa { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.pannello-contatore-titolo { font-size: 1rem; font-weight: 600; color: #17324d; margin: 0; }
.pannello-contatore-icona { display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: #e6f0fa; flex: none; }
.pannello-contatore-numero { font-size: 2.5rem; font-weight: 700; line-height: 1.1; color: #06c; }
.pannello-contatore-nota { color: #455b71; font-size: .875rem; margin: 0; }
.pannello-contatore-azione { margin-top: auto; padding-top: .75rem; font-weight: 600; }
.pannello-accesso { padding: 1.5rem 0; }

/* Diario: timeline ufficiale di Bootstrap Italia; testo sempre allineato a sinistra per leggere i dati */
.pannello-timeline .card { background: #fff; text-align: left; }
.pannello-timeline .col-12 .card-wrapper .card { border: 1px solid #d9dadb; }
.pannello-timeline .col-12:nth-child(n) .card-wrapper .card { text-align: left; }
.pannello-timeline .card-wrapper { padding-bottom: 0; }
.pannello-timeline .card.pannello-evento-verde { border-left: 4px solid #0b5d2b; }
.pannello-timeline .card.pannello-evento-arancio { border-left: 4px solid #b58900; }
.pannello-timeline .card.pannello-evento-blu { border-left: 4px solid #004080; }
.pannello-timeline .card.pannello-evento-grigio { border-left: 4px solid #3f4b57; }
.pannello-timeline .card.pannello-evento-rosso { border-left: 4px solid #8f1322; }
.pannello-timeline .card.pannello-evento-neutro { border-left: 4px solid #8a98a6; }
.pannello-timeline .card.pannello-evento-viola { border-left: 4px solid #5a2a82; }

/* Pallino colorato per tipo: accanto c'è sempre il nome, il colore non è l'unica informazione */
.pannello-pallino { display: inline-block; width: .75rem; height: .75rem; border-radius: 50%; margin-right: .5rem; background: #8a98a6; }
.pannello-pallino-verde { background: #0b5d2b; }
.pannello-pallino-rosso { background: #b3142a; }
.pannello-pallino-viola { background: #5a2a82; }
.pannello-pallino-arancio { background: #d97a00; }
.pannello-pallino-blu { background: #004080; }
.pannello-pallino-grigio { background: #3f4b57; }
.pannello-legenda { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; padding: 0; margin: 0 0 1.5rem; font-size: .875rem; color: #455b71; }
.pannello-riquadro { border-left: 4px solid #06c; }
.pannello-riquadro dt { font-weight: 600; }
.pannello-riquadro dd { margin-bottom: .5rem; }
.pannello-interruzioni td, .pannello-interruzioni th { color: #8f1322; }

/* Header stretto: ente e utente vanno a capo invece di allargare la pagina */
.it-header-slim-wrapper-content { flex-wrap: wrap; gap: .25rem .75rem; height: auto; min-height: 2.25rem; }
.pannello-ente { white-space: normal; }
@media (max-width: 575.98px) {
  .it-header-slim-right-zone { margin-left: auto; }
  .pannello-utente { margin-right: .5rem; }
}
.pannello-spunta-allineata { padding-top: 2.25rem; }

/* Documentazione pubblica (/docs) */
.docs-indice-sotto { padding-left: 1.5rem; font-size: .875rem; }
.docs-testo h2, .docs-testo h3 { margin-top: 2rem; scroll-margin-top: 1rem; }
.docs-testo pre { position: relative; background: #0f2236; color: #e8eef5; border: 0; border-radius: 8px; padding: 1.25rem 1.25rem 1.25rem; padding-top: 2.75rem; overflow-x: auto; font-family: "Roboto Mono", monospace; font-size: .875rem; line-height: 1.6; white-space: pre; tab-size: 2; margin: 1rem 0 1.5rem; }
.docs-testo pre code { color: inherit; background: none; padding: 0; font-size: inherit; white-space: inherit; }
.docs-testo pre::-webkit-scrollbar { height: 8px; }
.docs-testo pre::-webkit-scrollbar-thumb { background: #4a6378; border-radius: 4px; }
.docs-testo .docs-copia { position: absolute; top: .5rem; right: .5rem; background: #1d3a57; color: #e8eef5; border: 1px solid #4a6378; border-radius: 4px; font-size: .75rem; padding: .2rem .6rem; cursor: pointer; font-family: "Titillium Web", sans-serif; }
.docs-testo .docs-copia:hover, .docs-testo .docs-copia:focus { background: #06c; border-color: #06c; outline: 2px solid #f90; outline-offset: 2px; }
.docs-testo .docs-etichetta-codice { position: absolute; top: .65rem; left: 1.25rem; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: #8fa6bb; font-family: "Titillium Web", sans-serif; }
.docs-c-metodo { color: #7fd1ff; font-weight: 700; }
.docs-c-percorso { color: #ffffff; }
.docs-c-risposta { color: #9be39b; }
.docs-c-chiave { color: #ffcb6b; }
.docs-c-stringa { color: #c3e88d; }
.docs-c-commento { color: #8fa6bb; font-style: italic; }
.docs-testo table code { white-space: normal; }
@media (min-width: 992px) {
  .docs-indice { position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; }
}

/* Pagina d'ingresso (modulo Portale) */
.portale-striscia-sandbox { background: #8a5300; color: #fff; font-size: 1rem; padding: .6rem 0; text-align: center; position: sticky; top: 0; z-index: 1050; letter-spacing: .01em; }
.portale-striscia-sandbox .icon { fill: #9fc5ec; vertical-align: -3px; }
.portale-striscia-sandbox strong { display: inline-block; margin-right: .4rem; color: #fff; }
.portale-striscia-sviluppo { background: #5c6f82; color: #fff; font-size: .875rem; padding: .25rem 0; text-align: center; }
.portale-sandbox .it-brand-tagline::before { content: "SANDBOX"; display: inline-block; background: rgba(255, 255, 255, .15); border: 1px solid rgba(255, 255, 255, .6); border-radius: 999px; padding: 0 .5rem; margin-right: .5rem; font-size: .7rem; letter-spacing: .1em; font-weight: 700; }
.portale-eroe { background: linear-gradient(135deg, #003366 0%, #0066cc 100%); color: #fff; padding: 4rem 0 3.5rem; }
.portale-eroe-sandbox { background: radial-gradient(rgba(255, 255, 255, .08) 1px, transparent 1px) 0 0 / 18px 18px, linear-gradient(135deg, #0b2a4a 0%, #17324d 55%, #0066cc 100%); }
.portale-titolo { color: #fff; font-size: 2.5rem; font-weight: 700; line-height: 1.15; margin-bottom: 1rem; }
.portale-sottotitolo { color: #e6f0fa; font-size: 1.25rem; max-width: 46rem; margin-bottom: 2rem; }
.portale-azioni { display: flex; flex-wrap: wrap; gap: .75rem; }
.portale-azioni .icon { vertical-align: -3px; margin-right: .25rem; }
.portale-btn-chiaro { color: #fff; box-shadow: inset 0 0 0 2px #fff; }
.portale-btn-chiaro:hover, .portale-btn-chiaro:focus { color: #003366; background: #fff; }
.portale-bollino { display: inline-block; background: rgba(255, 255, 255, .12); color: #fff; border: 1px solid rgba(255, 255, 255, .7); font-weight: 700; font-size: .8rem; letter-spacing: .14em; padding: .2rem .8rem; border-radius: 999px; margin-bottom: 1rem; }
.portale-codice { background: rgba(0, 0, 0, .35); border: 1px solid rgba(255, 255, 255, .2); border-radius: 8px; padding: 1rem 1.25rem; }
.portale-codice pre { margin: .5rem 0; color: #fff; font-size: .8125rem; white-space: pre-wrap; }
.portale-codice-titolo { font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; color: #b3d1f0; }
.portale-codice-nota { font-size: .8125rem; color: #cfe0f2; }
.portale-sezione { padding-top: 3rem; padding-bottom: 3rem; }
.portale-fascia { background: #f2f4f6; }
.portale-titolo-sezione { font-size: 1.75rem; font-weight: 700; color: #17324d; margin-bottom: 1.5rem; }
.portale-scheda .card-body { padding: 1.5rem; display: flex; flex-direction: column; }
.portale-scheda .portale-testo { color: #455b71; flex-grow: 1; }
.portale-scheda .btn { align-self: flex-start; }
.portale-scheda .btn .icon { width: 1rem; height: 1rem; vertical-align: -3px; }
.portale-icona { width: 3rem; height: 3rem; border-radius: 50%; background: #e6f0fa; display: flex; align-items: center; justify-content: center; }
.portale-passi { counter-reset: passo; list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1.5rem; }
.portale-passi li { counter-increment: passo; background: #fff; border: 1px solid #d9dadb; border-radius: 8px; padding: 1.25rem 1.25rem 1.25rem 4rem; position: relative; color: #455b71; }
.portale-passi li::before { content: counter(passo); position: absolute; left: 1.25rem; top: 1.1rem; width: 2rem; height: 2rem; border-radius: 50%; background: #0066cc; color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.portale-passi strong { color: #17324d; }
.prova-api-codice { font-family: SFMono-Regular, Menlo, Consolas, monospace; font-size: .875rem; background: #f2f4f6; border: 1px solid #d9dadb; border-radius: 4px; padding: .75rem; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 32rem; overflow: auto; }
@media (max-width: 767px) { .portale-titolo { font-size: 1.75rem; } .portale-eroe { padding: 2.5rem 0; } }