/* ==========================================================
 * styles.css — File di personalizzazione del progetto. SI CARICA SEMPRE PER ULTIMO (inc/mainhead.php).
 *
 * Il tema è Zeno COMPLETO (assets/css/zeno.min.css): layout, componenti, tema scuro. Qui SOLO override globali, per sezione:
 *   1. Colori del brand               5. Tema scuro (ponte Bootstrap ↔ Zeno)
 *   2. Fondo pagina e card            6. Compatibilità SweetAlert2 e toastr
 *   3. Shell: marchio, header         7. Pagine di accesso e pagina d'errore
 *   4. Shell: banner, schermo intero  8. Utility dei componenti (lib/ui_zeno.php), cookie banner, loader
 *   …poi le sezioni dei workstream (WS-A …). Gli stili di una sola pagina vanno nel CSS del suo workstream
 *   (dashboard.css, messaggi.css, checkin.css, …), mai qui e mai inline. Guida: scratchpad/zeno/GUIDA_COMPONENTI.md
 * ========================================================== */

/* 1. Colori del brand ---------------------------------------------------------------------------------------------------
 * Primario = viola Zeno (decisione 2026-10-06): per cambiarlo ridefinire --primary-rgb qui. Bootstrap eredita il primario.
 * "secondary" grigio ardesia (in Zeno è rosa): le pagine lo usano come neutro (btn-secondary-light, bg-secondary-transparent). */
:root {
    /* --primary-rgb: 121, 97, 245; */
    --bs-primary-rgb: var(--primary-rgb);
    --bs-primary: rgb(var(--primary-rgb));
    --secondary-rgb: 100, 116, 139;
    --bs-secondary-rgb: var(--secondary-rgb);
}

/* 2. Fondo pagina e card --------------------------------------------------------------------------------------------------
 * Fondo grigio di Zeno (--default-body-bg-color) sotto la shell; le card dei contenuti sono "card custom-card" (senza bordo,
 * ombra leggera). Le KPI (zenoKpi) riempiono l'altezza della riga. */
body { background-color: var(--default-body-bg-color); }
.row > [class*="col"] > .card.custom-card.zeno-kpi { height: calc(100% - 1.5rem); }
.zeno-grafico { min-height: 1px; }

/* 3. Shell: marchio testuale (sempre APP_NAME, nessun logo immagine) e header ------------------------------------------------ */
.header-logo { text-decoration: none; }
.header-logo .logo-testo { font-size: 1.25rem; font-weight: 600; color: var(--default-text-color); white-space: nowrap; line-height: 2rem; }
.header-logo .logo-iniziale { width: 2rem; height: 2rem; line-height: 2rem; border-radius: 0.5rem; text-align: center; font-weight: 600;
    background: rgb(var(--primary-rgb)); color: #fff; }
.header-tenant { max-width: 22rem; color: var(--header-prime-color); }
/* Pulsanti dell'header: <button> al posto degli <a href="javascript:void(0)"> del template (CSP: niente URL javascript:) */
button.header-link { border: 0; background: transparent; }
/* Notifiche: classe propria (Zeno nasconde .notifications-dropdown sotto 576px) */
.header-notifiche .main-header-dropdown { width: 22rem; max-width: calc(100vw - 1rem); }
#header-notification-scroll { max-height: 20rem; }
.header-notification-testo { white-space: normal; }
/* Ricerca dell'header (zeno-init.js): tendina dei risultati sotto il campo */
.header-search .header-ricerca-risultati { width: 26rem; max-width: 90vw; max-height: 70vh; overflow-y: auto; inset-inline-start: 0; inset-block-start: 100%; margin-top: 0.25rem; }
.header-search .header-ricerca-risultati .dropdown-item { white-space: normal; }

/* 4. Shell: banner di stato e schermo intero ---------------------------------------------------------------------------------
 * Il banner (inc/banner_stato.php) sta tra sidebar e contenuto ma non ha .app-content: stessi margini a mano. */
@media (min-width: 992px) {
    .main-content.banner-stato { margin-block-start: 4.25rem; margin-inline-start: 15rem; padding-block-start: 1rem; transition: all 0.05s ease; }
    [data-toggled="icon-overlay-close"] .main-content.banner-stato { margin-inline-start: 5rem; }
    .banner-stato + .main-content.app-content { margin-block-start: 0; }
}
@media (max-width: 991.98px) {
    .main-content.banner-stato { padding-block-end: 0; }
    .banner-stato + .main-content { padding-block-start: 0.5rem; }
}
/* Dashboard live a schermo intero (dashboard-live.js: body.schermo-intero): via header, sidebar, banner e margini della shell */
body.schermo-intero .app-header,
body.schermo-intero .footer,
body.schermo-intero .banner-stato { display: none; }
body.schermo-intero .main-content.app-content { margin-inline-start: 0; margin-block-start: 0; padding-block-start: 1rem; }
/* Barre di scorrimento sottili ma visibili nei box scorrevoli (Zeno le azzera a larghezza 0) */
body ::-webkit-scrollbar { width: 0.375rem; }
body ::-webkit-scrollbar-thumb { background: var(--input-border); border-radius: 0.25rem; }

/* 5. Tema scuro --------------------------------------------------------------------------------------------------------------
 * Zeno usa html[data-theme-mode="dark"] (tema.js + toggleDarkMode di main.js); Bootstrap non lo conosce (usa data-bs-theme) e le
 * sue variabili resterebbero chiare: ponte verso le variabili di Zeno. Nei CSS di pagina usare SEMPRE le variabili
 * (--default-text-color, --default-border, --custom-white, rgb(var(--body-bg-rgb)), --text-muted), mai colori fissi. */
[data-theme-mode="dark"] {
    --bs-body-color: var(--default-text-color);
    --bs-body-color-rgb: 255, 255, 255;
    --bs-body-bg: rgb(var(--body-bg-rgb2));
    --bs-emphasis-color: #fff;
    --bs-heading-color: inherit;
    --bs-secondary-color: var(--text-muted);
    --bs-secondary-bg: rgb(var(--light-rgb));
    --bs-tertiary-bg: rgb(var(--body-bg-rgb));
    --bs-border-color: var(--default-border);
    --bs-card-color: var(--default-text-color);
}

/* 6. Compatibilità SweetAlert2 e toastr ---------------------------------------------------------------------------------------
 * SweetAlert2: stile Zeno già in zeno.min.css (z-index 1060 > header 100 / modali 1055). toastr: colori Zeno, font del tema,
 * sopra header e modali. */
#toast-container { z-index: 1090; }
#toast-container > div { opacity: 0.97; font-family: var(--default-font-family); border-radius: 0.5rem; box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.12); }
#toast-container > .toast-success { background-color: rgb(var(--success-rgb)); }
#toast-container > .toast-error { background-color: rgb(var(--danger-rgb)); }
#toast-container > .toast-info { background-color: rgb(var(--info-rgb)); }
#toast-container > .toast-warning { background-color: rgb(var(--warning-rgb)); }
[data-theme-mode="dark"] .swal2-popup { background: rgb(var(--body-bg-rgb)); color: var(--default-text-color); }
[data-theme-mode="dark"] .swal2-title, [data-theme-mode="dark"] .swal2-html-container { color: var(--default-text-color); }

/* 7. Pagine di accesso e pagina d'errore ---------------------------------------------------------------------------------- */
.auth-marchio { font-size: 1.5rem; font-weight: 600; color: var(--default-text-color); text-decoration: none; }
.auth-marchio:hover { color: rgb(var(--primary-rgb)); }
/* Mostra/nascondi password: <button> al posto dell'<a onclick> del template (CSP) */
.show-password-button { border: 0; background: transparent; padding: 0.375rem 0.5rem; }
/* inc/error_page.php: sfondo a tinta del brand al posto della foto demo del template */
.error-bg { background: linear-gradient(135deg, rgb(var(--primary-rgb)) 0%, #241c4f 100%); }
.error-bg::before { display: none; }

/* 8. Utility dei componenti di lib/ui_zeno.php -------------------------------------------------------------------------------
 * zenoProgresso(): larghezza delle barre senza style inline, a passi di 5; .zeno-col-barra = colonna di tabella con barra; .zeno-col-testo = colonna che va a capo. */
.zeno-w-0 { width: 0%; } .zeno-w-5 { width: 5%; } .zeno-w-10 { width: 10%; } .zeno-w-15 { width: 15%; } .zeno-w-20 { width: 20%; } .zeno-w-25 { width: 25%; } .zeno-w-30 { width: 30%; } .zeno-w-35 { width: 35%; } .zeno-w-40 { width: 40%; } .zeno-w-45 { width: 45%; } .zeno-w-50 { width: 50%; } .zeno-w-55 { width: 55%; } .zeno-w-60 { width: 60%; } .zeno-w-65 { width: 65%; } .zeno-w-70 { width: 70%; } .zeno-w-75 { width: 75%; } .zeno-w-80 { width: 80%; } .zeno-w-85 { width: 85%; } .zeno-w-90 { width: 90%; } .zeno-w-95 { width: 95%; } .zeno-w-100 { width: 100%; }
.zeno-col-barra { min-width: 8rem; }
.table td.zeno-col-testo { white-space: normal; min-width: 11rem; }   /* colonna testuale che può andare a capo in una .table.text-nowrap */
/* zenoKpi(…, ['compatto' => true]) / ZenoUI.kpi(…, {compatto: true}): KPI piccoli (6 per riga) */
.zeno-kpi-compatto .card-body { padding: 1rem; }
.min-w-0 { min-width: 0; }
/* zenoAttivita() / ZenoUI.attivita(): "Recent Activity" con il segno del colore della voce (zeno-att-<colore>) al posto della sequenza fissa del tema */
ul.recent-activity-sales-list li.zeno-att { position: relative; }
ul.recent-activity-sales-list li.zeno-att:before { inset-block-start: 0; }
ul.recent-activity-sales-list li.zeno-att-primary:before { background-color: var(--primary-color); }
ul.recent-activity-sales-list li.zeno-att-secondary:before { background-color: rgb(var(--secondary-rgb)); }
ul.recent-activity-sales-list li.zeno-att-success:before { background-color: rgb(var(--success-rgb)); }
ul.recent-activity-sales-list li.zeno-att-info:before { background-color: rgb(var(--info-rgb)); }
ul.recent-activity-sales-list li.zeno-att-warning:before { background-color: rgb(var(--warning-rgb)); }
ul.recent-activity-sales-list li.zeno-att-danger:before { background-color: rgb(var(--danger-rgb)); }
ul.recent-activity-sales-list li.zeno-att-teal:before { background-color: rgb(var(--teal-rgb)); }
ul.recent-activity-sales-list li.zeno-att-muted:before { background-color: var(--default-border); }

/* Cookie banner (inc/cookie_banner.php) — nascosto finché main.js non verifica il consenso */
.cookie-banner {
    display: none;
    position: fixed;
    bottom: 1rem;
    left: 1rem;
    right: 1rem;
    z-index: 10000;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 0.5rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    padding: 1rem;
}
[data-theme-mode="dark"] .cookie-banner { background: #2a2d3a; color: #fff; border-color: #444; }
.cookie-banner-inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.cookie-banner-text { flex: 1; min-width: 250px; font-size: 0.875rem; }
.cookie-banner-actions { display: flex; gap: 0.5rem; flex-shrink: 0; }

/* Loader globale (inc/loader.php) — mostrato/nascosto con $('#globalLoader').show()/hide() */
.global-loader {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(255,255,255,0.7);
    z-index: 9999;
    align-items: center;
    justify-content: center;
}
.global-loader[style*="block"] { display: flex !important; }
[data-theme-mode="dark"] .global-loader { background: rgba(0,0,0,0.7); }
.global-loader .spinner-border { width: 3rem; height: 3rem; }
.loader-content { text-align: center; }

/* ==========================================================
 * WS-A — account, utenti, impostazioni, abbonamento
 * ========================================================== */
.login-card-larga { max-width: 640px; }
/* Honeypot anti-bot della registrazione: fuori schermo, non display:none (alcuni bot lo saltano) */
.hp-campo { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
/* Banner di stato (inc/banner_stato.php) sopra il contenuto della pagina */
.main-content.banner-stato { padding-bottom: 0; }
.banner-impersonazione { border-width: 2px; font-weight: 600; }
.lista-eventi-assegnabili { max-height: 320px; overflow-y: auto; }
.anteprima-brand { display: inline-block; padding: 0.5rem 1.5rem; border-radius: 0.375rem; font-weight: 600; background: #3366ff; color: #fff; }
.logo-anteprima { max-height: 64px; max-width: 220px; border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 0.375rem; padding: 0.25rem; background: #fff; }
.totp-qr { width: 200px; height: 200px; background: #fff; }
.totp-conferma { max-width: 320px; }
.codici-recupero { font-family: monospace; font-size: 1.1rem; }
.progresso-consumo { height: 0.6rem; }
.progresso-consumo.progresso-bloccato { accent-color: #dc3545; }
.progresso-consumo.progresso-tolleranza, .progresso-consumo.progresso-raggiunto, .progresso-consumo.progresso-avviso { accent-color: #ffc107; }
.progresso-consumo.progresso-ok { accent-color: #198754; }

/* ===== Area ORG: navigazione dell'evento (lib/ui_wsb.php wsbNavEvento) e ricerca globale (inc/menu_laterale.php) ===== */
/* ORG-014: navigazione dell'evento su una riga (gruppi a tendina); su mobile scorre in orizzontale */
.evt-nav-gruppi { overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.evt-nav-gruppi .nav-link { white-space: nowrap; }
.evt-pulsa { position: relative; display: inline-block; width: 0.5rem; height: 0.5rem; border-radius: 50%; background-color: rgb(var(--success-rgb)); }
.evt-pulsa::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background-color: rgb(var(--success-rgb)); animation: evt-pulsa 1.6s ease-out infinite; }
@keyframes evt-pulsa { 0% { transform: scale(1); opacity: 0.7; } 100% { transform: scale(2.6); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .evt-pulsa::after { animation: none; } }
/* Ricerca globale a tutto schermo su mobile (ORG-013) */
@media (max-width: 767.98px) {
    .header-search.ricerca-aperta { display: block !important; position: fixed; inset: 0 0 auto 0; z-index: 1100; padding: 0.75rem; background: var(--custom-white); box-shadow: 0 0.25rem 1rem rgba(0,0,0,.15); }
    .header-search.ricerca-aperta .header-ricerca-risultati { position: static; width: 100%; max-height: 75vh; overflow-y: auto; }
}
.header-ricerca-risultati kbd { font-size: 0.6875rem; }
/* ORG-018: editor visuale dei testi lunghi (assets/js/editor-testo.js) */
.editor-testo { background-color: var(--custom-white); border-color: var(--input-border, var(--default-border)) !important; }
.editor-testo-area { min-height: 9rem; max-height: 32rem; overflow-y: auto; outline: none; color: var(--default-text-color); }
.editor-testo-area.editor-testo-lg { min-height: 18rem; }
.editor-testo-area:focus { box-shadow: inset 0 0 0 1px rgba(var(--primary-rgb), .4); }
.editor-testo-area h3 { font-size: 1.05rem; font-weight: 600; margin: .75rem 0 .5rem; }
.editor-testo-area p { margin-bottom: .5rem; }
.editor-testo-area ul, .editor-testo-area ol { padding-left: 1.25rem; }
.editor-testo .editor-testo-sorgente { border: 0; border-radius: 0; }
/* ORG-020: avviso "modifiche non salvate" */
.zeno-sporco-avviso { font-size: .8125rem; }
.zeno-scheda-sporca::after { content: ""; display: inline-block; width: .45rem; height: .45rem; margin-left: .35rem; border-radius: 50%; background-color: rgb(var(--warning-rgb)); vertical-align: middle; }