/* Contabilità — Prospetto incassi & fatture
   Stili base + comportamenti hover (nel prototipo gestiti da style-hover). */

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: #f6f7f9;
  font-family: 'IBM Plex Sans', system-ui, sans-serif;
  color: #1a1d23;
}
[x-cloak] { display: none !important; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #d5d9e0; border-radius: 8px; border: 2px solid #f6f7f9; }

input:focus, select:focus, textarea:focus { outline: 2px solid #2f5fd0; outline-offset: 0; }

/* hover: pulsante primario (Nuova fattura / Nuovo cliente) */
.btn-primary:hover { background: #2751b5 !important; }

/* hover: intestazioni ordinabili */
.th-sort:hover { color: #475467 !important; }

/* hover: righe tabella */
.row-hover:hover { background: #fafbfc; }

/* hover: icone azione (modifica) */
.icon-edit:hover { background: #eef0f3; color: #2f5fd0 !important; }
/* hover: icone azione (elimina) */
.icon-del:hover { background: #fbecea; color: #c0392b !important; }

/* hover: pulsante secondario (Gestisci budget) */
.btn-ghost:hover { border-color: #2f5fd0 !important; color: #2f5fd0 !important; }

/* hover: riga "+ aggiungi al budget" */
.btn-dashed:hover { border-color: #2f5fd0 !important; color: #2f5fd0 !important; }

/* ==== menù laterale "Viste" (tutti i moduli) ============================
   Ogni voce definisce due variabili CSS inline: --c (colore pieno della voce)
   e --cs (versione soffice per sfondi). Il resto lo fa questo blocco. */
.nav-item { position:relative; display:flex; align-items:center; gap:10px; width:100%; border:none; background:transparent;
            cursor:pointer; font-family:inherit; font-size:13px; font-weight:600; padding:8px 10px 8px 12px; border-radius:9px;
            margin-bottom:3px; color:#475467; text-align:left; transition:background .16s ease, color .16s ease, transform .16s ease; }
.nav-item:hover { background:#f2f4f8; transform:translateX(2px); }
.nav-item .nav-ico { width:26px; height:26px; border-radius:8px; display:flex; align-items:center; justify-content:center;
                     font-size:11.5px; font-weight:700; font-family:'IBM Plex Mono',monospace; background:var(--cs); color:var(--c);
                     flex-shrink:0; transition:background .16s ease, color .16s ease, box-shadow .16s ease; }
.nav-item .nav-val { margin-left:auto; font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:500; color:#98a0af;
                     white-space:nowrap; transition:color .16s ease; }
.nav-item.active { background:var(--cs); color:var(--c); transform:none;
                   box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--c) 16%, transparent); }
.nav-item.active::before { content:''; position:absolute; left:0; top:7px; bottom:7px; width:3px; border-radius:3px; background:var(--c); }
.nav-item.active .nav-ico { background:var(--c); color:#fff; box-shadow:0 2px 6px color-mix(in srgb, var(--c) 35%, transparent); }
.nav-item.active .nav-val { color:var(--c); font-weight:600; }