/*
 * TEMA ITALMATIC — stile da docs/stile/Italmatic_Stile_Portabile.md (anteprima:
 * docs/stile/Italmatic_Anteprima_Token.html).
 *
 * Si carica DOPO tema_moderno.css (e, nell'area clienti, dopo tema_moderno_cliente.css), solo
 * quando in Setup -> Generale -> Aspetto grafico e' scelto "Italmatic" (o con ?stile=italmatic).
 * Il <body> ha le classi "tema-moderno tema-italmatic": la struttura (menu riducibile, filtri,
 * ricerca rapida...) e' quella del tema moderno, qui cambiano solo colori e forme.
 *
 * Regole della guida applicate:
 *  - nessun border-radius (tondi solo pallini, avatar, bandierine e radio), nessuna ombra;
 *  - verde #009972 come accento, non come fondo; superfici scure solo nella barra laterale;
 *  - colore = stato: verde ok, ambra avviso, rosso allarme; il resto neutro;
 *  - Ubuntu 300/400/700; etichette, pulsanti e intestazioni di tabella in maiuscolo con tracking;
 *  - token --c-* (canali RGB) e nessun esadecimale fuori da questo blocco.
 * Tema solo chiaro per ora: i token del tema scuro ci sono gia' nella guida (sezione 2).
 */

body.tema-italmatic {
    --c-page: 245 245 245;   --c-card: 255 255 255;   --c-value: 245 245 245;
    --c-primary: 0 153 114;  --c-primary-dark: 0 122 90;
    --c-amber: 240 170 0;    --c-gold: 186 162 103;   --c-alarm: 204 51 51;
    --c-ok: 227 241 236;     --c-ok-text: 0 105 79;
    --c-warn: 252 240 213;   --c-warn-text: 138 99 0;
    --c-ink: 26 26 26;       --c-body: 51 51 51;      --c-muted: 153 153 153;
    --c-line: 232 232 232;
    --c-sidebar: 26 26 26;   --c-panel-text: 232 232 232; --c-panel-muted: 143 143 143;

    /* il tema moderno legge queste variabili: mapparle sui token cambia gia' quasi tutto */
    --tm-bg: rgb(var(--c-page));
    --tm-card: rgb(var(--c-card));
    --tm-text: rgb(var(--c-ink));
    --tm-text-2: rgb(var(--c-body));
    --tm-muted: rgb(var(--c-muted));
    --tm-line: rgb(var(--c-line));
    --tm-line-2: rgb(var(--c-line));
    --tm-hover: rgb(var(--c-value));
    --tm-accent: rgb(var(--c-primary));
    --tm-accent-hover: rgb(var(--c-primary-dark));
    --tm-accent-soft: rgb(var(--c-ok));
    --tm-accent-line: rgb(var(--c-primary));
    --tm-accent-shadow: transparent;
    --tm-ok: rgb(var(--c-primary));
    --tm-ok-soft: rgb(var(--c-ok));
    --tm-ok-line: rgb(var(--c-primary));
    --tm-ko: rgb(var(--c-alarm));
    --tm-ko-soft: rgb(var(--c-alarm) / .08);
    --tm-ko-line: rgb(var(--c-alarm));
    --tm-warn: rgb(var(--c-warn-text));
    --tm-warn-bg: rgb(var(--c-amber));
    --tm-warn-soft: rgb(var(--c-warn));
    --tm-warn-line: rgb(var(--c-amber));
    --tm-info: rgb(var(--c-body));
    --tm-info-soft: rgb(var(--c-value));
    --tm-info-line: rgb(var(--c-line));
    --tm-neutral-soft: rgb(var(--c-value));
    --tm-radius: 0;
    --tm-radius-sm: 0;
    --tm-shadow: none;
    --tm-shadow-lg: none;
    --color-active: rgb(var(--c-primary));
    --color-completed: rgb(var(--c-primary-dark));

    font-family: Ubuntu, 'Segoe UI', Roboto, system-ui, sans-serif;
    font-weight: 300;
    background: rgb(var(--c-page));
    color: rgb(var(--c-body));
}
html:has(body.tema-italmatic) { background: rgb(245 245 245); }

/* ================================================================ forme: spigoli vivi, niente ombre */
body.tema-italmatic *,
body.tema-italmatic *::before,
body.tema-italmatic *::after {
    border-radius: 0 !important;
    box-shadow: none !important;
    text-shadow: none !important;
}
/* restano tondi solo: pallini, avatar, bandierine della lingua, radio */
body.tema-italmatic .rounded-circle,
body.tema-italmatic .user-avatar,
body.tema-italmatic a.languageswitcher img,
body.tema-italmatic .languageswitcher img,
body.tema-italmatic .custom-radio .custom-control-label::before,
body.tema-italmatic .custom-radio .custom-control-label::after,
body.tema-italmatic .profile-card-4 img,
body.tema-italmatic .dot { border-radius: 9999px !important; }
/* niente "salto" dei pulsanti al passaggio del mouse */
body.tema-italmatic .btn:hover { transform: none !important; }

/* ================================================================ tipografia */
body.tema-italmatic b, body.tema-italmatic strong, body.tema-italmatic .font-weight-bold { font-weight: 700 !important; }
body.tema-italmatic h1, body.tema-italmatic h2, body.tema-italmatic h3,
body.tema-italmatic h4, body.tema-italmatic h5 { font-weight: 300; color: rgb(var(--c-ink)); letter-spacing: 0; }
body.tema-italmatic .page-header .page-title,
body.tema-italmatic h1.heading { font-weight: 300 !important; font-size: 1.6rem; color: rgb(var(--c-ink)); letter-spacing: 0; }
/* titoli di pannello: 11 px maiuscolo, 700, filetto verde sotto (".section-title" della guida) */
body.tema-italmatic h6,
body.tema-italmatic .card-header h6,
body.tema-italmatic .page-header .page-subtitle {
    font-size: 11px;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: rgb(var(--c-ink));
}
body.tema-italmatic .card-header h6 {
    display: inline-block;
    padding-bottom: 8px;
    margin-bottom: 0;
    border-bottom: 2px solid rgb(var(--c-primary));
}
/* etichette (".lbl" della guida) */
body.tema-italmatic label,
body.tema-italmatic .col-form-label,
body.tema-italmatic .table thead th,
body.tema-italmatic .table tfoot th {
    font-size: 11px !important;
    font-weight: 400 !important;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: rgb(var(--c-muted)) !important;
}
body.tema-italmatic .form-check-label,
body.tema-italmatic .custom-control-label { text-transform: none; letter-spacing: 0; font-size: .875rem !important; color: rgb(var(--c-body)) !important; }
body.tema-italmatic a { color: rgb(var(--c-primary-dark)); }
body.tema-italmatic a:hover { color: rgb(var(--c-primary)); }

/* ================================================================ barra laterale scura */
body.tema-italmatic .main-sidebar,
body.tema-italmatic .main-sidebar .nav-wrapper { background: rgb(var(--c-sidebar)) !important; border-right: 0; }
/* il logo ha il testo scuro: resta su una targhetta chiara (guida, sezione 3) */
body.tema-italmatic .main-sidebar .main-navbar,
body.tema-italmatic .main-sidebar .main-navbar .navbar { background: rgb(var(--c-card)) !important; border-bottom: 2px solid rgb(var(--c-primary)) !important; }
body.tema-italmatic .main-sidebar .nav .nav-item .nav-link {
    color: rgb(var(--c-panel-text));
    font-size: 11px !important;
    font-weight: 400 !important;
    text-transform: uppercase;
    letter-spacing: .12em;
}
body.tema-italmatic .main-sidebar .nav .nav-item .nav-link i { color: rgb(var(--c-panel-muted)); }
body.tema-italmatic .main-sidebar .nav .nav-item .nav-link:hover { background: rgb(255 255 255 / .06); color: #fff; }
body.tema-italmatic .main-sidebar .nav .nav-item .nav-link:hover i { color: #fff; }
body.tema-italmatic .main-sidebar .nav .nav-item .nav-link.active,
body.tema-italmatic .main-sidebar .nav .nav-item.active .nav-link { background: rgb(var(--c-primary)); color: #fff; }
body.tema-italmatic .main-sidebar .nav .nav-item .nav-link.active i,
body.tema-italmatic .main-sidebar .nav .nav-item.active i { color: #fff; }
body.tema-italmatic .main-sidebar .nav .nav-item .dropdown-menu .dropdown-item { color: rgb(var(--c-panel-muted)); font-size: 12px; }
body.tema-italmatic .main-sidebar .nav .nav-item .dropdown-menu .dropdown-item:hover { color: #fff; background: rgb(255 255 255 / .06); }
body.tema-italmatic .main-sidebar .nav .nav-item .dropdown-menu .dropdown-item.active { color: #fff; background: transparent; font-weight: 700; }
body.tema-italmatic .menu-riduci { background: rgb(var(--c-value)); border-color: rgb(var(--c-line)); }

/* barra in alto: card con filetto verde da 2 px */
body.tema-italmatic .main-content > .main-navbar {
    background: rgb(var(--c-card)) !important;
    backdrop-filter: none;
    border-bottom: 2px solid rgb(var(--c-primary));
}
body.tema-italmatic .main-navbar__search .navbar-search { background: rgb(var(--c-value)); }

/* ================================================================ pulsanti */
body.tema-italmatic .btn {
    font-size: 11px !important;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: .12em;
    line-height: 16px;
}
body.tema-italmatic .btn:not(.btn-sm):not(.btn-lg) { padding: 8px 16px; }
body.tema-italmatic .btn-sm { padding: 5px 10px; }
body.tema-italmatic .btn-primary, body.tema-italmatic .btn-personal,
body.tema-italmatic .btn-success { background: rgb(var(--c-primary)); border-color: rgb(var(--c-primary)); color: #fff !important; }
body.tema-italmatic .btn-primary:hover, body.tema-italmatic .btn-personal:hover,
body.tema-italmatic .btn-success:hover { background: rgb(var(--c-primary-dark)); border-color: rgb(var(--c-primary-dark)); }
/* "fantasma" della guida: fondo value, bordo line */
body.tema-italmatic .btn-secondary, body.tema-italmatic .btn-secondary-personal,
body.tema-italmatic .btn-light, body.tema-italmatic .btn-white,
body.tema-italmatic .btn-outline-secondary, body.tema-italmatic .btn-outline-dark,
body.tema-italmatic .btn-outline-primary, body.tema-italmatic .btn-outline-info,
body.tema-italmatic #apriricerca, body.tema-italmatic #aprifiltri {
    background: rgb(var(--c-value));
    border: 1px solid rgb(var(--c-line));
    color: rgb(var(--c-body)) !important;
}
body.tema-italmatic .btn-secondary:hover, body.tema-italmatic .btn-secondary-personal:hover,
body.tema-italmatic .btn-light:hover, body.tema-italmatic .btn-white:hover,
body.tema-italmatic .btn-outline-secondary:hover, body.tema-italmatic .btn-outline-dark:hover,
body.tema-italmatic .btn-outline-primary:hover, body.tema-italmatic .btn-outline-info:hover,
body.tema-italmatic #apriricerca:hover, body.tema-italmatic #aprifiltri:hover {
    background: rgb(var(--c-card));
    border-color: rgb(var(--c-primary));
    color: rgb(var(--c-ink)) !important;
}
body.tema-italmatic .btn-danger { background: rgb(var(--c-alarm)); border-color: rgb(var(--c-alarm)); color: #fff !important; }
body.tema-italmatic .btn-outline-danger { background: rgb(var(--c-card)); border-color: rgb(var(--c-alarm)); color: rgb(var(--c-alarm)) !important; }
body.tema-italmatic .btn-outline-danger:hover { background: rgb(var(--c-alarm)); color: #fff !important; }
/* l'ambra resta l'avviso (es. "Prendi in carico") */
body.tema-italmatic .btn-warning { background: rgb(var(--c-amber)); border-color: rgb(var(--c-amber)); color: rgb(var(--c-ink)) !important; }
body.tema-italmatic .btn-outline-warning { background: rgb(var(--c-card)); border-color: rgb(var(--c-amber)); color: rgb(var(--c-warn-text)) !important; }

/* ricerca rapida: pillole = chip; il filtro attivo (giallo nel tema moderno) e' verde pieno */
body.tema-italmatic .text-center.mb-3.p-0:has(> .mb-1.text-center) .btn { letter-spacing: .06em; padding: 5px 10px !important; font-size: 11px !important; }
body.tema-italmatic .text-center.mb-3.p-0:has(> .mb-1.text-center) .btn-warning,
body.tema-italmatic .text-center.mb-3.p-0:has(> .mb-1.text-center) .btn-primary,
body.tema-italmatic .text-center.mb-3.p-0:has(> .mb-1.text-center) .btn-danger {
    background: rgb(var(--c-primary));
    border-color: rgb(var(--c-primary));
    color: #fff !important;
}

/* ================================================================ campi */
body.tema-italmatic .form-control,
body.tema-italmatic .custom-select,
body.tema-italmatic .select2-container--default .select2-selection--single,
body.tema-italmatic .select2-container--default .select2-selection--multiple,
body.tema-italmatic .input-group-text,
body.tema-italmatic .custom-file-label {
    background-color: rgb(var(--c-value));
    border: 1px solid rgb(var(--c-line));
    color: rgb(var(--c-ink));
    font-weight: 300;
}
body.tema-italmatic .form-control:focus,
body.tema-italmatic .custom-select:focus,
body.tema-italmatic .select2-container--focus .select2-selection,
body.tema-italmatic .select2-container--open .select2-selection {
    background-color: rgb(var(--c-card));
    border-color: rgb(var(--c-primary)) !important;
}
body.tema-italmatic .form-control:disabled,
body.tema-italmatic .form-control[readonly] { background-color: rgb(var(--c-page)); color: rgb(var(--c-muted)); }
body.tema-italmatic .dataTables_wrapper .dataTables_filter input { background: rgb(var(--c-value)); }
body.tema-italmatic .dataTables_wrapper .dataTables_filter input:focus { background: rgb(var(--c-card)); border-color: rgb(var(--c-primary)); }
/* focus da tastiera visibile: contorno verde 2 px, senza alone */
body.tema-italmatic .btn:focus-visible,
body.tema-italmatic a:focus-visible { outline: 2px solid rgb(var(--c-primary)); outline-offset: 2px; }

/* ================================================================ riquadri e tabelle */
body.tema-italmatic .card,
body.tema-italmatic .box_ricerca,
body.tema-italmatic .box_ricerca_macchine,
body.tema-italmatic table.table_test,
body.tema-italmatic .dataTables_wrapper > table.dataTable,
body.tema-italmatic .table-responsive > .table:not(.table-sm) { border: 1px solid rgb(var(--c-line)); background: rgb(var(--c-card)); }
body.tema-italmatic .card-header,
body.tema-italmatic .card-footer,
body.tema-italmatic .modal-footer { background: rgb(var(--c-card)); }
body.tema-italmatic .table thead th,
body.tema-italmatic .table tfoot th,
body.tema-italmatic .table_test thead tr,
body.tema-italmatic .table_test tfoot tr { background: rgb(var(--c-card)) !important; }
body.tema-italmatic .table td { font-variant-numeric: tabular-nums; }
body.tema-italmatic .table_test tbody tr:not(.spacer):hover,
body.tema-italmatic .table-hover tbody tr:hover { background-color: rgb(var(--c-value)); }
/* righe con significato: ritardo = ambra, bloccato = rosso, con filetto a sinistra */
body.tema-italmatic .table-warning, body.tema-italmatic .table-warning > td, body.tema-italmatic .table-warning > th { background-color: rgb(var(--c-warn)) !important; }
body.tema-italmatic .table-danger, body.tema-italmatic .table-danger > td, body.tema-italmatic .table-danger > th { background-color: rgb(var(--c-alarm) / .08) !important; }
body.tema-italmatic .table-success, body.tema-italmatic .table-success > td, body.tema-italmatic .table-success > th { background-color: rgb(var(--c-ok)) !important; }
body.tema-italmatic .table-warning > td:first-child { box-shadow: inset 2px 0 0 rgb(var(--c-amber)) !important; }
body.tema-italmatic .table-danger > td:first-child { box-shadow: inset 2px 0 0 rgb(var(--c-alarm)) !important; }

/* ================================================================ etichette = chip della guida */
body.tema-italmatic .badge {
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
    padding: 2px 8px;
    letter-spacing: .02em;
    border: 1px solid rgb(var(--c-line));
    background: rgb(var(--c-value));
    color: rgb(var(--c-body));
}
body.tema-italmatic .badge-success, body.tema-italmatic .badge-outline-success {
    background: rgb(var(--c-card)); border-color: rgb(var(--c-primary)); color: rgb(var(--c-ok-text));
}
body.tema-italmatic .badge-warning, body.tema-italmatic .badge-outline-warning {
    background: rgb(var(--c-card)); border-color: rgb(var(--c-amber)); color: rgb(var(--c-warn-text));
}
body.tema-italmatic .badge-danger, body.tema-italmatic .badge-outline-danger {
    background: rgb(var(--c-alarm)); border-color: rgb(var(--c-alarm)); color: #fff;
}
body.tema-italmatic .badge-primary, body.tema-italmatic .badge-outline-primary,
body.tema-italmatic .badge-info, body.tema-italmatic .badge-outline-info,
body.tema-italmatic .badge-secondary, body.tema-italmatic .badge-outline-secondary,
body.tema-italmatic .badge-light, body.tema-italmatic .badge-outline-dark {
    background: rgb(var(--c-value)); border-color: rgb(var(--c-line)); color: rgb(var(--c-body));
}
body.tema-italmatic .badge-dark { background: rgb(var(--c-ink)); border-color: rgb(var(--c-ink)); color: #fff; }
/* badge grandi del wizard offerte: cliccabili, restano pieni nei colori di stato */
body.tema-italmatic .badge.badge-font-large.badge-success,
body.tema-italmatic .badge.badge-font-large.badge-info,
body.tema-italmatic .badge.badge-font-large.badge-primary { background: rgb(var(--c-primary)); border-color: rgb(var(--c-primary)); color: #fff; }
body.tema-italmatic .badge.badge-font-large.badge-warning { background: rgb(var(--c-amber)); border-color: rgb(var(--c-amber)); color: rgb(var(--c-ink)); }

/* ================================================================ avvisi */
body.tema-italmatic .alert { border: 1px solid rgb(var(--c-line)); background: rgb(var(--c-card)); color: rgb(var(--c-body)); }
body.tema-italmatic .alert-success { background: rgb(var(--c-ok)); border-color: rgb(var(--c-primary)); color: rgb(var(--c-ok-text)); }
body.tema-italmatic .alert-warning { background: rgb(var(--c-warn)); border-color: rgb(var(--c-amber)); color: rgb(var(--c-warn-text)); }
body.tema-italmatic .alert-danger { background: rgb(var(--c-alarm) / .08); border-color: rgb(var(--c-alarm)); color: rgb(var(--c-alarm)); }
body.tema-italmatic .alert-info, body.tema-italmatic .alert-primary,
body.tema-italmatic .alert-secondary, body.tema-italmatic .alert-light { background: rgb(var(--c-value)); border-color: rgb(var(--c-line)); color: rgb(var(--c-body)); }

/* ================================================================ schede, paginazione, varie */
body.tema-italmatic .nav-tabs .nav-link {
    font-size: 11px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: .12em;
}
body.tema-italmatic .nav-tabs .nav-link.active,
body.tema-italmatic .nav-tabs .nav-item.show .nav-link { color: rgb(var(--c-ink)); border-bottom-color: rgb(var(--c-primary)); }
body.tema-italmatic .pagination .page-item .page-link { font-variant-numeric: tabular-nums; font-weight: 400; }
body.tema-italmatic .progress { background: rgb(var(--c-line)); height: 6px; }
body.tema-italmatic .progress-bar { background: rgb(var(--c-primary)); }
body.tema-italmatic .main-footer { background: rgb(var(--c-card)) !important; border-top: 1px solid rgb(var(--c-line)) !important; }

/* ================================================================ login (staff e clienti) */
body.tema-italmatic.tema-login { background: rgb(var(--c-page)); }
body.tema-italmatic.tema-login .form-container { border: 1px solid rgb(var(--c-line)); }
body.tema-italmatic.tema-login .form-container .form-icon { background: rgb(var(--c-card)); border-right: 1px solid rgb(var(--c-line)); }
body.tema-italmatic.tema-login .form-container .title {
    font-weight: 300;
    font-size: 1.5rem;
    padding-bottom: 8px;
    border-bottom: 2px solid rgb(var(--c-primary));
    display: inline-block;
}
body.tema-italmatic.tema-login .form-horizontal .form-group { background: rgb(var(--c-value)); }
body.tema-italmatic.tema-login .form-horizontal .form-group:focus-within { border-color: rgb(var(--c-primary)); }
body.tema-italmatic.tema-login .form-horizontal .btn { background: rgb(var(--c-primary)); }
body.tema-italmatic.tema-login .form-horizontal .btn:hover { background: rgb(var(--c-primary-dark)); }

/* ================================================================ area clienti */
body.tema-italmatic .navbar {
    background: rgb(var(--c-card));
    backdrop-filter: none;
    border-bottom: 2px solid rgb(var(--c-primary));
}
body.tema-italmatic .navbar-light .navbar-nav .nav-link {
    font-size: 11px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: .12em;
}
body.tema-italmatic .navbar-light .navbar-nav .nav-link:hover { background: rgb(var(--c-value)); color: rgb(var(--c-ink)); }
body.tema-italmatic .risposta_ticket { border-left: 2px solid rgb(var(--c-line)); }
body.tema-italmatic .risposta_ticket.bg-staff { background: rgb(var(--c-card)); border-left-color: rgb(var(--c-primary)); }
body.tema-italmatic .data_box i { background: rgb(var(--c-primary)); }
body.tema-italmatic #replyForm { border-color: rgb(var(--c-primary)); }
body.tema-italmatic #footer { background: rgb(var(--c-card)); border-top: 1px solid rgb(var(--c-line)); }

/* ================================================================ barra in alto: icone */
/* Campanella, bandierine, chiaro/scuro e utente sulla stessa linea, centrati in altezza
   (prima ogni gruppo aveva i suoi margini mt-3/pt-3 e le icone erano sfalsate). */
body.tema-italmatic .main-content > .main-navbar .navbar { align-items: center !important; min-height: 60px; }
body.tema-italmatic .main-content > .main-navbar .navbar > .navbar-nav {
    margin: 0 !important;
    padding: 0 6px !important;
    height: 60px;
    align-items: center;
    gap: 2px;
}
body.tema-italmatic .main-content > .main-navbar .navbar > .navbar-nav > .nav-item,
body.tema-italmatic .main-content > .main-navbar .navbar > .navbar-nav > .nav-item > .nav-item { display: flex; align-items: center; height: 100%; }
body.tema-italmatic .main-navbar a.languageswitcher { display: flex; align-items: center; padding: 0 6px !important; }
body.tema-italmatic .main-content > .main-navbar .navbar > .navbar-nav .nav-link { min-width: 0 !important; }
/* icone tutte a destra, vicino al nome dell'utente */
body.tema-italmatic .main-content > .main-navbar .navbar > ul.navbar-nav:first-of-type { margin-left: auto !important; padding-right: 10px !important; border-right: 1px solid rgb(var(--c-line)); height: 32px; }
body.tema-italmatic .main-content > .main-navbar .navbar > ul.navbar-nav:first-of-type > .nav-item { height: 32px; }
body.tema-italmatic .main-navbar a.languageswitcher { margin: 0 !important; height: 40px; }
body.tema-italmatic .main-navbar a.languageswitcher img { width: 22px; height: 22px; }

/* Icone della barra (campanella, chiaro/scuro): niente riquadro, 40x40 cliccabili, icona 19 px */
body.tema-italmatic #notifBell,
body.tema-italmatic .tema-ciclo {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0 !important;
    margin: 0;
    border: 0;
    background: transparent;
    color: rgb(var(--c-body)) !important;
    font-size: 19px;
    line-height: 1;
    cursor: pointer;
    transition: color .15s;
}
body.tema-italmatic #notifBell i,
body.tema-italmatic .tema-ciclo i { font-size: 19px !important; margin: 0 !important; color: inherit !important; vertical-align: 0; }
body.tema-italmatic #notifBell:hover,
body.tema-italmatic .tema-ciclo:hover { color: rgb(var(--c-primary)) !important; background: transparent; }
body.tema-italmatic #notifBell:focus-visible,
body.tema-italmatic .tema-ciclo:focus-visible { outline: 2px solid rgb(var(--c-primary)); outline-offset: 0; }
/* numero delle non lette: piccolo, rosso (e' un allarme da guardare), in alto a destra della campana,
   con un bordo del colore della barra che lo stacca dall'icona */
body.tema-italmatic #notifBadge {
    position: absolute;
    top: 3px;
    right: 0;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    background: rgb(var(--c-alarm));
    border: 2px solid rgb(var(--c-card));
    color: #fff;
}
body.tema-italmatic #notifBadge:empty { display: none; }
/* tendina delle notifiche: card piatta con bordo */
body.tema-italmatic #notifMenu {
    top: 48px !important;
    background: rgb(var(--c-card)) !important;
    border: 1px solid rgb(var(--c-line)) !important;
    color: rgb(var(--c-body));
}
/* l'area clienti ha la stessa icona nella barra in alto */
body.tema-italmatic .navbar .tema-ciclo-voce { display: flex; align-items: center; }

/* elenchi a scelta multipla (es. Supervisori nel Setup): voci scelte in verde chiaro */
body.tema-italmatic select[multiple].form-control { background: rgb(var(--c-value)); }
body.tema-italmatic select[multiple].form-control option { padding: 2px 6px; color: rgb(var(--c-ink)); }
body.tema-italmatic select[multiple].form-control option:checked { background: rgb(var(--c-ok)) linear-gradient(rgb(var(--c-ok)), rgb(var(--c-ok))); color: rgb(var(--c-ok-text)); }

/* ================================================================ TEMA SCURO */
/* Attivo con data-theme="dark" su <html> (script in tema_head(): scelta per browser, modalita
   automatica scura dalle 19 alle 7). Token scuri della guida, poi le superfici che il tema moderno
   e Bootstrap scrivono in bianco "a mano". */
html[data-theme="dark"] { background: rgb(17 20 23); color-scheme: dark; }
html[data-theme="dark"] body.tema-italmatic {
    --c-page: 17 20 23;      --c-card: 26 30 34;      --c-value: 35 40 45;
    --c-primary-dark: 0 160 122; --c-alarm: 228 78 78;
    --c-ok: 14 46 38;        --c-ok-text: 82 210 164;
    --c-warn: 51 40 10;      --c-warn-text: 242 192 80;
    --c-ink: 236 238 240;    --c-body: 200 205 210;   --c-muted: 136 144 152;
    --c-line: 52 58 64;
    --c-sidebar: 10 12 14;
    color-scheme: dark;
}
/* superfici: tutto cio che era bianco diventa "card", i fondi chiari diventano "value" */
html[data-theme="dark"] body.tema-italmatic .main-content,
html[data-theme="dark"] body.tema-italmatic .main-content-container,
html[data-theme="dark"] body.tema-italmatic .row_background_ticket .container,
html[data-theme="dark"] body.tema-italmatic .row_background_ticket_detail .container { background: rgb(var(--c-page)) !important; }
html[data-theme="dark"] body.tema-italmatic .card,
html[data-theme="dark"] body.tema-italmatic .card-header,
html[data-theme="dark"] body.tema-italmatic .card-footer,
html[data-theme="dark"] body.tema-italmatic .card-body,
html[data-theme="dark"] body.tema-italmatic .bg-white,
html[data-theme="dark"] body.tema-italmatic .modal-content,
html[data-theme="dark"] body.tema-italmatic .modal-footer,
html[data-theme="dark"] body.tema-italmatic .dropdown-menu,
html[data-theme="dark"] body.tema-italmatic .list-group-item,
html[data-theme="dark"] body.tema-italmatic .box_ricerca,
html[data-theme="dark"] body.tema-italmatic .box_ricerca_macchine,
html[data-theme="dark"] body.tema-italmatic div.filtritickets,
html[data-theme="dark"] body.tema-italmatic .box_department,
html[data-theme="dark"] body.tema-italmatic .jumbotron,
html[data-theme="dark"] body.tema-italmatic #ticket_options,
html[data-theme="dark"] body.tema-italmatic #table_tickets,
html[data-theme="dark"] body.tema-italmatic #table_utenti,
html[data-theme="dark"] body.tema-italmatic #replyForm,
html[data-theme="dark"] body.tema-italmatic .risposta_ticket,
html[data-theme="dark"] body.tema-italmatic .profile-card-4,
html[data-theme="dark"] body.tema-italmatic .tab-content,
html[data-theme="dark"] body.tema-italmatic .main-footer,
html[data-theme="dark"] body.tema-italmatic #footer,
html[data-theme="dark"] body.tema-italmatic .page-link,
html[data-theme="dark"] body.tema-italmatic .daterangepicker,
html[data-theme="dark"] body.tema-italmatic .select2-dropdown,
html[data-theme="dark"] body.tema-italmatic .swal2-popup,
html[data-theme="dark"] body.tema-italmatic .navbar,
html[data-theme="dark"] body.tema-italmatic .main-content > .main-navbar,
html[data-theme="dark"] body.tema-italmatic .main-navbar .navbar,
html[data-theme="dark"] body.tema-italmatic.tema-login .form-container,
html[data-theme="dark"] body.tema-italmatic.tema-login .form-container .form-horizontal { background: rgb(var(--c-card)) !important; color: rgb(var(--c-body)); }
html[data-theme="dark"] body.tema-italmatic .bg-light,
html[data-theme="dark"] body.tema-italmatic .alert-light,
html[data-theme="dark"] body.tema-italmatic .custom-file-label::after,
html[data-theme="dark"] body.tema-italmatic .risposta_ticket.bg-staff,
html[data-theme="dark"] body.tema-italmatic .table_test thead tr,
html[data-theme="dark"] body.tema-italmatic .table_test tfoot tr,
html[data-theme="dark"] body.tema-italmatic .table thead th,
html[data-theme="dark"] body.tema-italmatic .table tfoot th { background: rgb(var(--c-value)) !important; }
/* tabelle: righe "card", passaggio del mouse "value" */
html[data-theme="dark"] body.tema-italmatic .table,
html[data-theme="dark"] body.tema-italmatic table.dataTable,
html[data-theme="dark"] body.tema-italmatic .table td,
html[data-theme="dark"] body.tema-italmatic .table th { color: rgb(var(--c-body)); border-color: rgb(var(--c-line)) !important; }
html[data-theme="dark"] body.tema-italmatic .table tbody tr:not([class*="table-"]),
html[data-theme="dark"] body.tema-italmatic table.dataTable tbody tr:not([class*="table-"]),
html[data-theme="dark"] body.tema-italmatic .table_test tbody tr:not([class*="table-"]):nth-of-type(odd),
html[data-theme="dark"] body.tema-italmatic .table_test tbody tr:not([class*="table-"]):nth-of-type(even) { background-color: rgb(var(--c-card)) !important; }
html[data-theme="dark"] body.tema-italmatic .table_test tbody tr:not(.spacer):hover,
html[data-theme="dark"] body.tema-italmatic .table-hover tbody tr:hover,
html[data-theme="dark"] body.tema-italmatic table.dataTable tbody tr:hover { background-color: rgb(var(--c-value)) !important; }
html[data-theme="dark"] body.tema-italmatic .table-warning, html[data-theme="dark"] body.tema-italmatic .table-warning > td { background-color: rgb(var(--c-warn)) !important; }
html[data-theme="dark"] body.tema-italmatic .table-danger, html[data-theme="dark"] body.tema-italmatic .table-danger > td { background-color: rgb(var(--c-alarm) / .14) !important; }
html[data-theme="dark"] body.tema-italmatic .table-success, html[data-theme="dark"] body.tema-italmatic .table-success > td { background-color: rgb(var(--c-ok)) !important; }
/* testo */
html[data-theme="dark"] body.tema-italmatic,
html[data-theme="dark"] body.tema-italmatic p,
html[data-theme="dark"] body.tema-italmatic li,
html[data-theme="dark"] body.tema-italmatic td,
html[data-theme="dark"] body.tema-italmatic .text-dark,
html[data-theme="dark"] body.tema-italmatic .text-secondary { color: rgb(var(--c-body)) !important; }
html[data-theme="dark"] body.tema-italmatic h1, html[data-theme="dark"] body.tema-italmatic h2,
html[data-theme="dark"] body.tema-italmatic h3, html[data-theme="dark"] body.tema-italmatic h4,
html[data-theme="dark"] body.tema-italmatic h5, html[data-theme="dark"] body.tema-italmatic h6,
html[data-theme="dark"] body.tema-italmatic .page-title,
html[data-theme="dark"] body.tema-italmatic strong, html[data-theme="dark"] body.tema-italmatic b { color: rgb(var(--c-ink)) !important; }
html[data-theme="dark"] body.tema-italmatic .text-muted { color: rgb(var(--c-muted)) !important; }
html[data-theme="dark"] body.tema-italmatic a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link) { color: rgb(var(--c-ok-text)); }
/* le etichette di stato colorate tengono il proprio colore anche dentro a celle e paragrafi */
html[data-theme="dark"] body.tema-italmatic .badge-danger,
html[data-theme="dark"] body.tema-italmatic .badge-outline-danger { color: #fff !important; }
/* campi */
html[data-theme="dark"] body.tema-italmatic .form-control,
html[data-theme="dark"] body.tema-italmatic .custom-select,
html[data-theme="dark"] body.tema-italmatic .input-group-text,
html[data-theme="dark"] body.tema-italmatic .custom-file-label,
html[data-theme="dark"] body.tema-italmatic .select2-container--default .select2-selection--single,
html[data-theme="dark"] body.tema-italmatic .select2-container--default .select2-selection--multiple,
html[data-theme="dark"] body.tema-italmatic .select2-search__field,
html[data-theme="dark"] body.tema-italmatic .dataTables_wrapper .dataTables_filter input,
html[data-theme="dark"] body.tema-italmatic .dataTables_wrapper .dataTables_length select,
html[data-theme="dark"] body.tema-italmatic.tema-login .form-horizontal .form-group {
    background-color: rgb(var(--c-value)) !important;
    border-color: rgb(var(--c-line)) !important;
    color: rgb(var(--c-ink)) !important;
}
html[data-theme="dark"] body.tema-italmatic .select2-container--default .select2-selection--single .select2-selection__rendered { color: rgb(var(--c-ink)) !important; }
html[data-theme="dark"] body.tema-italmatic .select2-results__option { color: rgb(var(--c-body)); }
html[data-theme="dark"] body.tema-italmatic .form-control::placeholder { color: rgb(var(--c-muted)); }
html[data-theme="dark"] body.tema-italmatic .form-control:disabled,
html[data-theme="dark"] body.tema-italmatic .form-control[readonly] { background-color: rgb(var(--c-page)) !important; color: rgb(var(--c-muted)) !important; }
html[data-theme="dark"] body.tema-italmatic .form-control:focus,
html[data-theme="dark"] body.tema-italmatic .custom-select:focus { border-color: rgb(var(--c-primary)) !important; }
/* pulsanti chiari, voci di menu */
html[data-theme="dark"] body.tema-italmatic .btn-outline-danger,
html[data-theme="dark"] body.tema-italmatic .btn-outline-success,
html[data-theme="dark"] body.tema-italmatic .btn-outline-info,
html[data-theme="dark"] body.tema-italmatic .btn-outline-warning,
html[data-theme="dark"] body.tema-italmatic .pin-toggle-list.btn-outline-secondary,
html[data-theme="dark"] body.tema-italmatic table .btn-group > .btn-sm { background: rgb(var(--c-value)) !important; }
html[data-theme="dark"] body.tema-italmatic .dropdown-item { color: rgb(var(--c-body)); }
html[data-theme="dark"] body.tema-italmatic .dropdown-item:hover { background: rgb(var(--c-value)); color: rgb(var(--c-ink)); }
html[data-theme="dark"] body.tema-italmatic .badge-dark { background: rgb(var(--c-ink)); color: rgb(var(--c-page)); }
html[data-theme="dark"] body.tema-italmatic .close { color: rgb(var(--c-ink)); }
html[data-theme="dark"] body.tema-italmatic hr { border-top-color: rgb(var(--c-line)); }
/* il logo ha il testo grigio scuro e niente versione in negativo: targhetta bianca (guida, sezione 3) */
html[data-theme="dark"] body.tema-italmatic #main-logo,
html[data-theme="dark"] body.tema-italmatic .navbar-brand img,
html[data-theme="dark"] body.tema-italmatic .form-container .form-icon img { background: #fff; padding: 4px 8px; }
html[data-theme="dark"] body.tema-italmatic .main-sidebar .main-navbar,
html[data-theme="dark"] body.tema-italmatic .main-sidebar .main-navbar .navbar { background: rgb(var(--c-sidebar)) !important; }

/* ================================================================ regole della guida, seconda passata */

/* Ricerca in alto: campo compatto con la lente dentro (prima: lente fuori e un riquadro grigio a
   tutta larghezza). Valore = "value-box" della guida, fuoco = bordo verde, niente alone. */
body.tema-italmatic .main-navbar__search { align-items: center; max-width: 560px; padding-left: 16px; }
body.tema-italmatic .main-navbar__search .input-group,
body.tema-italmatic .main-navbar__search .input-group-prepend { margin: 0 !important; padding: 0 !important; width: 100%; flex: 1 1 auto; }
body.tema-italmatic .main-navbar__search .input-group-text {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}
body.tema-italmatic .main-navbar__search .input-group-text > i {
    position: absolute;
    left: 12px;
    z-index: 2;
    font-size: 13px;
    color: rgb(var(--c-muted));
    pointer-events: none;
}
body.tema-italmatic .main-navbar__search .navbar-search {
    height: 36px !important;
    min-height: 36px;
    margin: 0 !important;
    padding: 0 12px 0 36px !important;
    width: 100%;
    background: rgb(var(--c-value)) !important;
    border: 1px solid rgb(var(--c-line)) !important;
    color: rgb(var(--c-ink));
    font-size: 14px;
    font-weight: 300;
}
body.tema-italmatic .main-navbar__search .navbar-search:focus { background: rgb(var(--c-card)) !important; border-color: rgb(var(--c-primary)) !important; }
body.tema-italmatic .main-navbar__search .navbar-search::placeholder { color: rgb(var(--c-muted)); text-transform: none; }

/* Stato del ticket (guida 8.1): nuovo neutro, in lavorazione verde, in attesa ambra, concluso verde
   con pallino, da contabilizzare e chiuso neutri attenuati. Il rosso resta per bloccato/scaduto. */
body.tema-italmatic .badge.stato-ticket { display: inline-flex; align-items: center; gap: 6px; }
body.tema-italmatic .badge.stato-1 { background: rgb(var(--c-value)); border-color: rgb(var(--c-line)); color: rgb(var(--c-body)); }
body.tema-italmatic .badge.stato-2 { background: rgb(var(--c-card)); border-color: rgb(var(--c-primary)); color: rgb(var(--c-ok-text)); }
body.tema-italmatic .badge.stato-3 { background: rgb(var(--c-card)); border-color: rgb(var(--c-amber)); color: rgb(var(--c-warn-text)); }
body.tema-italmatic .badge.stato-4 { background: rgb(var(--c-card)); border-color: rgb(var(--c-primary)); color: rgb(var(--c-ok-text)); }
body.tema-italmatic .badge.stato-4::before { content: ''; width: 8px; height: 8px; border-radius: 9999px !important; background: rgb(var(--c-primary)); flex: none; }
body.tema-italmatic .badge.stato-5,
body.tema-italmatic .badge.stato-6 { background: rgb(var(--c-value)); border-color: rgb(var(--c-line)); color: rgb(var(--c-muted)); }
html[data-theme="dark"] body.tema-italmatic .badge.stato-5,
html[data-theme="dark"] body.tema-italmatic .badge.stato-6 { color: rgb(var(--c-muted)) !important; }
/* macchina in garanzia: stato "ok" (chip verde), non un fondo pieno */
body.tema-italmatic .badge.badge-garanzia {
    background: rgb(var(--c-card)) !important;
    border: 1px solid rgb(var(--c-primary)) !important;
    color: rgb(var(--c-ok-text)) !important;
    font-weight: 400 !important;
    padding: 2px 8px !important;
}

/* Link (guida: "gold"): il dorato puro sul bianco non arriva al contrasto minimo del testo (4,5:1),
   quindi testo scuro e sottolineatura dorata; nel tema scuro il dorato chiaro va bene come testo. */
body.tema-italmatic .main-content-container a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.badge),
body.tema-italmatic .row_background_ticket_detail a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.badge) {
    color: rgb(var(--c-ink));
    text-decoration: underline;
    text-decoration-color: rgb(var(--c-gold));
    text-underline-offset: 3px;
}
body.tema-italmatic .main-content-container a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.badge):hover,
body.tema-italmatic .row_background_ticket_detail a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.badge):hover { text-decoration-color: rgb(var(--c-primary)); }
html[data-theme="dark"] body.tema-italmatic { --c-gold: 205 182 124; }
html[data-theme="dark"] body.tema-italmatic a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):not(.badge) { color: rgb(var(--c-gold)) !important; }

/* Barra laterale ridotta = 56 px di sole icone, come nella guida (sezione 6) */
@media (min-width: 768px) {
    body.tema-italmatic.menu-ridotto .main-sidebar { flex: 0 0 56px; max-width: 56px; }
    body.tema-italmatic.menu-ridotto .main-content,
    body.tema-italmatic.menu-ridotto .main-footer { flex: 0 0 calc(100% - 56px); max-width: calc(100% - 56px); margin-left: 56px; }
    body.tema-italmatic.menu-ridotto .main-sidebar .nav-wrapper { padding: 8px 0; }
}

/* Elenchi densi (guida 8.6): righe da circa 36-40 px */
body.tema-italmatic .table_test tbody td,
body.tema-italmatic .table_test tbody th { padding-top: 8px; padding-bottom: 8px; }
body.tema-italmatic .table td, body.tema-italmatic .table th { padding: 8px 10px !important; }

/* Note interne del ticket (guida 8.4): fondo "warn" ed etichetta INTERNA, cosi' non si scambiano
   per un messaggio al cliente */
body.tema-italmatic #notesBox .alert.alert-light {
    background: rgb(var(--c-warn)) !important;
    border: 1px solid rgb(var(--c-amber)) !important;
    color: rgb(var(--c-warn-text)) !important;
}
body.tema-italmatic #notesBox .alert.alert-light .alert-heading::before {
    content: 'INTERNA';
    display: block;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: .12em;
    color: rgb(var(--c-warn-text));
    margin-bottom: 4px;
}

/* Corpo del testo: Ubuntu 300, 15 px (guida, sezione 4); le tabelle restano a 13-14 px */
body.tema-italmatic { font-size: 15px; line-height: 1.65; }
body.tema-italmatic .table { font-size: 13.5px; line-height: 1.45; }