@import '_content/Majorsoft.Blazor.Components.Notifications/Majorsoft.Blazor.Components.Notifications.bundle.scp.css';

/* /Components/ComposerChat.razor.rz.scp.css */
/* Campo di scrittura della chat. Stava in LiveChat.razor.css con prefisso lc2-:
   dal CSS di una pagina le regole non raggiungono un componente figlio. */

.cmp-riga[b-jxug4iotwa] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Bottone e pannello delle emoji */
.cmp-emoji[b-jxug4iotwa] {
    position: relative;
    flex-shrink: 0;
}

/* Sfondo trasparente a tutto schermo: un click fuori chiude la palette. */
.cmp-emoji__sfondo[b-jxug4iotwa] {
    position: fixed;
    inset: 0;
    z-index: 1300;
}

.cmp-emoji__pannello[b-jxug4iotwa] {
    position: absolute;
    left: 0;
    bottom: calc(100% + 8px);
    z-index: 1301;
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius-lg);
    box-shadow: 0 8px 28px var(--its-shadow-md);
    overflow: hidden;
    background: var(--its-surface);
}

.cmp-riga[b-jxug4iotwa]  .cmp-campo {
    flex: 1;
}

.cmp-riga[b-jxug4iotwa]  .mud-input-outlined {
    background: var(--its-surface2);
    border-radius: 12px;
    font-size: 13.5px;
}

/* Cresce col testo (AutoGrow, fino a 12 righe). Il tetto in altezza tiene visibile
   la conversazione su un telefono; oltre, il campo scorre dentro sé stesso. */
.cmp-riga[b-jxug4iotwa]  textarea {
    max-height: min(40vh, 320px);
    max-height: min(40dvh, 320px);
    overflow-y: auto !important;
    line-height: 1.45;
}

.cmp-riga--nota[b-jxug4iotwa]  .mud-input-outlined {
    border-color: var(--its-warning) !important;
    background: #fff8e1;
}

.cmp-riga[b-jxug4iotwa]  .cmp-invia {
    flex-shrink: 0;
    border-radius: 12px !important;
    width: 42px !important;
    height: 42px !important;
}
/* /Components/DialogInviaMedia.razor.rz.scp.css */
/* ── Drop zone ── */
.lc2-file-drop[b-d1cnjqndsp] {
    border: 2px dashed rgba(var(--mud-palette-primary-rgb), 0.35);
    border-radius: 10px;
    padding: 24px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: border-color .2s, background .2s;
    min-height: 110px;
    background: rgba(var(--mud-palette-primary-rgb), 0.03);
}

.lc2-file-drop--over[b-d1cnjqndsp] {
    border-color: var(--mud-palette-primary);
    background: rgba(var(--mud-palette-primary-rgb), 0.08);
}

.lc2-file-drop__text[b-d1cnjqndsp] {
    font-size: .875rem;
    color: var(--mud-palette-text-secondary);
    text-align: center;
}

.lc2-file-drop__link[b-d1cnjqndsp] {
    color: var(--mud-palette-primary);
    cursor: pointer;
    font-weight: 500;
    text-decoration: underline;
}

.lc2-file-drop__hint[b-d1cnjqndsp] {
    font-size: .75rem;
    color: var(--mud-palette-text-disabled);
}

.lc2-file-drop__add-more[b-d1cnjqndsp] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .8rem;
    color: var(--mud-palette-primary);
    cursor: pointer;
    font-weight: 500;
}

    .lc2-file-drop__add-more:hover[b-d1cnjqndsp] {
        text-decoration: underline;
    }

/* ── Lista file ── */
.lc2-file-list[b-d1cnjqndsp] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 280px;
    overflow-y: auto;
    padding-right: 2px;
}

.lc2-file-item[b-d1cnjqndsp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 8px;
    background: rgba(var(--mud-palette-surface-rgb), 1);
    border: 1px solid rgba(var(--mud-palette-lines-default-rgb), 1);
    transition: background .15s;
}

.lc2-file-item--error[b-d1cnjqndsp] {
    border-color: rgba(var(--mud-palette-error-rgb), 0.4);
    background: rgba(var(--mud-palette-error-rgb), 0.05);
}

.lc2-file-item__icon[b-d1cnjqndsp] {
    opacity: .7;
    flex-shrink: 0;
}

.lc2-file-item__info[b-d1cnjqndsp] {
    flex: 1;
    min-width: 0;
}

.lc2-file-item__name[b-d1cnjqndsp] {
    font-size: .85rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lc2-file-item__meta[b-d1cnjqndsp] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: .75rem;
    color: var(--mud-palette-text-secondary);
}

.lc2-file-item__sep[b-d1cnjqndsp] {
    opacity: .4;
}

.lc2-file-item__error[b-d1cnjqndsp] {
    color: var(--mud-palette-error);
    font-size: .75rem;
}

/* Select tipo inline — riduco la dimensione */
.lc2-file-item__tipo[b-d1cnjqndsp] {
    max-width: 110px;
    font-size: .75rem !important;
}

    .lc2-file-item__tipo .mud-select-input[b-d1cnjqndsp] {
        padding: 0 !important;
        font-size: .75rem !important;
    }

/* ── Riepilogo ── */
.lc2-file-summary[b-d1cnjqndsp] {
    font-size: .75rem;
    color: var(--mud-palette-text-disabled);
    text-align: right;
    padding-right: 2px;
}

/* ── Badge tipo rilevato automaticamente ── */
.lc2-file-item__badge[b-d1cnjqndsp] {
    display: inline-block;
    padding: 1px 7px;
    border-radius: 20px;
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.lc2-file-item__badge--immagine[b-d1cnjqndsp] {
    background: rgba(76, 175, 80, 0.15);
    color: #2e7d32;
}

.lc2-file-item__badge--video[b-d1cnjqndsp] {
    background: rgba(33, 150, 243, 0.15);
    color: #1565c0;
}

.lc2-file-item__badge--audio[b-d1cnjqndsp] {
    background: rgba(156, 39, 176, 0.15);
    color: #6a1b9a;
}

.lc2-file-item__badge--documento[b-d1cnjqndsp] {
    background: rgba(255, 152, 0, 0.15);
    color: #e65100;
}
/* /Components/DialogInvioOtp.razor.rz.scp.css */
/* =============================================
   its-dialog-otp.css
   Stili Dialog OTP — firma privacy
   ============================================= */

/* ── Step indicator ── */
.its-otp-steps[b-lu3zmsr4u3] {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 16px;
}

.its-otp-step[b-lu3zmsr4u3] {
    display: flex;
    align-items: center;
    gap: 5px;
}

.its-otp-step__dot[b-lu3zmsr4u3] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
    border: 2px solid var(--its-border);
    color: var(--its-text-muted);
    background: var(--its-surface);
    transition: background 0.3s, border-color 0.3s, color 0.3s;
    line-height: 1;
}

.its-otp-step--done .its-otp-step__dot[b-lu3zmsr4u3] {
    background: var(--mud-palette-success);
    border-color: var(--mud-palette-success);
    color: #fff;
}

.its-otp-step--active .its-otp-step__dot[b-lu3zmsr4u3] {
    background: var(--mud-palette-primary);
    border-color: var(--mud-palette-primary);
    color: #fff;
}

.its-otp-step__lbl[b-lu3zmsr4u3] {
    font-size: 11px;
    font-weight: 500;
    color: var(--its-text-muted);
    white-space: nowrap;
}

.its-otp-step--active .its-otp-step__lbl[b-lu3zmsr4u3] {
    color: var(--mud-palette-primary);
    font-weight: 600;
}

.its-otp-step--done .its-otp-step__lbl[b-lu3zmsr4u3] {
    color: var(--mud-palette-success);
}

.its-otp-step__line[b-lu3zmsr4u3] {
    flex: 1;
    height: 2px;
    background: var(--its-border);
    border-radius: 1px;
    min-width: 14px;
}

.its-otp-step__line--done[b-lu3zmsr4u3] {
    background: var(--mud-palette-success);
}

/* ── Card destinatario ── */
.its-otp-recipient[b-lu3zmsr4u3] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid var(--its-border);
    background: var(--its-surface2);
    margin-bottom: 14px;
}

.its-otp-recipient__avatar[b-lu3zmsr4u3] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(26, 86, 219, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    color: var(--mud-palette-primary);
    flex-shrink: 0;
}

.its-otp-recipient__info[b-lu3zmsr4u3] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.its-otp-recipient__name[b-lu3zmsr4u3] {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--its-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.its-otp-recipient__phone[b-lu3zmsr4u3] {
    font-size: 12px;
    color: var(--its-text-muted);
    font-family: var(--its-font-mono);
}

/* Badge SMS */
.its-otp-sms-badge[b-lu3zmsr4u3] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    background: var(--its-accent-light);
    border: 1px solid #b2dfc2;
    color: #1a5c34;
    flex-shrink: 0;
}

.its-otp-sms-badge--error[b-lu3zmsr4u3] {
    background: #fdecea;
    border-color: #f5c6c4;
    color: #b71c1c;
}

/* ── Timer ── */
.its-otp-timer[b-lu3zmsr4u3] {
    margin-bottom: 12px;
}

.its-otp-timer__header[b-lu3zmsr4u3] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
}

.its-otp-field-label[b-lu3zmsr4u3] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--its-text-muted);
}

.its-otp-timer__val[b-lu3zmsr4u3] {
    font-size: 12px;
    font-weight: 600;
    font-family: var(--its-font-mono);
    color: var(--mud-palette-primary);
    transition: color 0.5s;
}

    .its-otp-timer__val.warn[b-lu3zmsr4u3] {
        color: var(--mud-palette-warning);
    }

    .its-otp-timer__val.danger[b-lu3zmsr4u3] {
        color: var(--mud-palette-error);
    }

/* ── Tentativi ── */
.its-otp-retry[b-lu3zmsr4u3] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 14px;
}

.its-otp-retry__dot[b-lu3zmsr4u3] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--its-border);
    transition: background 0.3s;
}

    .its-otp-retry__dot.active[b-lu3zmsr4u3] {
        background: var(--mud-palette-primary);
    }

/* ── Input OTP ── */
.its-otp-input .mud-input-root input[b-lu3zmsr4u3] {
    font-size: 22px !important;
    font-weight: 700 !important;
    letter-spacing: 10px !important;
    text-align: center !important;
    font-family: var(--its-font-mono) !important;
}

/* ── Stato successo ── */
.its-otp-success[b-lu3zmsr4u3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    gap: 4px;
}

.its-otp-success__title[b-lu3zmsr4u3] {
    font-weight: 700 !important;
    color: var(--its-text) !important;
}
/* /Components/FirmaSchermoIntero.razor.rz.scp.css */
/* =============================================
   FIRMA A SCHERMO INTERO — prefisso fsi-
   Sopra tutto (anche il drawer da cui si apre).
   ============================================= */

.fsi[b-la8xry1p3u] {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    flex-direction: column;
    background: var(--its-surface);
    padding-bottom: var(--its-safe-bottom, 0px);
}

.fsi__barra[b-la8xry1p3u] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--its-space-3);
    padding: var(--its-space-2) var(--its-space-4);
    border-bottom: 1px solid var(--its-border);
    flex-wrap: wrap;
}

.fsi__titoli[b-la8xry1p3u] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.fsi__titolo[b-la8xry1p3u] {
    font-weight: 600;
    font-size: 16px;
}

.fsi__sottotitolo[b-la8xry1p3u] {
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
}

.fsi__azioni[b-la8xry1p3u] {
    display: flex;
    gap: var(--its-space-2);
    flex-wrap: wrap;
}

.fsi__area[b-la8xry1p3u] {
    position: relative;
    flex: 1;
    min-height: 0;
    padding: var(--its-space-3);
}

/* Bianco anche col tema scuro (la firma è nera nel PDF); niente scroll né zoom
   della pagina mentre si firma col dito. */
.fsi__canvas[b-la8xry1p3u] {
    display: block;
    width: 100%;
    height: 100%;
    background: #ffffff;
    border: 2px dashed var(--its-border);
    border-radius: 12px;
    touch-action: none;
    cursor: crosshair;
}

.fsi__linea[b-la8xry1p3u] {
    position: absolute;
    left: 8%;
    right: 8%;
    bottom: 28%;
    border-bottom: 1.5px solid #9ca3af;
    pointer-events: none;
}

.fsi__linea span[b-la8xry1p3u] {
    position: absolute;
    left: 0;
    top: 6px;
    font-size: 12px;
    color: #9ca3af;
}

.fsi__errore[b-la8xry1p3u] {
    position: absolute;
    top: calc(var(--its-space-3) + 10px);
    left: 50%;
    transform: translateX(-50%);
    padding: 6px 14px;
    border-radius: 8px;
    background: #fde5e4;
    color: #a83232;
    font-weight: 600;
    pointer-events: none;
}

/* L'invito a girare il telefono: solo su telefono in verticale. */
.fsi__ruota[b-la8xry1p3u] {
    display: none;
}

@media (orientation: portrait) and (max-width: 600px) {
    .fsi__ruota[b-la8xry1p3u] {
        display: flex;
        align-items: center;
        gap: var(--its-space-2);
        padding: var(--its-space-2) var(--its-space-4);
        background: #fff4d6;
        color: #7a5a00;
        font-size: 13px;
        font-weight: 600;
        order: -1;
    }
}
/* /Components/NotAuthorizedView.razor.rz.scp.css */
.nav-wrap[b-2llp13u557] {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.nav-card[b-2llp13u557] {
    width: 100%;
    max-width: 420px;
    padding: 2.5rem 2rem;
    text-align: center;
    border: 1px solid var(--its-border);
    border-radius: 14px;
    background: var(--its-surface);
    box-shadow: 0 6px 24px rgba(20, 25, 60, 0.06);
}

.nav-icon[b-2llp13u557] {
    width: 64px;
    height: 64px;
    margin: 0 auto 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--its-surface2);
    color: var(--its-text-muted);
}

.nav-title[b-2llp13u557] {
    font-weight: 600 !important;
    color: var(--its-text);
    margin-bottom: 0.5rem;
}

.nav-subtitle[b-2llp13u557] {
    color: var(--its-text-muted);
    margin-bottom: 1.75rem;
}

.nav-btn[b-2llp13u557] {
    text-transform: none;
    font-weight: 500;
    padding: 0.55rem 1.5rem;
    border-radius: 10px;
}
/* /Components/PaletteEmoji.razor.rz.scp.css */
/* Palette delle emoji — prefisso pal-
   Compatta di proposito: si apre sopra la conversazione (campo di scrittura e
   reaction) e deve coprirne il meno possibile. Otto emoji per riga da 30px. */

.pal[b-ijemlr2fxy] {
    width: min(278px, calc(100vw - 24px));
    padding: 6px;
    background: var(--its-surface);
    font-family: var(--its-font);
    user-select: none;
}

.pal__schede[b-ijemlr2fxy] {
    display: flex;
    gap: 1px;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--its-border);
    overflow-x: auto;
    scrollbar-width: none;
}

.pal__scheda[b-ijemlr2fxy] {
    flex: 1 1 0;
    min-width: 28px;
    height: 28px;
    border: 0;
    border-radius: var(--its-radius-sm);
    background: transparent;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
    opacity: 0.55;
    transition: background 0.12s, opacity 0.12s;
}

.pal__scheda:hover[b-ijemlr2fxy] {
    background: var(--its-surface2);
    opacity: 1;
}

.pal__scheda--attiva[b-ijemlr2fxy] {
    background: var(--its-accent-light);
    opacity: 1;
}

.pal__titolo[b-ijemlr2fxy] {
    margin: 4px 2px 2px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--its-text-muted);
}

.pal__griglia[b-ijemlr2fxy] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(30px, 1fr));
    gap: 1px;
    /* Altezza fissa e non massima: la palette la posiziona il chiamante sulla sua
       misura, e una scheda più piena non deve farla crescere fuori dallo schermo. */
    height: min(164px, 32vh);
    align-content: start;
    overflow-y: auto;
    scrollbar-width: thin;
}

.pal__emoji[b-ijemlr2fxy] {
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    border-radius: var(--its-radius-sm);
    background: transparent;
    font-size: 19px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.1s, transform 0.1s;
}

.pal__emoji:hover[b-ijemlr2fxy] {
    background: var(--its-surface2);
    transform: scale(1.15);
}

.pal__emoji:focus-visible[b-ijemlr2fxy] {
    outline: 2px solid var(--its-accent);
}

/* Su un touch le dita vogliono bersagli più grandi: qui si rinuncia alla compattezza. */
@media (pointer: coarse) {
    .pal[b-ijemlr2fxy] {
        width: min(300px, calc(100vw - 24px));
    }

    .pal__emoji[b-ijemlr2fxy] {
        width: 34px;
        height: 34px;
        font-size: 21px;
    }

    .pal__griglia[b-ijemlr2fxy] {
        grid-template-columns: repeat(auto-fill, minmax(34px, 1fr));
    }
}
/* /Components/PannelloNotifiche.razor.rz.scp.css */
/* =============================================
   PANNELLO NOTIFICHE — prefisso its-notific…

   Drawer, chip ed empty state vengono da its-shell.css.
   ============================================= */

.its-notifiche__barra[b-n7kiks9u4c] {
    display: flex;
    align-items: center;
    gap: var(--its-space-1);
    padding: var(--its-space-2) var(--its-space-4);
    border-bottom: 1px solid var(--its-border);
    /* Tre chip più «Segna tutte lette» non stanno in un telefono: il bottone va a capo. */
    flex-wrap: wrap;
}

.its-notifiche__barra[b-n7kiks9u4c]  .mud-chip {
    flex-shrink: 0;
}

/* Riga delle push del dispositivo, sotto la barra dei filtri. */
.its-notifiche__push[b-n7kiks9u4c] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
    padding: var(--its-space-2) var(--its-space-4);
    border-bottom: 1px solid var(--its-border);
    background: var(--its-surface2);
    font-size: 12.5px;
    color: var(--its-text-muted);
}

.its-notifiche__push-testo[b-n7kiks9u4c] {
    flex: 1;
    min-width: 0;
}

.its-notifiche__spazio[b-n7kiks9u4c] {
    flex: 1;
}

.its-notifica[b-n7kiks9u4c] {
    padding: var(--its-space-2) var(--its-space-3);
    margin-bottom: var(--its-space-2);
    border: 1px solid var(--its-border);
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s;
}

.its-notifica:hover[b-n7kiks9u4c] {
    background: var(--its-surface2);
}

/* Da leggere: filo a sinistra, più evidente del solo grassetto. */
.its-notifica--nuova[b-n7kiks9u4c] {
    border-left: 3px solid var(--mud-palette-primary);
}

.its-notifica--nuova .its-notifica__titolo[b-n7kiks9u4c] {
    font-weight: 600;
}

.its-notifica__testa[b-n7kiks9u4c] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
}

.its-notifica__quando[b-n7kiks9u4c] {
    flex: 1;
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
}

.its-notifica__titolo[b-n7kiks9u4c] {
    margin-top: 2px;
    color: var(--its-text);
}

.its-notifica__testo[b-n7kiks9u4c] {
    font-size: var(--its-fs-sm);
    color: var(--its-text-muted);
}

.its-notifica__archiviata[b-n7kiks9u4c] {
    margin-top: 2px;
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
}
/* /Components/Pianificazione/AttivitaCollegate.razor.rz.scp.css */
/* ATTIVITÀ COLLEGATE — prefisso atc- */

.atc__barra[b-cfav41so6o] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--its-space-3);
    margin-bottom: var(--its-space-3);
}

.atc--compatto .atc__barra[b-cfav41so6o] {
    justify-content: flex-end;
    margin-bottom: var(--its-space-1);
}

.atc__azioni[b-cfav41so6o] {
    display: flex;
    align-items: center;
    gap: var(--its-space-3);
}

.atc__elenco[b-cfav41so6o] {
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius-lg);
    overflow: hidden;
}

.atc__riga[b-cfav41so6o] {
    display: block;
    padding: var(--its-space-3) var(--its-space-4);
    color: inherit;
    text-decoration: none;
}

.atc__riga + .atc__riga[b-cfav41so6o] {
    border-top: 1px solid var(--its-border);
}

.atc__riga:hover[b-cfav41so6o] {
    background: var(--its-surface2);
}

/* Completate e annullate restano consultabili, ma passano in secondo piano. */
.atc__riga--chiusa[b-cfav41so6o] {
    opacity: 0.65;
}

.atc__titolo[b-cfav41so6o] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--its-space-2);
}

.atc--compatto .atc__riga[b-cfav41so6o] {
    padding: var(--its-space-2) var(--its-space-3);
}

.atc__vuoto[b-cfav41so6o] {
    color: var(--its-text-muted);
    font-size: var(--its-fs-sm);
    padding: var(--its-space-2) 0;
}
/* /Components/Pianificazione/CampiOrario.razor.rz.scp.css */
/* CAMPI ORARIO — prefisso cor- */

/* Scorciatoie di durata sotto le date. */
.cor-durate[b-w4p1893my8] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--its-space-1);
    margin-top: var(--its-space-2);
}
/* /Components/Pianificazione/DrawerCalendariCollegati.razor.rz.scp.css */
/* =============================================
   CALENDARI COLLEGATI — prefisso ccl-
   ============================================= */

.ccl-stato[b-oxdbtsn6ce] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
}

.ccl-azioni[b-oxdbtsn6ce] {
    display: flex;
    gap: var(--its-space-2);
    margin-top: var(--its-space-3);
    flex-wrap: wrap;
}

.ccl-calendario[b-oxdbtsn6ce] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
    padding: var(--its-space-2) 0;
    border-bottom: 1px solid var(--its-border);
}

.ccl-calendario__corpo[b-oxdbtsn6ce] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.ccl-errore[b-oxdbtsn6ce] {
    font-size: var(--its-fs-caption);
    color: #a83232;
}

.ccl-nuovo[b-oxdbtsn6ce] {
    margin-top: var(--its-space-3);
}
/* /Components/Pianificazione/DrawerRapportino.razor.rz.scp.css */
/* =============================================
   RAPPORTINO — prefisso rap-
   ============================================= */

.rap-riepilogo[b-mkm4d112wj] {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 4px var(--its-space-3);
    align-items: baseline;
}

/* La firma: un riquadro che si tocca per aprire il popup, poi la sua anteprima.
   Bianco anche col tema scuro: la firma è nera. */
.rap-firma[b-mkm4d112wj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 100%;
    min-height: 140px;
    padding: var(--its-space-3);
    background: #ffffff;
    border: 2px dashed var(--its-border);
    border-radius: 10px;
    box-sizing: border-box;
}

.rap-firma--vuota[b-mkm4d112wj] {
    cursor: pointer;
    font: inherit;
    font-weight: 600;
    color: var(--its-text);
    transition: border-color 0.2s ease, background 0.2s ease;
}

.rap-firma--vuota:hover[b-mkm4d112wj] {
    border-color: var(--its-admin);
    background: var(--its-admin-light);
}

.rap-firma__immagine[b-mkm4d112wj] {
    max-width: 100%;
    max-height: 160px;
    object-fit: contain;
}

.rap-firma__piede[b-mkm4d112wj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 4px;
}
/* /Components/Pianificazione/SceltaAttivita.razor.rz.scp.css */
/* SCELTA ATTIVITÀ — prefisso sat- */

.sat-voce[b-ygt1bavsuv] {
    display: block;
    width: 100%;
    text-align: left;
    border: 0;
    background: transparent;
    font-family: inherit;
    padding: var(--its-space-3) var(--its-space-4);
    cursor: pointer;
}

.sat-voce + .sat-voce[b-ygt1bavsuv] {
    border-top: 1px solid var(--its-border);
}

.sat-voce:hover[b-ygt1bavsuv],
.sat-voce:focus-visible[b-ygt1bavsuv] {
    background: var(--its-surface2);
    outline: none;
}
/* /Pages/AnagraficaClienti.razor.rz.scp.css */
/* =============================================
   CLIENTI — prefisso cli-

   Shell, area principale, badge ed empty state vengono
   da css/custom/its-shell.css.
   ============================================= */

/* Barra dei filtri, campi e misure: tutto da .its-filtri / .its-campo in
   css/custom/its-shell.css. Qui resta solo ciò che è proprio dei clienti. */

.cli-filtri[b-nvjrp4sljk] {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

/* ── Griglia ── */


.cli-nome[b-nvjrp4sljk] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
}

/* L'icona dice azienda o persona senza rubare una colonna a un testo
   che era sempre "Azienda" o vuoto. */
.cli-nome__tipo[b-nvjrp4sljk] {
    color: var(--its-text-muted);
    flex-shrink: 0;
}

.cli-nome__testo[b-nvjrp4sljk] {
    font-weight: 600;
    color: var(--its-text);
}

.cli-sottotitolo[b-nvjrp4sljk] {
    display: block;
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
    margin-top: 1px;
    margin-left: 26px;
}

/* L'azienda di appartenenza è un nome, non un codice: si legge come tale. */
.cli-sottotitolo--madre[b-nvjrp4sljk] {
    color: var(--its-text-dim);
}

.cli-recapito[b-nvjrp4sljk] {
    font-family: var(--its-font-mono);
    font-size: var(--its-fs-sm);
    color: var(--its-text);
}

.cli-email[b-nvjrp4sljk] {
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
}

/* Lo stato porta il colore deciso in configurazione: qui si dà solo la forma. */
.cli-stato[b-nvjrp4sljk] {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border-radius: var(--its-radius-pill);
    font-size: var(--its-fs-caption);
    font-weight: 600;
    color: #fff;
    white-space: nowrap;
}

.cli-servizi[b-nvjrp4sljk] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--its-space-1);
}

/* Un valore assente si scrive: una cella vuota sembra un dato non caricato. */
.cli-vuoto[b-nvjrp4sljk] {
    color: var(--its-text-muted);
    font-style: italic;
    font-size: var(--its-fs-sm);
}

[b-nvjrp4sljk] .cli-azioni {
    white-space: nowrap;
    text-align: right;
}
/* /Pages/AnagraficaDettaglio.razor.rz.scp.css */
/* =============================================
   ANAGRAFICA DETTAGLIO — solo ciò che è proprio di
   questa pagina. Shell, sidebar, sezioni, area
   principale, card, empty state, drawer e griglia
   stanno in its-shell.css (globali): qui non si
   duplicano. Colori e misure da its-variables.css.
   ============================================= */

/* =============================================
   CARD — varianti di questa pagina, sopra .its-card
   ============================================= */

.ad-card--ghost[b-u86bdcbsju] {
    background: transparent;
    border-style: dashed;
}

/* Card con accento warning — usata per i task "da completare" come l'upload privacy in edit */
.ad-card--accent-warning[b-u86bdcbsju] {
    border-color: #f0c87a;
    background: linear-gradient(180deg, #fffbea 0%, #ffffff 60%);
    box-shadow: 0 0 0 1px rgba(245, 200, 66, 0.18) inset;
}

.ad-card--accent-warning .its-card__title[b-u86bdcbsju] {
    color: #8a5a00;
}

.ad-card--accent-warning .its-card__title-divider[b-u86bdcbsju] {
    background: #f3d997;
}

/* Card locked — visivamente "fuori uso" ma leggibile */
.ad-card--locked[b-u86bdcbsju] {
    background: linear-gradient(135deg, #f7f8fc 0%, #eef1f8 100%);
    border-style: dashed;
    border-color: #c8cee0;
    position: relative;
}

.ad-card--locked[b-u86bdcbsju]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(
        45deg,
        transparent 0,
        transparent 14px,
        rgba(168, 178, 204, 0.05) 14px,
        rgba(168, 178, 204, 0.05) 16px
    );
    pointer-events: none;
    border-radius: 12px;
}

.ad-locked-badge[b-u86bdcbsju] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    background: #ffffff;
    border: 1px solid #d4dae8;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 600;
    color: var(--its-text-dim);
    text-transform: none;
    letter-spacing: 0.2px;
    margin-left: 4px;
    white-space: nowrap;
}

.ad-locked-badge .mud-icon-root[b-u86bdcbsju] {
    color: var(--its-text-muted);
}

/* Input deep-styling per matchare lo stile DM Sans + raggi morbidi */
.ad-input[b-u86bdcbsju]  .mud-input-outlined {
    border-radius: 8px;
    font-size: 13.5px;
    background: var(--its-surface);
}

.ad-input[b-u86bdcbsju]  .mud-input-label {
    font-size: 13px;
}

.ad-tipo-chip--large[b-u86bdcbsju] {
    font-size: 11px;
    padding: 5px 14px;
    letter-spacing: 0.6px;
    border-radius: 6px;
}

.ad-tipo-chip[b-u86bdcbsju] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

.ad-tipo-chip--basic[b-u86bdcbsju]    { background: #fff4e1; color: #b07000; }
.ad-tipo-chip--top[b-u86bdcbsju]      { background: #e6f8ec; color: #1a7a3a; }
.ad-tipo-chip--lead[b-u86bdcbsju]     { background: #f0e8ff; color: #5a3fa3; }
.ad-tipo-chip--nopaga[b-u86bdcbsju]   { background: #fde5e4; color: #a83232; }
.ad-tipo-chip--perdi[b-u86bdcbsju]    { background: #ebeef5; color: #4a5278; }
.ad-tipo-chip--forn[b-u86bdcbsju]     { background: var(--its-admin-light); color: var(--its-admin); }
.ad-tipo-chip--perso[b-u86bdcbsju]    { background: #e2e8f0; color: #334155; }
.ad-tipo-chip--bloccato[b-u86bdcbsju] { background: var(--its-danger-text); color: #fff; }

/* =============================================
   PENDING BADGE
   ============================================= */

.ad-pending-badge[b-u86bdcbsju] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 8px;
    background: var(--its-warning-bg);
    border: 1px solid var(--its-warning);
    border-radius: 6px;
    font-size: 11px;
    font-weight: 500;
    color: var(--its-warning-text);
}

/* Variante per l'header sticky: pill, leggermente più alta, con spazio dal pulsante Salva */
.ad-pending-badge--header[b-u86bdcbsju] {
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 999px;
    margin-right: 4px;
    box-shadow: 0 1px 2px rgba(245, 200, 66, 0.18);
}

.ad-pending-badge--header .mud-icon-root[b-u86bdcbsju] {
    font-size: 14px !important;
    animation: ad-pending-pulse-b-u86bdcbsju 2s ease-in-out infinite;
}

@keyframes ad-pending-pulse-b-u86bdcbsju {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%      { opacity: 0.7; transform: scale(0.92); }
}

/* =============================================
   PENDING BANNER — sezione (Documenti, ecc.)
   ============================================= */

.ad-pending-banner[b-u86bdcbsju] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 14px;
    margin-bottom: 14px;
    border-radius: 10px;
    background: linear-gradient(180deg, var(--its-warning-bg) 0%, #fff7d6 100%);
    border: 1px solid var(--its-warning);
    color: var(--its-warning-text);
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

.ad-pending-banner__icon[b-u86bdcbsju] {
    color: var(--its-warning-text);
    flex-shrink: 0;
    margin-top: 2px;
}

.ad-pending-banner__body[b-u86bdcbsju] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    /* Occupa lo spazio residuo così il bottone "Carica" resta ancorato a destra
       e non si sposta al variare della lunghezza del testo. */
    flex: 1 1 auto;
}

.ad-pending-banner__title[b-u86bdcbsju] {
    font-family: var(--its-font);
    font-weight: 700;
    font-size: 13px;
    line-height: 1.25;
    letter-spacing: 0.1px;
}

.ad-pending-banner__hint[b-u86bdcbsju] {
    font-size: 11.5px;
    opacity: 0.88;
    line-height: 1.35;
}

.ad-pending-banner__hint strong[b-u86bdcbsju] {
    font-weight: 700;
}

.ad-pending-banner__azione[b-u86bdcbsju] {
    flex-shrink: 0;
    align-self: center;
    white-space: nowrap;
}

/* =============================================
   TOOLBAR DELTA (+N / −N) accanto al counter
   ============================================= */

.ad-delta[b-u86bdcbsju] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: var(--its-font-mono);
    font-size: 11px;
    font-weight: 700;
    color: var(--its-warning-text);
    background: var(--its-warning-bg);
    border: 1px solid var(--its-warning);
    padding: 1px 7px;
    border-radius: 6px;
    margin-left: 4px;
    letter-spacing: 0.2px;
}

.ad-delta > span + span[b-u86bdcbsju] {
    padding-left: 4px;
    border-left: 1px solid var(--its-warning);
}

/* =============================================
   CHIP DI STATO per riga documento
   ============================================= */

.ad-doc-chip[b-u86bdcbsju] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 9px;
    border-radius: 999px;
    font-family: var(--its-font);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5;
    white-space: nowrap;
    letter-spacing: 0.15px;
    flex-shrink: 0;
}

.ad-doc-chip .mud-icon-root[b-u86bdcbsju] {
    font-size: 12px !important;
}

.ad-doc-chip--muted[b-u86bdcbsju] {
    background: var(--its-surface2);
    color: var(--its-text-muted);
    border: 1px solid var(--its-border);
}

.ad-doc-chip--muted .mud-icon-root[b-u86bdcbsju] {
    color: var(--its-success);
    opacity: 0.7;
}

.ad-doc-chip--warning[b-u86bdcbsju] {
    background: var(--its-warning-bg);
    color: var(--its-warning-text);
    border: 1px solid var(--its-warning);
}

.ad-doc-chip--warning .mud-icon-root[b-u86bdcbsju] {
    color: var(--its-warning);
    animation: ad-pending-pulse-b-u86bdcbsju 2s ease-in-out infinite;
}

.ad-doc-chip--danger[b-u86bdcbsju] {
    background: #fdecea;
    color: var(--its-danger);
    border: 1px solid #f5b7b1;
}

/* Caricamento in corso: il documento è partito ma il server non ha ancora risposto. */
.ad-doc-chip--info[b-u86bdcbsju] {
    background: var(--its-surface2);
    color: var(--its-text-muted);
    border: 1px solid var(--its-border);
}

.ad-doc-chip--info .mud-progress-circular[b-u86bdcbsju] {
    width: 12px !important;
    height: 12px !important;
}

/* Delta della testata quando ci sono caricamenti falliti. */
.ad-delta--errore[b-u86bdcbsju] {
    color: var(--its-danger);
    background: #fdecea;
    border-color: #f5b7b1;
}

/* Riga di un documento che non è arrivato al server: resta in elenco col motivo
   e il bottone Riprova, invece di sparire come se fosse andato tutto bene. */
.ad-doc-row.ad-doc-row--errore[b-u86bdcbsju] {
    background: rgba(229, 57, 53, 0.04);
    border-color: rgba(229, 57, 53, 0.35);
}

.ad-doc-row__errore[b-u86bdcbsju] {
    font-size: 11px;
    line-height: 1.35;
    color: var(--its-danger);
    margin-top: 2px;
    white-space: normal;
}

/* Riga documento marcato per eliminazione (soft-delete, finché non si Salva).
   Selettori compound (specificità 0,2,0) per scavalcare la regola .ad-doc-row
   che è definita più avanti nel file. */
.ad-doc-row.ad-doc-row--deleting[b-u86bdcbsju] {
    background: linear-gradient(90deg, rgba(229, 57, 53, 0.04) 0%, rgba(229, 57, 53, 0.10) 50%, rgba(229, 57, 53, 0.04) 100%);
    border-color: rgba(229, 57, 53, 0.35);
}

.ad-doc-row.ad-doc-row--deleting .ad-doc-row__name[b-u86bdcbsju],
.ad-doc-row.ad-doc-row--deleting .ad-doc-row__size[b-u86bdcbsju] {
    text-decoration: line-through;
    opacity: 0.55;
}

.ad-doc-row.ad-doc-row--deleting .ad-doc-row__icon[b-u86bdcbsju] {
    opacity: 0.45;
}

/* =============================================
   PULSAZIONE pulsante Salva con modifiche pending
   ============================================= */

@keyframes ad-save-pulse-b-u86bdcbsju {
    0%, 100% { box-shadow: 0 0 0 0 rgba(245, 200, 66, 0.55); }
    50%      { box-shadow: 0 0 0 8px rgba(245, 200, 66, 0); }
}

.ad-save-btn--pulse[b-u86bdcbsju] {
    animation: ad-save-pulse-b-u86bdcbsju 2.4s ease-in-out infinite;
}

/* =============================================
   PLACEHOLDER (per sezioni in arrivo)
   ============================================= */

.ad-placeholder[b-u86bdcbsju] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 60px 20px;
    color: var(--its-text-muted);
}

.ad-placeholder__icon[b-u86bdcbsju] {
    font-size: 48px;
    opacity: 0.4;
    margin-bottom: 16px;
}

.ad-placeholder__title[b-u86bdcbsju] {
    font-size: 16px;
    font-weight: 600;
    color: var(--its-text-dim);
    margin: 0 0 6px;
}

.ad-placeholder__text[b-u86bdcbsju] {
    font-size: 13px;
    max-width: 400px;
    line-height: 1.6;
    margin: 0;
}

/* =============================================
   LOADING STATE
   ============================================= */

.ad-loading[b-u86bdcbsju] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 14px;
    color: var(--its-text-muted);
    font-size: 13px;
}

/* =============================================
   ACTIONS BAR (sticky footer della main area)
   ============================================= */

.ad-actions-bar[b-u86bdcbsju] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    background: var(--its-surface);
    border-top: 1px solid var(--its-border);
    flex-shrink: 0;
}

/* =============================================
   TIPO ANAGRAFICA — selettore 3-way grande
   ============================================= */

.ad-tipo-selector[b-u86bdcbsju] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.ad-tipo-card[b-u86bdcbsju] {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    background: var(--its-surface);
    border: 1.5px solid var(--its-border);
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.18s ease;
    font-family: var(--its-font);
    overflow: hidden;
}

.ad-tipo-card[b-u86bdcbsju]::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, transparent 0%, transparent 100%);
    opacity: 0;
    transition: opacity 0.2s ease;
    pointer-events: none;
}

.ad-tipo-card:hover[b-u86bdcbsju] {
    border-color: var(--its-text-muted);
    transform: translateY(-1px);
}

.ad-tipo-card__icon[b-u86bdcbsju] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: var(--its-surface2);
    color: var(--its-text-muted);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

.ad-tipo-card__body[b-u86bdcbsju] {
    flex: 1;
    min-width: 0;
    z-index: 1;
}

.ad-tipo-card__title[b-u86bdcbsju] {
    font-size: 14px;
    font-weight: 700;
    color: var(--its-text);
    margin: 0 0 2px;
    letter-spacing: -0.2px;
}

.ad-tipo-card__desc[b-u86bdcbsju] {
    font-size: 11.5px;
    color: var(--its-text-muted);
    line-height: 1.35;
}

.ad-tipo-card__check[b-u86bdcbsju] {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--its-surface);
    border: 1.5px solid var(--its-border);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    z-index: 1;
}

/* Selected — Azienda */
.ad-tipo-card--azienda.ad-tipo-card--on[b-u86bdcbsju] {
    border-color: var(--its-admin);
    background: linear-gradient(135deg, #ffffff 0%, #eaf1fc 100%);
}
.ad-tipo-card--azienda.ad-tipo-card--on .ad-tipo-card__icon[b-u86bdcbsju] {
    background: linear-gradient(135deg, var(--its-admin), #2563eb);
    color: #ffffff;
}
.ad-tipo-card--azienda.ad-tipo-card--on .ad-tipo-card__check[b-u86bdcbsju] {
    background: var(--its-admin);
    border-color: var(--its-admin);
    color: #ffffff;
}

/* Selected — Contatto */
.ad-tipo-card--contatto.ad-tipo-card--on[b-u86bdcbsju] {
    border-color: #15803d;
    background: linear-gradient(135deg, #ffffff 0%, #ecf8f0 100%);
}
.ad-tipo-card--contatto.ad-tipo-card--on .ad-tipo-card__icon[b-u86bdcbsju] {
    background: linear-gradient(135deg, #15803d, #22c55e);
    color: #ffffff;
}
.ad-tipo-card--contatto.ad-tipo-card--on .ad-tipo-card__check[b-u86bdcbsju] {
    background: #15803d;
    border-color: #15803d;
    color: #ffffff;
}

/* Selected — Privato */
.ad-tipo-card--privato.ad-tipo-card--on[b-u86bdcbsju] {
    border-color: #6d28d9;
    background: linear-gradient(135deg, #ffffff 0%, #f3edff 100%);
}
.ad-tipo-card--privato.ad-tipo-card--on .ad-tipo-card__icon[b-u86bdcbsju] {
    background: linear-gradient(135deg, #6d28d9, #a78bfa);
    color: #ffffff;
}
.ad-tipo-card--privato.ad-tipo-card--on .ad-tipo-card__check[b-u86bdcbsju] {
    background: #6d28d9;
    border-color: #6d28d9;
    color: #ffffff;
}

/* Pending badge per items non ancora salvati su server */
.ad-pending-marker[b-u86bdcbsju] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 7px;
    background: var(--its-warning-bg);
    border: 1px solid var(--its-warning);
    border-radius: 999px;
    font-size: 10px;
    font-weight: 600;
    color: var(--its-warning-text);
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

@media (max-width: 800px) {
    .ad-tipo-selector[b-u86bdcbsju] {
        grid-template-columns: 1fr;
    }
}

/* =============================================
   FORM STRIP (pannello aggiungi-nuovo)
   ============================================= */

.ad-form-strip[b-u86bdcbsju] {
    background: linear-gradient(135deg, #ffffff 0%, #f8faff 100%);
    border: 1px dashed var(--its-border);
    border-radius: 12px;
    padding: 16px 18px;
    margin-bottom: 14px;
}

.ad-form-strip__title[b-u86bdcbsju] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    color: var(--its-text-muted);
    margin: 0 0 12px;
    display: flex;
    align-items: center;
    gap: 7px;
}

/* =============================================
   TOOLBAR sezione (titolo + azioni a destra)
   ============================================= */

/* =============================================
   RADIO GROUP STILIZZATO (note category)
   ============================================= */

.ad-radio-pills[b-u86bdcbsju] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.ad-radio-pill[b-u86bdcbsju] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: var(--its-surface);
    border: 1.5px solid var(--its-border);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    color: var(--its-text-muted);
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
}

/* Hover solo per i pill spenti — altrimenti il testo bianco dei pill accesi
   diventava grigio scuro su sfondo colorato, illeggibile. */
.ad-radio-pill:not(.ad-radio-pill--on):hover[b-u86bdcbsju] {
    border-color: var(--its-text-muted);
    color: var(--its-text-dim);
    transform: translateY(-1px);
}

.ad-radio-pill--on:hover[b-u86bdcbsju] {
    filter: brightness(1.08);
}

.ad-radio-pill--on[b-u86bdcbsju] {
    color: #ffffff;
    border-width: 1.5px;
}

.ad-radio-pill--on.ad-radio-pill--generica[b-u86bdcbsju]   { background: var(--its-admin); border-color: var(--its-admin); }
.ad-radio-pill--on.ad-radio-pill--sollecito[b-u86bdcbsju]  { background: #6d28d9; border-color: #6d28d9; }
.ad-radio-pill--on.ad-radio-pill--assistenza[b-u86bdcbsju] { background: #15803d; border-color: #15803d; }
.ad-radio-pill--on.ad-radio-pill--wiki[b-u86bdcbsju]       { background: #4a2087; border-color: #4a2087; }
.ad-radio-pill--on.ad-radio-pill--richieste[b-u86bdcbsju]  { background: #b45309; border-color: #b45309; }
.ad-radio-pill--on.ad-radio-pill--commerciale[b-u86bdcbsju] { background: #0e7490; border-color: #0e7490; }

/* =============================================
   DOCUMENT ROW (icone + nome + dimensione)
   ============================================= */

.ad-doc-row[b-u86bdcbsju] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-radius: 10px;
    transition: border-color 0.15s;
}

.ad-doc-row:hover[b-u86bdcbsju] {
    border-color: var(--its-text-muted);
}

.ad-doc-row__icon[b-u86bdcbsju] {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: var(--its-admin-light);
    color: var(--its-admin);
}

.ad-doc-row__icon--pdf[b-u86bdcbsju] { background: #fde5e4; color: #a83232; }
.ad-doc-row__icon--img[b-u86bdcbsju] { background: #e6f8ec; color: #1a7a3a; }
.ad-doc-row__icon--archive[b-u86bdcbsju] { background: #fff3d6; color: #92520a; }

.ad-doc-row__name[b-u86bdcbsju] {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    font-weight: 500;
    color: var(--its-text);
    word-break: break-word;
}

.ad-doc-row__size[b-u86bdcbsju] {
    font-family: var(--its-font-mono);
    font-size: 11px;
    color: var(--its-text-muted);
    flex-shrink: 0;
}

/* Sul desktop il contenitore non esiste: dimensione e stato restano in riga
   con il nome, come prima. Sul telefono è la seconda riga (sotto). */
.ad-doc-row__meta[b-u86bdcbsju] {
    display: contents;
}

.ad-testo-tocco[b-u86bdcbsju] {
    display: none;
}

@media (hover: none) {
    .ad-testo-mouse[b-u86bdcbsju] { display: none; }
    .ad-testo-tocco[b-u86bdcbsju] { display: inline; }
}

@media (max-width: 600px) {
    /* Icona a sinistra su due righe, nome sopra, dimensione e stato sotto,
       azioni a destra: il nome prende tutta la larghezza che resta. */
    .ad-doc-row[b-u86bdcbsju] {
        display: grid;
        grid-template-columns: 36px minmax(0, 1fr) auto;
        grid-template-areas:
            "icona nome azioni"
            "icona meta azioni";
        column-gap: 10px;
        row-gap: 4px;
        align-items: center;
        padding: 10px 8px 10px 12px;
    }

    .ad-doc-row__icon[b-u86bdcbsju] { grid-area: icona; align-self: start; }
    .ad-doc-row__name[b-u86bdcbsju] { grid-area: nome; line-height: 1.3; overflow-wrap: anywhere; word-break: normal; }
    /* In riga: la regola globale del telefono impila le azioni di
       .its-list-item, ma qui la riga è già su due livelli e due bottoni
       in colonna la farebbero più alta del necessario. */
    .ad-doc-row .its-list-item__actions[b-u86bdcbsju] { grid-area: azioni; flex-direction: row; }

    .ad-doc-row__meta[b-u86bdcbsju] {
        grid-area: meta;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 8px;
        min-width: 0;
    }

    .ad-upload-zone[b-u86bdcbsju] {
        padding: 16px;
    }

    /* Banner delle modifiche in attesa: il bottone va sotto, a tutta
       larghezza, invece di schiacciare il testo in una colonna stretta. */
    .ad-pending-banner[b-u86bdcbsju] {
        flex-wrap: wrap;
    }

    .ad-pending-banner__body[b-u86bdcbsju] {
        flex-basis: calc(100% - 36px);
    }

    .ad-pending-banner[b-u86bdcbsju]  .ad-pending-banner__azione {
        flex-basis: 100%;
    }
}

/* Nota: lo stile del wrapper .ad-upload-mud + input invisibile sopra
   la dropzone vive in wwwroot/css/custom/its-anagrafica-dettaglio.css
   (regola globale, deve attraversare lo scoping di MudFileUpload). */

.ad-upload-wrapper[b-u86bdcbsju] {
    margin-bottom: 14px;
}

.ad-upload-zone[b-u86bdcbsju] {
    display: block;
    cursor: pointer;
    border: 2px dashed var(--its-border);
    border-radius: 12px;
    padding: 24px;
    text-align: center;
    transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
    background: var(--its-surface);
    width: 100%;
    box-sizing: border-box;
    pointer-events: none; /* Pattern overlay (MudFileUpload): i click passano all'input absolute sovrastante */
}

/* Pattern label-based (dropzone Documenti): la zona È un <label for=...>, deve
   ricevere i click direttamente. Higher-specificity selector (tag + classe)
   sovrascrive il pointer-events:none ereditato dal pattern overlay. */
label.ad-upload-zone[b-u86bdcbsju] {
    pointer-events: auto;
}

/* Child elements del label devono lasciare passare i click al label stesso
   (altrimenti MudIcon/SVG potrebbero diventare il click target su iOS). */
label.ad-upload-zone > *[b-u86bdcbsju] {
    pointer-events: none;
}

.ad-upload-zone__icon[b-u86bdcbsju] {
    color: var(--its-text-muted);
    transition: color 0.2s ease, transform 0.2s ease;
}

/* Hover normale (mouse, senza drag) */
.ad-upload-mud:hover .ad-upload-zone[b-u86bdcbsju] {
    border-color: var(--its-admin);
    background: var(--its-admin-light);
}

/* Drag in corso — feedback più forte e animato */
.ad-upload-wrapper--drag .ad-upload-zone[b-u86bdcbsju] {
    border-color: var(--its-admin);
    border-style: solid;
    background: var(--its-admin-light);
    transform: scale(1.015);
    box-shadow: 0 4px 16px rgba(26, 86, 219, 0.15);
}

.ad-upload-wrapper--drag .ad-upload-zone__icon[b-u86bdcbsju] {
    color: var(--its-admin);
    transform: translateY(-2px) scale(1.15);
}

/* Canvas firma grafometrica */
.ad-signature-pad[b-u86bdcbsju] {
    width: 100%;
    height: 200px;
    border: 2px dashed var(--its-border);
    border-radius: 10px;
    background: #ffffff;
    cursor: crosshair;
    touch-action: none;
    display: block;
}

.ad-signature-hint[b-u86bdcbsju] {
    font-size: 11px;
    color: var(--its-text-muted);
    margin-top: 6px;
    text-align: center;
    font-style: italic;
}

/* Privacy summary inline (sostituisce card legacy) */
.ad-privacy-summary[b-u86bdcbsju] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-radius: 10px;
}

.ad-privacy-summary--ok[b-u86bdcbsju] {
    background: linear-gradient(135deg, #ffffff 0%, #ecf8f0 100%);
    border-color: #22c55e;
}

.ad-privacy-summary--pending[b-u86bdcbsju] {
    background: linear-gradient(135deg, #ffffff 0%, #fff8ed 100%);
    border-color: #f59e0b;
}

.ad-privacy-summary__icon[b-u86bdcbsju] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #ffffff;
}

.ad-privacy-summary--ok .ad-privacy-summary__icon[b-u86bdcbsju] {
    background: linear-gradient(135deg, #15803d 0%, #22c55e 100%);
}

.ad-privacy-summary--pending .ad-privacy-summary__icon[b-u86bdcbsju] {
    background: linear-gradient(135deg, #b45309 0%, #f59e0b 100%);
}

.ad-privacy-summary__main[b-u86bdcbsju] {
    flex: 1;
    min-width: 0;
}

.ad-privacy-summary__label[b-u86bdcbsju] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    color: var(--its-text-muted);
    margin-bottom: 2px;
}

.ad-privacy-summary__value[b-u86bdcbsju] {
    font-size: 14px;
    font-weight: 600;
    color: var(--its-text);
}

/* =============================================
   RESPONSIVE
   ============================================= */

/* Sidebar, testata, card e padding su schermi stretti li decide its-shell.css
   (sezione RESPONSIVE), per tutte le schede: qui stava una copia che valeva
   solo per questa pagina. */

/* ── Avviso «terzo sollecito» in testa al corpo della scheda ── */
.ad-solleciti[b-u86bdcbsju]  .mud-alert-message {
    width: 100%;
}

.ad-solleciti__riga[b-u86bdcbsju] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--its-space-2) var(--its-space-3);
}
/* /Pages/AttivitaDettaglio.razor.rz.scp.css */
/* =============================================
   SCHEDA ATTIVITÀ — prefisso atd-
   Shell, sidebar a sezioni, card, toolbar, empty state e
   chip vengono da css/custom/its-shell.css.
   ============================================= */

.atd-dim[b-ukkka4z7ml] {
    color: var(--its-text-muted);
    font-size: var(--its-fs-sm);
}

/* Testi scritti dalle persone: gli a capo contano. */
.atd-testo[b-ukkka4z7ml] {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    line-height: 1.5;
}

.atd-data[b-ukkka4z7ml] {
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    letter-spacing: 0.03em;
    font-weight: 500;
}

.atd-data--ritardo[b-ukkka4z7ml] {
    color: var(--its-danger-text);
    font-weight: 600;
}

.atd-dati[b-ukkka4z7ml] {
    row-gap: var(--its-space-4);
}

.atd-suggerimento[b-ukkka4z7ml] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--its-space-3);
}

/* ── Intervento ── */

.atd-int[b-ukkka4z7ml] {
    display: flex;
    align-items: flex-start;
    gap: var(--its-space-4);
}

/* Il «foglio di calendario» a sinistra: si legge il giorno senza leggere la riga. */
.atd-int__giorno[b-ukkka4z7ml] {
    flex: 0 0 56px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius);
    overflow: hidden;
    background: var(--its-surface);
}

.atd-int__mese[b-ukkka4z7ml] {
    width: 100%;
    text-align: center;
    background: var(--its-admin);
    color: #fff;
    font-size: var(--its-fs-label);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.7px;
    padding: 2px 0;
}

.atd-int__giorno--spento .atd-int__mese[b-ukkka4z7ml] {
    background: var(--its-text-muted);
}

.atd-int__num[b-ukkka4z7ml] {
    font-family: var(--its-font-codici);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
    padding-top: 2px;
}

.atd-int__dow[b-ukkka4z7ml] {
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
    padding-bottom: 3px;
}

.atd-int__corpo[b-ukkka4z7ml] {
    flex: 1;
    min-width: 0;
}

.atd-int__testo[b-ukkka4z7ml] {
    margin-top: var(--its-space-2);
}

.atd-int__esito[b-ukkka4z7ml] {
    margin-top: var(--its-space-3);
    padding: var(--its-space-2) var(--its-space-3);
    border-left: 3px solid var(--its-success);
    background: var(--its-surface2);
    border-radius: var(--its-radius-sm);
}

.atd-int__azioni[b-ukkka4z7ml] {
    display: flex;
    align-items: center;
    gap: var(--its-space-1);
    white-space: nowrap;
}

/* ── Note ── */

.atd-azioni-riga[b-ukkka4z7ml] {
    display: flex;
    justify-content: flex-end;
    margin-top: var(--its-space-2);
}

.atd-note[b-ukkka4z7ml] {
    display: flex;
    flex-direction: column;
    gap: var(--its-space-2);
}

.atd-nota[b-ukkka4z7ml] {
    display: flex;
    align-items: flex-start;
    gap: var(--its-space-3);
    padding: var(--its-space-3) var(--its-space-4);
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius);
}

/* Lo storico scritto dal sistema si distingue dalle note delle persone. */
.atd-nota--sistema[b-ukkka4z7ml] {
    background: var(--its-surface2);
    border-style: dashed;
    color: var(--its-text-dim);
}

[b-ukkka4z7ml] .atd-nota__icona {
    margin-top: 2px;
    color: var(--its-text-muted);
}

.atd-nota__corpo[b-ukkka4z7ml] {
    flex: 1;
    min-width: 0;
}

.atd-nota__testa[b-ukkka4z7ml] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--its-space-2);
    align-items: baseline;
    margin-bottom: 2px;
}

/* ── Allegati ── */

.atd-allegato[b-ukkka4z7ml] {
    display: flex;
    align-items: center;
    gap: var(--its-space-3);
    padding: var(--its-space-2) var(--its-space-4);
}

.atd-allegato + .atd-allegato[b-ukkka4z7ml] {
    border-top: 1px solid var(--its-border);
}

.atd-allegato__corpo[b-ukkka4z7ml] {
    flex: 1;
    min-width: 0;
    overflow-wrap: anywhere;
}

/* ── Telefono: azioni sotto, non accanto ── */

@media (max-width: 600px) {
    .atd-int[b-ukkka4z7ml] {
        flex-wrap: wrap;
    }

    .atd-int__azioni[b-ukkka4z7ml] {
        width: 100%;
        justify-content: flex-end;
    }
}

/* Sotto un intervento firmato: chi, quando e il PDF. Il verde è quello dei chip «positive». */
.atd-int__firmato[b-ukkka4z7ml] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-top: var(--its-space-2);
    font-size: var(--its-fs-caption);
    color: #1a7a3a;
}
/* /Pages/AziendaDettaglio.razor.rz.scp.css */
/* =============================================
   SCHEDA AZIENDA — solo ciò che è proprio di
   questa pagina. Shell, sidebar, card, hero,
   snapshot, liste e chip stanno in its-shell.css
   (globali): qui non si duplicano.
   ============================================= */

/* Il pulsante "Gestisci utenti" va a fine riga, non attaccato al titolo. */
[b-jh3hood33s] .its-card__title .mud-button-root {
    margin-left: auto;
}

/* Riga di ricerca sopra l'elenco utenti: campo a sinistra, conteggio a destra. */
.azd-ricerca-utenti[b-jh3hood33s] {
    display: flex;
    align-items: center;
    gap: var(--its-space-3);
    margin-bottom: var(--its-space-3);
}

.azd-ricerca-utenti__conteggio[b-jh3hood33s] {
    font-size: var(--its-fs-sm);
    color: var(--its-text-muted);
    white-space: nowrap;
}

/* ── Piano e limiti ── */

.azd-piano[b-jh3hood33s] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 14px;
}

.azd-piano__descrizione[b-jh3hood33s] {
    font-size: 12.5px;
    color: var(--its-text-dim);
}

/* Il rapporto "usati / massimo" si legge a colpo d'occhio: numero grande, etichetta piccola. */
.azd-limite[b-jh3hood33s] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 10px 14px;
    background: var(--its-surface2);
    border-radius: 10px;
}

.azd-limite__valore[b-jh3hood33s] {
    font-family: var(--its-font-mono);
    font-size: 16px;
    font-weight: 600;
    color: var(--its-text);
}
/* /Pages/AziendaNuova.razor.rz.scp.css */
/* =============================================
   NUOVA AZIENDA — solo ciò che è proprio della pagina.
   Shell, sidebar, sezioni, card e note stanno in
   its-shell.css: qui non si duplicano.
   ============================================= */

/* Il pallino sulle sezioni con un campo obbligatorio ancora vuoto. */
.azn-manca[b-fwrlaz697m] {
    margin-left: auto;
    color: var(--its-warning-text);
    font-size: 18px;
    line-height: 1;
}

.azn-manca-riga[b-fwrlaz697m] {
    border-left: 3px solid var(--its-warning-text);
    margin-bottom: 14px;
}

/* ── Esito: le credenziali si vedono una volta sola ────── */

.azn-esito[b-fwrlaz697m] {
    max-width: 620px;
}

.azn-credenziali[b-fwrlaz697m] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 14px 0 18px;
}

.azn-credenziale[b-fwrlaz697m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 14px;
    border-radius: var(--its-radius);
    background: var(--its-surface2);
    border: 1px solid var(--its-border);
}

.azn-credenziale__label[b-fwrlaz697m] {
    font-size: .78rem;
    color: var(--its-text-muted);
    text-transform: uppercase;
    letter-spacing: .03em;
}

.azn-credenziale__valore[b-fwrlaz697m] {
    font-size: 1rem;
    font-weight: 600;
}

/* Monospazio: una password si rilegge carattere per carattere, e con un font
   proporzionale l+I+1 e 0+O sono la stessa cosa. */
.azn-credenziale__valore--password[b-fwrlaz697m] {
    font-family: var(--its-font-mono, monospace);
    letter-spacing: .06em;
    user-select: all;
}

.azn-esito__azioni[b-fwrlaz697m] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
/* /Pages/Chat2Bot.razor.rz.scp.css */
/* =============================================
   BOT WHATSAPP CHAT2 — solo ciò che è proprio di
   questa pagina. Shell, sidebar, sezioni, snapshot,
   chip di stato, area principale, card, griglia,
   liste, empty state e drawer stanno in its-shell.css
   (globali): qui non si duplicano.
   ============================================= */

/* Il selettore del numero WhatsApp vive in testa alla sidebar e sparisce
   quando la si comprime. */
.bot2-numero-select[b-xa20uroz3k] {
    padding: 12px 14px 6px;
    flex-shrink: 0;
}

.its-sidebar--collapsed .bot2-numero-select[b-xa20uroz3k] {
    display: none;
}

/* Input deep-styling — raggi morbidi, DM Sans */
.bot2-input[b-xa20uroz3k]  .mud-input-outlined {
    border-radius: 8px;
    font-size: 13.5px;
    background: var(--its-surface);
}

.bot2-input[b-xa20uroz3k]  .mud-input-label {
    font-size: 13px;
}

/* =============================================
   HERO — interruttore generale
   ============================================= */

.bot2-hero[b-xa20uroz3k] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    border-radius: 14px;
    margin-bottom: 16px;

    border: 1px solid var(--its-border);
    transition: background 0.25s ease, border-color 0.25s ease;
}

.bot2-hero--on[b-xa20uroz3k] {
    background: linear-gradient(135deg, #ffffff 0%, #ecf8f0 100%);
    border-color: #b7e4c7;
}

.bot2-hero--off[b-xa20uroz3k] {
    background: linear-gradient(135deg, #f7f8fc 0%, #eef1f8 100%);
    border-style: dashed;
    border-color: #c8cee0;
}

.bot2-hero__icon[b-xa20uroz3k] {
    width: 48px;
    height: 48px;
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #fff;
    transition: background 0.25s ease, box-shadow 0.25s ease;
}

.bot2-hero--on .bot2-hero__icon[b-xa20uroz3k] {
    background: linear-gradient(135deg, #15803d 0%, var(--its-accent) 100%);
    box-shadow: 0 6px 18px rgba(37, 211, 102, 0.28);
}

.bot2-hero--off .bot2-hero__icon[b-xa20uroz3k] {
    background: linear-gradient(135deg, var(--its-text-muted) 0%, #b4bcd6 100%);
}

.bot2-hero__main[b-xa20uroz3k] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.bot2-hero__state[b-xa20uroz3k] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -0.2px;
    color: var(--its-text);
}

.bot2-hero__pulse[b-xa20uroz3k] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--its-success);
    animation: bot2-pulse-b-xa20uroz3k 1.8s ease-in-out infinite;
}

@keyframes bot2-pulse-b-xa20uroz3k {
    0%, 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.45); }
    50% { box-shadow: 0 0 0 6px rgba(37, 211, 102, 0); }
}

.bot2-hero__hint[b-xa20uroz3k] {
    font-size: 12.5px;
    color: var(--its-text-dim);
    line-height: 1.4;
}

/* =============================================
   SCENARIO CARDS
   ============================================= */

.bot2-scenari-grid[b-xa20uroz3k] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 16px;

}

@media (max-width: 1250px) {
    .bot2-scenari-grid[b-xa20uroz3k] { grid-template-columns: 1fr; }
}

.bot2-scenario-card[b-xa20uroz3k] {
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-radius: 12px;
    padding: 14px 16px 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: relative;
    overflow: hidden;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.bot2-scenario-card[b-xa20uroz3k]::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--its-border);
    transition: background 0.2s ease;
}

.bot2-scenario-card--active[b-xa20uroz3k] {
    border-color: #b9cdf5;
    box-shadow: 0 2px 8px rgba(26, 86, 219, 0.07);
}

.bot2-scenario-card--active[b-xa20uroz3k]::before {
    background: linear-gradient(90deg, var(--its-admin) 0%, #4f8ef7 100%);
}

.bot2-scenario-card__header[b-xa20uroz3k] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.bot2-scenario-card__icon[b-xa20uroz3k] {
    width: 32px;
    height: 32px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: var(--its-surface2);
    color: var(--its-text-dim);
    transition: background 0.2s ease, color 0.2s ease;
}

.bot2-scenario-card--active .bot2-scenario-card__icon[b-xa20uroz3k] {
    background: var(--its-admin-light);
    color: var(--its-admin);
}

.bot2-scenario-card__name[b-xa20uroz3k] {
    flex: 1;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.2px;
    color: var(--its-text);
}

.bot2-scenario-card__desc[b-xa20uroz3k] {
    font-size: 12px;
    color: var(--its-text-dim);
    line-height: 1.45;
    margin: 0;
}

.bot2-scenario-card__link[b-xa20uroz3k] {
    color: var(--its-admin);
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* Anteprima messaggio — richiama la bolla WhatsApp */
.bot2-msg-preview[b-xa20uroz3k] {
    position: relative;
    font-size: 12.5px;
    color: var(--its-text-dim);
    line-height: 1.5;
    background: #f6fbf7;
    border: 1px solid #d8efe0;
    border-left: 3px solid var(--its-success);
    border-radius: 4px 10px 10px 10px;
    padding: 8px 12px;
    white-space: pre-wrap;
    word-break: break-word;
}

/* Stato compatto: ~6 righe (12.5px * 1.5 = 18.75px per riga) + padding.
   Niente -webkit-line-clamp: con white-space pre-wrap le righe vuote fra i
   paragrafi consumavano il budget e il taglio usciva a metà riga. */
.bot2-msg-preview--compatta[b-xa20uroz3k] {
    max-height: 129px;
    overflow: hidden;
}

/* Sfumatura di chiusura, solo da compatta: segnala che il testo continua */
.bot2-msg-preview--compatta[b-xa20uroz3k]::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 28px;
    background: linear-gradient(to bottom, rgba(246, 251, 247, 0), #f6fbf7);
    pointer-events: none;
}

/* Formattazione WhatsApp: grassetto, corsivo e barrato vengono da .its-wa
   (its-shell.css). Qui resta solo il fondo del `code`, che sull'anteprima
   verde non può essere quello neutro. */
.bot2-msg-preview code[b-xa20uroz3k] {
    background: #e9f5ed;
    font-size: 11.5px;
}

.bot2-msg-preview-toggle[b-xa20uroz3k] {
    align-self: flex-end;
    margin-top: -4px;
    padding: 0;
    border: none;
    background: none;
    font-family: inherit;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--its-admin);
    cursor: pointer;
}

.bot2-msg-preview-toggle:hover[b-xa20uroz3k] {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.bot2-scenario-warn[b-xa20uroz3k] {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 11.5px;
    font-weight: 600;
    color: #8a6300;
    background: #fffbea;
    border: 1px solid #f3d997;
    border-radius: 8px;
    padding: 7px 10px;
    line-height: 1.35;
}

.bot2-hint-banner[b-xa20uroz3k] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    padding: 10px 14px;
    background: var(--its-admin-light);
    border-radius: 9px;
    font-size: 12px;
    color: var(--its-admin-darken);
    line-height: 1.4;
}

.bot2-hint-banner--warn[b-xa20uroz3k] {
    background: #fffbea;
    border: 1px solid #f3d997;
    color: #8a6300;
    margin-top: 0;
    margin-bottom: 16px;

    flex-wrap: wrap;
}

/* =============================================
   PRESET ORARI (compilazione rapida)
   ============================================= */

.bot2-preset-row[b-xa20uroz3k] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 0 0 12px;
    margin-bottom: 4px;
    border-bottom: 1px dashed var(--its-border);
}

.bot2-preset-row__label[b-xa20uroz3k] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    color: var(--its-text-muted);
}

.bot2-preset-chip[b-xa20uroz3k] {
    font-family: 'DM Sans', 'Segoe UI', sans-serif;
    font-size: 12px;
    font-weight: 600;
    color: var(--its-text-dim);
    background: var(--its-surface);
    border: 1.5px solid var(--its-border);
    border-radius: 999px;
    padding: 5px 13px;
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
}

.bot2-preset-chip:hover[b-xa20uroz3k] {
    border-color: var(--its-admin);
    color: var(--its-admin);
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(26, 86, 219, 0.10);
}

.bot2-preset-chip:active[b-xa20uroz3k] {
    transform: translateY(0);
}

/* =============================================
   INDICATORE LIVE (snapshot sidebar)
   ============================================= */

.bot2-live[b-xa20uroz3k] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.bot2-live__dot[b-xa20uroz3k] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
    background: var(--its-text-muted);
}

.bot2-live--on .bot2-live__dot[b-xa20uroz3k] { background: var(--its-success); }
.bot2-live--ferie .bot2-live__dot[b-xa20uroz3k] { background: #f5a623; }
.bot2-live--fuori .bot2-live__dot[b-xa20uroz3k] { background: #4f8ef7; }
.bot2-live--off .bot2-live__dot[b-xa20uroz3k] { background: var(--its-text-muted); }

/* Coppia datepicker nel drawer chiusura: larghezze uguali */
.bot2-datepair[b-xa20uroz3k]  .mud-picker {
    flex: 1;
    min-width: 0;
}

/* Tag priorità sulle scenario card */
.bot2-prio[b-xa20uroz3k] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    font-size: 10px;
    font-weight: 700;
    font-family: var(--its-font-mono);
    background: var(--its-surface2);
    color: var(--its-text-muted);
    flex-shrink: 0;
    cursor: default;
}

.bot2-scenario-card--active .bot2-prio[b-xa20uroz3k] {
    background: var(--its-admin);
    color: #fff;
}

.bot2-hint-banner--prio[b-xa20uroz3k] {
    margin-top: 0;
    margin-bottom: 14px;
}

/* =============================================
   CONTATORE CARATTERI (drawer messaggio)
   ============================================= */

.bot2-char-counter[b-xa20uroz3k] {
    font-family: var(--its-font-mono);
    font-size: 11px;
    color: var(--its-text-muted);
    text-align: right;
    display: block;
}

/* =============================================
   ORARI SETTIMANALI
   ============================================= */

/* Griglia a colonne fisse condivisa da tutte le righe: giorni e fasce incolonnati */
.bot2-orario-row[b-xa20uroz3k] {
    display: grid;
    grid-template-columns: 150px 56px 140px 140px 28px 56px 140px 140px 1fr;
    align-items: center;
    gap: 8px;
    padding: 6px 0;
    border-bottom: 1px solid var(--its-border);
}

.bot2-orario-row:last-of-type[b-xa20uroz3k] {
    border-bottom: none;
}

.bot2-orario-row--chiuso[b-xa20uroz3k] {
    opacity: 0.65;
}

.bot2-orario-row__giorno[b-xa20uroz3k] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.bot2-orario-row__nome[b-xa20uroz3k] {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--its-text);
}

.bot2-orario-row__fascia-label[b-xa20uroz3k] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--its-text-muted);
    text-align: right;
    padding-right: 2px;
}

.bot2-orario-row__sep[b-xa20uroz3k] {
    height: 22px;
    width: 1px;
    background: var(--its-border);
    justify-self: center;
}

.bot2-timepicker[b-xa20uroz3k] {
    width: 100%;
}

/* I TimePicker Mud portano un margin-top di default: azzerato per centrare in riga */
.bot2-timepicker[b-xa20uroz3k]  .mud-picker {
    margin-top: 0;
}

.bot2-timepicker[b-xa20uroz3k]  .mud-input-control {
    margin-top: 0;
}

.bot2-orario-row__chiuso-label[b-xa20uroz3k] {
    grid-column: 2 / -1;
    font-size: 12px;
    font-weight: 600;
    font-style: italic;
    color: var(--its-text-muted);
}

@media (max-width: 1150px) {
    .bot2-orario-row[b-xa20uroz3k] {
        grid-template-columns: 140px 48px 1fr 1fr;
        row-gap: 4px;
    }
    .bot2-orario-row__sep[b-xa20uroz3k] { display: none; }
    .bot2-orario-row__giorno[b-xa20uroz3k] { grid-column: 1; grid-row: 1 / span 2; }
    .bot2-orario-row__chiuso-label[b-xa20uroz3k] { grid-column: 2 / -1; }
}

/* Chiusura scaduta: riga attenuata, già inattiva per il bot */
.bot2-scaduta[b-xa20uroz3k] {
    opacity: 0.55;
    background: var(--its-surface2);
}

/* =============================================
   RESPONSIVE
   ============================================= */

/* Sidebar, testata e padding su schermi stretti li decide its-shell.css
   (sezione RESPONSIVE): qui resta solo ciò che è di questa pagina. */
@media (max-width: 960px) {
    /* Nella barra orizzontale non c'è compressione: il numero resta sceglibile. */
    .its-sidebar--collapsed .bot2-numero-select[b-xa20uroz3k] {
        display: block;
    }
    .bot2-numero-select[b-xa20uroz3k] {
        padding: 10px 12px 0;
    }
}

@media (max-width: 600px) {
    .bot2-orario-row__giorno[b-xa20uroz3k] {
        width: 100%;
    }
}
/* /Pages/Chat2Massivo.razor.rz.scp.css */
/* Invio massivo — solo ciò che è proprio di questa pagina.
   Shell, drawer, card, badge, empty state, filtri e segmenti stanno in
   its-shell.css: prima di aggiungere una regola qui, si guarda là. */

.mas-vuoto[b-sy6grf9289] {
    color: var(--its-text-muted);
}

/* ── Elenco ─────────────────────────────────────────────── */

.mas-esito[b-sy6grf9289] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.mas-azioni[b-sy6grf9289] {
    white-space: nowrap;
    text-align: right;
}

/* ── Passi del wizard ───────────────────────────────────── */

.mas-passi[b-sy6grf9289] {
    display: flex;
    gap: 4px;
    padding: 10px 20px;
    border-bottom: 1px solid var(--its-border);
    background: var(--its-surface2);
    overflow-x: auto;
}

.mas-passi__voce[b-sy6grf9289] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: .78rem;
    color: var(--its-text-muted);
    white-space: nowrap;
}

.mas-passi__numero[b-sy6grf9289] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    font-size: .7rem;
    font-weight: 600;
}

.mas-passi__voce--attiva[b-sy6grf9289] {
    background: var(--its-admin-light);
    color: var(--its-admin);
    font-weight: 600;
}

.mas-passi__voce--attiva .mas-passi__numero[b-sy6grf9289] {
    background: var(--its-admin);
    border-color: var(--its-admin);
    color: #fff;
}

.mas-passi__voce--fatta .mas-passi__numero[b-sy6grf9289] {
    background: var(--its-accent-light);
    border-color: var(--its-accent-light);
    color: #128a45;
}

/* ── Anteprima del template ─────────────────────────────── */

.mas-anteprima-template[b-sy6grf9289] {
    margin-top: 12px;
    padding: 12px 14px;
    border-radius: var(--its-radius);
    background: var(--its-surface2);
    border: 1px solid var(--its-border);
    font-size: .85rem;
    line-height: 1.45;
    white-space: pre-wrap;
}

.mas-file[b-sy6grf9289] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    font-size: .82rem;
    color: var(--its-text-muted);
}

.mas-avviso[b-sy6grf9289] {
    border-left: 3px solid var(--its-warning-text);
}

/* ── Contatori ──────────────────────────────────────────── */

.mas-contatori[b-sy6grf9289] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 12px;
}

.mas-contatore[b-sy6grf9289] {
    flex: 1 1 90px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px 8px;
    border-radius: var(--its-radius);
    background: var(--its-surface2);
    border: 1px solid var(--its-border);
}

.mas-contatore__numero[b-sy6grf9289] {
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 1.1;
}

.mas-contatore__label[b-sy6grf9289] {
    font-size: .72rem;
    color: var(--its-text-muted);
    text-transform: uppercase;
    letter-spacing: .03em;
}

.mas-contatore--on .mas-contatore__numero[b-sy6grf9289] { color: #128a45; }
.mas-contatore--info .mas-contatore__numero[b-sy6grf9289] { color: var(--its-admin); }
.mas-contatore--danger .mas-contatore__numero[b-sy6grf9289] { color: #b3261e; }

.mas-aggiornamento[b-sy6grf9289] {
    margin-left: 8px;
    font-size: .72rem;
    font-weight: 400;
    color: var(--its-text-muted);
    text-transform: none;
    letter-spacing: 0;
}

/* ── Tabella di scelta dei destinatari ──────────────────── */

.mas-conteggio-scelti[b-sy6grf9289] {
    margin-left: 8px;
    font-size: 11.5px;
    font-weight: 400;
    color: var(--its-text-muted);
    text-transform: none;
    letter-spacing: 0;
}

.mas-azioni-scelta[b-sy6grf9289] {
    display: flex;
    gap: 2px;
}

/* Altezza fissa: la tabella scorre dentro sé stessa, così i contatori sopra e i
   bottoni del drawer sotto restano sempre visibili. */
.mas-tabella[b-sy6grf9289] {
    height: 46vh;
    height: 46dvh;
    overflow-y: auto;
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius);
    background: var(--its-surface);
}

.mas-riga[b-sy6grf9289] {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 44px;
    padding: 0 12px;
    border-bottom: 1px solid var(--its-border);
    cursor: pointer;
    user-select: none;
}

.mas-riga:last-child[b-sy6grf9289] {
    border-bottom: none;
}

.mas-riga:hover[b-sy6grf9289] {
    background: var(--its-surface2);
}

.mas-riga--scelta[b-sy6grf9289] {
    background: var(--its-admin-light);
}

.mas-riga--scelta:hover[b-sy6grf9289] {
    background: var(--its-admin-light);
}

.mas-riga__nome[b-sy6grf9289] {
    flex: 1 1 auto;
    font-size: .86rem;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mas-riga__numero[b-sy6grf9289] {
    flex: 0 0 auto;
    font-family: var(--its-font-mono, monospace);
    font-size: .78rem;
    color: var(--its-text-muted);
}

.mas-riga__parametri[b-sy6grf9289] {
    flex: 0 1 40%;
    font-size: .76rem;
    color: var(--its-text-dim);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Destinatari ────────────────────────────────────────── */

.mas-destinatari[b-sy6grf9289] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 8px;
}

.mas-destinatario[b-sy6grf9289] {
    padding: 8px 10px;
    border-radius: var(--its-radius);
    border: 1px solid var(--its-border);
    background: var(--its-surface);
}

.mas-destinatario__testa[b-sy6grf9289] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

/* Le variabili del destinatario nel riepilogo: servono a distinguere due righe
   con lo stesso numero, che dal 20/08/2026 sono legittime. */
.mas-destinatario__variabili[b-sy6grf9289] {
    margin-top: 4px;
    font-size: .78rem;
    color: var(--its-text-dim);
    word-break: break-word;
}

.mas-destinatario__motivo[b-sy6grf9289] {
    margin-top: 4px;
    font-size: .78rem;
    color: #b3261e;
    word-break: break-word;
}

/* ── Riepilogo di conferma ──────────────────────────────── */

.mas-conferma[b-sy6grf9289] {
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius);
    overflow: hidden;
}

.mas-conferma__riga[b-sy6grf9289] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 12px;
    font-size: .85rem;
}

.mas-conferma__riga + .mas-conferma__riga[b-sy6grf9289] {
    border-top: 1px solid var(--its-border);
}

/* Il mittente si legge per primo e si distingue: è il dato che decide a chi arriva
   il messaggio, non un dettaglio di contorno. */
.mas-conferma__riga--mittente[b-sy6grf9289] {
    background: var(--its-admin-light);
    color: var(--its-admin);
}
/* /Pages/Frmaziende.razor.rz.scp.css */
/* =============================================
   AZIENDE — prefisso azi-

   Shell, area principale, badge ed empty state vengono
   da css/custom/its-shell.css.
   ============================================= */

.azi-contatto[b-8lhqadhnw5] {
    font-size: var(--its-fs-sm);
    color: var(--its-text);
}

.azi-contatto--secondario[b-8lhqadhnw5] {
    font-family: var(--its-font-mono);
    color: var(--its-text-dim);
}

.azi-funzioni[b-8lhqadhnw5] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--its-space-1);
}

/* Un valore assente si scrive: una cella vuota sembra un dato non caricato. */
.azi-vuoto[b-8lhqadhnw5] {
    color: var(--its-text-muted);
    font-style: italic;
    font-size: var(--its-fs-sm);
}

[b-8lhqadhnw5] .azi-azioni {
    white-space: nowrap;
    text-align: right;
}
/* /Pages/Home.razor.rz.scp.css */
/* =============================================
   HOME — prefisso home-

   Shell, area principale ed empty state vengono da
   css/custom/its-shell.css.
   ============================================= */

.home-intro[b-hgpz40ddpn] {
    margin: 0 0 var(--its-space-4);
    font-size: var(--its-fs-md);
    color: var(--its-text-dim);
}

.home-griglia[b-hgpz40ddpn] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: var(--its-space-3);
}

.home-carta[b-hgpz40ddpn] {
    display: flex;
    flex-direction: column;
    gap: var(--its-space-1);
    padding: var(--its-space-4);
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius-lg);
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}

.home-carta:hover[b-hgpz40ddpn] {
    border-color: var(--its-admin);
    box-shadow: 0 4px 16px var(--its-shadow);
    /* Sollevamento appena percepibile: la carta risponde, non salta */
    transform: translateY(-2px);
}

.home-carta:focus-visible[b-hgpz40ddpn] {
    outline: 2px solid var(--its-admin);
    outline-offset: 2px;
}

.home-carta__icona[b-hgpz40ddpn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--its-radius);
    background: var(--its-admin-light);
    color: var(--its-admin);
    margin-bottom: var(--its-space-2);
}

.home-carta__titolo[b-hgpz40ddpn] {
    font-size: var(--its-fs-md);
    font-weight: 600;
    color: var(--its-text);
}

.home-carta__descrizione[b-hgpz40ddpn] {
    font-size: var(--its-fs-sm);
    color: var(--its-text-muted);
    line-height: 1.4;
}

/* ── Stato dei servizi monitorati ──
   Il rosso è l'unica cosa che deve saltare all'occhio: i verdi e i grigi
   restano sommessi, e senza rossi il riquadro dice solo «tutto a posto». */

.home-stato[b-hgpz40ddpn] {
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius-lg);
    padding: var(--its-space-4);
    min-width: 0;
}

/* «Le mie attività» e «Servizi monitorati»: una colonna, e sopra i 1280 px
   (menu fisso con le etichette) affiancati per risparmiare spazio. Lo stacco
   verso il basso lo dà il contenitore, non le sezioni. Con una sezione sola
   (l'altra non è concessa) occupa la riga intera. */
.home-riquadri[b-hgpz40ddpn] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--its-space-4);
    align-items: start;
    margin-bottom: var(--its-space-5);
}

.home-riquadri--vuoto[b-hgpz40ddpn] {
    display: none;
}

@media (min-width: 1281px) {
    .home-riquadri[b-hgpz40ddpn] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .home-riquadri > .home-stato:only-child[b-hgpz40ddpn] {
        grid-column: 1 / -1;
    }
}

.home-stato__testa[b-hgpz40ddpn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--its-space-3);
    margin-bottom: var(--its-space-3);
}

.home-stato__titolo[b-hgpz40ddpn] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
    font-weight: 600;
    color: var(--its-text);
}

.home-stato__totale[b-hgpz40ddpn] {
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    font-weight: 500;
    font-size: var(--its-fs-sm);
    color: var(--its-text-muted);
    background: var(--its-surface2);
    padding: 1px 8px;
    border-radius: var(--its-radius-pill);
}

.home-stato__link[b-hgpz40ddpn],
.home-stato__altri[b-hgpz40ddpn] {
    font-size: var(--its-fs-sm);
    font-weight: 600;
    color: var(--its-admin);
    text-decoration: none;
}

.home-stato__contatori[b-hgpz40ddpn] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--its-space-2);
}

.home-stato__conta[b-hgpz40ddpn] {
    display: inline-flex;
    align-items: center;
    gap: var(--its-space-2);
    padding: 8px 14px;
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius);
    color: var(--its-text-dim);
    text-decoration: none;
    font-size: var(--its-fs-sm);
    transition: border-color 0.15s, background 0.15s;
}

.home-stato__conta strong[b-hgpz40ddpn] {
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 0.03em;
    color: var(--its-text);
}

.home-stato__conta:hover[b-hgpz40ddpn] {
    border-color: var(--its-admin);
    text-decoration: none;
}

.home-stato__conta--allarme[b-hgpz40ddpn] {
    border-color: var(--its-danger);
    background: rgba(229, 57, 53, 0.06);
    color: var(--its-danger);
}

.home-stato__conta--allarme strong[b-hgpz40ddpn] {
    color: var(--its-danger);
}

.home-stato__conta--attenzione[b-hgpz40ddpn] {
    border-color: var(--its-warning);
    background: rgba(245, 166, 35, 0.08);
}

.home-stato__elenco[b-hgpz40ddpn] {
    list-style: none;
    margin: var(--its-space-3) 0 var(--its-space-2);
    padding: 0;
    border-top: 1px solid var(--its-border);
}

.home-stato__riga[b-hgpz40ddpn] {
    padding: 8px 0;
    border-bottom: 1px solid var(--its-border);
}

.home-stato__voce[b-hgpz40ddpn] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 10px;
    color: inherit;
    text-decoration: none;
}

.home-stato__voce:hover .home-stato__cliente[b-hgpz40ddpn] {
    color: var(--its-admin);
}

/* Sotto la riga: gli indirizzi che non rispondono (Link cliccabile) e «Verifica ora». */
.home-stato__dettaglio[b-hgpz40ddpn] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--its-space-2);
    padding-left: 19px;
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
}

.home-stato__elenco .its-stato-dot[b-hgpz40ddpn] {
    align-self: center;
}

.home-stato__cliente[b-hgpz40ddpn] {
    font-weight: 600;
    color: var(--its-text);
}

.home-stato__servizio[b-hgpz40ddpn] {
    color: var(--its-text-dim);
    font-size: var(--its-fs-sm);
}

.home-stato__da[b-hgpz40ddpn] {
    margin-left: auto;
    font-size: var(--its-fs-caption);
    color: var(--its-danger);
}

.home-stato__ok[b-hgpz40ddpn],
.home-stato__vuoto[b-hgpz40ddpn] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
    margin-top: var(--its-space-3);
    font-size: var(--its-fs-sm);
    color: var(--its-text-dim);
}

.home-stato__ok[b-hgpz40ddpn] {
    color: var(--its-success);
}

.home-stato__ok--parziale[b-hgpz40ddpn] {
    color: var(--its-warning-text);
}

.home-stato__ok--parziale a[b-hgpz40ddpn] {
    color: inherit;
    font-weight: 600;
}

@media (max-width: 600px) {
    .home-stato__conta[b-hgpz40ddpn] {
        flex: 1 1 100%;
    }

    .home-stato__da[b-hgpz40ddpn] {
        margin-left: 0;
        flex-basis: 100%;
        padding-left: 19px;
    }
}

/* ── Area avvisi dell'azienda (stessa cornice del riquadro dei servizi) ── */
.home-avvisi[b-hgpz40ddpn] {
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius-lg);
    padding: var(--its-space-4);
    margin-bottom: var(--its-space-5);
}

.home-avvisi__riga[b-hgpz40ddpn] {
    max-width: 100%;
    margin-bottom: var(--its-space-2);
}

/* Le mie attività: l'ora dell'intervento davanti al titolo, come in un'agenda. */
.home-att__ora[b-hgpz40ddpn] {
    flex: 0 0 auto;
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    font-weight: 600;
    color: var(--its-admin);
    min-width: 54px;
}
/* /Pages/IlMioProfilo.razor.rz.scp.css */
/* =============================================
   IL MIO PROFILO — versione ridotta della scheda
   utente. Shell, hero, card e liste stanno in
   its-shell.css: qui solo il resto.
   ============================================= */

/* /Pages/LiveChat.razor.rz.scp.css */
/* =============================================
   LIVECHAT — solo ciò che è proprio di questa pagina.
   Shell, colori e misure vengono da its-variables.css
   e its-shell.css: qui restano l'elenco dei ticket, le
   bolle, l'area di scrittura e il pannello informazioni.
   ============================================= */

/* I tre colori della bolla in uscita sono della chat, non del design
   system: restano espliciti. */
.its-shell[b-z715n3hgq7] {
    --lc2-bubble-out: #e8f8ee;
    --lc2-bubble-out-border: #b2dfc2;
    --lc2-bubble-out-text: #1a4a2e;
}

/* =============================================
   SIDEBAR
   ============================================= */

.lc2-sidebar[b-z715n3hgq7] {
    width: 320px;
    min-width: 320px;
    display: flex;
    flex-direction: column;
    background: var(--its-surface);
    border-right: 1px solid var(--its-border);
    overflow: hidden;
    transition: width 0.2s ease, min-width 0.2s ease, opacity 0.2s ease, visibility 0s linear 0s;
}

/* ⚠️ Chiusa non basta che sia larga zero e trasparente: su telefono (lista
   sovrapposta, sotto 960px) restava un contenitore di scroll vivo, e il primo
   gesto sulla conversazione andava ancora alla lista appena scorsa — la chat
   non scorreva finché non si toccava un punto qualsiasi. `visibility` la toglie
   dal hit-test; il ritardo di 0.2s lascia finire l'animazione di chiusura. */
.lc2-sidebar--collapsed[b-z715n3hgq7] {
    width: 0 !important;
    min-width: 0 !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: width 0.2s ease, min-width 0.2s ease, opacity 0.2s ease, visibility 0s linear 0.2s;
}

.lc2-sidebar__header[b-z715n3hgq7] {
    padding: 12px 12px 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-bottom: 1px solid var(--its-border);
    flex-shrink: 0;
}

.lc2-sidebar__top[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.lc2-sidebar__title[b-z715n3hgq7] {
    font-size: 14px;
    font-weight: 600;
    color: var(--its-text);
    letter-spacing: -0.2px;
}

.lc2-numero-badge[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 7px;
    background: var(--its-surface2);
    border: 1px solid var(--its-border);
    border-radius: 20px;
    padding: 5px 12px;
    font-size: 12px;
    font-family: var(--its-font-mono);
    color: var(--its-text-dim);
}

.lc2-numero-dot[b-z715n3hgq7] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--its-accent);
    box-shadow: 0 0 6px var(--its-accent);
    flex-shrink: 0;
}

.lc2-numero-select[b-z715n3hgq7]  .mud-input-outlined {
    border-radius: 20px;
    font-size: 12px;
}

.lc2-search[b-z715n3hgq7]  .mud-input-outlined {
    border-radius: 8px;
    font-size: 13px;
    background: var(--its-surface2);
}

/* Filtro tabs */
.lc2-filter-tabs[b-z715n3hgq7] {
    display: flex;
    gap: 3px;
    background: var(--its-surface2);
    border-radius: 8px;
    padding: 3px;
}

.lc2-filter-tab[b-z715n3hgq7] {
    flex: 1;
    text-align: center;
    padding: 4px 0;
    font-size: 11px;
    font-weight: 500;
    border-radius: 6px;
    cursor: pointer;
    color: var(--its-text-muted);
    transition: background 0.15s, color 0.15s;
    user-select: none;
}

.lc2-filter-tab--active[b-z715n3hgq7] {
    background: var(--its-surface);
    color: var(--its-text);
    box-shadow: 0 1px 3px var(--its-shadow);
}

.lc2-filter-tab:hover:not(.lc2-filter-tab--active)[b-z715n3hgq7] {
    color: var(--its-text-dim);
}

/* Lista ticket */
.lc2-ticket-list[b-z715n3hgq7] {
    flex: 1;
    overflow-y: auto;
    padding: 4px 6px;
}

    .lc2-ticket-list[b-z715n3hgq7]::-webkit-scrollbar {
        width: 4px;
    }

    .lc2-ticket-list[b-z715n3hgq7]::-webkit-scrollbar-track {
        background: transparent;
    }

    .lc2-ticket-list[b-z715n3hgq7]::-webkit-scrollbar-thumb {
        background: var(--its-border);
        border-radius: 4px;
    }

.lc2-ticket-item[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s;
    position: relative;
}

    .lc2-ticket-item:hover[b-z715n3hgq7] {
        background: var(--its-surface2);
    }

.lc2-ticket-item--active[b-z715n3hgq7] {
    background: var(--its-surface2);
}

    .lc2-ticket-item--active[b-z715n3hgq7]::before {
        content: '';
        position: absolute;
        left: 0;
        top: 20%;
        bottom: 20%;
        width: 3px;
        background: var(--its-accent);
        border-radius: 0 3px 3px 0;
    }

/* Avatar */
.lc2-avatar[b-z715n3hgq7] {
    width: 40px;
    height: 40px;
    min-width: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    position: relative;
    flex-shrink: 0;
}

.lc2-avatar--c1[b-z715n3hgq7] {
    background: linear-gradient(135deg, #4f8ef7, #a78bfa);
}

.lc2-avatar--c2[b-z715n3hgq7] {
    background: linear-gradient(135deg, #f75f8e, #f5a442);
}

.lc2-avatar--c3[b-z715n3hgq7] {
    background: linear-gradient(135deg, var(--its-accent), #4f8ef7);
}

.lc2-avatar--c4[b-z715n3hgq7] {
    background: linear-gradient(135deg, #f5c842, #f75f5f);
}

.lc2-status-dot[b-z715n3hgq7] {
    position: absolute;
    bottom: 1px;
    right: 1px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 2px solid var(--its-surface);
}

.lc2-status-dot--aperto[b-z715n3hgq7] {
    background: var(--its-accent);
}

.lc2-status-dot--inlavorazione[b-z715n3hgq7] {
    background: var(--its-blue);
}

.lc2-status-dot--chiuso[b-z715n3hgq7] {
    background: var(--its-text-muted);
}

/* Ticket info */
.lc2-ticket-info[b-z715n3hgq7] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.lc2-ticket-name-row[b-z715n3hgq7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
}

.lc2-ticket-name[b-z715n3hgq7] {
    font-size: 13px;
    font-weight: 500;
    color: var(--its-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lc2-ticket-time[b-z715n3hgq7] {
    font-size: 11px;
    color: var(--its-text-muted);
    font-family: var(--its-font-mono);
    white-space: nowrap;
    flex-shrink: 0;
}

.lc2-ticket-preview[b-z715n3hgq7] {
    font-size: 12px;
    color: var(--its-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lc2-ticket-preview--unread[b-z715n3hgq7] {
    color: var(--its-text-dim);
    font-weight: 500;
}

/* Formattazione WhatsApp: viene da .its-wa (its-shell.css). Nell'anteprima
   in riga il `code` non ha fondo, deve restare alto una riga. */
.lc2-ticket-preview code[b-z715n3hgq7] {
    background: none;
    padding: 0;
}

/* Skeleton loader */
.lc2-ticket-skeleton[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
}

.lc2-ticket-skeleton__lines[b-z715n3hgq7] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* Empty list */
.lc2-empty-list[b-z715n3hgq7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 40px 20px;
    color: var(--its-text-muted);
}

/* =============================================
   CHAT PANEL
   ============================================= */

.lc2-chat[b-z715n3hgq7] {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--its-bg);
    min-width: 0;
}

/* Header */
.lc2-chat__header[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 16px;
    height: 60px;
    background: var(--its-surface);
    border-bottom: 1px solid var(--its-border);
    flex-shrink: 0;
}

.lc2-chat__header-avatar[b-z715n3hgq7] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    flex-shrink: 0;
}

.lc2-chat__header-info[b-z715n3hgq7] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.lc2-chat__header-name[b-z715n3hgq7] {
    font-size: 14px;
    font-weight: 600;
    color: var(--its-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lc2-chat__header-sub[b-z715n3hgq7] {
    font-size: 11px;
    color: var(--its-text-muted);
    font-family: var(--its-font-mono);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lc2-chat__header-actions[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* Il separatore è invisibile su desktop */
.lc2-chat__header-actions-sep[b-z715n3hgq7] {
    display: none;
}

/* Stato e icone: inline su desktop */
.lc2-chat__header-stato[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.lc2-chat__header-actions[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* ── Header mobile: riga 1 = hamburger+avatar+nome+stato, riga 2 = icone ── */
@media (max-width: 600px) {
    .lc2-chat__header[b-z715n3hgq7] {
        height: auto;
        flex-wrap: wrap;
        padding: 6px 8px;
        gap: 6px;
        row-gap: 2px;
        align-items: center;
    }

    /* Nome si restringe lasciando spazio allo stato */
    .lc2-chat__header-info[b-z715n3hgq7] {
        flex: 1 1 0;
        min-width: 0;
    }

    /* Stato rimane compatto a destra del nome, non si sposta */
    .lc2-chat__header-stato[b-z715n3hgq7] {
        flex-shrink: 0;
    }

    /* Icone: vanno a capo su riga 2, allineate a destra
       width 100% + justify-content end le mette in fondo */
    .lc2-chat__header-actions[b-z715n3hgq7] {
        width: 100%;
        justify-content: flex-end;
        gap: 0;
        padding-right: 0;
    }
}

/* Messaggi */
.lc2-messages[b-z715n3hgq7] {
    flex: 1;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

    .lc2-messages[b-z715n3hgq7]::-webkit-scrollbar {
        width: 4px;
    }

    .lc2-messages[b-z715n3hgq7]::-webkit-scrollbar-track {
        background: transparent;
    }

    .lc2-messages[b-z715n3hgq7]::-webkit-scrollbar-thumb {
        background: var(--its-border);
        border-radius: 4px;
    }

.lc2-messages__loading[b-z715n3hgq7] {
    display: flex;
    justify-content: center;
    padding: 40px;
}

/* Sentinelle dello scroll infinito: in cima alla conversazione (messaggi
   precedenti) e in fondo alla lista ticket. Poco alte di proposito — segnalano
   che si sta caricando, non occupano la vista. */
.lc2-messages__prima[b-z715n3hgq7],
.lc2-ticket-sentinel[b-z715n3hgq7] {
    display: flex;
    justify-content: center;
    padding: 12px 0;
}

/* Date divider */
.lc2-date-divider[b-z715n3hgq7] {
    text-align: center;
    margin: 12px 0 8px;
}

    .lc2-date-divider span[b-z715n3hgq7] {
        background: var(--its-surface);
        border: 1px solid var(--its-border);
        color: var(--its-text-muted);
        font-size: 11px;
        font-family: var(--its-font-mono);
        padding: 3px 10px;
        border-radius: 20px;
    }

/* Righe messaggio */
.lc2-msg-row[b-z715n3hgq7] {
    display: flex;
    max-width: 70%;
    animation: lc2MsgIn-b-z715n3hgq7 0.18s ease;
}

@keyframes lc2MsgIn-b-z715n3hgq7 {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.lc2-msg-row--in[b-z715n3hgq7] {
    align-self: flex-start;
}

.lc2-msg-row--out[b-z715n3hgq7] {
    align-self: flex-end;
    flex-direction: row-reverse;
}

/* Bolle */
.lc2-bubble[b-z715n3hgq7] {
    padding: 9px 13px;
    border-radius: 14px;
    font-size: 13.5px;
    line-height: 1.5;
    word-break: break-word;
    max-width: 100%;
}

.lc2-bubble--in[b-z715n3hgq7] {
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-bottom-left-radius: 4px;
    color: var(--its-text);
    box-shadow: 0 1px 2px var(--its-shadow);
}

.lc2-bubble--out[b-z715n3hgq7] {
    background: var(--lc2-bubble-out);
    border: 1px solid var(--lc2-bubble-out-border);
    border-bottom-right-radius: 4px;
    color: var(--lc2-bubble-out-text);
}

.lc2-bubble__text[b-z715n3hgq7] {
    display: block;
    /* Gli a capo del messaggio restano a capo: senza, un messaggio del cliente su
       più righe si leggeva tutto di seguito (trovato collaudando le reaction). */
    white-space: pre-wrap;
    word-break: break-word;
}

/* Il `code` dentro la bolla non può avere il fondo neutro: la bolla in
   uscita è verde. Il resto della formattazione viene da .its-wa. */
.lc2-bubble__text code[b-z715n3hgq7],
.lc2-media-caption code[b-z715n3hgq7] {
    background: rgba(0, 0, 0, 0.06);
    font-size: 0.85em;
}

/* Nome utente mittente nella bolla — visibile solo sui messaggi in uscita */
.lc2-bubble__author[b-z715n3hgq7] {
    font-size: 10.5px;
    font-weight: 600;
    color: var(--its-accent);
    margin-bottom: 3px;
    display: block;
    opacity: 0.85;
}

.lc2-bubble__footer[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    margin-top: 4px;
}

/* Orario e status */
.lc2-msg-time[b-z715n3hgq7] {
    font-size: 10px;
    color: var(--its-text-muted);
    font-family: var(--its-font-mono);
}

.lc2-status-icon[b-z715n3hgq7] {
    font-size: 11px;
    line-height: 1;
}

.lc2-status-icon--pending[b-z715n3hgq7] {
    color: var(--its-border);
}

.lc2-status-icon--sent[b-z715n3hgq7] {
    color: var(--its-text-muted);
}

.lc2-status-icon--read[b-z715n3hgq7] {
    color: var(--its-blue);
}

/* Reply preview */
.lc2-reply-preview[b-z715n3hgq7] {
    background: var(--its-surface2);
    border-left: 3px solid var(--its-accent);
    border-radius: 4px 8px 8px 4px;
    padding: 5px 8px;
    font-size: 12px;
    color: var(--its-text-dim);
    margin-bottom: 6px;
}

/* Media */
.lc2-media-row[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--its-text-dim);
}

.lc2-media-name[b-z715n3hgq7] {
    font-size: 13px;
    font-weight: 500;
    color: var(--its-text);
}

.lc2-media-mime[b-z715n3hgq7] {
    font-size: 11px;
    color: var(--its-text-muted);
}

/* Reaction */


/* Nota interna */
.lc2-msg-nota[b-z715n3hgq7] {
    align-self: center;
    max-width: 80%;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    background: var(--its-warning-bg);
    border: 1px solid var(--its-warning);
    border-radius: 10px;
    padding: 9px 13px;
    margin: 6px 0;
    animation: lc2MsgIn-b-z715n3hgq7 0.18s ease;
}

.lc2-msg-nota__label[b-z715n3hgq7] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: #b8860b;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.lc2-msg-nota__text[b-z715n3hgq7] {
    font-size: 13px;
    color: #7a5f00;
    line-height: 1.5;
    /* Gli a capo scritti nella nota restano a capo: senza, la card mostrava
       tutto su una riga sola. */
    white-space: pre-wrap;
    word-break: break-word;
}

/* Empty state */
.lc2-empty-state[b-z715n3hgq7] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: var(--its-text-muted);
    text-align: center;
    padding: 40px;
}

/* =============================================
   INPUT AREA
   ============================================= */

.lc2-input-area[b-z715n3hgq7] {
    /* safe-bottom: sopra la barra home degli iPhone, non sotto. */
    padding: 10px 14px calc(12px + var(--its-safe-bottom));
    background: var(--its-surface);
    border-top: 1px solid var(--its-border);
    flex-shrink: 0;
    transition: border-top-color 0.2s, background 0.2s;
}

.lc2-input-area--nota[b-z715n3hgq7] {
    border-top-color: var(--its-warning);
    background: var(--its-warning-bg);
}

.lc2-input-toolbar[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    row-gap: 4px;
    gap: 2px;
    margin-bottom: 8px;
}

.lc2-input-toolbar__sep[b-z715n3hgq7] {
    flex: 1;
}

/* Campo di scrittura e bottone di invio: stanno in Components/ComposerChat
   (componente e CSS suoi), vedi il commento lì. */

/* =============================================
   INFO PANEL
   ============================================= */

.lc2-info-panel[b-z715n3hgq7] {
    width: 280px;
    min-width: 280px;
    background: var(--its-surface);
    border-left: 1px solid var(--its-border);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

    .lc2-info-panel[b-z715n3hgq7]::-webkit-scrollbar {
        width: 4px;
    }

    .lc2-info-panel[b-z715n3hgq7]::-webkit-scrollbar-thumb {
        background: var(--its-border);
        border-radius: 4px;
    }

.lc2-info-section[b-z715n3hgq7] {
    padding: 14px 16px;
    border-bottom: 1px solid var(--its-border);
}

.lc2-info-title[b-z715n3hgq7] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    color: var(--its-text-muted);
    margin-bottom: 10px;
}

.lc2-info-row[b-z715n3hgq7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
    margin-bottom: 7px;
}

.lc2-info-label[b-z715n3hgq7] {
    color: var(--its-text-muted);
}

.lc2-info-value[b-z715n3hgq7] {
    color: var(--its-text);
    font-weight: 500;
}

.lc2-info-value--mono[b-z715n3hgq7] {
    font-family: var(--its-font-mono);
    font-size: 12px;
}

/* In evidenza: avvisi del numero e note fissate, sotto la testata.
   Stesso fondo della conversazione, così le card si leggono come messaggi. */
.lc2-evidenza[b-z715n3hgq7] {
    flex: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 20px 4px;
    background: var(--its-bg);
    max-height: 45%;
    overflow-y: auto;
}

.lc2-evidenza__gruppo[b-z715n3hgq7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

/* Avvisi del numero e note fissate occupano tutta la larghezza della conversazione. */
.lc2-evidenza__gruppo--larga[b-z715n3hgq7] {
    align-items: stretch;
}

/* …ma il «+N / Mostra meno» resta una pillola al centro, non una barra. */
.lc2-evidenza__gruppo--larga .lc2-evidenza__altri[b-z715n3hgq7] {
    align-self: center;
}

/* «Nuovo ticket»: il bottone Apri, bianco sul blu della barra. */
.lc2-ticket-nuovo[b-z715n3hgq7]  .lc2-ticket-nuovo__apri {
    flex: none;
    background: #fff;
    color: var(--its-admin);
    font-weight: 700;
}

/* «+N»: la pillola dei divisori di data. */
.lc2-evidenza__altri[b-z715n3hgq7] {
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    color: var(--its-text-muted);
    font: inherit;
    font-size: 11px;
    padding: 2px 10px;
    border-radius: 20px;
    cursor: pointer;
}

    .lc2-evidenza__altri:hover[b-z715n3hgq7] {
        color: var(--its-text);
    }

/* Nota fissata: rosso pieno, testo bianco e a tutta larghezza — è fissata perché
   chi apre la chat la deve leggere prima di rispondere. Nel giallo delle note
   interne passava inosservata, e nel rosso tenue (29/09/2026) ancora poco. */
.lc2-fissata[b-z715n3hgq7] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--its-danger);
    border: 1px solid var(--its-danger-text);
    border-radius: 10px;
    padding: 4px 6px 4px 14px;
    box-shadow: 0 2px 8px rgba(179, 38, 30, 0.25);
}

/* Etichetta e testo su una riga: la fascia non deve mangiarsi la conversazione.
   align-items esplicito: la regola globale sui button centrerebbe il contenuto. */
.lc2-fissata__corpo[b-z715n3hgq7] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: 8px;
    padding: 5px 0;
    border: 0;
    background: none;
    text-align: left;
    font: inherit;
    cursor: pointer;
}

.lc2-fissata__label[b-z715n3hgq7] {
    flex: none;
    white-space: nowrap;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: rgba(255, 255, 255, 0.85);
    text-transform: uppercase;
}

.lc2-fissata__testo[b-z715n3hgq7] {
    flex: 1;
    min-width: 0;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    line-height: 1.45;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lc2-fissata--aperta .lc2-fissata__corpo[b-z715n3hgq7] {
    flex-wrap: wrap;
}

.lc2-fissata--aperta .lc2-fissata__testo[b-z715n3hgq7] {
    flex-basis: 100%;
    white-space: pre-wrap;
}

.lc2-msg-nota--fissata[b-z715n3hgq7] {
    box-shadow: inset 3px 0 0 var(--its-danger);
}

/* Avviso in testata: servizi del cliente giù. Rosso pieno, si nota aprendo il ticket. */
.lc2-servizi-alert[b-z715n3hgq7] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: none;
    padding: 3px 10px 3px 6px;
    border: 1px solid var(--its-danger);
    border-radius: 999px;
    background: var(--its-danger-bg);
    color: var(--its-danger-text);
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
}

.lc2-servizi-alert:hover[b-z715n3hgq7] {
    background: var(--its-danger);
    color: #fff;
}

/* Contatore dei servizi in errore sul titolo della sezione. */
.lc2-servizi-errori[b-z715n3hgq7] {
    margin-left: 6px;
    min-width: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: var(--its-danger);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 18px;
    text-align: center;
}

/* Messaggio raggiunto dalla fascia (classe messa da scorriAlMessaggio). */
.lc2-evidenziato[b-z715n3hgq7] {
    animation: lc2-evidenzia-b-z715n3hgq7 1.6s ease-out;
}

@keyframes lc2-evidenzia-b-z715n3hgq7 {
    0%, 30% { background-color: #ffe9a8; }
    100%    { background-color: transparent; }
}

/* Servizi del cliente (pannello Info) */
.lc2-servizi-titolare[b-z715n3hgq7] {
    font-size: 12px;
    color: var(--its-text-muted);
    margin: 6px 0 8px;
}

.lc2-servizio[b-z715n3hgq7] {
    min-width: 0;
    overflow: hidden;
    padding: 8px 6px 8px 12px;
    border-radius: 8px;
    border: 1px solid var(--its-border);
    border-left: 3px solid var(--its-danger);
    background: var(--its-surface2);
    margin-top: 8px;
}

.lc2-servizio__testa[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 28px;
}

/* Il nome va a capo (fino a due righe) e prende tutto lo spazio fra il pallino
   e «Verifica ora». È un bottone: porta alla scheda del cliente. */
.lc2-servizio__nome[b-z715n3hgq7] {
    flex: 1;
    min-width: 0;
    padding: 0;
    border: 0;
    background: none;
    text-align: left;
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--its-text);
    overflow: hidden;
    overflow-wrap: anywhere;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.lc2-servizio__nome:hover[b-z715n3hgq7] {
    text-decoration: underline;
}

.lc2-servizio__bersagli[b-z715n3hgq7] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-top: 2px;
    font-size: 12px;
    color: var(--its-text-muted);
}

/* Host lunghi (myfritz, 3cx…) nel pannello da 280px: si tronca col tooltip,
   non si allarga il pannello. */
.lc2-servizio__bersagli[b-z715n3hgq7]  .its-bersaglio {
    max-width: 100%;
    min-width: 0;
}

.lc2-servizio__bersagli[b-z715n3hgq7]  .its-bersaglio strong,
.lc2-servizio__bersagli[b-z715n3hgq7]  .its-bersaglio a {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* strong e il Link (a) stanno in BersagliServizio, componente figlio: serve ::deep. */
.lc2-servizio__bersagli[b-z715n3hgq7]  strong,
.lc2-servizio__bersagli[b-z715n3hgq7]  a {
    font-family: var(--its-font-codici);
    font-weight: 500;
    letter-spacing: 0.03em;
    font-variant-numeric: tabular-nums slashed-zero;
    color: var(--its-text);
}

/* Template items */
.lc2-template-item[b-z715n3hgq7] {
    padding: 9px 10px;
    border-radius: 8px;
    border: 1px solid var(--its-border);
    background: var(--its-surface2);
    margin-bottom: 6px;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
}

    .lc2-template-item:hover[b-z715n3hgq7] {
        border-color: var(--its-accent);
        background: var(--its-accent-light);
    }

.lc2-template-name[b-z715n3hgq7] {
    font-size: 12px;
    font-weight: 600;
    color: var(--its-text);
    margin-bottom: 3px;
}

.lc2-template-preview[b-z715n3hgq7] {
    font-size: 11px;
    color: var(--its-text-muted);
    line-height: 1.4;
}

/* =============================================
   RESPONSIVE
   ============================================= */

/* Fino a 1180px (iPad in orizzontale compreso) il pannello info è
   sovrapposto invece che affiancato: con menu, lista e info tutti in riga
   alla conversazione restavano 200-360px. */
@media (max-width: 1180px) {
    .lc2-info-panel[b-z715n3hgq7] {
        display: none;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: 320px;
        max-width: 90vw;
        z-index: 200;
        box-shadow: -4px 0 24px rgba(0,0,0,0.18);
    }

    .lc2-info-panel--open[b-z715n3hgq7] {
        display: flex !important;
        flex-direction: column;
    }
}

/* Tablet e telefono: la lista copre la conversazione invece di stringerla.
   Selezionare un ticket la chiude (its.eChatStretta, stessa soglia), la
   freccia nella testata la riapre. Prima valeva solo sotto i 640px, e fra
   641 e 960 lista e conversazione si dividevano uno schermo da tablet. */
@media (max-width: 960px) {
    .lc2-sidebar[b-z715n3hgq7] {
        position: absolute;
        z-index: 20;
        height: var(--its-shell-h);
        box-shadow: 4px 0 24px rgba(0,0,0,0.12);
    }

        .lc2-sidebar:not(.lc2-sidebar--collapsed)[b-z715n3hgq7] {
            width: min(100%, 400px);
            min-width: min(100%, 400px);
        }
}

@media (max-width: 600px) {
    .lc2-sidebar:not(.lc2-sidebar--collapsed)[b-z715n3hgq7] {
        width: 100%;
        min-width: 100%;
    }

    .lc2-msg-row[b-z715n3hgq7] {
        max-width: 88%;
    }
}

/* Bolla template — header con nome + corpo testo */
.lc2-bubble-template[b-z715n3hgq7] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.lc2-bubble-template__header[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 5px;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    color: var(--its-text-muted);
    font-size: 11px;
}

.lc2-bubble-template__name[b-z715n3hgq7] {
    font-weight: 600;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.lc2-bubble-template__body[b-z715n3hgq7] {
    font-size: 13.5px;
    line-height: 1.6;
    color: inherit;
    word-break: break-word;
}








/* Wrapper posizione relativa per il badge reaction */
.lc2-bubble-wrap[b-z715n3hgq7] {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    max-width: 100%;
    /* Padding bottom per fare spazio al badge sovrapposto */
    padding-bottom: 10px;
    margin-bottom: 2px;
}

/* Badge reaction stile WhatsApp — sovrapposto in basso alla bolla */
.lc2-reaction-badges[b-z715n3hgq7] {
    position: absolute;
    bottom: 0;
    display: flex;
    gap: 2px;
    z-index: 1;
}

.lc2-reaction-badges--out[b-z715n3hgq7] {
    left: 6px; /* lato sinistro della bolla uscente (angolo inferiore sinistro) */
}

.lc2-reaction-badges--in[b-z715n3hgq7] {
    right: 6px; /* lato destro della bolla entrante */
}

.lc2-reaction-badge[b-z715n3hgq7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border: 1px solid var(--its-border);
    border-radius: 999px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
    font-size: 13px;
    line-height: 1;
    padding: 2px 5px;
    min-width: 26px;
    height: 22px;
}

/* =============================================
   SIDEBAR SINISTRA — ticket item arricchito
============================================= */

.lc2-ticket-company[b-z715n3hgq7] {
    font-size: 11px;
    color: var(--mud-palette-text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 2px;
}

.lc2-ticket-bottom-row[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.lc2-ticket-id[b-z715n3hgq7] {
    font-size: 10px;
    color: var(--mud-palette-text-disabled);
    flex-shrink: 0;
}

.lc2-badge-unregistered[b-z715n3hgq7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--mud-palette-text-disabled);
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    margin-left: 3px;
    vertical-align: middle;
    flex-shrink: 0;
}

/* =============================================
   INFO PANEL — contatto anagrafica
============================================= */

.lc2-info-contact-header[b-z715n3hgq7] {
    padding: 8px 0 12px;
    border-bottom: 1px solid var(--mud-palette-divider);
    margin-bottom: 8px;
}

.lc2-info-contact-name[b-z715n3hgq7] {
    font-size: 15px;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
    line-height: 1.3;
}

.lc2-info-contact-company[b-z715n3hgq7] {
    font-size: 12px;
    color: var(--mud-palette-text-secondary);
    margin-top: 2px;
}

/* =============================================
   SIDEBAR DESTRA — fullscreen su mobile
============================================= */

/* Su telefono il pannello info occupa tutto lo schermo */
@media (max-width: 600px) {
    .lc2-info-panel--open[b-z715n3hgq7] {
        position: fixed !important;
        inset: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 0 !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        z-index: 999 !important;
    }
}

/* =============================================
   INFO PANEL — backdrop e close row (mobile/tablet)
============================================= */

/* Backdrop scuro dietro il pannello info su mobile/tablet */
.lc2-info-backdrop[b-z715n3hgq7] {
    display: none;
}

@media (max-width: 1180px) {
    .lc2-info-backdrop[b-z715n3hgq7] {
        display: block;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,0.35);
        z-index: 199;
    }
}

/* Riga header con titolo e pulsante chiusura nel pannello info: sempre
   visibile, anche su desktop dove il pannello è affiancato. */
.lc2-info-panel__close-row[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px 10px 20px;
    border-bottom: 1px solid var(--its-border);
    flex-shrink: 0;
}

.lc2-info-panel__close-title[b-z715n3hgq7] {
    font-size: 15px;
    font-weight: 600;
    color: var(--its-text);
}

/* =============================================
   NOTA INTERNA — pulsanti modifica/elimina
============================================= */

.lc2-nota-actions[b-z715n3hgq7] {
    display: inline-flex;
    align-items: center;
    gap: 0;
    margin-left: 4px;
    opacity: 0;
    transition: opacity 0.15s ease;
    vertical-align: middle;
}

.lc2-msg-nota:hover .lc2-nota-actions[b-z715n3hgq7] {
    opacity: 1;
}

.lc2-nota-action-btn[b-z715n3hgq7] {
    width: 22px !important;
    height: 22px !important;
    padding: 0 !important;
}

.lc2-msg-nota--editing[b-z715n3hgq7] {
    background: var(--its-warning-bg) !important;
    border-color: var(--its-warning) !important;
}

/* Form modifica inline */
.lc2-nota-edit-form[b-z715n3hgq7] {
    margin-top: 6px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.lc2-nota-edit-input[b-z715n3hgq7] {
    font-size: 13px;
}

.lc2-nota-edit-actions[b-z715n3hgq7] {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
}

/* =============================================
   MESSAGGIO RITARDATO — badge orario + elimina
============================================= */

.lc2-ritardo-badge[b-z715n3hgq7] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 10px;
    color: var(--mud-palette-secondary);
    background: rgba(156, 39, 176, 0.08);
    border-radius: 8px;
    padding: 1px 5px;
    font-weight: 500;
}

/* Variante "inviato": il messaggio ritardato è stato effettivamente spedito,
   mostriamo l'orario di invio in verde accanto a quello di inserimento. */
.lc2-ritardo-badge--sent[b-z715n3hgq7] {
    color: var(--mud-palette-success);
    background: rgba(76, 175, 80, 0.10);
}

/* Tentativi esauriti: il messaggio non è partito e la coda non lo riprende più.
   Rosso, perché è l'unico stato che richiede che qualcuno faccia qualcosa. */
.lc2-errore-badge[b-z715n3hgq7] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 10px;
    color: var(--mud-palette-error);
    background: rgba(244, 67, 54, 0.10);
    border-radius: 8px;
    padding: 1px 5px;
    font-weight: 500;
}

.lc2-delete-ritardo-btn[b-z715n3hgq7] {
    width: 20px !important;
    height: 20px !important;
    padding: 0 !important;
    margin-left: 2px !important;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.lc2-bubble:hover .lc2-delete-ritardo-btn[b-z715n3hgq7] {
    opacity: 1;
}

/* Senza mouse non c'è hover: le azioni di note e invii programmati restano
   visibili, altrimenti su telefono e tablet non si raggiungono affatto. */
@media (hover: none) {
    .lc2-nota-actions[b-z715n3hgq7],
    .lc2-delete-ritardo-btn[b-z715n3hgq7] {
        opacity: 1;
    }

    .lc2-nota-action-btn[b-z715n3hgq7] {
        width: 32px !important;
        height: 32px !important;
    }
}

/* Azioni header sidebar (notifiche + nuovo ticket) */
.lc2-sidebar__top-actions[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Media row: allineamento icona + info + download */
.lc2-media-row[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.lc2-media-icon[b-z715n3hgq7] {
    flex-shrink: 0;
    opacity: 0.75;
}

.lc2-media-info[b-z715n3hgq7] {
    flex: 1;
    min-width: 0;
}

.lc2-media-name[b-z715n3hgq7] {
    font-weight: 500;
    font-size: 0.875rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}

.lc2-media-mime[b-z715n3hgq7] {
    font-size: 0.7rem;
    opacity: 0.6;
}

.lc2-media-download-btn[b-z715n3hgq7] {
    flex-shrink: 0;
    opacity: 0.7;
    transition: opacity 0.15s;
}

    .lc2-media-download-btn:hover[b-z715n3hgq7] {
        opacity: 1;
    }

/* Caption sotto la bolla media */
.lc2-media-caption[b-z715n3hgq7] {
    margin-top: 4px;
    font-size: 0.875rem;
    white-space: pre-wrap;
    word-break: break-word;
}

/* ═══════════════════════════════════════════════
   LiveChat — sessione 24h scaduta
   ═══════════════════════════════════════════════ */

/* Area input con sessione scaduta — bordo ambra sottile, stesso pattern della nota */
.lc2-input-area--scaduta[b-z715n3hgq7] {
    border-top: 2px solid #e8a020;
}

/* Avviso sessione: riga compatta nella toolbar, non un banner separato */
.lc2-sessione-avviso[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11.5px;
    font-weight: 500;
    color: #b06a00;
    background: #fff8ed;
    border: 1px solid #f0c070;
    border-radius: 6px;
    padding: 3px 8px 3px 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 1;
    min-width: 0;
}

.lc2-sessione-avviso__icon[b-z715n3hgq7] {
    font-size: 13px;
    flex-shrink: 0;
    opacity: 0.8;
}

/* Avviso mobile: nascosto di default, visibile solo su schermi piccoli */
.lc2-sessione-avviso--mobile[b-z715n3hgq7] {
    display: none;
}

@media (max-width: 600px) {
    /* Nascondo la pillola inline nella toolbar */
    .lc2-sessione-avviso[b-z715n3hgq7] {
        display: none;
    }

    /* Mostro la riga sotto la toolbar */
    .lc2-sessione-avviso--mobile[b-z715n3hgq7] {
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 11.5px;
        font-weight: 500;
        color: #b06a00;
        background: #fff8ed;
        border-top: 1px solid #f0c070;
        padding: 5px 14px;
        width: 100%;
        box-sizing: border-box;
    }
}


/* ═══════════════════════════════════════════════
   Pannello Archivio ticket
   ═══════════════════════════════════════════════ */

.lc2-archivio-panel[b-z715n3hgq7] {
    position: absolute;
    top: 0;
    right: 0;
    width: 340px;
    height: 100%;
    background: var(--mud-palette-surface);
    border-left: 1px solid var(--mud-palette-divider);
    display: flex;
    flex-direction: column;
    z-index: 200;
    box-shadow: -4px 0 16px rgba(0,0,0,.08);
}

@media (max-width: 600px) {
    .lc2-archivio-panel[b-z715n3hgq7] {
        width: 100%;
        border-left: none;
    }
}

.lc2-archivio-panel__header[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px 12px;
    border-bottom: 1px solid var(--mud-palette-divider);
    flex-shrink: 0;
}

.lc2-archivio-panel__title[b-z715n3hgq7] {
    font-size: 14px;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
}

.lc2-archivio-panel__body[b-z715n3hgq7] {
    flex: 1;
    overflow-y: auto;
    padding: 8px 0;
}

.lc2-archivio-panel__loading[b-z715n3hgq7],
.lc2-archivio-panel__empty[b-z715n3hgq7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 40px 16px;
    color: var(--mud-palette-text-secondary);
}

/* Riga singolo ticket archiviato */
.lc2-archivio-item[b-z715n3hgq7] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--mud-palette-divider);
    transition: background 0.15s;
}

    .lc2-archivio-item:hover[b-z715n3hgq7] {
        background: var(--mud-palette-action-hover);
    }

.lc2-archivio-item__avatar[b-z715n3hgq7] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
}

.lc2-archivio-item__info[b-z715n3hgq7] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.lc2-archivio-item__name[b-z715n3hgq7] {
    font-size: 13px;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lc2-archivio-item__meta[b-z715n3hgq7] {
    font-size: 11px;
    color: var(--mud-palette-text-secondary);
}

.lc2-archivio-item__actions[b-z715n3hgq7] {
    display: flex;
    gap: 2px;
    flex-shrink: 0;
}

/* =============================================
   REACTION — bottone accanto alla bolla e barra delle emoji
   Il bottone compare al passaggio del mouse; senza mouse resta sempre
   visibile, o su telefono e tablet non si potrebbe reagire affatto.
   ============================================= */

.lc2-reaction-badge--nostra[b-z715n3hgq7] {
    border-color: var(--its-accent);
    background: var(--its-accent-light);
}

/* ⚠️ Niente transform qui: un antenato con transform diventa il riferimento dei
   figli position:fixed, e pannello e sfondo restavano chiusi dentro la faccina. */
.lc2-reagisci[b-z715n3hgq7] {
    position: absolute;
    top: calc(50% - 5px);
    margin-top: -14px;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.12s ease;
}

.lc2-reagisci--in[b-z715n3hgq7]  { left: 100%;  margin-left: 4px; }
.lc2-reagisci--out[b-z715n3hgq7] { right: 100%; margin-right: 4px; }

.lc2-bubble-wrap:hover .lc2-reagisci[b-z715n3hgq7],
.lc2-reagisci--aperta[b-z715n3hgq7] {
    opacity: 1;
}

@media (hover: none) {
    .lc2-reagisci[b-z715n3hgq7] {
        opacity: 0.7;
    }
}

.lc2-reagisci__bottone[b-z715n3hgq7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid var(--its-border);
    border-radius: 50%;
    background: var(--its-surface);
    color: var(--its-text-muted);
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.lc2-reagisci__bottone:hover[b-z715n3hgq7] {
    color: var(--its-text);
    border-color: var(--its-text-muted);
}

/* Sfondo trasparente: un click fuori chiude la barra. */
.lc2-reagisci__sfondo[b-z715n3hgq7] {
    position: fixed;
    inset: 0;
    z-index: 1300;
}

/* Fisso rispetto allo schermo: lo colloca its.posizionaVicino. Parte invisibile per
   non comparire un istante nell'angolo prima di essere spostato. */
.lc2-reagisci__menu[b-z715n3hgq7] {
    position: fixed;
    top: 0;
    left: 0;
    visibility: hidden;
    z-index: 1301;
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-radius: 22px;
    box-shadow: 0 8px 28px var(--its-shadow-md);
    overflow: hidden;
}


.lc2-reagisci__rapide[b-z715n3hgq7] {
    display: flex;
    gap: 2px;
    padding: 4px 6px;
}

.lc2-reagisci__emoji[b-z715n3hgq7] {
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    transition: transform 0.1s ease, background 0.1s ease;
}

.lc2-reagisci__emoji:hover[b-z715n3hgq7] {
    transform: scale(1.2);
    background: var(--its-surface2);
}

/* La reaction già messa: toccarla di nuovo la toglie. */
.lc2-reagisci__emoji--scelta[b-z715n3hgq7] {
    background: var(--its-accent-light);
}

.lc2-reagisci__altro[b-z715n3hgq7] {
    font-size: 20px;
    font-weight: 600;
    color: var(--its-text-muted);
}
/* /Pages/PageAgenti.razor.rz.scp.css */
/* =============================================
   AGENTI — prefisso age-

   Shell, area principale, badge, empty state e drawer
   vengono da css/custom/its-shell.css: qui sta solo ciò
   che è proprio di questa pagina.
   ============================================= */

/* ── Griglia ── */

.age-nome[b-0zshoyy8x1] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
}

.age-nome__testo[b-0zshoyy8x1] {
    font-weight: 600;
    color: var(--its-text);
}

/* Un valore assente si scrive, non si lascia vuoto: una cella bianca
   sembra un dato non caricato. */
.age-vuoto[b-0zshoyy8x1] {
    color: var(--its-text-muted);
    font-style: italic;
    font-size: var(--its-fs-sm);
}

.age-collegamenti[b-0zshoyy8x1] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--its-space-1);
}

.age-gettone[b-0zshoyy8x1] {
    font-family: var(--its-font-mono);
    font-weight: 500;
}

.age-gettone__sub[b-0zshoyy8x1] {
    display: block;
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
    font-family: var(--its-font-mono);
}

[b-0zshoyy8x1] .age-azioni {
    white-space: nowrap;
    text-align: right;
}

/* ── Drawer ── */

/* /Pages/PageAttivita.razor.rz.scp.css */
/* =============================================
   ATTIVITÀ (elenco) — prefisso atl-
   Shell, filtri, griglia, chip e empty state vengono
   da css/custom/its-shell.css.
   ============================================= */

[b-vp3efuetuv] .atl-riga {
    cursor: pointer;
}

/* Contatore dentro il chip di stato. */
.atl-conta[b-vp3efuetuv] {
    margin-left: 6px;
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    font-weight: 500;
    opacity: 0.75;
}

.atl-numero[b-vp3efuetuv] {
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    letter-spacing: 0.03em;
}

.atl-data[b-vp3efuetuv] {
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    letter-spacing: 0.03em;
    font-weight: 500;
}

.atl-data--ritardo[b-vp3efuetuv],
.atl-ritardo[b-vp3efuetuv] {
    color: var(--its-danger-text);
    font-weight: 600;
}

.atl-vuoto[b-vp3efuetuv] {
    color: var(--its-text-muted);
    font-style: italic;
    font-size: var(--its-fs-sm);
}
/* /Pages/PageAvvisi.razor.rz.scp.css */
/* =============================================
   AVVISI — prefisso avv-

   Shell, drawer e card degli avvisi (its-avviso) vengono da
   css/custom/its-shell.css: qui solo ciò che è di questa pagina.
   ============================================= */

.avv-gruppo[b-rj5vo3fwfp] {
    margin-bottom: var(--its-space-5);
}

.avv-gruppo__titolo[b-rj5vo3fwfp] {
    font-size: var(--its-fs-label);
    font-weight: 700;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    color: var(--its-text-muted);
    margin: 0 0 10px;
}

/* Le card della fascia della chat sono strette come una bolla: qui, in un elenco
   a tutta pagina, prendono la larghezza che c'è. */
.avv-riga[b-rj5vo3fwfp] {
    max-width: 100%;
    margin-bottom: var(--its-space-2);
}
/* /Pages/PageCalendario.razor.rz.scp.css */
/* =============================================
   CALENDARIO (pagina) — prefisso cal-
   Il calendario vero sta in its-shell.css (sezione CALENDARIO):
   qui solo la legenda della pagina.
   ============================================= */

.cal-legenda[b-q56w8qw72x] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--its-space-2) var(--its-space-4);
    margin-top: var(--its-space-3);
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
}

.cal-suggerimento[b-q56w8qw72x] {
    margin-bottom: var(--its-space-2);
}

.cal-legenda__voce--avviso[b-q56w8qw72x] {
    color: var(--its-danger-text);
    font-weight: 600;
}

.cal-legenda__voce[b-q56w8qw72x] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* Le variabili di colore le dà la classe its-cal-evento--{variante}. */
.cal-legenda__colore[b-q56w8qw72x] {
    width: 14px;
    height: 10px;
    border-radius: 2px;
    background: var(--its-cal-fondo);
    border-left: 3px solid var(--its-cal-bordo);
}
/* /Pages/PageCambioPassword.razor.rz.scp.css */
/* =============================================
   CAMBIO PASSWORD — prefisso cpw-

   Card e variabili vengono da css/custom/its-shell.css
   e its-variables.css.
   ============================================= */

/* Una cosa sola da fare: la scheda sta al centro, senza sidebar né
   intestazione di sezione a distrarre. */
.cpw-pagina[b-qwfffgzx0h] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: var(--its-space-6) var(--its-space-4);
    background: var(--its-bg);
    min-height: var(--its-shell-h);
}

.cpw-scheda[b-qwfffgzx0h] {
    width: 100%;
    max-width: 460px;
    padding: var(--its-space-5);
    margin-bottom: 0;
}

/* ── Testa ── */

.cpw-testa[b-qwfffgzx0h] {
    display: flex;
    align-items: flex-start;
    gap: var(--its-space-3);
    margin-bottom: var(--its-space-4);
}

.cpw-testa__icona[b-qwfffgzx0h] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    border-radius: var(--its-radius);
    background: var(--its-admin-light);
    color: var(--its-admin);
}

.cpw-titolo[b-qwfffgzx0h] {
    margin: 0;
    font-size: var(--its-fs-lg);
    font-weight: 600;
    color: var(--its-text);
}

.cpw-sottotitolo[b-qwfffgzx0h] {
    margin: 2px 0 0;
    font-size: var(--its-fs-base);
    color: var(--its-text-dim);
}

/* ── Avvisi ── */

.cpw-avviso[b-qwfffgzx0h],
.cpw-errore[b-qwfffgzx0h] {
    display: flex;
    align-items: flex-start;
    gap: var(--its-space-2);
    padding: var(--its-space-3);
    border-radius: var(--its-radius);
    font-size: var(--its-fs-base);
    margin-bottom: var(--its-space-4);
}

.cpw-avviso[b-qwfffgzx0h] {
    background: var(--its-warning-bg);
    color: var(--its-warning-text);
}

.cpw-errore[b-qwfffgzx0h] {
    background: #fdecea;
    color: #b3261e;
    margin-top: var(--its-space-4);
    margin-bottom: 0;
}

/* ── Modulo ── */

.cpw-modulo[b-qwfffgzx0h] {
    display: flex;
    flex-direction: column;
    gap: var(--its-space-4);
}

.cpw-azioni[b-qwfffgzx0h] {
    display: flex;
    justify-content: flex-end;
    gap: var(--its-space-2);
    margin-top: var(--its-space-5);
}
/* /Pages/PageGettone.razor.rz.scp.css */
/* =============================================
   GETTONI AGENTI — prefisso get-

   Shell, card, badge ed empty state vengono da
   css/custom/its-shell.css.
   ============================================= */

/* ── Riepilogo ──
   I totali stanno sopra la tabella: sono la risposta che si cerca
   caricando il file, le righe servono a verificarla. */

.get-riepilogo[b-c2xg4bbzf6] {
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    gap: var(--its-space-5);
    padding: var(--its-space-3) var(--its-space-5);
}

.get-riepilogo__voce[b-c2xg4bbzf6] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.get-riepilogo__valore[b-c2xg4bbzf6] {
    font-family: var(--its-font-mono);
    font-size: var(--its-fs-lg);
    color: var(--its-text);
}

.get-riepilogo__voce--forte .get-riepilogo__valore[b-c2xg4bbzf6] {
    font-weight: 700;
    color: var(--its-admin);
}

.get-riepilogo__voce--avviso .get-riepilogo__valore[b-c2xg4bbzf6] {
    color: var(--its-warning-text);
    font-weight: 600;
}

/* ── Griglia ── */

/* Gli importi si confrontano in colonna: cifre allineate e a destra. */
[b-c2xg4bbzf6] .get-numero {
    text-align: right;
    white-space: nowrap;
}

.get-importo[b-c2xg4bbzf6] {
    font-family: var(--its-font-mono);
    font-size: var(--its-fs-sm);
    color: var(--its-text);
}

.get-importo--forte[b-c2xg4bbzf6] {
    font-weight: 700;
    color: var(--its-admin);
}

.get-competenza[b-c2xg4bbzf6] {
    font-size: var(--its-fs-sm);
    color: var(--its-text-dim);
    white-space: nowrap;
}

/* ── Intestazione di gruppo (per agente) ── */

.get-gruppo[b-c2xg4bbzf6] {
    display: inline-flex;
    align-items: baseline;
    gap: var(--its-space-3);
    font-weight: 600;
    color: var(--its-text);
}

.get-gruppo__totale[b-c2xg4bbzf6] {
    font-family: var(--its-font-mono);
    font-weight: 700;
    color: var(--its-admin);
}

.get-gruppo__righe[b-c2xg4bbzf6] {
    font-size: var(--its-fs-caption);
    font-weight: 400;
    color: var(--its-text-muted);
}
/* /Pages/PageInterventi.razor.rz.scp.css */
/* =============================================
   INTERVENTI (elenco) — prefisso int-
   Shell, filtri, griglia, chip e empty state vengono
   da css/custom/its-shell.css.
   ============================================= */

[b-2dt31jvtri] .int-riga {
    cursor: pointer;
}

/* Contatore dentro il chip di stato. */
.int-conta[b-2dt31jvtri] {
    margin-left: 6px;
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    font-weight: 500;
    opacity: 0.75;
}

.int-numero[b-2dt31jvtri],
.int-data[b-2dt31jvtri] {
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    letter-spacing: 0.03em;
    font-weight: 500;
}

.int-data[b-2dt31jvtri] {
    display: block;
    white-space: nowrap;
}

.int-vuoto[b-2dt31jvtri] {
    color: var(--its-text-muted);
    font-style: italic;
    font-size: var(--its-fs-sm);
}
/* /Pages/PageMonitoraggio.razor.rz.scp.css */
/* =============================================
   STATO SERVIZI — prefisso mon-

   Shell, filtri, griglia, pallini e badge vengono da
   css/custom/its-shell.css: qui solo ciò che è di questa pagina.
   ============================================= */

.mon-dot[b-ntyjhumex0] {
    margin-right: 6px;
}

.mon-stato[b-ntyjhumex0] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    font-size: var(--its-fs-sm);
    color: var(--its-text-dim);
}

.mon-stato--offline[b-ntyjhumex0] {
    color: var(--its-danger);
}

.mon-stato--degradato[b-ntyjhumex0] {
    color: var(--its-warning-text);
}

.mon-cliente[b-ntyjhumex0] {
    font-weight: 600;
    color: var(--its-text);
    text-decoration: none;
}

.mon-cliente:hover[b-ntyjhumex0] {
    color: var(--its-admin);
    text-decoration: underline;
}

.mon-giu[b-ntyjhumex0] {
    white-space: nowrap;
    color: var(--its-danger);
    font-size: var(--its-fs-sm);
}

.mon-quando[b-ntyjhumex0] {
    white-space: nowrap;
    font-size: var(--its-fs-sm);
    color: var(--its-text-dim);
}

.mon-vuoto[b-ntyjhumex0] {
    color: var(--its-text-muted);
}

/* Sede del servizio, accanto al chip della categoria. */
.mon-sede[b-ntyjhumex0] {
    margin-left: 6px;
    font-size: 12px;
    color: var(--its-text-muted);
}
/* /Pages/PageNote.razor.rz.scp.css */
/* =============================================
   NOTE — prefisso note-

   Shell, barra dei filtri, misure dei campi, card, badge ed empty
   state vengono da css/custom/its-shell.css.
   ============================================= */

/* ── Selettore della vista ──
   Due modi di guardare le stesse note, non un filtro: si scrive come
   un interruttore, come la coppia Recenti/Archivio del registro. */

/* ── Gruppo per cliente ── */

.note-gruppo[b-jzxfyu3xad] {
    padding: 0;
    margin-bottom: var(--its-space-2);
    overflow: hidden;
}

.note-gruppo__testa[b-jzxfyu3xad] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
    padding: var(--its-space-3) var(--its-space-4);
    cursor: pointer;
    transition: background .15s ease;
}

.note-gruppo__testa:hover[b-jzxfyu3xad] {
    background: var(--its-surface2);
}

.note-gruppo__freccia[b-jzxfyu3xad],
.note-gruppo__tipo[b-jzxfyu3xad] {
    color: var(--its-text-muted);
    flex-shrink: 0;
}

.note-gruppo__nome[b-jzxfyu3xad] {
    font-weight: 600;
    color: var(--its-text);
}

.note-gruppo__data[b-jzxfyu3xad] {
    font-size: var(--its-fs-caption);
    font-family: var(--its-font-mono);
    color: var(--its-text-muted);
}

/* Le azioni del gruppo stanno a destra: sono comandi, non informazioni. */
.note-gruppo__azioni[b-jzxfyu3xad] {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: var(--its-space-1);
    white-space: nowrap;
}

.note-gruppo__corpo[b-jzxfyu3xad] {
    border-top: 1px solid var(--its-border);
    padding: var(--its-space-2) var(--its-space-4) var(--its-space-3);
}

/* ── Riga di una nota ── */

.note-elenco[b-jzxfyu3xad] {
    padding: var(--its-space-2) var(--its-space-4);
}

.note-riga[b-jzxfyu3xad] {
    display: flex;
    align-items: flex-start;
    gap: var(--its-space-2);
    padding: var(--its-space-2) 0;
}

.note-riga + .note-riga[b-jzxfyu3xad] {
    border-top: 1px solid var(--its-border);
}

.note-riga__testo[b-jzxfyu3xad] {
    flex: 1 1 auto;
    min-width: 0;
    cursor: pointer;
}

.note-riga__data[b-jzxfyu3xad] {
    font-family: var(--its-font-mono);
    font-size: var(--its-fs-sm);
    color: var(--its-text-dim);
}

.note-riga__cliente[b-jzxfyu3xad] {
    font-weight: 600;
    color: var(--its-text);
}

/* Graffetta: segnala l'allegato senza rubare spazio al testo della nota,
   che è la cosa che si legge davvero. */
.note-riga__graffetta[b-jzxfyu3xad] {
    color: var(--its-text-dim);
    font-size: 15px;
}

/* Il testo della nota è la cosa che si legge: sta su una riga sola e
   si taglia con i puntini, il resto è nella scheda. */
.note-riga__contenuto[b-jzxfyu3xad] {
    font-size: var(--its-fs-base);
    color: var(--its-text-dim);
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.note-riga__azioni[b-jzxfyu3xad] {
    display: flex;
    align-items: center;
    gap: var(--its-space-1);
    white-space: nowrap;
}

/* ── Paginazione ── */

/* ── Telefono ──
   Intestazione del gruppo su due righe: freccia, nome e azioni sopra,
   conteggio e data sotto il nome. In una riga sola il nome restava con
   pochi pixel fra le icone e i bottoni. */
@media (max-width: 600px) {
    .note-gruppo__testa[b-jzxfyu3xad] {
        flex-wrap: wrap;
        row-gap: 2px;
        padding: 10px 8px 10px 12px;
    }

    /* Occupa tutto ciò che resta nella prima riga: così conteggio e data,
       che vengono dopo nell'ordine, vanno per forza a capo. */
    .note-gruppo__nome[b-jzxfyu3xad] {
        flex: 1 1 calc(100% - 150px);
        min-width: 0;
        overflow-wrap: anywhere;
        line-height: 1.3;
    }

    .note-gruppo__azioni[b-jzxfyu3xad] {
        order: 1;
    }

    /* Rientro pari a freccia + icona + spazi (20 + 8 + 20 + 8), sotto il nome. */
    .note-gruppo__testa > .its-badge[b-jzxfyu3xad] {
        order: 2;
        margin-left: 56px;
    }

    .note-gruppo__data[b-jzxfyu3xad] {
        order: 3;
    }

    .note-gruppo__corpo[b-jzxfyu3xad] {
        padding: 4px 8px 8px 12px;
    }

    .note-elenco[b-jzxfyu3xad] {
        padding: 4px 8px 4px 12px;
    }

    /* Riga della nota: il testo prende tutta la larghezza e mostra due righe
       invece di una; i bottoni vanno sotto, a destra. */
    .note-riga[b-jzxfyu3xad] {
        flex-wrap: wrap;
        row-gap: 0;
    }

    .note-riga__testo[b-jzxfyu3xad] {
        flex-basis: 100%;
    }

    .note-riga__contenuto[b-jzxfyu3xad] {
        white-space: normal;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow-wrap: anywhere;
    }

    .note-riga__azioni[b-jzxfyu3xad] {
        margin-left: auto;
        margin-bottom: -4px;
    }
}
/* /Pages/PagePiani.razor.rz.scp.css */
/* =============================================
   PIANI — solo ciò che è proprio della pagina.
   Shell, elenco, drawer e chip stanno in
   its-shell.css: qui non si duplicano.
   ============================================= */

.pia-nota[b-a6ljd96lv1] {
    margin: 0 0 12px;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--its-text-dim);
}

/* Quante funzioni sono incluse, accanto al titolo: senza, per saperlo si contano
   i chip accesi a occhio. */
.pia-conteggio[b-a6ljd96lv1] {
    margin-left: 8px;
    font-size: 11.5px;
    font-weight: 400;
    color: var(--its-text-muted);
    text-transform: none;
    letter-spacing: 0;
}

.pia-azioni-rapide[b-a6ljd96lv1] {
    display: flex;
    gap: 2px;
}

/* La spiegazione di ciò che si è acceso o spento da solo. Il bordo la distingue
   dalla nota fissa sopra, che c'è sempre. */
.pia-conseguenza[b-a6ljd96lv1] {
    margin-top: 10px;
    border-left: 3px solid var(--its-admin);
}
/* /Pages/PageProfili.razor.rz.scp.css */
/* =============================================
   GESTIONE PROFILI — prefisso prof-

   Shell, sidebar, card, empty state e drawer vengono
   da css/custom/its-shell.css: qui sta solo ciò che
   è proprio di questa pagina.
   ============================================= */

.prof-sidebar__azioni[b-jpm24c6cgp] {
    padding: var(--its-space-3) var(--its-space-3) var(--its-space-2);
    flex-shrink: 0;
}

/* ── Voce dell'elenco profili ── */

.prof-item__testo[b-jpm24c6cgp] {
    flex: 1;
    min-width: 0;
}

.prof-item__ambito[b-jpm24c6cgp] {
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
    margin-top: 1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Riepilogo in testa al contenuto ── */

.prof-riepilogo[b-jpm24c6cgp] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--its-space-5);
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius-lg);
    padding: var(--its-space-4) var(--its-space-5);
    margin-bottom: var(--its-space-3);
}

.prof-riepilogo__voce[b-jpm24c6cgp] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    /* Larghezza minima perché le note non si incolonnino su una riga sola,
       ma libere di crescere se c'è spazio */
    flex: 1 1 240px;
    max-width: 420px;
    align-items: flex-start;
}

.prof-riepilogo__valore[b-jpm24c6cgp] {
    font-size: var(--its-fs-md);
    font-weight: 600;
    color: var(--its-text);
}

.prof-riepilogo__nota[b-jpm24c6cgp] {
    font-size: var(--its-fs-caption);
    color: var(--its-text-dim);
    line-height: 1.4;
}

/* ── Nota esplicativa e barra comandi ── */

.prof-nota[b-jpm24c6cgp] {
    background: var(--its-admin-light);
    border-left: 3px solid var(--its-admin);
    border-radius: var(--its-radius-sm);
    padding: 10px var(--its-space-3);
    font-size: var(--its-fs-sm);
    color: var(--its-text-dim);
    line-height: 1.5;
    margin-bottom: var(--its-space-3);
}

.prof-comandi[b-jpm24c6cgp] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
    margin-bottom: var(--its-space-2);
}

/* ── Area di permessi ── */

.prof-area[b-jpm24c6cgp] {
    padding: 0;
    margin-bottom: var(--its-space-2);
    overflow: hidden;
}

.prof-area__header[b-jpm24c6cgp] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
    padding: 10px var(--its-space-4);
    cursor: pointer;
    user-select: none;
    transition: background 0.15s;
}

.prof-area__header:hover[b-jpm24c6cgp] {
    background: var(--its-surface2);
}

.prof-area__nome[b-jpm24c6cgp] {
    font-size: var(--its-fs-md);
    font-weight: 600;
    color: var(--its-text);
}

.prof-area__spazio[b-jpm24c6cgp] {
    flex: 1;
}

.prof-area__permessi[b-jpm24c6cgp] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr));
    gap: 2px var(--its-space-3);
    padding: var(--its-space-2) var(--its-space-4) var(--its-space-3);
    border-top: 1px solid var(--its-border);
}

/* ── Drawer ── */

.prof-avviso[b-jpm24c6cgp] {
    margin-top: var(--its-space-3);
    background: var(--its-warning-bg);
    border-left: 3px solid var(--its-warning);
    border-radius: var(--its-radius-sm);
    padding: 10px var(--its-space-3);
    font-size: var(--its-fs-sm);
    color: var(--its-warning-text);
    line-height: 1.5;
}
/* /Pages/PagePuntiVendita.razor.rz.scp.css */
/* =============================================
   PUNTI VENDITA — solo ciò che è proprio della pagina.
   Shell, griglia, drawer, badge ed empty state stanno
   in its-shell.css: qui non si duplicano.
   ============================================= */

.pdv-vuoto[b-hpebwyvbku] {
    color: var(--its-text-muted);
}

.pdv-collegamenti[b-hpebwyvbku] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.pdv-azioni[b-hpebwyvbku] {
    white-space: nowrap;
    text-align: right;
}
/* /Pages/PageRegistroAttivita.razor.rz.scp.css */
/* =============================================
   REGISTRO ATTIVITÀ — prefisso reg-

   Shell, area principale, card ed empty state vengono
   da css/custom/its-shell.css.
   ============================================= */

/* ── Selettore della sorgente (recenti / archivio) ──
   Due tabelle diverse, non un filtro: si scrive come un
   interruttore a due posizioni, non come un chip fra i filtri. */

/* ── Filtri ── */

.reg-filtri[b-e9xlscgho8] {
    margin-bottom: var(--its-space-3);
    padding: var(--its-space-3);
}

/* Le misure dei campi e la riga di filtri vengono da .its-filtri / .its-campo
   in css/custom/its-shell.css: qui resta solo la spaziatura della card. */
.reg-filtri__riga[b-e9xlscgho8] {
    margin-bottom: 0;
}

/* Le azioni stanno sotto i campi, separate da un filo: si vede dove si
   imposta e dove si applica. Disposizione e misure da .its-filtri. */
.reg-filtri__azioni[b-e9xlscgho8] {
    margin-top: var(--its-space-3);
    margin-bottom: 0;
    padding-top: var(--its-space-3);
    border-top: 1px solid var(--its-border);
}

/* ── Tabella ── */

.reg-data[b-e9xlscgho8] {
    font-family: var(--its-font-mono);
    font-size: var(--its-fs-sm);
    color: var(--its-text);
}

.reg-ora[b-e9xlscgho8] {
    font-family: var(--its-font-mono);
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
    margin-left: 6px;
}

.reg-evento[b-e9xlscgho8] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    color: var(--its-text);
}

/* Il rosso è l'unica marcatura dell'esito: un tentativo respinto si
   riconosce dalla riga, senza un secondo indicatore che ripete l'icona. */
.reg-evento--respinto[b-e9xlscgho8] {
    color: var(--its-danger);
}

.reg-ip[b-e9xlscgho8] {
    font-family: var(--its-font-mono);
    font-size: var(--its-fs-sm);
    color: var(--its-text-dim);
}

/* Un valore assente si scrive: una cella vuota sembra un dato non caricato. */
.reg-vuoto[b-e9xlscgho8] {
    color: var(--its-text-muted);
    font-style: italic;
    font-size: var(--its-fs-sm);
}
/* /Pages/PageReportOre.razor.rz.scp.css */
/* =============================================
   REPORT ORE — prefisso rep-
   ============================================= */

.rep-numeri[b-3laf30uw85] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--its-space-3);
    margin-bottom: var(--its-space-3);
}

.rep-numero[b-3laf30uw85] {
    display: flex;
    flex-direction: column;
    min-width: 150px;
    padding: var(--its-space-3) var(--its-space-4);
    background: var(--its-surface);
    border: 1px solid var(--its-border);
    border-radius: var(--its-radius-lg);
}

.rep-numero__valore[b-3laf30uw85] {
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    font-size: 22px;
    font-weight: 600;
    color: var(--its-text);
}

.rep-numero__etichetta[b-3laf30uw85] {
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
}

.rep-schede[b-3laf30uw85] {
    margin-bottom: var(--its-space-3);
}

[b-3laf30uw85] .rep-riga {
    cursor: pointer;
}

.rep-data[b-3laf30uw85],
.rep-ore[b-3laf30uw85] {
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    font-weight: 500;
    letter-spacing: 0.03em;
}
/* /Pages/PageRicorrenze.razor.rz.scp.css */
/* =============================================
   ATTIVITÀ RICORRENTI — prefisso ric-
   ============================================= */

[b-d0pn959pry] .ric-riga {
    cursor: pointer;
}

.ric-data[b-d0pn959pry] {
    font-family: var(--its-font-codici);
    font-variant-numeric: tabular-nums slashed-zero;
    font-weight: 500;
    letter-spacing: 0.03em;
}
/* /Pages/PageScadenze.razor.rz.scp.css */
/* =============================================
   SCADENZE SERVIZI — prefisso sca-

   Shell, area principale, chip, empty state e drawer
   vengono da css/custom/its-shell.css: qui sta solo ciò
   che è proprio di questa pagina.
   ============================================= */

/* ── Griglia ── */

[b-2yorv65jih] .sca-riga {
    cursor: pointer;
}

/* Date: regola dei codici (zero barrato, cifre tabellari). */
.sca-data[b-2yorv65jih] {
    margin-top: 2px;
    font-family: var(--its-font-codici);
    font-size: 12.5px;
    font-weight: 500;
    letter-spacing: 0.03em;
    font-variant-numeric: tabular-nums slashed-zero;
    color: var(--its-text-muted);
}

.sca-cliente[b-2yorv65jih] {
    font-weight: 600;
    color: var(--its-text);
    text-decoration: none;
}

.sca-cliente:hover[b-2yorv65jih] {
    text-decoration: underline;
}

.sca-costo[b-2yorv65jih] {
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
}

/* Un valore assente si scrive, non si lascia vuoto. */
.sca-vuoto[b-2yorv65jih] {
    color: var(--its-text-muted);
    font-style: italic;
    font-size: var(--its-fs-sm);
}

[b-2yorv65jih] .sca-azioni {
    white-space: nowrap;
    text-align: right;
}

/* ── Drawer ── */

.sca-dati[b-2yorv65jih] {
    margin-top: var(--its-space-3);
    row-gap: var(--its-space-2);
}

.sca-nota[b-2yorv65jih] {
    display: block;
    margin-top: 2px;
    font-size: var(--its-fs-sm);
    color: var(--its-text-muted);
    white-space: pre-line;
}

.sca-storico[b-2yorv65jih] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--its-space-2);
}

.sca-storico li[b-2yorv65jih] {
    display: flex;
    flex-direction: column;
    padding-bottom: var(--its-space-2);
    border-bottom: 1px solid var(--its-border);
}

.sca-storico li:last-child[b-2yorv65jih] {
    border-bottom: none;
}

.sca-storico__date[b-2yorv65jih] {
    font-family: var(--its-font-codici);
    font-weight: 500;
    letter-spacing: 0.03em;
    font-variant-numeric: tabular-nums slashed-zero;
}

.sca-storico__chi[b-2yorv65jih] {
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
}
/* /Pages/PageUtenti.razor.rz.scp.css */
/* =============================================
   UTENTI — prefisso ute-

   Shell, area principale, badge ed empty state vengono
   da css/custom/its-shell.css.
   ============================================= */

/* ── Barra dei filtri rapidi ── */

/* ── Griglia ── */

/* L'ambito che viene da un'eccezione personale si distingue da quello
   ereditato dal profilo: è la differenza che conta quando si controlla
   chi vede cosa. */
.ute-ambito[b-lvxv4kc70h] {
    font-size: var(--its-fs-caption);
    color: var(--its-text-muted);
}

.ute-ambito--personale[b-lvxv4kc70h] {
    color: var(--its-admin);
    font-weight: 600;
}

/* Un valore assente si scrive: una cella vuota sembra un dato non caricato. */
.ute-vuoto[b-lvxv4kc70h] {
    color: var(--its-text-muted);
    font-style: italic;
    font-size: var(--its-fs-sm);
}

.ute-punti[b-lvxv4kc70h] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--its-space-1);
}

.ute-data[b-lvxv4kc70h] {
    font-family: var(--its-font-mono);
    font-size: var(--its-fs-sm);
    color: var(--its-text-dim);
}

[b-lvxv4kc70h] .ute-azioni {
    white-space: nowrap;
    text-align: right;
}
/* /Pages/RealTimeChat.razor.rz.scp.css */
/* /Pages/UtenteDettaglio.razor.rz.scp.css */
/* =============================================
   SCHEDA UTENTE — solo ciò che è proprio di
   questa pagina. Shell, sidebar, hero, snapshot,
   card, liste e chip stanno in its-shell.css.
   ============================================= */

/* Gli interruttori di stato stanno su una riga, con aria fra loro. */
.ute-interruttori[b-1b7khwz4w6] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--its-space-5);
    margin-top: var(--its-space-3);
}

/* Il pulsante "Reimposta password" si allinea in basso, come i campi accanto. */
.ute-azione-password[b-1b7khwz4w6] {
    display: flex;
    align-items: flex-end;
}

/* ── Permessi ── */

.ute-area[b-1b7khwz4w6] {
    margin-bottom: var(--its-space-4);
}

.ute-area__titolo[b-1b7khwz4w6] {
    font-size: var(--its-fs-label);
    font-weight: 700;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    color: var(--its-text-muted);
    margin-bottom: var(--its-space-2);
}

/* Riga del permesso: casella a sinistra, etichetta dell'eccezione a destra. */
.ute-permesso[b-1b7khwz4w6] {
    display: flex;
    align-items: center;
    gap: var(--its-space-2);
}

/* La casella cresce, così il chip resta a fine riga e le colonne si incolonnano. */
.ute-permesso[b-1b7khwz4w6]  .mud-checkbox {
    flex: 1;
    min-width: 0;
}

/* Il pulsante e il filtro in testa alla card vanno a fine riga. */
[b-1b7khwz4w6] .its-card__title .mud-button-root,
[b-1b7khwz4w6] .its-card__title .its-campo {
    margin-left: auto;
}
/* /Shared/AppBar.razor.rz.scp.css */

/* =============================================
   APPBAR
   ============================================= */

.its-appbar[b-gn2zgu98co] {
    height: var(--its-appbar-h);
    background: var(--its-surface);
    border-bottom: 1px solid var(--its-border);
    display: flex;
    align-items: center;
    flex-shrink: 0;
    z-index: 200;
    box-shadow: 0 1px 4px var(--its-shadow);
    position: sticky;
    top: 0;
}

/* ── Brand (allineato con il sidenav) ── */

.its-appbar__brand[b-gn2zgu98co] {
    width: var(--its-nav-w);
    min-width: var(--its-nav-w);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    border-right: 1px solid var(--its-border);
    height: 100%;
    flex-shrink: 0;
    transition: width .25s ease, min-width .25s ease;
}

.its-appbar__logo-img[b-gn2zgu98co] {
    height: 36px;
    width: auto;
    max-width: 160px;
    object-fit: contain;
    flex-shrink: 0;
}

/* ── Hamburger ── */

.its-appbar__hamburger[b-gn2zgu98co] {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    align-items: center;
    justify-content: center;
    color: var(--its-text-dim);
    margin: 0 4px;
    flex-shrink: 0;
    transition: background .15s;
    flex-direction: column;
    gap: 4px;
    padding: 0;
}

    .its-appbar__hamburger:hover[b-gn2zgu98co] {
        background: var(--its-surface2);
    }

.ham-line[b-gn2zgu98co] {
    display: block;
    width: 18px;
    height: 2px;
    background: currentColor;
    border-radius: 2px;
    transition: transform .25s ease, opacity .2s ease;
    transform-origin: center;
}

/* Hamburger → X quando nav è aperto */
.its-appbar__hamburger--open .ham-line:nth-child(1)[b-gn2zgu98co] {
    transform: translateY(6px) rotate(45deg);
}

.its-appbar__hamburger--open .ham-line:nth-child(2)[b-gn2zgu98co] {
    opacity: 0;
}

.its-appbar__hamburger--open .ham-line:nth-child(3)[b-gn2zgu98co] {
    transform: translateY(-6px) rotate(-45deg);
}

/* ── Breadcrumb ── */

.its-appbar__section[b-gn2zgu98co] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0 16px;
    flex: 1;
    min-width: 0;
}

.its-appbar__crumb[b-gn2zgu98co] {
    font-size: 13px;
    color: var(--its-text-muted);
}

.its-appbar__crumb-sep[b-gn2zgu98co] {
    color: var(--its-border);
    font-size: 16px;
}

.its-appbar__crumb--active[b-gn2zgu98co] {
    font-size: 13px;
    font-weight: 600;
    color: var(--its-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Azioni destra ── */

.its-appbar__actions[b-gn2zgu98co] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding-right: 12px;
    flex-shrink: 0;
}

.its-appbar__badge-wrap[b-gn2zgu98co]  .mud-badge-root {
    display: flex;
    align-items: center;
}

.its-appbar__icon-btn[b-gn2zgu98co]  .mud-icon-button {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    color: var(--its-text-dim);
    transition: background .15s, color .15s;
}

    .its-appbar__icon-btn[b-gn2zgu98co]  .mud-icon-button:hover {
        background: var(--its-surface2);
        color: var(--its-text);
    }

.its-appbar__divider[b-gn2zgu98co] {
    width: 1px;
    height: 22px;
    background: var(--its-border);
    margin: 0 4px;
}

/* ── Avatar utente ── */

.its-appbar__user-menu[b-gn2zgu98co]  .mud-menu-activator {
    display: flex;
    align-items: center;
}

.its-appbar__user[b-gn2zgu98co] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 8px;
    border-radius: 8px;
    cursor: pointer;
    transition: background .15s;
    user-select: none;
}

    .its-appbar__user:hover[b-gn2zgu98co] {
        background: var(--its-surface2);
    }

.its-appbar__avatar[b-gn2zgu98co] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, #4f8ef7, #a78bfa);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
    font-family: var(--its-font);
}

.its-appbar__user-info[b-gn2zgu98co] {
    display: flex;
    flex-direction: column;
}

.its-appbar__user-name[b-gn2zgu98co] {
    font-size: 12px;
    font-weight: 600;
    color: var(--its-text);
    line-height: 1.2;
    white-space: nowrap;
}

.its-appbar__user-role[b-gn2zgu98co] {
    font-size: 10px;
    color: var(--its-text-muted);
    line-height: 1.2;
    white-space: nowrap;
}

/* =============================================
   RESPONSIVE
   ============================================= */

/* Tablet (anche in orizzontale, fino a 1280): hamburger visibile, brand senza
   border-right. Il menu sotto è una colonna di icone o un pannello nascosto
   (its-sidenav.css), e il ☰ è il modo di vederne le etichette. */
@media (max-width: 1280px) {
    .its-appbar__brand[b-gn2zgu98co] {
        width: auto;
        min-width: auto;
        border-right: none;
        padding: 0 12px;
    }

    .its-appbar__hamburger[b-gn2zgu98co] {
        display: flex;
    }
}

/* Mobile medio: nascondi testo utente e breadcrumb radice */
@media (max-width: 860px) {
    .its-appbar__user-info[b-gn2zgu98co] {
        display: none;
    }

    .its-appbar__crumb[b-gn2zgu98co],
    .its-appbar__crumb-sep[b-gn2zgu98co] {
        display: none;
    }
}

/* Telefono: il logo si stringe per lasciare spazio al titolo della pagina */
@media (max-width: 600px) {
    .its-appbar__brand[b-gn2zgu98co] {
        padding: 0 6px;
    }

    .its-appbar__logo-img[b-gn2zgu98co] {
        max-width: 110px;
        height: 30px;
    }
}

/* Telefono piccolo: via il divisore e si stringe ancora il logo.
   ⚠️ La campanella resta: prima spariva sotto i 400px, ed è l'unico accesso
   alle notifiche delle scadenze (PannelloNotifiche). */
@media (max-width: 400px) {
    .its-appbar__divider[b-gn2zgu98co] {
        display: none;
    }

    .its-appbar__logo-img[b-gn2zgu98co] {
        max-width: 84px;
    }
}
/* /Shared/NavigationSpinner.razor.rz.scp.css */
/* =====================================================
   NavigationSpinner.razor.css
   Tema bianco — fully responsive
   ===================================================== */

/* ---- Overlay ---- */
.itnet-nav-overlay[b-zjllss47l0] {
    position: fixed;
    inset: 0;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: clamp(14px, 3vw, 22px);
    z-index: 9998;
    opacity: 1;
    transition: opacity 0.35s ease;
    padding: 24px;
}

    .itnet-nav-overlay.fade-out[b-zjllss47l0] {
        opacity: 0;
        pointer-events: none;
    }

/* ---- Ring — dimensione fluida ---- */
.itnet-ring-wrap[b-zjllss47l0] {
    position: relative;
    /* clamp: min 70px su mobile, 12vw fluido, max 100px su desktop */
    width: clamp(70px, 12vw, 100px);
    height: clamp(70px, 12vw, 100px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.itnet-ring[b-zjllss47l0] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid rgba(253, 195, 0, 0.2);
    border-top-color: #fdc300;
    border-right-color: rgba(253, 195, 0, 0.55);
    animation: itnetSpinRing-b-zjllss47l0 1.1s linear infinite;
}

.itnet-ring-outer[b-zjllss47l0] {
    position: absolute;
    /* Margine negativo proporzionale */
    inset: clamp(-6px, -1vw, -8px);
    border-radius: 50%;
    border: 1.5px solid transparent;
    border-bottom-color: rgba(253, 195, 0, 0.3);
    animation: itnetSpinRing-b-zjllss47l0 2s linear infinite reverse;
}

/* Badge al centro del ring — scala con il ring */
.itnet-badge-icon[b-zjllss47l0] {
    width: clamp(36px, 7vw, 52px);
    height: clamp(36px, 7vw, 52px);
    z-index: 2;
    filter: drop-shadow(0 2px 8px rgba(253,195,0,0.35));
}

/* ---- Logo completo ridotto ---- */
.itnet-nav-logo[b-zjllss47l0] {
    width: clamp(130px, 32vw, 190px);
    height: auto;
    overflow: visible;
    filter: drop-shadow(0 2px 12px rgba(253,195,0,0.25));
}

/* ---- Dots ---- */
.itnet-dots[b-zjllss47l0] {
    display: flex;
    gap: clamp(5px, 1.2vw, 8px);
}

    .itnet-dots span[b-zjllss47l0] {
        width: clamp(4px, 1vw, 6px);
        height: clamp(4px, 1vw, 6px);
        background: #fdc300;
        border-radius: 50%;
        box-shadow: 0 1px 4px rgba(253,195,0,0.5);
        animation: itnetDotBounce-b-zjllss47l0 1.2s ease-in-out infinite;
    }

        .itnet-dots span:nth-child(2)[b-zjllss47l0] {
            animation-delay: 0.15s;
        }

        .itnet-dots span:nth-child(3)[b-zjllss47l0] {
            animation-delay: 0.30s;
        }

/* ---- Label ---- */
.itnet-nav-label[b-zjllss47l0] {
    font-size: clamp(8px, 1.8vw, 11px);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(0, 0, 0, 0.35);
    animation: itnetFadePulse-b-zjllss47l0 2s ease-in-out infinite;
    font-family: inherit;
    white-space: nowrap;
}

/* ---- Animazioni logo SVG ---- */
.itnet-badge-anim[b-zjllss47l0] {
    transform-box: fill-box;
    transform-origin: center;
    animation: itnetBadgePulse-b-zjllss47l0 2.2s ease-in-out infinite;
}

.itnet-net-anim[b-zjllss47l0] {
    animation: itnetNetFade-b-zjllss47l0 2.6s ease-in-out infinite;
    animation-delay: 0.4s;
}

/* ---- Media queries di supporto ---- */

/* Smartphone portrait (< 480px): riduci ulteriormente il gap */
@media (max-width: 480px) {
    .itnet-nav-overlay[b-zjllss47l0] {
        gap: 12px;
    }

    /* Su schermi molto piccoli nascondi il logo completo,
       mostra solo ring + dots + label */
    .itnet-nav-logo[b-zjllss47l0] {
        display: none;
    }

    .itnet-ring-wrap[b-zjllss47l0] {
        width: 80px;
        height: 80px;
    }

    .itnet-badge-icon[b-zjllss47l0] {
        width: 42px;
        height: 42px;
    }
}

/* Tablet portrait (481px – 768px) */
@media (min-width: 481px) and (max-width: 768px) {
    .itnet-nav-logo[b-zjllss47l0] {
        width: 150px;
    }

    .itnet-ring-wrap[b-zjllss47l0] {
        width: 88px;
        height: 88px;
    }
}

/* Desktop large (> 1200px): dimensioni massime già gestite da clamp */

/* ---- Keyframes ---- */
@keyframes itnetSpinRing-b-zjllss47l0 {
    to {
        transform: rotate(360deg);
    }
}

@keyframes itnetDotBounce-b-zjllss47l0 {
    0%, 80%, 100% {
        transform: scale(0.5);
        opacity: 0.4;
    }

    40% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes itnetFadePulse-b-zjllss47l0 {
    0%, 100% {
        opacity: 0.35;
    }

    50% {
        opacity: 0.75;
    }
}

@keyframes itnetBadgePulse-b-zjllss47l0 {
    0%, 100% {
        transform: scale(1);
        filter: drop-shadow(0 2px 6px rgba(253,195,0,0.2));
    }

    50% {
        transform: scale(1.06);
        filter: drop-shadow(0 4px 18px rgba(253,195,0,0.5));
    }
}

@keyframes itnetNetFade-b-zjllss47l0 {
    0%, 100% {
        opacity: 1;
        transform: translateX(0);
    }

    50% {
        opacity: 0.6;
        transform: translateX(3px);
    }
}