﻿/* Inventario PiperNova - foglio di stile. Niente CSS in linea nelle pagine. */
:root {
	--sfondo: #F4F6F8;
	--carta: #FFFFFF;
	--testo: #1B2733;
	--tenue: #5F6F7E;
	--bordo: #D5DCE3;
	--primario: #1F4E79;
	--primario-testo: #FFFFFF;
	--ok: #1E7B45;
	--ok-sfondo: #DDF3E6;
	--attenzione: #9A5B00;
	--attenzione-sfondo: #FFF0CF;
	--errore: #A61B1B;
	--errore-sfondo: #FBE0E0;
	--spento: #59636E;
	--spento-sfondo: #E6EAEE;
	--evidenzia: #FFF6DB;
	--intestazione: #14283B;
}
@media (prefers-color-scheme: dark) {
	:root {
		--sfondo: #10161C;
		--carta: #182029;
		--testo: #E4EAF0;
		--tenue: #94A3B1;
		--bordo: #2C3944;
		--primario: #5FA3E0;
		--primario-testo: #08121B;
		--ok: #6FD39A;
		--ok-sfondo: #163A28;
		--attenzione: #F0B862;
		--attenzione-sfondo: #40300F;
		--errore: #FF8E8E;
		--errore-sfondo: #4A1D1D;
		--spento: #A9B4BF;
		--spento-sfondo: #26313B;
		--evidenzia: #3A3113;
		--intestazione: #0B1218;
	}
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--sfondo);
	color: var(--testo);
	font: 15px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
a { color: var(--primario); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { font-size: 1.6rem; margin: 0.4rem 0 0.6rem; }
h2 { font-size: 1.15rem; margin: 1.6rem 0 0.6rem; }
.scheda h2 { margin-top: 0; }
code { font: 0.9em ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; word-break: break-all; }
.tenue { color: var(--tenue); }
.nowrap { white-space: nowrap; }
.num { text-align: right; font-variant-numeric: tabular-nums; }

/* Intestazione */
#Intestazione { background: var(--intestazione); color: #FFFFFF; }
.testata-interno {
	max-width: 1280px; margin: 0 auto; padding: 0.6rem 16px;
	display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem 1.2rem;
}
.marchio { display: flex; align-items: center; gap: 0.5rem; color: #FFFFFF; }
.marchio:hover { text-decoration: none; }
.marchio img { width: 28px; height: 28px; }
.marchio .nome { font-weight: 700; font-size: 1.05rem; }
.marchio .reparto { color: #9FB4C7; font-size: 0.85rem; }
.menu { display: flex; gap: 0.2rem; }
.menu a { color: #D6E2EE; padding: 0.35rem 0.75rem; border-radius: 6px; }
.menu a:hover { background: rgba(255, 255, 255, 0.12); text-decoration: none; }
.menu a.attivo { background: rgba(255, 255, 255, 0.2); color: #FFFFFF; }
.conteggio {
	display: inline-block; min-width: 1.4em; padding: 0 0.4em; margin-left: 0.2em;
	background: #E5A100; color: #1B1200; border-radius: 999px; font-size: 0.8rem; font-weight: 700; text-align: center;
}
.ricerca { display: flex; gap: 0.4rem; flex: 1 1 260px; max-width: 560px; }
.ricerca input[type="search"] { flex: 1; min-width: 0; }
.ricerca.grande { max-width: 760px; margin-bottom: 1rem; }
.esci { display: flex; align-items: center; gap: 0.6rem; margin-left: auto; }
.esci .chi { color: #9FB4C7; font-size: 0.85rem; }

#Principale { max-width: 1280px; margin: 0 auto; padding: 1rem 16px 2rem; }
#FinePagina { border-top: 1px solid var(--bordo); color: var(--tenue); font-size: 0.85rem; }
.piede-interno { max-width: 1280px; margin: 0 auto; padding: 0.8rem 16px; }

/* Moduli e pulsanti */
input[type="text"], input[type="search"], input[type="email"], input[type="password"], input[type="number"], select {
	font: inherit; color: var(--testo); background: var(--carta);
	border: 1px solid var(--bordo); border-radius: 6px; padding: 0.45rem 0.6rem; min-height: 2.4rem;
}
input:focus-visible, select:focus-visible, button:focus-visible, a:focus-visible { outline: 2px solid var(--primario); outline-offset: 2px; }
button {
	font: inherit; font-weight: 600; cursor: pointer; min-height: 2.4rem;
	border-radius: 6px; padding: 0.4rem 0.9rem; border: 1px solid var(--bordo);
	background: var(--carta); color: var(--testo);
}
button.principale { background: var(--primario); border-color: var(--primario); color: var(--primario-testo); }
button.secondario { background: var(--carta); }
button.pericolo { background: var(--errore-sfondo); border-color: var(--errore); color: var(--errore); }
button:hover { filter: brightness(0.95); }
.campo { margin-bottom: 0.8rem; }
.campo label { display: block; font-size: 0.85rem; color: var(--tenue); margin-bottom: 0.25rem; }
.campo input, .campo select { width: 100%; max-width: 420px; }
form.inline { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; margin: 0.15rem 0.3rem 0.15rem 0; }
form.inline select { max-width: 100%; }
.gruppo-azioni { display: flex; flex-wrap: wrap; gap: 0.8rem 1.4rem; align-items: center; }

/* Riquadri del riepilogo */
.riquadri { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0.8rem; margin: 0.8rem 0; }
.riquadro {
	display: flex; flex-direction: column; gap: 0.2rem; padding: 0.9rem 1rem;
	background: var(--carta); border: 1px solid var(--bordo); border-left: 5px solid var(--bordo);
	border-radius: 8px; color: var(--testo);
}
.riquadro:hover { text-decoration: none; border-color: var(--primario); }
.riquadro .numero { font-size: 2rem; font-weight: 700; line-height: 1.1; }
.riquadro .didascalia { color: var(--tenue); font-size: 0.85rem; }
.riquadro.attenzione { border-left-color: var(--attenzione); background: var(--attenzione-sfondo); }
.riquadro.errore { border-left-color: var(--errore); background: var(--errore-sfondo); }

/* Schede e griglie */
.scheda { background: var(--carta); border: 1px solid var(--bordo); border-radius: 8px; padding: 1rem 1.1rem; margin: 0.9rem 0; }
.griglia { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 0 1rem; align-items: start; }
.dati { margin: 0; }
.dati > div { display: flex; gap: 0.8rem; padding: 0.28rem 0; border-bottom: 1px solid var(--bordo); }
.dati > div:last-child { border-bottom: 0; }
.dati dt { flex: 0 0 8.5rem; color: var(--tenue); }
.dati dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
ul.elenco { margin: 0; padding-left: 1.2rem; }

/* Tabelle */
.tabella-scorrevole { overflow-x: auto; }
.tabella { width: 100%; border-collapse: collapse; background: var(--carta); }
.tabella th, .tabella td { padding: 0.45rem 0.7rem; border-bottom: 1px solid var(--bordo); text-align: left; vertical-align: top; }
.tabella th { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.03em; color: var(--tenue); white-space: nowrap; }
.tabella th.num, .tabella td.num { text-align: right; }
.tabella.ordinabile th[data-tipo] { cursor: pointer; user-select: none; }
.tabella.ordinabile th[aria-sort="ascending"]::after { content: " \25B2"; }
.tabella.ordinabile th[aria-sort="descending"]::after { content: " \25BC"; }
.tabella tbody tr:hover { background: var(--spento-sfondo); }
.tabella tr.muto { background: var(--evidenzia); }
.tabella tr.muto td:first-child { box-shadow: inset 4px 0 0 var(--errore); }
.tabella tr.dismesso { color: var(--tenue); }
progress { width: 8rem; height: 0.8rem; vertical-align: middle; accent-color: var(--primario); }
progress.pieno { accent-color: var(--errore); }

/* Etichette e messaggi */
.etichetta {
	display: inline-block; padding: 0.05rem 0.5rem; border-radius: 999px;
	font-size: 0.78rem; font-weight: 600; white-space: nowrap;
	background: var(--spento-sfondo); color: var(--spento);
}
.etichetta.ok { background: var(--ok-sfondo); color: var(--ok); }
.etichetta.attenzione { background: var(--attenzione-sfondo); color: var(--attenzione); }
.etichetta.errore { background: var(--errore-sfondo); color: var(--errore); }
.etichetta.spento { background: var(--spento-sfondo); color: var(--spento); }
.etichetta.ignoto { background: transparent; color: var(--tenue); border: 1px dashed var(--bordo); font-weight: 400; }
.messaggio {
	padding: 0.7rem 1rem; margin: 0.8rem 0; border-radius: 8px;
	background: var(--spento-sfondo); border-left: 5px solid var(--spento);
}
.messaggio.ok { background: var(--ok-sfondo); border-left-color: var(--ok); }
.messaggio.attenzione { background: var(--attenzione-sfondo); border-left-color: var(--attenzione); }
.messaggio.errore { background: var(--errore-sfondo); border-left-color: var(--errore); }

/* Codice del nuovo link */
.codice-nuovo { border-color: var(--attenzione); background: var(--attenzione-sfondo); }
.codice { font-size: 1.4rem; letter-spacing: 0.12em; padding: 0.3rem 0.6rem; background: var(--carta); border: 1px solid var(--bordo); border-radius: 6px; user-select: all; }

/* Accesso */
.riquadro-modulo { max-width: 420px; margin: 3rem auto; background: var(--carta); border: 1px solid var(--bordo); border-radius: 10px; padding: 1.4rem 1.6rem; }
.riquadro-modulo .campo input { max-width: none; }
.riquadro-modulo button.principale { width: 100%; }
.nota-modulo { font-size: 0.85rem; margin-bottom: 0; }

@media (max-width: 720px) {
	.esci { margin-left: 0; }
	.dati > div { flex-direction: column; gap: 0; }
	.dati dt { flex: none; font-size: 0.8rem; }
	.tabella th, .tabella td { padding: 0.4rem 0.5rem; }
	h1 { font-size: 1.35rem; }
}
