/* ============================================================================
 * GESTIONALE A.C. — LAYER TEMA CHIARO  (css/theme.css)
 *
 * Additivo: si attiva solo con  <html data-theme="light">.
 * Il tema SCURO resta quello storico definito da style.css e dagli <style>
 * inline dei moduli: qui non lo tocchiamo.
 *
 * Palette CHIARA (massima leggibilità):
 *   - sfondo:            SEMPRE bianco  (#ffffff)
 *   - testo:             nero           (#000000)
 *   - bordi tabelle/campi: neri
 *   - titoli:            blu            (#0d47a1)
 *   - accent/link/bottoni primari: blu  (#0d47a1) con testo bianco
 *   - il testo dei pulsanti è comunque ricalcolato via JS in base al colore
 *     effettivo del pulsante (contrasto automatico).
 * ========================================================================== */

:root {
    --lt-bg:            #ffffff;
    --lt-text:          #000000;
    --lt-title:         #0d47a1;   /* blu titoli */
    --lt-primary:       #0d47a1;   /* blu accent */
    --lt-primary-strong:#09367a;
    --lt-border:        #000000;   /* bordi tabelle / campi */
    --lt-border-soft:   #555555;
    --lt-surface:       #ffffff;
    --lt-surface-2:     #eef1f6;   /* fasce header / hover leggeri */
    --lt-surface-3:     #e2e6ee;
    --lt-danger:        #c62828;
    --lt-success:       #2e7d32;
    --lt-warning:       #ff8f00;
}

/* ============================================================================
 * BOTTONE TOGGLE (sole/luna) — valido in ENTRAMBI i temi
 * ========================================================================== */
.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px; height: 38px;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 50%;
    color: #e6e6e6;
    cursor: pointer;
    padding: 0;
    flex-shrink: 0;
    transition: background .15s, transform .15s, border-color .15s;
}
.theme-toggle:hover { transform: rotate(18deg); background: rgba(255,255,255,.18); }
.theme-toggle svg { width: 19px; height: 19px; }
/* mostra "sole" nel tema scuro (per andare al chiaro) e "luna" nel chiaro */
[data-theme="dark"]  .theme-toggle .icon-moon { display: none; }
[data-theme="light"] .theme-toggle .icon-sun  { display: none; }

/* Toggle FLUTTANTE (pagine senza navbar: mobile, monitor…) */
.theme-toggle-float {
    position: fixed;
    right: 16px; bottom: 16px;
    width: 46px; height: 46px;
    z-index: 2147483000;
    background: #0d47a1;
    color: #fff;
    border: 2px solid #fff;
    box-shadow: 0 4px 14px rgba(0,0,0,.35);
}
.theme-toggle-float:hover { background: #09367a; }
[data-theme="light"] .theme-toggle-float {
    background: #ffffff; color: #0d47a1; border-color: #0d47a1;
}
.theme-toggle-float svg { width: 22px; height: 22px; }

/* ============================================================================
 * ↓↓↓  DA QUI IN GIÙ: SOLO TEMA CHIARO  (html[data-theme="light"])  ↓↓↓
 * ========================================================================== */

/* ---- Base: tutto bianco, testo nero -------------------------------------- */
html[data-theme="light"],
html[data-theme="light"] body {
    background: #ffffff !important;
    color: var(--lt-text) !important;
}
/* Neutralizza gradienti / immagini di sfondo scure (portale, mobile, monitor) */
html[data-theme="light"] body,
html[data-theme="light"] body.portal-body {
    background-image: none !important;
    background-color: #ffffff !important;
}

/* Testo generico -> nero. Senza !important così eventuali colori inline
   volutamente semantici (rossi/verdi) restano; i grigi chiari ereditano nero. */
html[data-theme="light"] body,
html[data-theme="light"] p,
html[data-theme="light"] li,
html[data-theme="light"] td,
html[data-theme="light"] label,
html[data-theme="light"] div,
html[data-theme="light"] span { color: var(--lt-text); }

/* Molti moduli forzano testo chiaro (#e0e0e0, #aaa, white) via <style>:
   qui lo riportiamo a nero in modo forte. */
html[data-theme="light"] p,
html[data-theme="light"] li,
html[data-theme="light"] label,
html[data-theme="light"] th,
html[data-theme="light"] td { color: var(--lt-text) !important; }

/* ---- Titoli: BLU --------------------------------------------------------- */
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] h5,
html[data-theme="light"] h6,
html[data-theme="light"] [class*="title" i],
html[data-theme="light"] [class*="-titolo" i],
html[data-theme="light"] legend {
    color: var(--lt-title) !important;
    /* per i titoli con testo a gradiente (background-clip:text) forziamo un
       colore pieno leggibile invece del gradiente chiaro */
    -webkit-text-fill-color: var(--lt-title) !important;
}
/* ...ma il text-fill NON deve colare sui figli del titolo (es. un bottone
   dentro la riga-titolo): lì lo riportiamo al proprio colore, altrimenti
   diventerebbe testo blu su bottone blu (invisibile). */
html[data-theme="light"] h1 *, html[data-theme="light"] h2 *,
html[data-theme="light"] h3 *, html[data-theme="light"] h4 *,
html[data-theme="light"] h5 *, html[data-theme="light"] h6 *,
html[data-theme="light"] legend *,
html[data-theme="light"] [class*="title" i] *,
html[data-theme="light"] [class*="-titolo" i] * {
    -webkit-text-fill-color: currentColor !important;
}

/* ---- Link: blu (affordance, resta ad alto contrasto) --------------------- */
html[data-theme="light"] a { color: var(--lt-primary); }
html[data-theme="light"] a:hover { color: var(--lt-primary-strong); }

/* ---- Tabelle: sfondo bianco, testo nero, BORDI NERI ---------------------- */
html[data-theme="light"] table {
    background: #ffffff !important;
    color: var(--lt-text) !important;
    border-color: var(--lt-border) !important;
}
html[data-theme="light"] table th,
html[data-theme="light"] table td {
    border-color: var(--lt-border) !important;
    background-color: transparent !important;
}
html[data-theme="light"] table thead,
html[data-theme="light"] table thead tr,
html[data-theme="light"] table thead th {
    background: var(--lt-surface-2) !important;
    color: var(--lt-title) !important;              /* intestazioni blu */
    border-color: var(--lt-border) !important;
}
html[data-theme="light"] table tbody td { color: var(--lt-text) !important; }
html[data-theme="light"] table tbody tr:nth-child(even) td { background: #f7f9fc !important; }
html[data-theme="light"] table tbody tr:hover td { background: var(--lt-surface-3) !important; }

/* ---- Card / sezioni / box / contenitori: bianco + bordo scuro ------------ */
html[data-theme="light"] .card,
html[data-theme="light"] [class*="card" i]:not([class*="badge" i]):not([class*="-head" i]),
html[data-theme="light"] [class*="-section" i],
html[data-theme="light"] [class*="sezione" i],
html[data-theme="light"] [class*="riquadro" i],
html[data-theme="light"] [class*="pannello" i],
html[data-theme="light"] [class*="blocco" i],
html[data-theme="light"] [class*="-box" i]:not(.login-box):not([class*="combo" i]):not([class*="search" i]),
html[data-theme="light"] [class*="-panel" i],
html[data-theme="light"] [class*="kpi" i],
html[data-theme="light"] [class*="tile" i],
html[data-theme="light"] [class*="widget" i],
html[data-theme="light"] [class*="riepilogo" i],
html[data-theme="light"] [class*="metric" i],
html[data-theme="light"] [class*="-stat" i],
html[data-theme="light"] [class*="-wrap" i],
html[data-theme="light"] [class*="tbl-wrap" i],
html[data-theme="light"] [class*="table-container" i],
html[data-theme="light"] [class*="-container" i] {
    background-color: var(--lt-surface) !important;
    border-color: var(--lt-border-soft) !important;
    color: var(--lt-text);
}

/* Sezioni collassabili <details>/<summary> con fondo scuro inline */
html[data-theme="light"] details[class*="sezione" i],
html[data-theme="light"] details[class*="-section" i] {
    background-color: var(--lt-surface) !important;
    border: 1px solid var(--lt-border-soft) !important;
}

/* Fasce header (band) leggermente grigie */
html[data-theme="light"] [class*="-head" i]:not(body):not(html),
html[data-theme="light"] [class*="-header" i]:not(body):not(html) {
    background-color: var(--lt-surface-2) !important;
    color: var(--lt-text) !important;
    border-color: var(--lt-border-soft) !important;
}
html[data-theme="light"] [class*="-head" i] h1,
html[data-theme="light"] [class*="-head" i] h2,
html[data-theme="light"] [class*="-head" i] h3,
html[data-theme="light"] [class*="-header" i] h1,
html[data-theme="light"] [class*="-header" i] h2,
html[data-theme="light"] [class*="-header" i] h3 { color: var(--lt-title) !important; }

/* ---- Campi form: bianco, testo nero, bordo nero -------------------------- */
html[data-theme="light"] input:not([type="range"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="submit"]):not([type="button"]),
html[data-theme="light"] select,
html[data-theme="light"] textarea {
    background: #ffffff !important;
    color: var(--lt-text) !important;
    border: 1px solid var(--lt-border) !important;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder { color: #666 !important; }
/* File input (pagine di import CSV/XLSX): da barra scura a chiara */
html[data-theme="light"] input[type="file"] {
    background: #ffffff !important;
    color: #000 !important;
    border: 1px solid var(--lt-border) !important;
}
html[data-theme="light"] input[type="file"]::file-selector-button {
    background: var(--lt-primary) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 5px !important;
    padding: 6px 12px !important;
    margin-right: 10px !important;
    cursor: pointer !important;
}
html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus {
    outline: none;
    border-color: var(--lt-primary) !important;
    box-shadow: 0 0 0 3px rgba(13,71,161,.20) !important;
}

/* ---- Modali / popup / overlay ------------------------------------------- */
html[data-theme="light"] [class*="overlay" i]:not(.theme-toggle) {
    background-color: rgba(0,0,0,.45) !important;
}
html[data-theme="light"] [class*="modal" i][class*="content" i],
html[data-theme="light"] [class*="modal-box" i],
html[data-theme="light"] [class*="modal-body" i],
html[data-theme="light"] [class*="popup-box" i],
html[data-theme="light"] [class*="popup-content" i],
html[data-theme="light"] [class*="dialog" i] {
    background: #ffffff !important;
    border: 1px solid var(--lt-border) !important;
    color: var(--lt-text) !important;
}

/* Modali del modulo Letture Esattori (#le-modal / #tg-modal): hanno backdrop
   e box con stile inline senza classe (esclusi dal neutralizzatore JS).
   Il backdrop resta un velo scuro; il box diventa bianco opaco, testo scuro. */
html[data-theme="light"] #le-modal,
html[data-theme="light"] #tg-modal {
    background: rgba(0,0,0,.55) !important;
}
html[data-theme="light"] #le-modal > div,
html[data-theme="light"] #tg-modal > div {
    background: #ffffff !important;
    border-color: #cccccc !important;
    color: #111 !important;
    box-shadow: 0 12px 42px rgba(0,0,0,.30) !important;
}
html[data-theme="light"] #le-modal-esatt {
    color: #111 !important; -webkit-text-fill-color: #111 !important;
}
html[data-theme="light"] #le-modal-stato {
    color: #555 !important; -webkit-text-fill-color: #555 !important;
}
/* pulsante "Chiudi" (fondo trasparente) -> testo/bordo scuri sul box bianco */
html[data-theme="light"] #le-modal button[style*="transparent" i],
html[data-theme="light"] #tg-modal button[style*="transparent" i] {
    color: #333 !important; -webkit-text-fill-color: #333 !important;
    border-color: #999 !important;
}
/* riquadri interni scuri (es. link generato #111) -> chiari */
html[data-theme="light"] #le-modal [style*="background:#111" i],
html[data-theme="light"] #tg-modal [style*="background:#111" i] {
    background: #f4f6f9 !important;
    color: #111 !important; -webkit-text-fill-color: #111 !important;
}

/* ---- Barre filtri / tab -------------------------------------------------- */
html[data-theme="light"] [class*="-filters" i],
html[data-theme="light"] [class*="-filter-bar" i],
html[data-theme="light"] [class*="filter-group" i],
html[data-theme="light"] [class*="-tabs" i],
html[data-theme="light"] [class*="toolbar" i] {
    background-color: var(--lt-surface-2) !important;
    border-color: var(--lt-border-soft) !important;
    color: var(--lt-text) !important;
}
/* tab / filtri NON attivi */
html[data-theme="light"] [class*="-tab" i]:not([class*="-tabs" i]):not(.active),
html[data-theme="light"] [class*="btn-filter" i]:not(.active) {
    background: #ffffff !important;
    color: var(--lt-text) !important;
    border-color: var(--lt-border-soft) !important;
}
/* tab / filtri ATTIVI -> blu, testo bianco */
html[data-theme="light"] [class*="-tab" i].active,
html[data-theme="light"] [class*="btn-filter" i].active {
    background: var(--lt-primary) !important;
    color: #ffffff !important;
    border-color: var(--lt-primary-strong) !important;
}

/* Controlli SEGMENTATI / pill / chip (es. .st > a in Schede: Esercizio/Magazzino/
   Disponibili). Non-attivi -> bianco con bordo; attivi -> blu. */
html[data-theme="light"] .st a,
html[data-theme="light"] [class*="segment" i] a,
html[data-theme="light"] [class*="seg-" i],
html[data-theme="light"] [class*="pill" i]:not(.active):not(.on),
html[data-theme="light"] [class*="chip" i]:not(.active):not(.on) {
    background: #ffffff !important;
    color: #000 !important;
    border: 1px solid var(--lt-border-soft) !important;
}
html[data-theme="light"] .st a.active,
html[data-theme="light"] .st a.on,
html[data-theme="light"] [class*="segment" i] a.active,
html[data-theme="light"] [class*="pill" i].active,
html[data-theme="light"] [class*="pill" i].on,
html[data-theme="light"] [class*="chip" i].active {
    background: var(--lt-primary) !important;
    color: #ffffff !important;
    border-color: var(--lt-primary-strong) !important;
}

/* ---- Bottoni: default blu; il testo lo rifinisce il JS (contrasto auto) --- */
html[data-theme="light"] button:not(.theme-toggle):not([style*="background" i]):not([class*="danger" i]):not([class*="delete" i]):not([class*="success" i]):not([class*="warn" i]):not([class*="filter" i]):not([class*="tab" i]),
html[data-theme="light"] .btn:not(.theme-toggle):not([style*="background" i]):not([class*="danger" i]):not([class*="success" i]):not([class*="warn" i]),
html[data-theme="light"] input[type="submit"]:not([style*="background" i]),
html[data-theme="light"] input[type="button"]:not([style*="background" i]) {
    background: var(--lt-primary) !important;
    border: 1px solid var(--lt-primary-strong) !important;
}
/* bottoni semantici per classe */
html[data-theme="light"] [class*="danger" i].btn,
html[data-theme="light"] button[class*="danger" i],
html[data-theme="light"] button[class*="delete" i],
html[data-theme="light"] [class*="btn-elimina" i] { background: var(--lt-danger) !important; border-color: var(--lt-danger) !important; }
html[data-theme="light"] [class*="success" i].btn,
html[data-theme="light"] button[class*="success" i],
html[data-theme="light"] [class*="btn-salva" i] { background: var(--lt-success) !important; border-color: var(--lt-success) !important; }
html[data-theme="light"] [class*="warn" i].btn,
html[data-theme="light"] button[class*="warn" i] { background: var(--lt-warning) !important; border-color: var(--lt-warning) !important; }

/* ---- Calendario ferie (Turni): caselle-giorno scure -> chiare ------------ */
html[data-theme="light"] .giorno-feria {
    background: #f1f3f6 !important;
    color: #000 !important;
    border: 1px solid var(--lt-border-soft) !important;
}
html[data-theme="light"] .giorno-feria.sabato,
html[data-theme="light"] .giorno-feria.domenica {
    background: #dfe3ea !important;
    color: #333 !important;
}
html[data-theme="light"] .giorno-feria.feria-on {
    background: rgba(245,158,11,.40) !important;
    color: #7a4a00 !important;
    border-color: #b45309 !important;
}

/* ---- Banner di avviso (alert/banner/avviso): testo leggibile su tinta chiara */
html[data-theme="light"] [class*="alert" i],
html[data-theme="light"] [class*="banner" i],
html[data-theme="light"] [class*="avviso" i] { color: #111 !important; }
html[data-theme="light"] [class*="alert" i] *:not(a):not([class*="badge" i]):not([class*="pill" i]),
html[data-theme="light"] [class*="banner" i] *:not(a):not([class*="badge" i]):not([class*="pill" i]),
html[data-theme="light"] [class*="avviso" i] *:not(a):not([class*="badge" i]):not([class*="pill" i]) { color: #111 !important; }
html[data-theme="light"] [class*="alert" i] a,
html[data-theme="light"] [class*="banner" i] a { color: var(--lt-primary) !important; font-weight: 600; }

/* ---- Heatmap Confronto Ammanchi (griglia scura -> chiara) ----------------- */
/* intestazioni mesi e nomi: fondo chiaro, testo scuro */
html[data-theme="light"] .ca-hm .hm-h,
html[data-theme="light"] .ca-hm .hm-l {
    background: var(--lt-surface-2) !important;
    color: #111 !important;
    -webkit-text-fill-color: #111 !important;
    border-color: var(--lt-border-soft) !important;
}
/* celle VUOTE (fondo scuro pieno inline #181818/#1a1a1a) -> bianche.
   Le celle-VALORE usano invece rgba(...) della scala e restano colorate. */
html[data-theme="light"] .ca-hm .hm-c:not([style*="background" i]):not([style*="rgb" i]),
html[data-theme="light"] .ca-hm .hm-c[style*="#181818" i],
html[data-theme="light"] .ca-hm .hm-c[style*="#1a1a1a" i],
html[data-theme="light"] .ca-hm .hm-c[style*="#222" i] {
    background: #fafbfc !important;
    border-color: #e5e7eb !important;
}
/* testo delle celle-valore leggibile (le celle colorate della scala sono
   chiare/medie: testo scuro) */
html[data-theme="light"] .ca-hm .hm-c {
    color: #111 !important;
    -webkit-text-fill-color: #111 !important;
    border-color: #e5e7eb !important;
}

/* ---- Badge di priorità Ticket (fondo scuro -> colori pieni leggibili) ----- */
html[data-theme="light"] .tk-prio { color: #fff !important; }
html[data-theme="light"] .p-urgente { background: #c62828 !important; color: #fff !important; }
html[data-theme="light"] .p-alta    { background: #ef6c00 !important; color: #fff !important; }
html[data-theme="light"] .p-media   { background: #f9a825 !important; color: #000 !important; }
html[data-theme="light"] .p-bassa   { background: #2e7d32 !important; color: #fff !important; }

/* ---- NAVBAR del portale (override degli <style> inline di index.php) ------ */
html[data-theme="light"] .navbar { background: #ffffff !important; border-bottom: 2px solid var(--lt-border) !important; }
html[data-theme="light"] .nav-link { color: #222 !important; }
html[data-theme="light"] .nav-link:hover,
html[data-theme="light"] .nav-item:hover > .nav-link { color: #000 !important; background: var(--lt-surface-2) !important; border-color: var(--lt-border-soft) !important; }
html[data-theme="light"] .nav-link.active,
html[data-theme="light"] .nav-link.group-active { color: var(--lt-primary) !important; background: rgba(13,71,161,.10) !important; border-color: var(--lt-primary) !important; }
html[data-theme="light"] .nav-dropdown-inner { background: #ffffff !important; border-color: var(--lt-border) !important; box-shadow: 0 8px 24px rgba(0,0,0,.20) !important; }
html[data-theme="light"] .nav-dd-link { color: #222 !important; }
html[data-theme="light"] .nav-dd-link:hover { color: #000 !important; background: var(--lt-surface-2) !important; }
html[data-theme="light"] .nav-dd-link.active { color: var(--lt-primary) !important; background: rgba(13,71,161,.10) !important; }
html[data-theme="light"] .nav-separator { background: var(--lt-border-soft) !important; }
html[data-theme="light"] .user-name { color: #222 !important; }
html[data-theme="light"] .user-name b { color: var(--lt-primary) !important; }
html[data-theme="light"] .btn-logout { color: var(--lt-danger) !important; border-color: var(--lt-danger) !important; }
html[data-theme="light"] .btn-logout:hover { background: var(--lt-danger) !important; color: #fff !important; }
/* toggle nella navbar / login: bordo scuro e testo nero quando siamo in chiaro */
html[data-theme="light"] .navbar .theme-toggle,
html[data-theme="light"] .login-toggle { background: var(--lt-surface-2); border-color: var(--lt-border-soft); color: #000; }

/* ---- Footer -------------------------------------------------------------- */
html[data-theme="light"] footer {
    background: #ffffff !important;
    color: #333 !important;
    border-top: 1px solid var(--lt-border-soft) !important;
}

/* ---- Card di stato "home" e messaggi (usano bg inline scuri) ------------- */
html[data-theme="light"] .card[style] { background: #ffffff !important; }

/* ---- hr / divisori ------------------------------------------------------- */
html[data-theme="light"] hr { border-color: var(--lt-border-soft) !important; }

/* ---- Schermata di LOGIN (box scuro inline -> bianco) --------------------- */
html[data-theme="light"] .login-box {
    background: #ffffff !important;
    border: 1px solid var(--lt-border) !important;
    box-shadow: 0 10px 34px rgba(0,0,0,.18) !important;
}
html[data-theme="light"] .login-box h2 { color: var(--lt-title) !important; }
html[data-theme="light"] .login-box input {
    background: #ffffff !important;
    color: #000 !important;
    border: 1px solid var(--lt-border) !important;
}
html[data-theme="light"] .login-box button {
    background: var(--lt-primary) !important;
    color: #fff !important;
}
html[data-theme="light"] .login-box button:hover { background: var(--lt-primary-strong) !important; }
