html { font-size: 16px; }
body { background: #f4f6f8; }
.ff-nav { background: var(--ff-primario, #0b2e4f); }
.ff-nav .nav-link, .ff-nav .dropdown-toggle { color: rgba(255,255,255,.8); }
.ff-nav .navbar-nav .nav-link { white-space: nowrap; }
.ff-nav .nav-link.active, .ff-nav .nav-link:hover { color: #fff; }
.ff-main { max-width: 1320px; margin: 0 auto; padding: 1.25rem 1rem 3rem; }
.ff-kpi { display: block; text-decoration: none; color: inherit; }
.ff-kpi .num { font-size: 2.25rem; font-weight: 600; line-height: 1; }
.ff-kpi:hover .card { border-color: var(--ff-primario, #0b2e4f); }
.ff-accesso { max-width: 440px; margin: 2rem auto; }
.ff-codice { font-family: ui-monospace, Consolas, monospace; font-size: 2rem; letter-spacing: .15em; }
.ff-nota { white-space: pre-wrap; }
.table > :not(caption) > * > * { vertical-align: middle; }
.ff-corpo { min-height: 100vh; display: flex; flex-direction: column; }
.ff-corpo > main { flex: 1 0 auto; width: 100%; }
.ff-logo-accesso { display: block; width: 260px; max-width: 80%; margin: .25rem auto 1.25rem; }
.ff-footer { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 16px 22px; flex-shrink: 0; }
.ff-footer span { font-size: 11.5px; color: #8793a5; }
.ff-footer img { height: 20px; width: auto; display: block; background: #fff; border-radius: 6px; padding: 3px 8px; }

/* Tema: i colori si scelgono nel menu Aspetto dell'ufficio e arrivano come variabili CSS (vedi il layout); questi sono i valori di serie */
:root { --ff-primario: #0b2e4f; --ff-accento: #0d6efd; }
.btn-primary { --bs-btn-bg: var(--ff-accento); --bs-btn-border-color: var(--ff-accento); --bs-btn-hover-bg: color-mix(in srgb, var(--ff-accento) 82%, #000); --bs-btn-hover-border-color: color-mix(in srgb, var(--ff-accento) 76%, #000);
    --bs-btn-active-bg: color-mix(in srgb, var(--ff-accento) 72%, #000); --bs-btn-active-border-color: color-mix(in srgb, var(--ff-accento) 68%, #000); --bs-btn-disabled-bg: var(--ff-accento); --bs-btn-disabled-border-color: var(--ff-accento); }
.btn-outline-primary { --bs-btn-color: var(--ff-accento); --bs-btn-border-color: var(--ff-accento); --bs-btn-hover-bg: var(--ff-accento); --bs-btn-hover-border-color: var(--ff-accento);
    --bs-btn-active-bg: var(--ff-accento); --bs-btn-active-border-color: var(--ff-accento); --bs-btn-disabled-color: var(--ff-accento); --bs-btn-disabled-border-color: var(--ff-accento); }
.nav-pills { --bs-nav-pills-link-active-bg: var(--ff-accento); }
.form-check-input:checked { background-color: var(--ff-accento); border-color: var(--ff-accento); }
.border-primary { border-color: var(--ff-accento) !important; }