/* COPIA da depy/static/css/tema-scuro.css (commit 1360520, 10/11/2026). Non modificare qui:
   se cambia in Depy si ricopia (vedi web/css/depy/LEGGIMI.md). */
/* DEPY - tema scuro: le regole che cambiano FORMA al buio (non colore: quello
   lo fanno i token). Caricato per ultimo. Non aggiungere regole di colore qui. */
/* =============================================
   AL BUIO

   Tutto quello che si e' rifatto in questi giorni - l'elenco delle
   commesse, i riquadri delle impostazioni, il registro, le persone -
   aveva i colori del giorno scritti dentro: fondo bianco, righe
   #f0f2f5, bordi grigio chiaro. Con il tema scuro il fondo restava
   bianco e le scritte chiare sopra non si leggevano. Qui ogni pezzo
   prende la sua versione notturna.
   ============================================= */
/* I colori di casa, al buio. Il selettore e' html[...] e non solo
   [...]: i valori del giorno stanno su :root, che ha la stessa forza e
   viene piu' sotto nel foglio - a parita' vince l'ultimo, e vincevano
   loro. Cosi' meta' delle regole scritte con queste variabili restava
   chiara anche di notte, ed e' per questo che non si leggeva niente. */
/* (I valori notturni di --hb-* e --dp-* stanno in tokens.css, nel blocco
   html[data-bs-theme="dark"].) */
/* Le icone verdi e rosse al buio: la tinta piena su un fondo scuro si
   legge poco, la versione chiara si'. */
[data-bs-theme="dark"] .hb-ico.hb-e-entra, [data-bs-theme="dark"] .hb-alta.hb-e-entra .hb-alta-ico,
[data-bs-theme="dark"] .hb-alta.hb-e-entra .hb-alta-conta { color: var(--verde-300); }
[data-bs-theme="dark"] .hb-ico.hb-e-esce, [data-bs-theme="dark"] .hb-alta.hb-e-esce .hb-alta-ico,
[data-bs-theme="dark"] .hb-alta.hb-e-esce .hb-alta-conta { color: var(--rosso-300); }
[data-bs-theme="dark"] .hb-alta.hb-e-entra:hover { border-color: var(--verde-500); }
[data-bs-theme="dark"] .hb-alta.hb-e-esce:hover { border-color: var(--rosso-700); }
/* Passando sopra un articolo sotto scorta il testo tornava al colore
   del riquadro (blu scuro, di giorno): la regola :hover diceva
   «color: inherit» e veniva dopo quella notturna. */
[data-bs-theme="dark"] .hb-sotto:hover,
[data-bs-theme="dark"] .hb-porta:hover,
[data-bs-theme="dark"] .hb-alta:hover { color: var(--testo); }
[data-bs-theme="dark"] .hb-sotto:hover .hb-sr-art { color: #fff; }
/* I riquadri e le testate */
[data-bs-theme="dark"] .hb-rq-testa,
[data-bs-theme="dark"] .pf-card-head,
[data-bs-theme="dark"] .pf-card-foot,
[data-bs-theme="dark"] .pf-card-head h5,
[data-bs-theme="dark"] .hb-rq-testa h3 { color: var(--testo); }

/* L'elenco delle commesse */
[data-bs-theme="dark"] .el-lista-testa,
[data-bs-theme="dark"] .el-pag { background: transparent; }
[data-bs-theme="dark"] .hb-cm tbody td,
[data-bs-theme="dark"] .hb-cm thead th { color: var(--testo); }
[data-bs-theme="dark"] .hb-cm thead th { background: var(--superficie); }
[data-bs-theme="dark"] .hb-rif,
[data-bs-theme="dark"] .hb-chi { color: var(--testo); }
[data-bs-theme="dark"] .el-valore { color: var(--testo); }
[data-bs-theme="dark"] .el-ord { color: var(--testo-2); }
[data-bs-theme="dark"] .el-ord.e-ord, [data-bs-theme="dark"] .el-ord:hover { color: var(--testo); }

/* I riquadri delle impostazioni e del profilo */
[data-bs-theme="dark"] .rq-spiega, [data-bs-theme="dark"] .aiuto { color: var(--testo-2); }
[data-bs-theme="dark"] .aiuto b, [data-bs-theme="dark"] .aiuto strong { color: var(--testo); }

/* La home: le porte, i numeri, le pastiglie */
[data-bs-theme="dark"] .hb-porta,
[data-bs-theme="dark"] .hb-alta { color: var(--testo); }
[data-bs-theme="dark"] .hb-tit { color: var(--testo); }
[data-bs-theme="dark"] .hb-saluto h2 { color: var(--testo); }
[data-bs-theme="dark"] .hb-sotto { border-color: var(--bordo); color: var(--testo); }
[data-bs-theme="dark"] .hb-bt-chiaro, [data-bs-theme="dark"] .hbt-chiaro { border-color: var(--bordo-forte); color: var(--testo); }
[data-bs-theme="dark"] .hb-bt-chiaro:hover, [data-bs-theme="dark"] .hbt-chiaro:hover { color: #fff; }
[data-bs-theme="dark"] .hb-risparmio { color: var(--testo); }

/* Le pastiglie restano leggibili: fondo scuro della loro tinta,
   scritta chiara. Quelle chiare su fondo scuro sparivano. */
[data-bs-theme="dark"] .cat-blu    { background: rgba(var(--primario-rgb),.35); color: var(--blu-200); }
[data-bs-theme="dark"] .cat-grigio { background: var(--velo); color: var(--testo); }
[data-bs-theme="dark"] .cat-verde  { background: rgba(var(--ok-rgb),.25); color: var(--verde-300); }
[data-bs-theme="dark"] .cat-sabbia { background: rgba(var(--attenzione-rgb),.25); color: var(--ambra-300); }
[data-bs-theme="dark"] .cat-viola  { background: rgba(var(--primario-rgb),.3); color: var(--blu-200); }

/* Le iconcine di riga e i riquadri di caricamento */
[data-bs-theme="dark"] .el-ico-apri { background: rgba(var(--primario-rgb),.4); color: var(--blu-200); }
[data-bs-theme="dark"] .el-ico-stampa { background: rgba(var(--attenzione-rgb),.3); color: var(--ambra-300); }
[data-bs-theme="dark"] .el-ico-copia { background: rgba(var(--ok-rgb),.3); color: var(--verde-300); }
[data-bs-theme="dark"] .el-ico-via { background: rgba(var(--no-rgb),.3); color: var(--rosso-300); }
[data-bs-theme="dark"] .f-crea   { background: rgba(var(--ok-rgb),.3); color: var(--verde-300); }
[data-bs-theme="dark"] .f-cambia { background: rgba(var(--primario-rgb),.4); color: var(--blu-200); }
[data-bs-theme="dark"] .f-butta  { background: rgba(var(--no-rgb),.3); color: var(--rosso-300); }
[data-bs-theme="dark"] .f-entra  { background: rgba(var(--attenzione-rgb),.3); color: var(--ambra-300); }

/* Le scritte che avevo lasciato del colore del giorno. L'etichetta di
   un campo era blu scuro: su un riquadro scuro non si leggeva. */
[data-bs-theme="dark"] .cfg-pagina .form-label,
[data-bs-theme="dark"] .cfg-pagina .pf-card label:not(.form-check-label) { color: var(--testo); }
[data-bs-theme="dark"] .cfg-carica { color: var(--testo-2); }
[data-bs-theme="dark"] .cfg-menu-torna { color: var(--blu-200); }
[data-bs-theme="dark"] .cfg-pagina .form-check-label { color: var(--testo); }

/* Le pastiglie: il testo va schiarito ancora un po', se no si legge a
   fatica sul fondo scuro della loro tinta. */

/* Gli avvisi di Bootstrap: al buio restavano con il fondo chiaro di
   serie e la scritta scura sopra. */
[data-bs-theme="dark"] .alert strong, [data-bs-theme="dark"] .alert b { color: inherit; }

/* =============================================
   DARK THEME (Bootstrap 5.3 data-bs-theme=dark)
   ============================================= */
[data-bs-theme="dark"] body {
    background-color: var(--sfondo);
    color: var(--testo);
}
[data-bs-theme="dark"] .card {
    background-color: var(--superficie);
    
    color: var(--testo);
}
[data-bs-theme="dark"] .table {
    color: var(--testo);
}
[data-bs-theme="dark"] .table-light,
[data-bs-theme="dark"] .table > thead {
    background-color: var(--superficie);
    color: var(--testo);
}
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
    background-color: var(--superficie);
    color: var(--testo);
    border-color: var(--bordo-forte);
}
[data-bs-theme="dark"] .user-name,
[data-bs-theme="dark"] .user-header-name {
    color: var(--testo);
}

/* =========================================================================
   TEMA SCURO — passata completa
   Le utility Bootstrap `bg-white/bg-light` e `text-dark/text-black` sono
   COLORI FISSI: non si adattano a data-bs-theme. Qui le rimappiamo, insieme
   agli altri elementi custom che erano ancora troppo chiari o illeggibili.
   ========================================================================= */

/* Le utility Bootstrap a colore fisso (.bg-white, .text-dark...) si adattano
   da sole: tokens.css ridefinisce di notte i loro --bs-*-rgb. */

/* --- Card, card-header, card-footer --- */
[data-bs-theme="dark"] .card-header,
[data-bs-theme="dark"] .card-footer {
    background-color: var(--superficie);
    border-color: var(--bordo);
    color: var(--testo);
}
/* Il bordo chiaro della card al buio diventerebbe una riga luminosa. */
[data-bs-theme="dark"] .el-lista thead th { background: var(--superficie); }
[data-bs-theme="dark"] .el-lista-testa, [data-bs-theme="dark"] .el-pag { border-color: var(--bordo); }
[data-bs-theme="dark"] .el-lista-testa strong, [data-bs-theme="dark"] .el-pag-conta b { color: var(--testo); }
[data-bs-theme="dark"] .el-pag-t { border-color: var(--bordo-forte); color: var(--testo); }
[data-bs-theme="dark"] .el-cerca input, [data-bs-theme="dark"] .el-bt { border-color: var(--bordo-forte); color: var(--testo); }
[data-bs-theme="dark"] .el-pillola { border-color: var(--bordo-forte); color: var(--testo); }

/* --- Table hover e header --- */
[data-bs-theme="dark"] .table > thead > tr > th { border-color: var(--bordo); }
[data-bs-theme="dark"] .table-hover > tbody > tr:hover > * {
    --bs-table-hover-bg: rgba(255,255,255,0.05);
    color: var(--testo);
}
[data-bs-theme="dark"] .table > :not(:first-child) { border-top-color: var(--bordo); }
[data-bs-theme="dark"] .table > tbody > tr > td { border-color: var(--bordo); }

/* Righe tinted (danger/warning/success/info) — versione scura leggibile */
[data-bs-theme="dark"] .table-danger,
[data-bs-theme="dark"] .table-danger > * {
    --bs-table-bg: rgba(var(--no-rgb),0.20);
    --bs-table-color: var(--rosso-300);
    background-color: rgba(var(--no-rgb),0.20);
    color: var(--rosso-300);
}
[data-bs-theme="dark"] .table-warning,
[data-bs-theme="dark"] .table-warning > * {
    --bs-table-bg: rgba(var(--attenzione-rgb),0.18);
    --bs-table-color: var(--ambra-200);
    background-color: rgba(var(--attenzione-rgb),0.18);
    color: var(--ambra-200);
}
[data-bs-theme="dark"] .table-success,
[data-bs-theme="dark"] .table-success > * {
    --bs-table-bg: rgba(var(--ok-rgb),0.20);
    --bs-table-color: var(--verde-300);
    background-color: rgba(var(--ok-rgb),0.20);
    color: var(--verde-300);
}
[data-bs-theme="dark"] .table-info,
[data-bs-theme="dark"] .table-info > * {
    --bs-table-bg: rgba(var(--blu-500-rgb),0.20);
    --bs-table-color: var(--blu-200);
    background-color: rgba(var(--blu-500-rgb),0.20);
    color: var(--blu-200);
}

/* --- Form controls chiari sopravvissuti --- */
[data-bs-theme="dark"] .form-control::placeholder { color: var(--testo-debole); }
[data-bs-theme="dark"] .form-check-input:not(:checked) {
    background-color: var(--superficie);
    border-color: var(--bordo-forte);
}
[data-bs-theme="dark"] .input-group-text {
    background-color: var(--superficie);
    border-color: var(--bordo-forte);
    color: var(--testo);
}
[data-bs-theme="dark"] .form-control:disabled,
[data-bs-theme="dark"] .form-select:disabled {
    background-color: var(--superficie);
    color: var(--testo-debole);
}

/* --- Modal --- */
[data-bs-theme="dark"] .modal-content {
    background-color: var(--superficie);
    color: var(--testo);
    border-color: var(--bordo);
}
[data-bs-theme="dark"] .modal-header,
[data-bs-theme="dark"] .modal-footer {
    background-color: var(--superficie);
    border-color: var(--bordo);
}
[data-bs-theme="dark"] .modal-header .btn-close { filter: invert(1) grayscale(1); }
[data-bs-theme="dark"] .modal-title { color: var(--testo); }

/* --- Dropdown --- */
[data-bs-theme="dark"] .dropdown-menu {
    background-color: var(--superficie);
    border-color: var(--bordo);
    color: var(--testo);
}
[data-bs-theme="dark"] .dropdown-item { color: var(--testo); }
[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus { background-color: var(--superficie); color: var(--testo); }
[data-bs-theme="dark"] .dropdown-divider { border-color: var(--bordo); }

/* --- Alerts: rendi tinta scura leggibile --- */

/* --- Badge subtle: BS 5.3 le mappa via CSS var, ma alcuni tenant hanno colore
       hardcoded. Riforziamo. --- */


/* --- Bottoni outline: bordo e testo si perdono in dark; ridiamo contrasto --- */
[data-bs-theme="dark"] .btn-outline-secondary { color: var(--testo); border-color: var(--bordo-forte); }
[data-bs-theme="dark"] .btn-outline-secondary:hover { background-color: var(--velo); color: #fff; }

/* --- Bordi generici che erano su fondo bianco --- */
[data-bs-theme="dark"] .border,
[data-bs-theme="dark"] .border-top,
[data-bs-theme="dark"] .border-bottom,
[data-bs-theme="dark"] .border-start,

/* --- Progress bar background --- */
[data-bs-theme="dark"] .progress { background-color: var(--superficie); }

/* --- Componenti custom del progetto --- */

/* Filtri card: header bianco esplicito nelle nostre liste */
[data-bs-theme="dark"] .filters-card { background-color: var(--superficie); }

/* Header pager: usava #fafbfc/border-bottom */
[data-bs-theme="dark"] .pager-input { background-color: var(--superficie); color: var(--testo); border-color: var(--bordo-forte); }
[data-bs-theme="dark"] .pager-per-page { background-color: var(--superficie); color: var(--testo); border-color: var(--bordo-forte); }

/* Sub-row dettagli (bg-light usato inline nel dettaglio articolo) */
[data-bs-theme="dark"] tr.sub-row > td,
[data-bs-theme="dark"] tr[id^="dettaglio-"] > td { background-color: var(--superficie); color: var(--testo); }

/* Notifiche laterali dashboard */

/* Dashboard period picker */
[data-bs-theme="dark"] .dashboard-period-form label { color: var(--testo-2); }

/* Blocchi "table-light" nelle sub-tabelle (es. Fornitori per articolo) */
[data-bs-theme="dark"] .table thead.table-light th {
    background-color: var(--superficie);
    color: var(--testo);
    border-color: var(--bordo);
}

/* Cards KPI hover shadow: attenua l'ombra in dark */

/* Tooltip in dark rendered black-on-white by default: forziamo contrasto */
[data-bs-theme="dark"] .tooltip .tooltip-inner {
    background-color: #f8f9fa; color: var(--testo);
}
[data-bs-theme="dark"] .tooltip.bs-tooltip-top .tooltip-arrow::before,
[data-bs-theme="dark"] .tooltip.bs-tooltip-bottom .tooltip-arrow::before,
[data-bs-theme="dark"] .tooltip.bs-tooltip-start .tooltip-arrow::before,
[data-bs-theme="dark"] .tooltip.bs-tooltip-end .tooltip-arrow::before {
    border-color: #f8f9fa;
}

/* Loginpage in dark (la card era `background: white` hardcoded) */
[data-bs-theme="dark"] .login-card {
    
    color: var(--testo);
    box-shadow: var(--ombra-4);
}
[data-bs-theme="dark"] .login-header h2,
[data-bs-theme="dark"] .login-header h3 { color: var(--testo); }


/* Titoli h2/h3 in dark: visibilità */
[data-bs-theme="dark"] h1, [data-bs-theme="dark"] h2, [data-bs-theme="dark"] h3,
[data-bs-theme="dark"] h4, [data-bs-theme="dark"] h5, [data-bs-theme="dark"] h6 {
    color: var(--testo);
}

/* Link "Azzera" filtro (btn-link text-muted) */

/* Menu top user dropdown già gestito, ma il badge tenant */

/* Bootstrap-icons colorati inline (text-primary/success/…) — spesso servono ok
   ma su fondo scuro `text-primary` (var(--blu-500)) resta ok. Nessun override. */