:root { --blu: #1f4e79; --blu2: #2e75b6; --fondo: #f4f6f9; --bordo: #d5dbe3; --testo: #1d2733;
        --rosso: #c0392b; --giallo: #f0b400; --grigio: #6b7785; --verde: #2e8b57; }
* { box-sizing: border-box; }
body { margin: 0; font-family: "Segoe UI", Arial, sans-serif; color: var(--testo); background: var(--fondo); font-size: 15px; }
a { color: var(--blu2); }
.barra { background: var(--blu); color: #fff; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; padding: 10px 20px; }
.barra a { color: #fff; text-decoration: none; }
.marchio { font-weight: 700; letter-spacing: .5px; }
.marchio small { font-weight: 400; opacity: .75; margin-left: 6px; }
.barra nav { display: flex; flex-wrap: wrap; gap: 4px 16px; flex: 1; }
.barra nav a { opacity: .9; } .barra nav a:hover { opacity: 1; text-decoration: underline; }
.chi { font-size: 13px; opacity: .9; }
main { max-width: 1300px; margin: 0 auto; padding: 16px 20px 60px; }
h1 small { font-size: 14px; color: var(--grigio); font-weight: 400; }
h2 { margin-top: 32px; border-bottom: 2px solid var(--bordo); padding-bottom: 4px; }
.sotto { color: var(--grigio); }
.nota { background: #e8f1fb; border-left: 4px solid var(--blu2); padding: 8px 12px; }
.errore { background: #fdecea; border-left: 4px solid var(--rosso); padding: 8px 12px; }
.briciole { font-size: 13px; color: var(--grigio); margin: 0; }
.riquadri { display: flex; flex-wrap: wrap; gap: 12px; margin: 12px 0; }
.riquadro { flex: 1 1 180px; background: #fff; border: 1px solid var(--bordo); border-radius: 8px; padding: 14px; text-decoration: none; color: var(--testo); }
.riquadro b { display: block; font-size: 28px; }
.riquadro.alto { border-left: 6px solid var(--rosso); } .riquadro.medio { border-left: 6px solid var(--giallo); } .riquadro.info { border-left: 6px solid var(--grigio); }
.avvisi { list-style: none; padding: 0; }
.avvisi li { background: #fff; border: 1px solid var(--bordo); border-left: 6px solid var(--grigio); padding: 8px 12px; margin: 6px 0; border-radius: 4px; }
.avvisi li.alto { border-left-color: var(--rosso); } .avvisi li.medio { border-left-color: var(--giallo); }
.avvisi a { color: var(--testo); text-decoration: none; } .avvisi a:hover { text-decoration: underline; }
.griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.scheda { background: #fff; border: 1px solid var(--bordo); border-radius: 8px; padding: 12px; text-decoration: none; color: var(--testo); }
.scheda:hover { border-color: var(--blu2); }
.scheda b { display: block; } .scheda span { font-size: 13px; color: var(--grigio); }
.scorri { overflow-x: auto; }
table.elenco { width: 100%; border-collapse: collapse; background: #fff; font-size: 14px; }
table.elenco th { background: #e9eef4; text-align: left; position: sticky; top: 0; }
table.elenco th, table.elenco td { border: 1px solid var(--bordo); padding: 6px 8px; vertical-align: top; }
td.piccolo { font-size: 12px; color: var(--grigio); max-width: 320px; word-break: break-word; }
.etichetta { display: inline-block; font-size: 12px; padding: 2px 8px; border-radius: 10px; background: #e9eef4; }
.etichetta.in_vigore { background: #dff3e8; color: var(--verde); } .etichetta.bozza { background: #fff4d6; color: #8a6500; }
.etichetta.obsoleta { background: #eee; color: #777; }
.modulo { background: #fff; border: 1px solid var(--bordo); border-radius: 8px; padding: 16px; max-width: 760px; display: grid; gap: 12px; }
.modulo.largo { max-width: none; }
.modulo label { display: grid; gap: 4px; font-size: 13px; color: var(--grigio); }
.modulo .valore { color: var(--testo); font-size: 15px; white-space: pre-wrap; }
input, select, textarea { font: inherit; padding: 6px 8px; border: 1px solid var(--bordo); border-radius: 4px; color: var(--testo); background: #fff; }
textarea.mono { font-family: Consolas, monospace; font-size: 13px; }
button, .bottone { background: var(--blu2); color: #fff; border: 0; padding: 8px 14px; border-radius: 4px; cursor: pointer; text-decoration: none; display: inline-block; font: inherit; }
button.pericolo { background: var(--rosso); } button.conferma { background: var(--verde); }
.azioni { display: flex; gap: 10px; flex-wrap: wrap; }
.cerca, .in-linea { display: flex; gap: 8px; align-items: end; flex-wrap: wrap; margin: 10px 0; }
.in-linea label { display: grid; gap: 4px; font-size: 13px; color: var(--grigio); }
article.documento { background: #fff; border: 1px solid var(--bordo); padding: 24px 32px; max-width: 900px; }
article.documento .giallo, .giallo { background: #fff3a8; font-weight: 600; padding: 4px 6px; }
table.doc { border-collapse: collapse; width: 100%; margin: 10px 0; } table.doc th, table.doc td { border: 1px solid var(--bordo); padding: 4px 6px; }
.pagina-login { display: grid; place-items: center; min-height: 100vh; background: var(--blu); }
.scatola-login { background: #fff; padding: 28px; border-radius: 10px; width: min(360px, 92vw); display: grid; gap: 12px; }
.scatola-login h1 { margin: 0; color: var(--blu); font-size: 22px; }
.scatola-login label { display: grid; gap: 4px; font-size: 13px; color: var(--grigio); }


/* --- AGENTE TECNICO (07/10/2026) --- */
:root { --arancio: #c8641e; }
.barra { background: #3b4a5a; }
.pagina-login { background: #3b4a5a; }
.scatola-login h1 { color: #3b4a5a; }
.nuovo-caso summary { cursor: pointer; font-weight: 700; font-size: 17px; color: var(--blu); padding: 6px 0; }
.due { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tre { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 700px) { .due, .tre { grid-template-columns: 1fr; } }
.risposte { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
@media (max-width: 1000px) { .risposte { grid-template-columns: 1fr; } }
.risposta { background: #fff; border: 1px solid var(--bordo); border-radius: 8px; padding: 4px 18px 12px; min-width: 0; }
.risposta h3 { margin: 10px 0 4px; display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; }
.risposta.sintesi { border: 2px solid var(--verde); margin-bottom: 14px; }
.risposta.claude h3 { color: var(--arancio); } .risposta.chatgpt h3 { color: #10a37f; } .risposta.sintesi h3 { color: var(--verde); }
.risposta .testo { overflow-x: auto; line-height: 1.5; }
.risposta .testo table { border-collapse: collapse; } .risposta .testo td, .risposta .testo th { border: 1px solid var(--bordo); padding: 3px 6px; }
.costo { font-size: 12px; color: var(--grigio); font-weight: 400; }
.attesa { color: var(--grigio); font-style: italic; }
.attesa::before { content: "⏳ "; }
.giro { margin-top: 26px; }
.giro > .domanda { background: #e8f1fb; border-left: 4px solid var(--blu2); padding: 8px 12px; white-space: pre-wrap; margin-bottom: 12px; }
.foto { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.foto img { height: 120px; border-radius: 6px; border: 1px solid var(--bordo); }
.etichetta.risolto { background: #dff3e8; color: var(--verde); } .etichetta.parziale { background: #fff4d6; color: #8a6500; }
.etichetta.non_risolto { background: #fdecea; color: var(--rosso); } .etichetta.in_corso { background: #e8f1fb; color: var(--blu2); }
.etichetta.errore { background: #fdecea; color: var(--rosso); }
.dati-prod { font-size: 13px; white-space: pre-wrap; background: #f6f7f9; border: 1px solid var(--bordo); padding: 8px; max-height: 260px; overflow: auto; }
.schede-fase { display: flex; gap: 6px; margin: 18px 0 6px; border-bottom: 2px solid var(--bordo); }
.schede-fase a { padding: 8px 16px; text-decoration: none; color: var(--testo); border: 1px solid var(--bordo); border-bottom: 0;
                 border-radius: 6px 6px 0 0; background: #eef1f5; }
.schede-fase a.attiva { background: #fff; font-weight: 700; color: var(--blu); }
.schede-fase b { background: #e9eef4; border-radius: 10px; padding: 0 8px; font-size: 12px; margin-left: 4px; }
.etichetta.aperto { background: #e8f1fb; color: var(--blu2); } .etichetta.chiuso { background: #dff3e8; color: var(--verde); }
.etichetta.archiviato { background: #eee; color: #777; }
.punto { background: #fffbea; border: 1px solid #f0d77a; border-radius: 8px; padding: 4px 16px 10px; margin: 14px 0; }
.punto h3 { margin: 10px 0 4px; color: #8a6500; }