/* /Components/Layout/DashboardLayoutV2.razor.rz.scp.css */
/* DashboardLayoutV2 — stile sidebar desktop. Tutti i valori da design-tokens.css. */

.v2-sidebar[b-kj6p7xijjc] {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: var(--space-lg);
    gap: var(--space-md);
    box-sizing: border-box;
}

.v2-sidebar__brand[b-kj6p7xijjc] {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    padding: var(--space-sm) var(--space-md);
    color: var(--color-brand-primary);
}

.v2-sidebar__brand-name[b-kj6p7xijjc] {
    font-family: var(--font-serif);
    font-size: var(--text-h2);
    font-weight: var(--font-weight-serif);
    color: var(--color-text-primary);
    line-height: var(--line-height-tight);
}

.v2-sidebar__nav[b-kj6p7xijjc] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    flex: 1 1 auto;
    min-height: 0;
}

.v2-sidebar__divider[b-kj6p7xijjc] {
    border: none;
    border-top: 1px solid var(--color-border-subtle);
    margin: var(--space-sm) 0;
}

.v2-sidebar__footer[b-kj6p7xijjc] {
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    padding-top: var(--space-md);
    border-top: 1px solid var(--color-border-subtle);
    flex: 0 0 auto;
}

.v2-nav-link[b-kj6p7xijjc] {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    padding: var(--space-sm) var(--space-md);
    border-radius: var(--radius-md);
    text-decoration: none;
    color: var(--color-text-body);
    font-family: var(--font-sans);
    font-size: var(--text-body);
    font-weight: var(--font-weight-regular);
    line-height: var(--line-height-normal);
    transition:
        background var(--duration-standard) var(--ease-standard),
        color var(--duration-standard) var(--ease-standard);
}

.v2-nav-link:hover[b-kj6p7xijjc] {
    background: var(--color-surface-sunken);
    color: var(--color-text-primary);
}

.v2-nav-link--active[b-kj6p7xijjc] {
    background: var(--color-brand-teal-50);
    color: var(--color-brand-primary);
    font-weight: var(--font-weight-medium);
}

.v2-nav-link--active:hover[b-kj6p7xijjc] {
    background: var(--color-brand-teal-100);
}

.v2-nav-link__badge[b-kj6p7xijjc] {
    margin-left: auto;
    min-width: 20px;
    height: 20px;
    padding: 0 var(--space-xs);
    border-radius: var(--radius-pill);
    background: var(--color-brand-secondary);
    color: var(--color-text-on-brand);
    font-family: var(--font-sans);
    font-size: var(--text-caption);
    font-weight: var(--font-weight-medium);
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-ogq6y81arf],
.components-reconnect-repeated-attempt-visible[b-ogq6y81arf],
.components-reconnect-failed-visible[b-ogq6y81arf],
.components-pause-visible[b-ogq6y81arf],
.components-resume-failed-visible[b-ogq6y81arf],
.components-rejoining-animation[b-ogq6y81arf] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-ogq6y81arf],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-ogq6y81arf],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-ogq6y81arf],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-ogq6y81arf],
#components-reconnect-modal.components-reconnect-retrying[b-ogq6y81arf],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-ogq6y81arf],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-ogq6y81arf],
#components-reconnect-modal.components-reconnect-failed[b-ogq6y81arf],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-ogq6y81arf] {
    display: block;
}


#components-reconnect-modal[b-ogq6y81arf] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-ogq6y81arf 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-ogq6y81arf 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-ogq6y81arf 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-ogq6y81arf]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-ogq6y81arf 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-ogq6y81arf {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-ogq6y81arf {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-ogq6y81arf {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-ogq6y81arf] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-ogq6y81arf] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-ogq6y81arf] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-ogq6y81arf] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-ogq6y81arf] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-ogq6y81arf] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-ogq6y81arf] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-ogq6y81arf 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-ogq6y81arf] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-ogq6y81arf {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Dashboard/Consenso/Consenso.razor.rz.scp.css */
/* Header del wizard consenso — fix layout su mobile <600px.

   Bug: il titolo h5 "Consenso informato" veniva spezzato sillaba-per-
   sillaba (es. "Conse/nso/infor/mato") su viewport <430px perche' la
   flex row [back, titolo, chip nome, GuidaButton, spacer, meta versione]
   comprime il titolo oltre la sua larghezza minima, e la regola globale
   `h5 { word-break: break-word }` in app.css (riga 67) permette
   interruzioni interne alle parole.

   Fix: sotto i 600px lascia wrappare la riga (il titolo finisce su una
   propria riga con larghezza piena) e disattiva word-break/overflow-wrap
   per l'h5 del titolo a scanso di equivoci. Layout >=600px invariato. */

@media (max-width: 599.98px) {
    .d-flex.align-center.gap-2.mb-4[b-oqrizmg2xi] {
        flex-wrap: wrap;
    }

    .d-flex.align-center.gap-2.mb-4[b-oqrizmg2xi]  .mud-typography-h5 {
        word-break: normal;
        overflow-wrap: normal;
    }
}
/* /Components/Pages/Dashboard/_Components/Index.razor.rz.scp.css */
/* /dashboard/_components — demo. Tutti i valori da design-tokens.css. */

.demo-action-link[b-579x40xczv] {
    text-decoration: none;
    font-family: var(--font-sans);
    font-size: var(--text-small);
    font-weight: var(--font-weight-medium);
    color: var(--color-brand-primary);
    padding: var(--space-xs) var(--space-md);
    border-radius: var(--radius-md);
    border: 1px solid var(--color-brand-primary);
    transition: background var(--duration-standard) var(--ease-standard);
}

.demo-action-link:hover[b-579x40xczv] {
    background: var(--color-brand-teal-50);
}

.demo-page[b-579x40xczv] {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--space-xl) var(--space-lg);
    display: flex;
    flex-direction: column;
    gap: var(--space-xl);
}

.demo-card[b-579x40xczv] {
    background: var(--color-surface-raised);
    border: 1px solid var(--color-border-subtle);
    border-radius: var(--radius-lg);
    padding: var(--space-xl);
    box-shadow: var(--shadow-none);
}

.demo-card__title[b-579x40xczv] {
    margin: 0 0 var(--space-md) 0;
    font-family: var(--font-sans);
    font-size: var(--text-h2);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-primary);
    line-height: var(--line-height-normal);
}

.demo-card__body[b-579x40xczv] {
    margin: 0;
    font-family: var(--font-sans);
    font-size: var(--text-body);
    color: var(--color-text-body);
    line-height: var(--line-height-relaxed);
}

.demo-card__body code[b-579x40xczv] {
    font-family: ui-monospace, SFMono-Regular, monospace;
    font-size: var(--text-small);
    background: var(--color-surface-sunken);
    padding: 1px var(--space-xs);
    border-radius: var(--radius-sm);
    color: var(--color-text-primary);
}

.demo-viewport[b-579x40xczv] {
    margin-top: var(--space-md);
    background: var(--color-surface-sunken);
    border: 1px solid var(--color-border-subtle);
    border-radius: var(--radius-md);
    padding: var(--space-md) var(--space-lg);
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.demo-viewport__row[b-579x40xczv] {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    font-family: var(--font-sans);
    font-size: var(--text-small);
}

.demo-viewport__label[b-579x40xczv] {
    width: 110px;
    color: var(--color-text-secondary);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: var(--letter-spacing-caption);
    font-size: var(--text-caption);
}

.demo-viewport__value[b-579x40xczv] {
    color: var(--color-text-primary);
    font-family: ui-monospace, SFMono-Regular, monospace;
}

.demo-viewport__pill[b-579x40xczv] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-xs);
    padding: var(--space-xs) var(--space-md);
    border-radius: var(--radius-pill);
    font-family: var(--font-sans);
    font-size: var(--text-small);
    font-weight: var(--font-weight-medium);
}

.demo-viewport__pill--mobile[b-579x40xczv] {
    background: var(--color-brand-ocra-50);
    color: var(--color-brand-ocra-800);
    border: 1px solid var(--color-brand-ocra-100);
}

.demo-viewport__pill--desktop[b-579x40xczv] {
    background: var(--color-brand-teal-50);
    color: var(--color-brand-teal-800);
    border: 1px solid var(--color-brand-teal-100);
}

.demo-links[b-579x40xczv] {
    margin: var(--space-md) 0 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
}

.demo-links li[b-579x40xczv] {
    font-family: var(--font-sans);
    font-size: var(--text-body);
    color: var(--color-text-body);
}

.demo-links a[b-579x40xczv] {
    color: var(--color-brand-primary);
    text-decoration: none;
    font-family: ui-monospace, SFMono-Regular, monospace;
    font-size: var(--text-small);
}

.demo-links a:hover[b-579x40xczv] {
    text-decoration: underline;
}

/* Round 2B sezioni — actions row, skeleton grid */

.demo-actions-row[b-579x40xczv] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-md);
    margin-top: var(--space-md);
}

.demo-skeleton-grid[b-579x40xczv] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-lg);
    margin-top: var(--space-lg);
}

.demo-skeleton-list-wrap[b-579x40xczv] {
    margin-top: var(--space-lg);
    background: var(--color-surface-raised);
    border: 1px solid var(--color-border-subtle);
    border-radius: var(--radius-lg);
    overflow: hidden;
}

@media (max-width: 899.98px) {
    .demo-page[b-579x40xczv] {
        padding: var(--space-lg) var(--space-md);
        gap: var(--space-lg);
    }

    .demo-card[b-579x40xczv] {
        padding: var(--space-lg);
    }
}

@media (max-width: 599.98px) {
    .demo-skeleton-grid[b-579x40xczv] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Shared/Dashboard/Appuntamenti/SettimanaAgenda.razor.rz.scp.css */
/* ============================================================
   AGENDA SETTIMANALE — CSS scoped al componente SettimanaAgenda

   Spostato verbatim da wwwroot/app.css (righe 3311-3609 pre-extraction)
   in commit di Cluster C.1 (estrazione γ).

   Cleanup glassmorphism applicato in commit 2 di C.1: rgba(255,255,255,X)
   sostituiti con design tokens V2 light theme. Accenti teal
   rgba(15,118,110,X) e colori semantici stati appuntamento (blu/teal/
   amber/grigio/rosso) preservati come V1.
   ============================================================ */

.agenda-scroll-container[b-rue9g169sl] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 10px;
    border: 1px solid var(--color-border-subtle);
}

.agenda-table[b-rue9g169sl] {
    width: 100%;
    min-width: 700px;
    border-collapse: collapse;
    table-layout: fixed;
}

/* Intestazione colonne giorno */
.agenda-ora-header[b-rue9g169sl] {
    width: 54px;
    min-width: 54px;
}

.agenda-day-header[b-rue9g169sl] {
    text-align: center;
    padding: 8px 4px;
    background: var(--color-surface-sunken);
    border-bottom: 1px solid var(--color-border-subtle);
    font-weight: 500;
}

.agenda-oggi-header[b-rue9g169sl] {
    background: rgba(15,118,110,0.15);
}

.agenda-day-name[b-rue9g169sl] {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--color-text-secondary);
    margin-bottom: 2px;
}

.agenda-day-num-badge[b-rue9g169sl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 0.875rem;
    color: var(--color-text-primary);
}

.agenda-oggi-badge[b-rue9g169sl] {
    background: #0f766e;
    color: white;
    font-weight: 600;
}

/* Righe orari */
.agenda-row[b-rue9g169sl] {
    height: 44px;
}

.agenda-row:hover .agenda-slot[b-rue9g169sl] {
    background: var(--color-surface-sunken);
}

.agenda-ora[b-rue9g169sl] {
    width: 54px;
    min-width: 54px;
    padding: 0 8px;
    font-size: 0.72rem;
    color: var(--color-text-tertiary);
    text-align: right;
    vertical-align: top;
    padding-top: 6px;
    white-space: nowrap;
    border-right: 1px solid var(--color-border-subtle);
}

.agenda-slot[b-rue9g169sl] {
    position: relative;
    border-bottom: 1px solid var(--color-border-subtle);
    border-right: 1px solid var(--color-border-subtle);
    vertical-align: top;
    padding: 2px 3px;
    min-height: 44px;
}

.agenda-oggi-col[b-rue9g169sl] {
    background: rgba(15,118,110,0.04);
}

/* Link slot vuoto — mostra "+" all'hover */
.agenda-slot-link[b-rue9g169sl] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 40px;
    text-decoration: none;
    opacity: 0;
    transition: opacity 0.15s ease;
    color: rgba(15,118,110,0.6);
}

.agenda-slot:hover .agenda-slot-link[b-rue9g169sl] {
    opacity: 1;
}

/* Card appuntamento */
.agenda-event[b-rue9g169sl] {
    display: block;
    border-radius: 4px;
    padding: 3px 5px;
    margin-bottom: 2px;
    font-size: 0.72rem;
    text-decoration: none;
    line-height: 1.3;
    overflow: hidden;
    transition: opacity 0.15s, filter 0.15s;
    cursor: pointer;
}

.agenda-event:hover[b-rue9g169sl] {
    filter: brightness(0.95);
}

.agenda-event-richiesta[b-rue9g169sl] {
    background: rgba(59,130,246,0.18);
    border-left: 3px solid #3b82f6;
    color: var(--color-text-primary);
}

.agenda-event-confermato[b-rue9g169sl] {
    background: rgba(15,118,110,0.18);
    border-left: 3px solid #0f766e;
    color: var(--color-text-primary);
}

.agenda-event-attesa[b-rue9g169sl] {
    background: rgba(217,119,6,0.18);
    border-left: 3px solid #d97706;
    color: var(--color-text-primary);
}

.agenda-event-completato[b-rue9g169sl] {
    background: rgba(107,114,128,0.15);
    border-left: 3px solid #6b7280;
    color: var(--color-text-secondary);
}

.agenda-event-annullato[b-rue9g169sl] {
    background: rgba(239,68,68,0.12);
    border-left: 3px solid #ef4444;
    color: var(--color-text-secondary);
    text-decoration: line-through;
}

.agenda-event-default[b-rue9g169sl] {
    background: rgba(99,102,241,0.15);
    border-left: 3px solid #6366f1;
    color: var(--color-text-primary);
}

.agenda-event-ora[b-rue9g169sl] {
    font-weight: 600;
    font-size: 0.68rem;
    opacity: 0.8;
}

.agenda-event-nome[b-rue9g169sl] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.72rem;
}

.agenda-event-tratt[b-rue9g169sl] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.67rem;
    opacity: 0.7;
}

/* ─────────────────────────────────────────────────────────────────────────────
   AGENDA MOBILE — header navigazione giorno singolo
   ───────────────────────────────────────────────────────────────────────────── */

/* Nascosto di default; mostrato solo su <1024px via media query */
.agenda-mobile-header[b-rue9g169sl] {
    display: none;
    align-items: center;
    justify-content: space-between;
}

.agenda-mobile-day-name[b-rue9g169sl] {
    font-size: 1rem;
    font-weight: 600;
    text-transform: capitalize;
    color: var(--color-text-primary);
    line-height: 1.2;
}

.agenda-mobile-day-date[b-rue9g169sl] {
    font-size: 0.8rem;
    color: var(--color-text-secondary);
    margin-top: 2px;
}

/* Touch target minimo 44×44px (P2-021 + WCAG AAA) */
.agenda-nav-btn[b-rue9g169sl] {
    min-width: 44px !important;
    min-height: 44px !important;
}

/* ─────────────────────────────────────────────────────────────────────────────
   AGENDA RESPONSIVE — <1024px singolo giorno, ≥1025px sette colonne
   ───────────────────────────────────────────────────────────────────────────── */

/* Su mobile: singolo giorno, tabella occupa tutta la larghezza senza scroll orizzontale */
@media (max-width: 1024px) {
    .agenda-col-inactive[b-rue9g169sl] {
        display: none;
    }

    .agenda-table[b-rue9g169sl] {
        min-width: 0;
        width: 100%;
    }

    .agenda-mobile-header[b-rue9g169sl] {
        display: flex;
    }
}

/* Header nav settimana: stack verticale su telefoni stretti (P1-020) */
@media (max-width: 480px) {
    .agenda-header-nav[b-rue9g169sl] {
        flex-direction: column;
        align-items: stretch !important;
        gap: 0.5rem !important;
    }

    .agenda-week-nav[b-rue9g169sl] {
        justify-content: center;
    }
}

/* xs: font e padding più compatti */
@media (max-width: 576px) {
    .agenda-ora-header[b-rue9g169sl],
    .agenda-ora[b-rue9g169sl] {
        width: 44px;
        min-width: 44px;
        font-size: 0.65rem;
        padding-top: 4px;
    }

    .agenda-row[b-rue9g169sl] { height: 40px; }

    .agenda-slot[b-rue9g169sl] {
        padding: 1px 2px;
        min-height: 40px;
    }

    .agenda-day-name[b-rue9g169sl] { font-size: 0.62rem; }
    .agenda-day-num-badge[b-rue9g169sl] {
        width: 24px;
        height: 24px;
        font-size: 0.78rem;
        /* Touch target 44×44px via padding (P2-021) */
        padding: 10px;
        margin: -10px;
    }

    .agenda-event[b-rue9g169sl] {
        padding: 2px 3px;
        line-height: 1.15;
    }
    .agenda-event-ora[b-rue9g169sl]  { font-size: 0.7rem; } /* era 0.6rem — P0-018 fix leggibilità */
    .agenda-event-nome[b-rue9g169sl] { font-size: 0.7rem; } /* era 0.65rem */
    .agenda-event-tratt[b-rue9g169sl] { display: none; }

    .agenda-add-icon[b-rue9g169sl] { transform: scale(0.85); }
}

/* min-width difensivo per la colonna singola a 400px (P0-018) */
@media (max-width: 400px) {
    .agenda-table[b-rue9g169sl] {
        min-width: 300px; /* ora+giorno singolo: 44px ora + almeno 256px giorno */
    }
    .agenda-event-ora[b-rue9g169sl]  { font-size: 0.7rem; }
    .agenda-event-nome[b-rue9g169sl] { font-size: 0.7rem; }
}
/* /Components/Shared/Dashboard/Loading/Skeleton.razor.rz.scp.css */
/* Skeleton primitive — shimmer animation. Tutti i valori da design-tokens.css.
   Width/Height/BorderRadius sono passati via inline style per flessibilità. */

.skeleton[b-ipirrabqe2] {
    background: var(--color-surface-sunken);
    position: relative;
    overflow: hidden;
}

.skeleton--animated[b-ipirrabqe2]::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.4) 50%,
        transparent 100%
    );
    animation: skeleton-shimmer-b-ipirrabqe2 1.4s infinite;
}

@keyframes skeleton-shimmer-b-ipirrabqe2 {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

@media (prefers-reduced-motion: reduce) {
    .skeleton--animated[b-ipirrabqe2]::after {
        animation: none;
    }
}
/* /Components/Shared/Dashboard/Loading/SkeletonCard.razor.rz.scp.css */
/* SkeletonCard — composizione KPI card. Tutti i valori da design-tokens.css. */

.skeleton-card[b-we5wnr0kqf] {
    background: var(--color-surface-raised);
    border: 0.5px solid var(--color-border-subtle);
    border-radius: var(--radius-lg);
    padding: var(--space-lg);
    box-sizing: border-box;
}

.skeleton-card__gap-xs[b-we5wnr0kqf] {
    height: var(--space-xs);
}

.skeleton-card__gap-sm[b-we5wnr0kqf] {
    height: var(--space-sm);
}
/* /Components/Shared/Dashboard/Loading/SkeletonList.razor.rz.scp.css */
/* SkeletonList — composizione lista. Tutti i valori da design-tokens.css. */

.skeleton-list[b-3yguqbjipe] {
    display: flex;
    flex-direction: column;
}

.skeleton-list__row[b-3yguqbjipe] {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    padding: var(--space-lg);
    border-bottom: 0.5px solid var(--color-border-subtle);
}

.skeleton-list__row:last-child[b-3yguqbjipe] {
    border-bottom: none;
}

.skeleton-list__text[b-3yguqbjipe] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: var(--space-xs);
    min-width: 0;
}
/* /Components/Shared/Dashboard/Navigation/AppLayoutShell.razor.rz.scp.css */
/* AppLayoutShell — tutti i valori da design-tokens.css.
   .ds-scope risetta i --mud-palette-* ai default light di MudBlazor:
   soluzione permanente al cerotto della StyleGuide (vedi razor commento). */

.ds-scope[b-5tbpl60u5e] {
    --mud-palette-text-primary:               rgba(66, 66, 66, 1);
    --mud-palette-text-secondary:             rgba(0, 0, 0, 0.54);
    --mud-palette-text-disabled:              rgba(0, 0, 0, 0.38);
    --mud-palette-surface:                    #FFFFFF;
    --mud-palette-background:                 #FFFFFF;
    --mud-palette-background-grey:            #F5F5F5;
    --mud-palette-lines-default:              rgba(0, 0, 0, 0.12);
    --mud-palette-lines-inputs:               rgba(0, 0, 0, 0.42);
    --mud-palette-action-default:             rgba(0, 0, 0, 0.54);
    --mud-palette-action-disabled:            rgba(0, 0, 0, 0.26);
    --mud-palette-action-disabled-background: rgba(0, 0, 0, 0.12);
    --mud-palette-divider:                    rgba(0, 0, 0, 0.12);
}

/* Safety net: future widgets that accidentally inherit inline color:white
   from V1 markup will still render legibly on V2 light surfaces. Source-
   level fixes preferred (vedi commit fix(dashboard) inline tokens), ma
   questa rete protegge contro regressioni durante migrazioni successive
   (Cluster B-E). */
.ds-scope[b-5tbpl60u5e]  .mud-typography[style*="color:white"],
.ds-scope[b-5tbpl60u5e]  .mud-typography[style*="color: white"],
.ds-scope[b-5tbpl60u5e]  .mud-typography[style*="rgba(255,255,255"],
.ds-scope[b-5tbpl60u5e]  .mud-typography[style*="rgba(255, 255, 255"] {
    color: var(--color-text-primary) !important;
}

.app-shell[b-5tbpl60u5e] {
    background: var(--color-surface-page);
    color: var(--color-text-body);
    font-family: var(--font-sans);
    font-size: var(--text-body);
    line-height: var(--line-height-relaxed);
    min-height: 100vh;
    box-sizing: border-box;
}

.app-shell__sidebar[b-5tbpl60u5e] {
    display: none;
}

.app-shell__main[b-5tbpl60u5e] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    box-sizing: border-box;
}

.app-shell__header-slot[b-5tbpl60u5e] {
    flex: 0 0 auto;
}

.app-shell__content[b-5tbpl60u5e] {
    flex: 1 1 auto;
}

@media (min-width: 900px) {
    .app-shell[b-5tbpl60u5e] {
        display: grid;
        grid-template-columns: 200px 1fr;
        height: 100vh;
        min-height: 0;
    }

    .app-shell__sidebar[b-5tbpl60u5e] {
        display: block;
        background: var(--color-surface-raised);
        border-right: 1px solid var(--color-border-subtle);
        height: 100vh;
        overflow-y: auto;
        z-index: var(--z-sidebar);
        box-sizing: border-box;
    }

    .app-shell__main[b-5tbpl60u5e] {
        height: 100vh;
        min-height: 0;
        overflow-y: auto;
    }
}

@media (max-width: 899.98px) {
    /* spazio in basso per BottomNav (64) + safe-area + un FAB (56 a +88 dal fondo).
       Considerando padding di sicurezza per FAB sopra BottomNav: 88 + 56/2 ≈ 116px. */
    .app-shell__content[b-5tbpl60u5e] {
        padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px) + var(--space-2xl));
    }
}
/* /Components/Shared/Dashboard/Navigation/BottomNav.razor.rz.scp.css */
/* BottomNav — visibile solo su mobile (<900px). Tutti i valori da design-tokens.css. */

.bottom-nav[b-qfmyg6qn7a] {
    display: none;
}

@media (max-width: 899.98px) {
    .bottom-nav[b-qfmyg6qn7a] {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: var(--z-sticky);
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        height: calc(64px + env(safe-area-inset-bottom, 0px));
        padding-bottom: env(safe-area-inset-bottom, 0px);
        background: var(--color-surface-raised);
        border-top: 0.5px solid var(--color-border-subtle);
        box-shadow: var(--shadow-none);
    }
}

.bottom-nav__item[b-qfmyg6qn7a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-xs);
    padding: var(--space-sm) var(--space-xs);
    text-decoration: none;
    color: var(--color-text-secondary);
    min-width: 44px;
    min-height: 44px;
    transition: color var(--duration-standard) var(--ease-standard);
}

.bottom-nav__item:hover[b-qfmyg6qn7a] {
    color: var(--color-text-primary);
}

.bottom-nav__item:active[b-qfmyg6qn7a] {
    transform: scale(0.96);
}

.bottom-nav__item--active[b-qfmyg6qn7a] {
    color: var(--color-brand-primary);
}

.bottom-nav__item--active:hover[b-qfmyg6qn7a] {
    color: var(--color-brand-primary-hover);
}

.bottom-nav__label[b-qfmyg6qn7a] {
    font-family: var(--font-sans);
    font-size: var(--text-caption);
    font-weight: var(--font-weight-medium);
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
}
/* /Components/Shared/Dashboard/Navigation/BottomSheet.razor.rz.scp.css */
/* BottomSheet — sheet mobile + drag handle. Tutti i valori da design-tokens.css.
   Su desktop il branch mobile resta nel DOM ma è display:none via media query;
   il branch desktop (MudDialog) gestisce la sua visibilità via parametro. */

.bs-mobile[b-kb3qlvhf3n] {
    display: none;
}

@media (max-width: 899.98px) {
    .bs-mobile[b-kb3qlvhf3n] {
        display: block;
    }
}

.bs-overlay[b-kb3qlvhf3n] {
    position: fixed;
    inset: 0;
    z-index: var(--z-overlay);
    background: rgba(28, 28, 26, 0.5);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--duration-standard) var(--ease-standard);
}

.bs-mobile--open .bs-overlay[b-kb3qlvhf3n] {
    opacity: 1;
    pointer-events: auto;
}

.bs-sheet[b-kb3qlvhf3n] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: var(--z-dialog);

    background: var(--color-surface-raised);
    color: var(--color-text-body);
    border-top-left-radius: var(--radius-lg);
    border-top-right-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);

    /* 85vh: lascia ~15vh per overlay tap-to-close visibile in alto. Inline il
       valore: l'unica occorrenza nel codebase, non giustifica un token. */
    max-height: 85vh;
    overflow-y: auto;
    overscroll-behavior: contain;

    padding: var(--space-lg);
    padding-bottom: calc(var(--space-lg) + env(safe-area-inset-bottom, 0px));
    box-sizing: border-box;

    transform: translateY(100%);
    transition: transform var(--duration-long) var(--ease-emphasis);
    pointer-events: none;
}

.bs-mobile--open .bs-sheet[b-kb3qlvhf3n] {
    transform: translateY(0);
    pointer-events: auto;
}

.bs-handle[b-kb3qlvhf3n] {
    width: 32px;
    height: 4px;
    margin: 0 auto var(--space-md) auto;
    border-radius: var(--radius-pill);
    background: var(--color-border-emphasis);
    cursor: grab;
    touch-action: none; /* per pointer events vanilla: niente scroll del browser durante drag */
}

.bs-handle:active[b-kb3qlvhf3n] {
    cursor: grabbing;
}

.bs-header[b-kb3qlvhf3n] {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    margin-bottom: var(--space-md);
}

.bs-title[b-kb3qlvhf3n] {
    flex: 1 1 auto;
    margin: 0;
    font-family: var(--font-sans);
    font-size: var(--text-h2);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-primary);
    line-height: var(--line-height-normal);
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bs-close[b-kb3qlvhf3n] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-md);
    color: var(--color-text-primary);
    cursor: pointer;
    transition: background var(--duration-standard) var(--ease-standard);
}

.bs-close:hover[b-kb3qlvhf3n] {
    background: var(--color-surface-sunken);
}

.bs-body[b-kb3qlvhf3n] {
    font-family: var(--font-sans);
    font-size: var(--text-body);
    color: var(--color-text-body);
    line-height: var(--line-height-relaxed);
}

.bs-actions[b-kb3qlvhf3n] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-sm);
    margin-top: var(--space-lg);
    padding-top: var(--space-md);
    border-top: 1px solid var(--color-border-subtle);
}

@media (prefers-reduced-motion: reduce) {
    .bs-overlay[b-kb3qlvhf3n],
    .bs-sheet[b-kb3qlvhf3n] {
        transition: none;
    }
}
/* /Components/Shared/Dashboard/Navigation/Fab.razor.rz.scp.css */
/* Fab — bottone flottante. Tutti i valori da design-tokens.css.
   Mobile: bottom calcolato come 64 (BottomNav) + safe-area + spacing-xl
           per non sovrapporsi alla nav e mantenere respiro dal bordo. */

.fab[b-nn5mvwdlkb] {
    position: fixed;
    z-index: var(--z-overlay);

    width: 56px;
    height: 56px;
    padding: 0;
    border: none;
    border-radius: var(--radius-pill);

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;

    background: var(--color-brand-primary);
    color: var(--color-text-on-brand);

    box-shadow: var(--shadow-md);
    cursor: pointer;
    transition:
        background var(--duration-standard) var(--ease-standard),
        box-shadow var(--duration-standard) var(--ease-standard),
        transform var(--duration-standard) var(--ease-standard);

    /* mobile: sopra BottomNav (64) + safe-area + spacing-xl */
    bottom: calc(64px + env(safe-area-inset-bottom, 0px) + var(--space-xl));
    right: var(--space-lg);
}

.fab:hover[b-nn5mvwdlkb] {
    background: var(--color-brand-primary-hover);
    box-shadow: var(--shadow-lg);
}

.fab:active[b-nn5mvwdlkb] {
    transform: scale(0.95);
}

.fab:focus-visible[b-nn5mvwdlkb] {
    outline: 2px solid var(--color-brand-primary);
    outline-offset: 2px;
}

.fab .mud-icon-root[b-nn5mvwdlkb] {
    /* MudIcon Size.Medium = 24px */
    color: var(--color-text-on-brand);
}

.fab__label[b-nn5mvwdlkb] {
    display: none;
}

@media (min-width: 900px) {
    .fab[b-nn5mvwdlkb] {
        /* desktop: niente BottomNav, basta spacing-xl dal bordo */
        bottom: var(--space-xl);
        right: var(--space-xl);
    }

    .fab--extended-desktop[b-nn5mvwdlkb] {
        width: auto;
        padding: var(--space-md) var(--space-xl);
        gap: var(--space-sm);
    }

    .fab--extended-desktop .fab__label[b-nn5mvwdlkb] {
        display: inline;
        font-family: var(--font-sans);
        font-size: var(--text-body);
        font-weight: var(--font-weight-medium);
        line-height: 1;
    }
}
/* /Components/Shared/Dashboard/Navigation/PageHeader.razor.rz.scp.css */
/* PageHeader — sticky header design system. Tutti i valori da design-tokens.css. */

.page-header[b-7tuslm1j2d] {
    position: sticky;
    top: 0;
    z-index: var(--z-sticky);
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: var(--color-surface-raised);
    border-bottom: 1px solid var(--color-border-subtle);
    box-shadow: var(--shadow-none);
    padding: 0 var(--space-lg);
    height: 56px;
    box-sizing: border-box;
}

.page-header__breadcrumb[b-7tuslm1j2d] {
    font-family: var(--font-sans);
    font-size: var(--text-caption);
    font-weight: var(--font-weight-medium);
    text-transform: uppercase;
    letter-spacing: var(--letter-spacing-caption);
    color: var(--color-text-secondary);
    margin-bottom: var(--space-xs);
}

.page-header__row[b-7tuslm1j2d] {
    display: flex;
    align-items: center;
    gap: var(--space-md);
    width: 100%;
}

.page-header__back[b-7tuslm1j2d] {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-md);
    color: var(--color-text-primary);
    cursor: pointer;
    transition: background var(--duration-standard) var(--ease-standard);
}

.page-header__back:hover[b-7tuslm1j2d] {
    background: var(--color-surface-sunken);
}

.page-header__back:active[b-7tuslm1j2d] {
    transform: scale(0.96);
}

.page-header__titles[b-7tuslm1j2d] {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.page-header__title[b-7tuslm1j2d] {
    margin: 0;
    font-family: var(--font-sans);
    font-size: var(--text-nav-title);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-primary);
    line-height: var(--line-height-normal);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.page-header--serif-title .page-header__title[b-7tuslm1j2d] {
    font-family: var(--font-serif);
    font-size: var(--text-h1);
    font-weight: var(--font-weight-serif);
    line-height: var(--line-height-tight);
}

.page-header__subtitle[b-7tuslm1j2d] {
    font-family: var(--font-sans);
    font-size: var(--text-meta);
    color: var(--color-text-secondary);
    line-height: var(--line-height-normal);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.page-header__actions[b-7tuslm1j2d] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

@media (min-width: 900px) {
    .page-header[b-7tuslm1j2d] {
        height: 64px;
        padding: 0 var(--space-xl);
    }
}
/* /Components/Shared/Dashboard/Widgets/DashboardTodoWidget.razor.rz.scp.css */
/* DashboardTodoWidget — hover sottile sulle righe della lista todo.
   Migrato da app.css (rimosse regole .todo-row scoped al solo widget
   home; la regola V1 .dashboard-layout .todo-row:hover è obsoleta
   con V2 ed è stata eliminata). */

.todo-row[b-vblip7j6oc] {
    transition: background 0.15s;
}

.todo-row:hover[b-vblip7j6oc] {
    background: rgba(0, 0, 0, 0.02);
}
