/* ===========================================
   WAVECOM INTRANET - TEMA "DESK" (2026-10-25)
   Allinea l'intranet allo stile di desk.wavecom.it: tema sobrio e compatto, angoli 3-4 px,
   bordi sottili al posto delle ombre, blu istituzionale per le azioni principali,
   pulsanti secondari a contorno, menu laterale scuro a gruppi.
   Livello sopra common/stile.css (caricato dopo, da app/templates/header.php e bb_top.asp):
   per tornare allo stile precedente basta togliere il <link> a questo file e lo <script> js/tema.js.
   =========================================== */
:root {
    --primary: #1f4e8c;
    --primary-dark: #173d6e;
    --primary-light: #eaf0f8;
    --accent: #1e7a4c;
    --danger: #b42318;
    --warning: #b54708;
    --gray-50: #f6f7f9;
    --gray-100: #eceff3;
    --gray-200: #dfe3e8;
    --gray-300: #c5ccd6;
    --gray-500: #66707d;
    --gray-700: #39424e;
    --gray-900: #1b2129;
    --white: #ffffff;
    --shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
    --radius: 4px;
    --radius-sm: 3px;
    --transition: 0.15s ease;
    --sidebar: 220px;
    --sidebar-bg: #17202c;
    --testata: 56px;
}

html, body {
    font-size: 14px;
}

body {
    font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', Arial, sans-serif;
    background-color: var(--gray-50);
    color: var(--gray-900);
    line-height: 1.45;
    -webkit-font-smoothing: antialiased;
}

a, a:visited { color: var(--primary); }
a:hover { color: var(--primary-dark); }

/* ---------- Struttura ---------- */
.tabStruttura,
.tabStrutturaPagina {
    background: var(--gray-50);
}

.tabStrutturaMenuSX {
    width: var(--sidebar);
    min-width: var(--sidebar);
    background: var(--sidebar-bg);
    overflow-y: auto;
}

/* testata del menu: fascia bianca con il logo, filetto blu (come desk) */
.tabStrutturaMenuSX > div:first-child {
    height: var(--testata);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 1rem !important;
    background: var(--white);
    border-bottom: 3px solid var(--primary) !important;
}
.tabStrutturaMenuSX > div:first-child img {
    filter: none !important;
    max-width: 150px !important;
    max-height: 40px;
    width: auto;
}

/* barra in alto */
.pulsantiTop {
    border-bottom: 1px solid var(--gray-200);
    height: var(--testata);
}
.pulsantiTop table { height: var(--testata); }
.pulsantiTop td {
    padding: 0 1.25rem;
    color: var(--gray-900);
}
.pulsantiTop strong { font-weight: 600; color: var(--gray-900) !important; }
.pulsantiTop span { color: var(--gray-500) !important; }
.pulsantiTop a[href*="logout"] {
    display: inline-block;
    padding: 0.25rem 0.65rem;
    border: 1px solid var(--gray-300);
    border-radius: var(--radius-sm);
    color: var(--gray-700) !important;
    font-size: 0.8rem !important;
    font-weight: 600;
    text-decoration: none;
    transition: border-color var(--transition), color var(--transition);
}
.pulsantiTop a[href*="logout"]:hover {
    border-color: var(--danger);
    color: var(--danger) !important;
}
.hamburger-btn span { background-color: var(--gray-700); }

/* ---------- Menu laterale a gruppi (js/tema.js: click apre/chiude il gruppo) ---------- */
.suckerdiv,
.suckerdiv ul,
.suckerdiv ul li {
    background: transparent !important;
    border: none !important;
}
.suckerdiv { padding: 0.5rem 0; }

/* voce principale = testa di gruppo */
.suckerdiv > ul > li > a,
.suckerdiv > ul > li > a:visited {
    display: flex;
    align-items: center;
    padding: 0.5rem 1rem !important;
    background: transparent !important;
    color: rgba(255, 255, 255, 0.88) !important;
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: background var(--transition), color var(--transition);
}
.suckerdiv > ul > li > a:hover {
    background: rgba(255, 255, 255, 0.05) !important;
    color: var(--white) !important;
    text-decoration: none !important;
}
.suckerdiv > ul > li + li {
    margin-top: 0.15rem;
    padding-top: 0.15rem;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
}

/* freccia del gruppo */
.suckerdiv .subfolderstyle::after {
    content: "" !important;
    position: static !important;
    margin: 0 0 0 auto !important;
    width: 6px;
    height: 6px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(-45deg);
    transition: transform var(--transition);
    opacity: 0.55;
}
.suckerdiv li.aperto > .subfolderstyle::after { transform: rotate(45deg); }

/* voci del gruppo: sotto la testa, non piu' a comparsa laterale */
.suckerdiv ul li ul {
    position: static !important;
    width: auto !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding-bottom: 0.25rem;
}
.suckerdiv ul li ul li { background: transparent !important; }
.suckerdiv ul li ul li a,
.suckerdiv ul li ul li a:link,
.suckerdiv ul li ul li a:visited {
    display: block;
    padding: 0.36rem 1rem 0.36rem 1.9rem !important;
    background: transparent !important;
    color: rgba(255, 255, 255, 0.68) !important;
    font-size: 0.88rem !important;
    font-weight: 400 !important;
    text-transform: none;
    letter-spacing: 0;
}
.suckerdiv ul li ul li a:hover,
.suckerdiv ul li ul li a.attivo {
    background: rgba(255, 255, 255, 0.07) !important;
    color: var(--white) !important;
    text-decoration: none !important;
}
.suckerdiv a.attivo { box-shadow: inset 3px 0 0 #6c9ad8; }

/* ---------- Titoli ---------- */
.titolopagina,
.titoloPagina {
    display: block;
    width: auto;
    margin: 0 0 0.9rem 0;
    padding: 0;
    border: none;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--gray-900);
    text-align: left;
}
.titoloPagina center { text-align: left; }
.titoloPagina b { font-weight: 600; }

/* ---------- Card ---------- */
.card,
.form-card,
.azioni-card {
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 1rem 1.1rem;
    margin-bottom: 0.9rem;
}
.form-card-title,
.azioni-card h3 {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--gray-900);
    margin: 0 0 0.75rem 0;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--gray-200);
    text-transform: none;
    letter-spacing: 0;
}

/* ---------- Form ---------- */
.form-group label {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--gray-700);
    margin-bottom: 0.25rem;
}
.form-group input[type="text"],
.form-group input[type="password"],
.form-group input[type="email"],
.form-group input[type="number"],
.form-group input[type="date"],
.form-group input[type="time"],
.form-group select,
.form-group textarea,
.form-control {
    padding: 0.42rem 0.6rem;
    border: 1px solid var(--gray-300);
    border-radius: var(--radius-sm);
    font-family: inherit;
    font-size: 0.95rem;
    color: var(--gray-900);
    background-color: var(--white);
    transition: border-color var(--transition), box-shadow var(--transition);
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus,
.form-control:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 2px rgba(31, 78, 140, 0.15);
}
.form-group input::placeholder,
.form-group textarea::placeholder { color: #9aa3ae; }
.form-info-display {
    padding: 0.42rem 0.6rem;
    background-color: var(--gray-50);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius-sm);
    color: var(--gray-900);
    font-size: 0.95rem;
}
.form-actions {
    border-top: 1px solid var(--gray-100);
    padding-top: 0.85rem;
    margin-top: 0.9rem;
}

/* ---------- Pulsanti: pieno per l'azione principale, a contorno per le secondarie ---------- */
.btn,
input[type="button"],
input[type="submit"],
input[type="reset"],
button,
.form-actions .btn {
    padding: 0.42rem 0.9rem;
    font-family: inherit;
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.3;
    background-color: var(--primary);
    border: 1px solid var(--primary);
    border-radius: var(--radius-sm);
    transition: background var(--transition), border-color var(--transition), color var(--transition);
}
.btn:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
button:hover,
.form-actions .btn:hover,
.btnOver {
    background-color: var(--primary-dark);
    border-color: var(--primary-dark);
}
.btn:disabled, button:disabled, input:disabled[type="submit"] { opacity: 0.55; cursor: not-allowed; }

.btn-action,
.azioni-buttons .btn-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.42rem 0.9rem;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.3;
    text-decoration: none !important;
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--transition), border-color var(--transition), color var(--transition);
}
.btn-primary, .azioni-buttons .btn-primary {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: var(--white) !important;
}
.btn-primary:hover, .azioni-buttons .btn-primary:hover {
    background-color: var(--primary-dark) !important;
    border-color: var(--primary-dark) !important;
}
.btn-secondary, .azioni-buttons .btn-secondary {
    background-color: var(--white) !important;
    border-color: var(--gray-300) !important;
    color: var(--gray-700) !important;
}
.btn-secondary:hover, .azioni-buttons .btn-secondary:hover {
    background-color: var(--gray-50) !important;
    border-color: #aab3bf !important;
    color: var(--gray-900) !important;
}
.btn-danger, .azioni-buttons .btn-danger {
    background-color: var(--danger) !important;
    border-color: var(--danger) !important;
    color: var(--white) !important;
}
.btn-danger:hover, .azioni-buttons .btn-danger:hover {
    background-color: #912018 !important;
    border-color: #912018 !important;
}
.btn-warning, .azioni-buttons .btn-warning {
    background-color: var(--white) !important;
    border-color: #d8b47a !important;
    color: #8a4f00 !important;
}
.btn-warning:hover, .azioni-buttons .btn-warning:hover { background-color: #fdf6ec !important; }
.btn-success, .azioni-buttons .btn-success {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
    color: var(--white) !important;
}
.btn-success:hover, .azioni-buttons .btn-success:hover { background-color: #17613c !important; }

/* pulsanti icona / testo che non devono diventare blu */
.hamburger-btn,
.hamburger-btn:hover,
.tag-badge .tag-remove,
.tag-badge .tag-remove:hover {
    background: none !important;
    border: none !important;
}

/* ---------- Tabelle ---------- */
.tabella table {
    background-color: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
}
.tabella th {
    background-color: var(--gray-50);
    color: var(--gray-500);
    padding: 0.5rem 0.6rem;
    border-bottom: 1px solid var(--gray-200) !important;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.tabella th a, .tabella th a:visited { color: var(--gray-500); }
.tabella td {
    padding: 0.42rem 0.6rem;
    border-bottom: 1px solid var(--gray-100);
    color: var(--gray-900);
    font-size: 0.875rem;
}
.tabella .pari, .tabella tr.pari td, .pari { background-color: #fafbfc; color: var(--gray-900); }
.tabella .disp, .tabella tr.disp td, .disp { background-color: var(--white); color: var(--gray-900); }
.tabella tr:hover td,
.tabella .rigaON, .rigaON { background-color: var(--primary-light) !important; }

/* ---------- Messaggi ---------- */
.msgErrore, .msgSuccesso, .msgAvviso {
    padding: 0.55rem 0.8rem;
    border: 1px solid transparent;
    border-left-width: 3px;
    border-radius: var(--radius-sm);
    font-size: 0.875rem;
    margin: 0 0 0.85rem 0;
}
.msgErrore { background: #fdf2f1; color: #8c1d14; border-color: #f3cdc9; border-left-color: var(--danger); }
.msgSuccesso { background: #f0f8f3; color: #155c37; border-color: #c9e6d4; border-left-color: var(--accent); }
.msgAvviso { background: #fdf6ec; color: #7a4500; border-color: #f0dcbc; border-left-color: var(--warning); }

/* ---------- Badge: etichette rettangolari, colori tenui ---------- */
.badge {
    padding: 0.08rem 0.42rem;
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.5;
}
.badge-success { background: #eef7f1; color: #155c37; border-color: #cfe8da; }
.badge-danger { background: #fdf2f1; color: #8c1d14; border-color: #f3cdc9; }
.badge-warning { background: #fdf6ec; color: #7a4500; border-color: #f0dcbc; }
.badge-info { background: #eef3fa; color: #1f4e8c; border-color: #d3e0f1; }

/* ---------- Login ---------- */
.login-page {
    background: var(--gray-100);
    border-top: 4px solid var(--primary);
}
.login-box {
    border: 1px solid var(--gray-200);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}
.login-title { color: var(--primary); }

@media screen and (max-width: 768px) {
    .tabStrutturaMenuSX { width: 260px !important; }
    .pulsantiTop td { padding: 0 0.75rem; }
}

/* ---------- Contatori (come stat-card di desk) ---------- */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}
.stat-card {
    display: block;
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-left: 3px solid var(--primary);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 0.75rem 1rem;
    color: var(--gray-900) !important;
    text-decoration: none !important;
    transition: border-color var(--transition), box-shadow var(--transition);
}
.stat-card:hover { box-shadow: 0 2px 6px rgba(16, 24, 40, 0.08); }
.stat-card .stat-label {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--gray-500);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.stat-card .stat-value {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--gray-900);
    margin-top: 0.1rem;
}

/* ---------- Intestazioni di tabella scure definite nelle singole pagine -> stile tema ---------- */
th[style*="background:#334155"],
th[style*="background:#0f172a"],
th[style*="background:#1e293b"],
th[style*="background-color:#1a365d"],
.anag-table th,
.apparati-table th,
.mod-table th,
.offerte-table th,
table.griglia th {
    background: var(--gray-50) !important;
    color: var(--gray-500) !important;
    font-size: 0.72rem !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--gray-200) !important;
}

/* ---------- Pulsanti con colori accesi scritti nelle pagine -> palette del tema ---------- */
:is(button, a, input)[style*="background:#2563eb"],
:is(button, a, input)[style*="background:#1d4ed8"],
:is(button, a, input)[style*="background:#3b82f6"],
:is(button, a, input)[style*="background:#0284c7"],
:is(button, a, input)[style*="background:#0891b2"] {
    background: var(--primary) !important;
    border: 1px solid var(--primary) !important;
    color: var(--white) !important;
    border-radius: var(--radius-sm) !important;
}
:is(button, a, input)[style*="background:#64748b"],
:is(button, a, input)[style*="background:#6b7280"] {
    background: var(--white) !important;
    border: 1px solid var(--gray-300) !important;
    color: var(--gray-700) !important;
    border-radius: var(--radius-sm) !important;
}
:is(button, a, input)[style*="background:#059669"],
:is(button, a, input)[style*="background:#16a34a"] {
    background: var(--accent) !important;
    border: 1px solid var(--accent) !important;
    color: var(--white) !important;
    border-radius: var(--radius-sm) !important;
}
:is(button, a, input)[style*="background:#dc2626"] {
    background: var(--danger) !important;
    border: 1px solid var(--danger) !important;
    color: var(--white) !important;
    border-radius: var(--radius-sm) !important;
}
:is(button, a, input)[style*="background:#7c3aed"] {
    background: #5b3f9e !important;
    border: 1px solid #5b3f9e !important;
    color: var(--white) !important;
    border-radius: var(--radius-sm) !important;
}

/* ---------- Testata e tab della scheda cliente ---------- */
.scheda-testata {
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-radius: var(--radius) var(--radius) 0 0;
    padding: 0.85rem 1.1rem;
}
.scheda-testata .scheda-nome { font-size: 1.25rem; font-weight: 600; color: var(--gray-900); }
.scheda-testata .scheda-codice { margin-left: 0.75rem; color: var(--gray-500); font-size: 0.9rem; }
.scheda-testata .scheda-dati { display: flex; gap: 0.75rem; align-items: center; font-size: 0.85rem; color: var(--gray-700); }
.scheda-tab {
    background: var(--white);
    border: 1px solid var(--gray-200);
    border-top: none;
    border-radius: 0 0 var(--radius) var(--radius);
    padding: 0 1.1rem;
    margin-bottom: 0.9rem;
    display: flex;
    overflow-x: auto;
}
.scheda-tab a {
    padding: 0.7rem 1rem;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--gray-500) !important;
    text-decoration: none !important;
    border-bottom: 2px solid transparent;
    white-space: nowrap;
    transition: color var(--transition), border-color var(--transition);
}
.scheda-tab a:hover { color: var(--gray-900) !important; border-bottom-color: var(--gray-300); }
.scheda-tab a.attivo { color: var(--primary) !important; border-bottom-color: var(--primary); }