/*
 * LocaSmart - design token e overrides su Bootstrap 5.3 (solo variabili CSS, nessun build).
 * Caricare DOPO bootstrap.5.3.8.min.css. Palette di brand: petrolio, dal login.
 * Modalità scura: [data-bs-theme="dark"] sull'elemento <html> (vedi public/js/theme.js).
 */

/* ===== Token: chiaro ===== */
:root {
    --ls-brand: #0a6c8a;
    --ls-brand-dark: #085670;
    --ls-brand-rgb: 10, 108, 138;
    --ls-ink: #1f262d;

    --bs-primary: var(--ls-brand);
    --bs-primary-rgb: var(--ls-brand-rgb);
    --bs-primary-text-emphasis: #042b38;
    --bs-primary-bg-subtle: #cfe4eb;
    --bs-primary-border-subtle: #9fc9d8;
    --bs-link-color: var(--ls-brand);
    --bs-link-color-rgb: var(--ls-brand-rgb);
    --bs-link-hover-color: var(--ls-brand-dark);
    --bs-link-hover-color-rgb: 8, 86, 112;
    --bs-focus-ring-color: rgba(var(--ls-brand-rgb), .25);

    --bs-secondary-bg: #e9eff4;
    --bs-secondary-bg-rgb: 233, 239, 244;
    --bs-tertiary-bg: #f1f4f7;
    --bs-tertiary-bg-rgb: 241, 244, 247;
    --bs-border-color: #dbe2e8;
    --bs-border-radius: .5rem;
    --bs-border-radius-lg: .75rem;
    --bs-border-radius-xl: 1rem;

    --ls-page-bg: linear-gradient(160deg, #e9eff4 0%, #f7f9fb 60%);
}

/* ===== Token: scuro ===== */
[data-bs-theme="dark"] {
    --bs-primary-text-emphasis: #8fcadc;
    --bs-primary-bg-subtle: #06222b;
    --bs-primary-border-subtle: #084457;
    --bs-link-color: #5cb1cb;
    --bs-link-color-rgb: 92, 177, 203;
    --bs-link-hover-color: #82c8de;
    --bs-link-hover-color-rgb: 130, 200, 222;
    --bs-focus-ring-color: rgba(92, 177, 203, .3);

    --bs-body-bg: #12171c;
    --bs-body-bg-rgb: 18, 23, 28;
    --bs-secondary-bg: #1d252c;
    --bs-secondary-bg-rgb: 29, 37, 44;
    --bs-tertiary-bg: #181f25;
    --bs-tertiary-bg-rgb: 24, 31, 37;
    --bs-border-color: #2c3741;

    --ls-page-bg: linear-gradient(160deg, #0d1115 0%, #161d23 60%);
}

/* ===== Pulsanti ===== */
.btn-primary {
    --bs-btn-bg: var(--ls-brand);
    --bs-btn-border-color: var(--ls-brand);
    --bs-btn-hover-bg: var(--ls-brand-dark);
    --bs-btn-hover-border-color: var(--ls-brand-dark);
    --bs-btn-active-bg: var(--ls-brand-dark);
    --bs-btn-active-border-color: var(--ls-brand-dark);
    --bs-btn-disabled-bg: var(--ls-brand);
    --bs-btn-disabled-border-color: var(--ls-brand);
    --bs-btn-focus-shadow-rgb: var(--ls-brand-rgb);
}

.btn-outline-primary {
    --bs-btn-color: var(--ls-brand);
    --bs-btn-border-color: var(--ls-brand);
    --bs-btn-hover-bg: var(--ls-brand);
    --bs-btn-hover-border-color: var(--ls-brand);
    --bs-btn-active-bg: var(--ls-brand-dark);
    --bs-btn-active-border-color: var(--ls-brand-dark);
    --bs-btn-disabled-color: var(--ls-brand);
    --bs-btn-disabled-border-color: var(--ls-brand);
    --bs-btn-focus-shadow-rgb: var(--ls-brand-rgb);
}

[data-bs-theme="dark"] .btn-outline-primary {
    --bs-btn-color: #5cb1cb;
    --bs-btn-border-color: #3d8aa3;
}

.btn-outline-secondary {
    --bs-btn-color: var(--bs-secondary-color);
    --bs-btn-border-color: var(--bs-border-color);
    --bs-btn-hover-bg: var(--bs-secondary-bg);
    --bs-btn-hover-color: rgb(var(--bs-link-color-rgb));
    --bs-btn-hover-border-color: var(--bs-border-color);
    --bs-btn-active-bg: var(--bs-secondary-bg);
    --bs-btn-active-color: rgb(var(--bs-link-color-rgb));
    --bs-btn-active-border-color: var(--bs-border-color);
    --bs-btn-focus-shadow-rgb: var(--ls-brand-rgb);
}

/* ===== Form e componenti che in Bootstrap hanno il blu fisso ===== */
.form-control:focus,
.form-select:focus {
    border-color: var(--ls-brand);
    box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
}

.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate {
    background-color: var(--ls-brand);
    border-color: var(--ls-brand);
}

.form-check-input:focus {
    border-color: var(--ls-brand);
    box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
}

.form-switch .form-check-input:focus:not(:checked) {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%230a6c8a'/%3e%3c/svg%3e");
}

.nav-pills { --bs-nav-pills-link-active-bg: var(--ls-brand); }
.dropdown-menu { --bs-dropdown-link-active-bg: var(--ls-brand); }
.list-group { --bs-list-group-active-bg: var(--ls-brand); --bs-list-group-active-border-color: var(--ls-brand); }
.progress { --bs-progress-bar-bg: var(--ls-brand); }

.pagination {
    --bs-pagination-color: rgb(var(--bs-link-color-rgb));
    --bs-pagination-hover-color: rgb(var(--bs-link-hover-color-rgb));
    --bs-pagination-focus-color: rgb(var(--bs-link-hover-color-rgb));
    --bs-pagination-focus-box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
    --bs-pagination-active-bg: var(--ls-brand);
    --bs-pagination-active-border-color: var(--ls-brand);
}

/* ===== Pagine di autenticazione (login, recupero password, 2FA) ===== */
.auth-page {
    background: var(--ls-page-bg);
    background-attachment: fixed;
}

.auth-card { max-width: 440px; border-radius: 1rem; }
[data-bs-theme="dark"] .auth-card { --bs-card-bg: #1a2229; }
.auth-card-wide { max-width: 600px; }
.auth-logo { border-radius: .85rem; background: var(--ls-ink); }

/* Un solo anello di focus per l'intero gruppo icona + campo + occhio */
.auth-page .input-group { border-radius: var(--bs-border-radius-lg); }
.auth-page .input-group:focus-within { box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color); }
.auth-page .input-group:focus-within > .form-control,
.auth-page .input-group:focus-within > .input-group-text,
.auth-page .input-group:focus-within > .btn {
    border-color: var(--ls-brand);
}
.auth-page .form-control:focus { box-shadow: none; }
.auth-page .input-group > .form-control { border-left: 0; }
.auth-page .input-group > .input-group-text { border-right: 0; }
.auth-page .input-group > .btn { border-left: 0; }

.auth-code-input { letter-spacing: .25rem; text-align: center; }
.auth-qr { max-width: 220px; }
.auth-steps > li { list-style: none; }
.auth-steps > li.active { background: var(--bs-primary-bg-subtle); color: var(--bs-primary-text-emphasis); font-weight: 600; }

/* Selettore tema fisso in alto a destra */
.theme-switch { position: fixed; top: .75rem; right: .75rem; z-index: 1030; }

/* ======================================================================
 * Componenti di terze parti allineati ai token (chiaro/scuro)
 * ====================================================================== */

/* ===== DataTables 2 (solo core: qui il look Bootstrap; selettori allineati per specificita' a datatables.min.css) ===== */
:root { --dt-row-selected: var(--ls-brand-rgb); }
[data-bs-theme="dark"] { --dt-html-background: var(--bs-body-bg); --dt-row-stripe: 255, 255, 255; --dt-row-hover: 255, 255, 255; --dt-column-ordering: 255, 255, 255; }

body div.dt-container { font-size: .9rem; }
body div.dt-container .dt-layout-row { gap: .5rem; align-items: center; }
body div.dt-container .dt-input,
body div.dt-container .dt-search input {
    padding: .25rem .5rem;
    color: var(--bs-body-color);
    background-color: var(--bs-body-bg);
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
}
body div.dt-container select.dt-input { padding: .25rem 1.75rem .25rem .5rem; }
body div.dt-container .dt-input:focus,
body div.dt-container .dt-search input:focus {
    outline: 0;
    border-color: var(--ls-brand);
    box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
}
body div.dt-container .dt-search input { margin-left: .5rem; }
body div.dt-container .dt-length select { margin-right: .5rem; }
body div.dt-container .dt-info { color: var(--bs-secondary-color); }

body div.dt-container .dt-paging { display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem; }
body div.dt-container .dt-paging .dt-paging-button {
    min-width: 2.25rem;
    margin-left: 0;
    padding: .25rem .6rem;
    color: rgb(var(--bs-link-color-rgb)) !important;
    background: var(--bs-body-bg);
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
}
body div.dt-container .dt-paging .dt-paging-button:hover:not(.disabled):not(.current) {
    color: rgb(var(--bs-link-hover-color-rgb)) !important;
    background: var(--bs-tertiary-bg);
    border-color: var(--bs-border-color);
}
body div.dt-container .dt-paging .dt-paging-button:active:not(.disabled) { background: var(--bs-secondary-bg); box-shadow: none; }
body div.dt-container .dt-paging .dt-paging-button.current,
body div.dt-container .dt-paging .dt-paging-button.current:hover {
    color: #fff !important;
    background: var(--ls-brand);
    border-color: var(--ls-brand);
}
body div.dt-container .dt-paging .dt-paging-button.disabled,
body div.dt-container .dt-paging .dt-paging-button.disabled:hover,
body div.dt-container .dt-paging .dt-paging-button.disabled:active {
    color: var(--bs-secondary-color) !important;
    background: transparent;
    opacity: .6;
}

body table.dataTable > thead > tr > th,
body table.dataTable > thead > tr > td { border-bottom-color: var(--bs-border-color); }
body table.dataTable thead th { background-color: var(--bs-tertiary-bg); }

/* ===== Select2 (tema "default" reso come un form-select Bootstrap) ===== */
body .select2-container--default .select2-selection--single,
body .select2-container--default .select2-selection--multiple {
    min-height: calc(1.5em + .75rem + var(--bs-border-width) * 2);
    color: var(--bs-body-color);
    background-color: var(--bs-body-bg);
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
}
body .select2-container--default .select2-selection--single { display: flex; align-items: center; }
body .select2-container--default .select2-selection--single .select2-selection__rendered {
    flex: 1 1 auto; padding-left: .75rem; padding-right: 2rem; line-height: 1.5; color: var(--bs-body-color);
}
body .select2-container--default .select2-selection--single .select2-selection__placeholder { color: var(--bs-secondary-color); }
body .select2-container--default .select2-selection--single .select2-selection__arrow { top: 0; height: 100%; right: .5rem; }
body .select2-container--default .select2-selection--multiple { padding: .15rem .35rem; }
body .select2-container--default.select2-container--focus .select2-selection--multiple,
body .select2-container--default.select2-container--open .select2-selection--single,
body .select2-container--default.select2-container--open .select2-selection--multiple,
body .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--ls-brand);
    box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
}
body .select2-container--default .select2-selection--multiple .select2-selection__choice {
    color: var(--bs-primary-text-emphasis);
    background-color: var(--bs-primary-bg-subtle);
    border: var(--bs-border-width) solid var(--bs-primary-border-subtle);
    border-radius: var(--bs-border-radius-sm);
}
body .select2-dropdown {
    color: var(--bs-body-color);
    background-color: var(--bs-body-bg);
    border-color: var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    overflow: hidden;
}
body .select2-container--default .select2-search--dropdown .select2-search__field {
    color: var(--bs-body-color);
    background-color: var(--bs-body-bg);
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius-sm);
}
body .select2-container--default .select2-results__option--highlighted[aria-selected],
body .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    color: #fff;
    background-color: var(--ls-brand);
}
body .select2-container--default .select2-results__option[aria-selected=true],
body .select2-container--default .select2-results__option--selected { background-color: var(--bs-secondary-bg); color: var(--bs-body-color); }
body .select2-container--default .select2-selection--single .select2-selection__clear { color: var(--bs-secondary-color); }

/* ===== Toastr: colori semantici Bootstrap ===== */
body #toast-container > div { border-radius: var(--bs-border-radius-lg); box-shadow: var(--bs-box-shadow); opacity: .97; }
body #toast-container > .toast-success { background-color: var(--bs-success); }
body #toast-container > .toast-error { background-color: var(--bs-danger); }
body #toast-container > .toast-info { background-color: var(--ls-brand); }
body #toast-container > .toast-warning { background-color: var(--bs-warning); color: #000; }

/* ===== flatpickr ===== */
body .flatpickr-day.selected,
body .flatpickr-day.startRange,
body .flatpickr-day.endRange,
body .flatpickr-day.selected:hover,
body .flatpickr-day.startRange:hover,
body .flatpickr-day.endRange:hover {
    background: var(--ls-brand);
    border-color: var(--ls-brand);
}
body .flatpickr-day.today { border-color: var(--ls-brand); }
body .flatpickr-day.today:hover { background: var(--ls-brand); color: #fff; }
[data-bs-theme="dark"] body .flatpickr-calendar { background: var(--bs-body-bg); color: var(--bs-body-color); border: 1px solid var(--bs-border-color); box-shadow: var(--bs-box-shadow); }
[data-bs-theme="dark"] body .flatpickr-day,
[data-bs-theme="dark"] body .flatpickr-weekday,
[data-bs-theme="dark"] body .flatpickr-current-month,
[data-bs-theme="dark"] body .flatpickr-monthDropdown-months { color: var(--bs-body-color); background: transparent; }

/* ===== FilePond ===== */
body .filepond--root { font-family: inherit; }
body .filepond--panel-root { background-color: var(--bs-tertiary-bg); }
body .filepond--drop-label { color: var(--bs-secondary-color); }
body .filepond--drop-label label { cursor: pointer; }
body .filepond--file { background-color: var(--ls-brand); }
body .filepond--file-action-button:focus,
body .filepond--file-action-button:hover { box-shadow: 0 0 0 .125rem #fff; }

/* ===== Convenzioni comuni ===== */
.card { --bs-card-border-color: var(--bs-border-color); --bs-card-cap-bg: var(--bs-tertiary-bg); }
.table { --bs-table-hover-bg: rgba(var(--ls-brand-rgb), .06); }
.breadcrumb a { text-decoration: none; }
.alert-info { --bs-alert-color: var(--bs-primary-text-emphasis); --bs-alert-bg: var(--bs-primary-bg-subtle); --bs-alert-border-color: var(--bs-primary-border-subtle); }

/* ======================================================================
 * Guscio del portale: topbar, sidebar, area pagina (sostituisce theme-layout.min.css e style.min.css).
 * Le classi/attributi (#main-wrapper[data-sidebartype], .show-sidebar, .selected/.active/.in) sono
 * gestiti da sidebarmenu.js e custom.min.js: non rinominarli senza toccare il JS.
 * ====================================================================== */
:root { --ls-sidebar-w: 250px; --ls-sidebar-w-mini: 65px; --ls-topbar-h: 64px; }
:root { --ls-ink: #1f262d; --ls-page: #eef2f6; }
[data-bs-theme="dark"] { --ls-ink: #171d23; --ls-page: #0e1317; }

html { position: relative; min-height: 100%; }
body { margin: 0; overflow-x: hidden; }
label:not(.form-check-label):not(.btn) { font-weight: 600; }

#main-wrapper { width: 100%; overflow: hidden; }
.page-wrapper { position: relative; background: var(--ls-page); }
.page-wrapper > .container-fluid,
.page-wrapper > .container-lg, .page-wrapper > .container-md, .page-wrapper > .container-sm,
.page-wrapper > .container-xl, .page-wrapper > .container-xxl { padding: 20px; min-height: calc(100vh - 180px); }
.page-breadcrumb { padding: 20px 20px 0 20px; }
.page-breadcrumb .page-title { margin-bottom: 0; }
.footer { padding: 15px 20px; }

/* ----- Topbar ----- */
.topbar { position: relative; z-index: 50; height: var(--ls-topbar-h); background: var(--ls-ink); box-shadow: 0 1px 0 rgba(255, 255, 255, .06), 0 2px 8px rgba(0, 0, 0, .12); }
.topbar .top-navbar { min-height: var(--ls-topbar-h); padding: 0; }
.topbar .top-navbar .navbar-header { background: var(--ls-ink); }
.topbar .dropdown-toggle::after { display: none; }
.topbar .nav-toggler { color: #fff; padding: 0 15px; }
#navbarSupportedContent { background: var(--ls-ink) !important; }
.top-navbar .app-search { z-index: 110; width: 100%; top: -1px; left: 0; display: none; box-shadow: var(--bs-box-shadow); }
.top-navbar .app-search .form-control { padding: 32px; border-radius: 0; transition: .2s ease-in; }
.top-navbar .app-search .form-control:focus { border-color: transparent; }
.top-navbar .app-search .srh-btn { position: absolute; top: 23px; right: 20px; cursor: pointer; }

/* ----- Sidebar ----- */
.left-sidebar { position: absolute; width: var(--ls-sidebar-w); height: 100%; top: 0; z-index: 10; padding-top: var(--ls-topbar-h); background: var(--ls-ink); transition: left .2s ease; }
.scroll-sidebar { height: calc(100% - 20px); position: relative; }
.sidebar-nav ul { margin: 0; padding: 0; background: transparent; }
.sidebar-nav ul li { list-style: none; }
.sidebar-nav ul .sidebar-item .sidebar-link {
    display: flex; align-items: center; margin: 2px .6rem; padding: .6rem .75rem;
    color: #fff; opacity: .72; white-space: nowrap; line-height: 25px; border-radius: var(--bs-border-radius);
    transition: background-color .15s ease, opacity .15s ease;
}
.sidebar-nav ul .sidebar-item .sidebar-link i { display: inline-block; width: 35px; font-size: 1.35rem; font-style: normal; line-height: 25px; text-align: center; color: #fff; }
.sidebar-nav ul .sidebar-item .sidebar-link:hover { opacity: 1; background: rgba(255, 255, 255, .07); }
.sidebar-nav ul .sidebar-item .sidebar-link.active { opacity: 1; }
.sidebar-nav ul .sidebar-item.selected > .sidebar-link { opacity: 1; background: var(--ls-brand); }
.sidebar-nav ul .sidebar-item .first-level { padding: 0 0 .5rem; }
.sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link { padding: .45rem .75rem .45rem 1.25rem; }
.sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link i { font-size: .95rem; }
.sidebar-nav ul .sidebar-item .first-level .sidebar-item.active .sidebar-link { opacity: 1; background: rgba(255, 255, 255, .1); }
.collapse.in { display: block; }
.sidebar-nav .has-arrow { position: relative; }
.sidebar-nav .has-arrow::after {
    position: absolute; content: ""; top: 26px; right: 15px; width: 7px; height: 7px; margin-left: 10px;
    border: solid #fff; border-width: 1px 0 0 1px; transform: rotate(135deg) translate(0, -50%); transform-origin: top; transition: all .3s ease-out;
}
.sidebar-nav .has-arrow[aria-expanded="true"]::after,
.sidebar-nav li.active > .has-arrow::after,
.sidebar-nav li > .has-arrow.active::after { transform: rotate(-135deg) translate(0, -50%); }

#main-wrapper[data-sidebartype="full"] .page-wrapper { margin-left: var(--ls-sidebar-w); }
@media (min-width: 768px) {
    #main-wrapper[data-layout="vertical"][data-sidebartype="full"] .topbar .top-navbar .navbar-header { width: var(--ls-sidebar-w); }
    #main-wrapper[data-layout="vertical"][data-sidebartype="mini-sidebar"] .topbar .top-navbar .navbar-header { width: var(--ls-sidebar-w-mini); }
    #main-wrapper[data-layout="vertical"][data-sidebartype="mini-sidebar"] .topbar .top-navbar .navbar-header .logo-text { display: none; }
    #main-wrapper[data-layout="vertical"][data-sidebar-position="fixed"][data-sidebartype="full"] .topbar .top-navbar .navbar-collapse { margin-left: var(--ls-sidebar-w); }
    #main-wrapper[data-layout="vertical"][data-sidebar-position="fixed"][data-sidebartype="mini-sidebar"] .topbar .top-navbar .navbar-collapse { margin-left: var(--ls-sidebar-w-mini); }
    #main-wrapper[data-layout="vertical"][data-sidebartype="mini-sidebar"] .page-wrapper { margin-left: var(--ls-sidebar-w-mini); }
    #main-wrapper[data-layout="vertical"][data-sidebartype="mini-sidebar"] .left-sidebar { width: var(--ls-sidebar-w-mini); }
    #main-wrapper[data-layout="vertical"][data-sidebartype="mini-sidebar"] .sidebar-nav .has-arrow::after,
    #main-wrapper[data-layout="vertical"][data-sidebartype="mini-sidebar"] .sidebar-nav .hide-menu { display: none; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
    #main-wrapper[data-sidebartype="mini-sidebar"] .sidebar-nav ul .sidebar-item { width: var(--ls-sidebar-w-mini); }
}
@media (max-width: 767px) {
    #main-wrapper[data-sidebartype="mini-sidebar"] .left-sidebar { left: calc(var(--ls-sidebar-w) * -1); }
    #main-wrapper.show-sidebar .left-sidebar { left: 0; }
    #main-wrapper[data-layout="vertical"][data-sidebar-position="fixed"] .topbar .top-navbar .navbar-collapse,
    #main-wrapper[data-layout="vertical"][data-header-position="fixed"][data-sidebar-position="fixed"] .topbar .top-navbar .navbar-collapse { position: relative; top: var(--ls-topbar-h); }
}

/* ----- Preloader, card, ripple ----- */
.preloader { position: fixed; top: 0; width: 100%; height: 100%; z-index: 99999; background: var(--bs-body-bg); }
.lds-ripple { display: inline-block; position: absolute; width: 64px; height: 64px; top: calc(50% - 3.5px); left: calc(50% - 3.5px); }
.lds-ripple .lds-pos { position: absolute; border: 2px solid var(--ls-brand); opacity: 1; border-radius: 50%; animation: lds-ripple 1s cubic-bezier(0, .1, .5, 1) infinite; }
.lds-ripple .lds-pos:nth-child(2) { animation-delay: -.5s; }
@keyframes lds-ripple {
    0% { top: 28px; left: 28px; width: 0; height: 0; opacity: 0; }
    5% { top: 28px; left: 28px; width: 0; height: 0; opacity: 1; }
    to { top: -1px; left: -1px; width: 58px; height: 58px; opacity: 0; }
}
.card { --bs-card-border-radius: .75rem; --bs-card-inner-border-radius: calc(.75rem - 1px); box-shadow: 0 1px 2px rgba(16, 24, 40, .05); }
.card-hover { transition: all .25s ease; }
.card-hover:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 14px 24px rgba(16, 24, 40, .12); }
.waves-effect { position: relative; cursor: pointer; overflow: hidden; user-select: none; -webkit-tap-highlight-color: transparent; z-index: 1; transition: all .1s ease-out; }
.waves-effect .waves-ripple { position: absolute; width: 20px; height: 20px; margin-top: -10px; margin-left: -10px; border-radius: 50%; opacity: 0; background: rgba(0, 0, 0, .2); transform: scale(0); transition: all .7s ease-out; transition-property: transform, opacity; pointer-events: none; }
.waves-effect.waves-light .waves-ripple { background-color: rgba(255, 255, 255, .35); }

/* ----- Utility e residui ancora in uso ----- */
.nowrap { white-space: nowrap; }
.font-light { font-weight: 300; }
.font-medium { font-weight: 600; }
.thumb-sm { height: 32px; width: 32px; }
.scrollable { position: relative; }
.btn-danger, .btn-info { --bs-btn-color: #fff; --bs-btn-hover-color: #fff; --bs-btn-active-color: #fff; }
.dropzone { border: 2px dotted var(--bs-border-color); }
.error .form-control { border-color: var(--bs-danger); }
.validate .form-control { border-color: var(--bs-success); }
.comment-widgets { position: relative; margin-bottom: 10px; }
.comment-widgets .comment-row { display: flex; margin: 10px 0; padding: 14px; border-bottom: 1px solid transparent; }
.comment-widgets .comment-row:last-child { border-bottom: 0; }
.comment-widgets .comment-row.active, .comment-widgets .comment-row:hover { background: rgba(var(--bs-emphasis-color-rgb), .05); }
.comment-text { padding-left: 15px; }
.comment-text p { max-height: 65px; width: 100%; overflow: hidden; }
.list-task .task-done .badge, .list-task .task-done .todo-desc { text-decoration: line-through; }
/* perfect-scrollbar (plugin jQuery ancora caricato da template.html) */
.ps-container { touch-action: auto; overflow: hidden !important; }
.ps-container > .ps-scrollbar-x-rail, .ps-container > .ps-scrollbar-y-rail { display: none; position: absolute; opacity: 0; transition: opacity .2s linear; }
.ps-container.ps-active-x > .ps-scrollbar-x-rail, .ps-container.ps-active-y > .ps-scrollbar-y-rail { display: block; }
.ps-container > .ps-scrollbar-x-rail { bottom: 0; height: 15px; }
.ps-container > .ps-scrollbar-y-rail { right: 3px; width: 8px; border-radius: 4px; }
.ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x, .ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y { position: absolute; border-radius: 6px; background-color: rgba(0, 0, 0, .2); }
.ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x { bottom: 2px; height: 6px; }
.ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y { right: 2px; width: 6px; }
.ps-container:hover > .ps-scrollbar-x-rail, .ps-container:hover > .ps-scrollbar-y-rail { opacity: .6; }

/* ======================================================================
 * Componenti riutilizzabili (ex blocchi <style> e attributi style= delle pagine)
 * ====================================================================== */

/* Utility mancanti in Bootstrap */
.cursor-pointer { cursor: pointer; }
.ls-pre-wrap { white-space: pre-wrap; }
.ls-pre-line { white-space: pre-line; }
.msg-preview { white-space: pre-wrap; }
.ls-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--bs-secondary-color); }

/* Editor (CKEditor 5) */
#editor1 { display: none; }
.ck-editor__editable_inline { min-height: 30em; }
.ck-editor__editable { min-height: 200px; background: var(--bs-body-bg); }

/* Colonna laterale appiccicosa. #main-wrapper ha overflow:hidden (serve al menu mobile) e
   questo impedirebbe a position:sticky di agganciarsi: lo si neutralizza solo da lg in su
   e solo nelle pagine che contengono una .sidebar-sticky. */
.sidebar-sticky { position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; }
@media (min-width: 992px) {
    #main-wrapper:has(.sidebar-sticky) { overflow: visible; }
}

/* Barra strumenti con controlli a tutta larghezza su mobile */
.toolbar-control { width: 100%; }
@media (min-width: 576px) {
    .toolbar-control { width: auto; }
    .toolbar-control.toolbar-strategy-select { width: 140px; }
    .toolbar-control.toolbar-import-file { max-width: 260px; }
}

/* Tile KPI cliccabili */
.kpi-tile { border-left: 3px solid var(--bs-secondary); cursor: pointer; }
.kpi-tile.kpi-scadute { border-left-color: var(--bs-danger); }
.kpi-tile.kpi-scadenza { border-left-color: var(--bs-warning); }
.kpi-tile.kpi-corso { border-left-color: var(--bs-info); }
.kpi-tile.kpi-registrate { border-left-color: var(--bs-success); }
.kpi-tile .kpi-num { font-size: 1.6rem; font-weight: 600; line-height: 1; font-variant-numeric: tabular-nums; }
.col-giorni { font-variant-numeric: tabular-nums; }
.tabellaRegistrazioni td, .tabellaRegistrazioni th { white-space: nowrap; }

/* Select2 multiplo "a chip" (destinatari email e simili): sostituisce lo stile inline applicato dal JS */
body .ls-select2-tags .select2-selection--multiple { height: auto; min-height: calc(2.25rem + 2px); padding: .125rem .375rem; }
body .ls-select2-tags .select2-selection__rendered { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; margin: 0; padding: 0; }
body .ls-select2-tags .select2-selection__choice { margin: 0; max-width: 100%; padding: .125rem .3125rem; font-size: .875rem; white-space: normal; }
body .ls-select2-tags .select2-search--inline { margin: 0; }
body .ls-select2-tags .select2-selection__choice__remove { margin-right: .25rem; padding: 0; color: inherit; background: transparent; border-right: 0; }
body .ls-select2-tags .select2-selection__clear { display: none; }

/* ======================================================================
 * Ex custom.css: offset header/sidebar fissi (banner manutenzione) e utility di pagina
 * ====================================================================== */
.module-editor-height {
	min-height: 300px;
}

/* Dropdown notifiche messaggi nell'header: senza un limite di altezza la lista
   cresce quanto i messaggi ricevuti e spinge "Vedi tutti i messaggi" fuori
   dallo schermo. Lo scroll resta nella lista, il link in fondo è sempre
   raggiungibile. */
#msgNotifList {
	max-height: 60vh;
	overflow-y: auto;
}

/* Sidebar e header fissi (Bootstrap 5 position-fixed): il contenuto scorre in
   modo indipendente. L'header esce dal flusso normale, quindi il page-wrapper
   deve recuperare lo spazio (64px = altezza .topbar). position:sticky non è
   utilizzabile qui perché #main-wrapper ha overflow:hidden (necessario per il
   menu off-canvas mobile), il che impedisce allo sticky di agganciarsi.
   --maintenance-banner-height viene impostata da maintenance-banner.js quando
   il banner di manutenzione è visibile, per non farlo coprire dall'header/
   sidebar fissi (la sua altezza varia in base al testo e alla larghezza).
   La sidebar (.left-sidebar) ha overflow-y-auto sull'elemento stesso: se le
   riservassimo lo spazio dell'header con un padding-top, come per .page-wrapper,
   la sua area di scroll (e quindi la scrollbar nativa) partirebbe comunque da
   top:0, cioè da sotto l'header, restando in parte coperta da esso. Per questo
   qui non usiamo padding ma spostiamo l'intero box con top/height, cosi'
   l'area scrollabile (scrollbar inclusa) inizia esattamente sotto l'header. */
:root {
	--maintenance-banner-height: 0px;
}

.topbar {
	top: var(--maintenance-banner-height);
}

.left-sidebar {
	top: calc(64px + var(--maintenance-banner-height));
	height: calc(100vh - 64px - var(--maintenance-banner-height));
	padding-top: 0;
}

.page-wrapper {
	padding-top: calc(64px + var(--maintenance-banner-height));
}

.feature-col-id {
	width: 60px;
}

.feature-col-type {
	width: 130px;
}

.feature-col-actions {
	width: 120px;
}

.whatsapp-qr-image {
	max-width: 300px;
}

.diagnostics-sessions {
	font-size: 0.85rem;
	max-height: 200px;
	overflow: auto;
}

.diagnostics-key {
	width: 40%;
}

.breadcrumb a {
	text-decoration: none;
}

/* Icone: modificatori che Bootstrap Icons non fornisce */
.bi-spin::before { display: inline-block; animation: ls-spin 1s linear infinite; }
.bi-rotate-180::before { display: inline-block; transform: rotate(180deg); }
@keyframes ls-spin { to { transform: rotate(360deg); } }

/* Tema scuro: i link/testi "primary" usano la variante chiara, altrimenti il petrolio e' illeggibile su fondo scuro */
[data-bs-theme="dark"] .text-primary { color: rgb(var(--bs-link-color-rgb)) !important; }
[data-bs-theme="dark"] .btn-outline-primary, [data-bs-theme="dark"] .border-primary { --bs-btn-hover-color: #fff; }

/* FullCalendar: variabili native allineate ai token (chiaro e scuro) */
.fc { --fc-border-color: var(--bs-border-color); --fc-page-bg-color: var(--bs-body-bg); --fc-neutral-bg-color: var(--bs-tertiary-bg);
      --fc-neutral-text-color: var(--bs-secondary-color); --fc-today-bg-color: rgba(var(--ls-brand-rgb), .12);
      --fc-list-event-hover-bg-color: var(--bs-tertiary-bg); --fc-button-bg-color: var(--ls-brand); --fc-button-border-color: var(--ls-brand);
      --fc-button-hover-bg-color: var(--ls-brand-dark); --fc-button-hover-border-color: var(--ls-brand-dark);
      --fc-button-active-bg-color: var(--ls-brand-dark); --fc-button-active-border-color: var(--ls-brand-dark); }
[data-bs-theme="dark"] .fc .fc-col-header-cell, [data-bs-theme="dark"] .fc .fc-scrollgrid-section-header > * { background: var(--bs-tertiary-bg); }
[data-bs-theme="dark"] .fc .fc-col-header-cell-cushion, [data-bs-theme="dark"] .fc .fc-timegrid-slot-label-cushion, [data-bs-theme="dark"] .fc .fc-daygrid-day-number { color: var(--bs-body-color); }

/* Menu azioni nelle tabelle responsive: la cella con il dropdown aperto sta sopra le sticky */
.table-responsive td:has(> .dropdown > .dropdown-menu.show) { z-index: 1060 !important; }