@import '_content/Microsoft.FluentUI.AspNetCore.Components/Microsoft.FluentUI.AspNetCore.Components.ewdlgswx1m.bundle.scp.css';

/* /Components/Account/Pages/Login.razor.rz.scp.css */
/* =========================================================================
   Login.razor.css
   Gli stili del layout di autenticazione sono condivisi con Register.razor
   e vivono in wwwroot/css/auxilium.auth.css (importato da app.css).
   Questo file è volutamente vuoto: tutto il layout è globale e coerente
   tra le pagine Identity.
   ========================================================================= */
/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* =========================================================================
   MainLayout.razor.css
   Shell principale dell'app: sidebar + topbar + area contenuti.
   Consumer dei token definiti in wwwroot/css/auxilium.tokens.css
   ========================================================================= */

.app-shell[b-8l088lemo6] {
    display: grid;
    grid-template-columns: var(--ax-sidebar-width) 1fr;
    min-height: 100vh;
    background: var(--ax-body-bg);
    color: var(--ax-text-1);
    transition: grid-template-columns 200ms ease;
}

.app-shell.shell-collapsed[b-8l088lemo6] {
    grid-template-columns: var(--ax-sidebar-collapsed-width) 1fr;
}

/* ---------- SIDEBAR ---------- */
.sidebar-shell[b-8l088lemo6] {
    background: var(--ax-sidebar-bg);
    color: var(--ax-sidebar-text);
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    border-right: 1px solid var(--ax-sidebar-border);
    position: sticky;
    top: 0;
}

.sidebar-top[b-8l088lemo6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ax-space-2);
    padding: var(--ax-space-4) var(--ax-space-4) var(--ax-space-4) var(--ax-space-2);
    min-height: var(--ax-topbar-height);
    border-bottom: 1px solid var(--ax-sidebar-border);
}

/* In modalità compatta brand-mark e toggle non entrano in 72px di larghezza:
   impiliamo verticalmente per evitare la sovrapposizione. */
.app-shell.shell-collapsed .sidebar-top[b-8l088lemo6] {
    flex-direction: column;
    justify-content: center;
    gap: var(--ax-space-2);
    padding: var(--ax-space-3) var(--ax-space-2);
}

.brand-block[b-8l088lemo6] {
    display: flex;
    align-items: center;
    gap: var(--ax-space-3);
    min-width: 0;
}

.brand-mark[b-8l088lemo6] {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    background: var(--ax-sidebar-text-strong);
    color: var(--ax-primary-700);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--ax-radius-xs);
    font-weight: 700;
    font-size: 15px;
    letter-spacing: -0.02em;
}

/* Logo PNG di brand sostitutivo del placeholder testuale ".brand-mark".
   Sfondo bianco morbido per dare contrasto al logo sulla sidebar scura,
   mantiene proporzioni e sta bene anche con sidebar collassata. */
.brand-logo[b-8l088lemo6] {
    width: 52px;
    height: 52px;
    flex-shrink: 0;
    border-radius: var(--ax-radius-sm);
    object-fit: contain;
    background: var(--ax-sidebar-text-strong);
    /* Padding ridotto rispetto al precedente (4px): il PNG ha già un suo
       bordo bianco interno, sommarci altro padding rendeva il logo poco
       leggibile a colpo d'occhio. */
    padding: 4px;
}

.brand-copy[b-8l088lemo6] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.brand-title[b-8l088lemo6] {
    color: var(--ax-sidebar-text-strong);
    font-size: var(--ax-fs-14);
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.brand-subtitle[b-8l088lemo6] {
    color: var(--ax-sidebar-text);
    font-size: var(--ax-fs-11);
    font-weight: 500;
    line-height: 1.2;
    opacity: 0.8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sidebar-toggle[b-8l088lemo6] {
    background: transparent;
    border: 1px solid transparent;
    color: var(--ax-sidebar-text);
    cursor: pointer;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--ax-radius-xs);
    font-size: 16px;
    transition: background 120ms, color 120ms;
}

.sidebar-toggle:hover[b-8l088lemo6] {
    background: var(--ax-sidebar-hover-bg);
    color: var(--ax-sidebar-text-strong);
}

.sidebar-divider[b-8l088lemo6] {
    height: 1px;
    background: var(--ax-sidebar-border);
    margin: 0;
}

/* ---------- WORKSPACE ---------- */
.workspace-shell[b-8l088lemo6] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* ---------- TOPBAR ---------- */
.topbar-shell[b-8l088lemo6] {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ax-space-4);
    padding: var(--ax-space-4) var(--ax-space-6);
    min-height: var(--ax-topbar-height);
    background: var(--ax-shell-bg);
    border-bottom: 1px solid var(--ax-border-soft);
}

.topbar-copy[b-8l088lemo6] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1 1 auto;
}

.topbar-kicker[b-8l088lemo6] {
    font-size: var(--ax-fs-11);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ax-text-3);
}

.topbar-title[b-8l088lemo6] {
    font-size: var(--ax-fs-18);
    font-weight: 600;
    color: var(--ax-text-1);
    line-height: 1.25;
    letter-spacing: -0.01em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar-subtitle[b-8l088lemo6] {
    font-size: var(--ax-fs-12);
    color: var(--ax-text-3);
    line-height: 1.4;
}

.topbar-actions[b-8l088lemo6] {
    display: flex;
    align-items: center;
    gap: var(--ax-space-2);
    flex-shrink: 0;
}

.topbar-action-button[b-8l088lemo6] {
    background: transparent;
    border: 1px solid var(--ax-border-strong);
    color: var(--ax-text-2);
    font-size: var(--ax-fs-13);
    font-weight: 500;
    padding: 7px 12px;
    border-radius: var(--ax-radius-sm);
    cursor: pointer;
    transition: background 120ms, color 120ms, border-color 120ms;
}

.topbar-action-button:hover[b-8l088lemo6] {
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-1);
    border-color: var(--ax-primary-500);
}

/* Blocco utente corrente (nome/azienda + email) accanto al pulsante Esci.
   Due righe impilate, troncate con ellipsis per non rompere il layout
   flex del topbar anche con nomi lunghi. */
.topbar-user[b-8l088lemo6] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    min-width: 0;
    max-width: 260px;
    line-height: 1.2;
}

.topbar-user-name[b-8l088lemo6] {
    color: var(--ax-text-1);
    font-size: var(--ax-fs-13);
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topbar-user-email[b-8l088lemo6] {
    color: var(--ax-text-3);
    font-size: var(--ax-fs-11);
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Il form di logout è solo un wrapper per il POST anti-CSRF,
   non deve occupare spazio o rompere l'allineamento flex del topbar. */
.topbar-logout-form[b-8l088lemo6] {
    margin: 0;
    padding: 0;
    display: inline-flex;
}

/* ---------- CONTENT ---------- */
.content-shell[b-8l088lemo6] {
    flex: 1;
    min-width: 0;
    padding: 0;
    background: var(--ax-body-bg);
}

/* ---------- ERROR BOUNDARY ---------- */
.layout-error-box[b-8l088lemo6] {
    margin: 2rem auto;
    max-width: 520px;
    padding: 1.5rem 1.75rem;
    background: var(--ax-panel-bg);
    border: 1px solid var(--ax-border-strong);
    border-left: 4px solid var(--ax-danger, #d9534f);
    border-radius: var(--ax-radius-md);
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.layout-error-title[b-8l088lemo6] {
    font-size: var(--ax-fs-15);
    font-weight: 600;
    color: var(--ax-text-1);
}

.layout-error-detail[b-8l088lemo6] {
    font-size: var(--ax-fs-13);
    color: var(--ax-text-3);
    word-break: break-word;
}

/* ---------- HAMBURGER (nascosto su desktop) ---------- */
.topbar-hamburger[b-8l088lemo6] {
    display: none;
    background: transparent;
    border: 1px solid transparent;
    color: var(--ax-text-2);
    cursor: pointer;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    border-radius: var(--ax-radius-xs);
    font-size: 18px;
    flex-shrink: 0;
    transition: background 120ms, color 120ms;
}

.topbar-hamburger:hover[b-8l088lemo6] {
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-1);
}

/* ---------- RESPONSIVE 960px: sidebar compressa ---------- */
@media (max-width: 960px) {
    .app-shell[b-8l088lemo6],
    .app-shell.shell-collapsed[b-8l088lemo6] {
        grid-template-columns: var(--ax-sidebar-collapsed-width) 1fr;
    }

    .brand-copy[b-8l088lemo6],
    .topbar-kicker[b-8l088lemo6],
    .topbar-subtitle[b-8l088lemo6] {
        display: none;
    }

    .sidebar-top[b-8l088lemo6] {
        flex-direction: column;
        justify-content: center;
        gap: var(--ax-space-2);
        padding: var(--ax-space-3) var(--ax-space-2);
    }

    .topbar-shell[b-8l088lemo6] {
        padding: var(--ax-space-3) var(--ax-space-4);
    }
}

/* ---------- RESPONSIVE 768px: sidebar nascosta, overlay mobile ---------- */
@media (max-width: 768px) {
    /* Sidebar non occupa colonna nella griglia */
    .app-shell[b-8l088lemo6],
    .app-shell.shell-collapsed[b-8l088lemo6],
    .app-shell.shell-expanded[b-8l088lemo6] {
        display: block;
        min-width: 0;
        width: 100%;
    }

    .workspace-shell[b-8l088lemo6],
    .content-shell[b-8l088lemo6] {
        width: 100%;
        min-width: 0;
    }

    /* Sidebar nascosta di default */
    .sidebar-shell[b-8l088lemo6] {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        height: 100dvh;
        width: var(--ax-sidebar-width);
        z-index: 200;
        overflow-y: auto;
        box-shadow: 4px 0 16px rgba(0, 0, 0, 0.25);
    }

    /* Quando l'overlay è aperto, sidebar torna visibile */
    .app-shell.menu-mobile-aperto .sidebar-shell[b-8l088lemo6] {
        display: flex;
    }

    /* Backdrop semitrasparente per chiudere cliccando fuori */
    .menu-mobile-backdrop[b-8l088lemo6] {
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.45);
        z-index: 199;
    }

    /* Hamburger visibile */
    .topbar-hamburger[b-8l088lemo6] {
        display: inline-flex;
    }

    /* Nasconde il toggle interno alla sidebar (su mobile la controlla l'hamburger) */
    .sidebar-toggle[b-8l088lemo6] {
        display: none;
    }

    /* Overlay mobile: sidebar larga → ripristina riga orizzontale e logo a sinistra */
    .app-shell.menu-mobile-aperto .sidebar-top[b-8l088lemo6] {
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        padding: var(--ax-space-4) var(--ax-space-4) var(--ax-space-4) var(--ax-space-2);
        gap: var(--ax-space-3);
    }

    .topbar-shell[b-8l088lemo6] {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: var(--ax-space-2);
        padding: var(--ax-space-3) var(--ax-space-3);
        width: 100%;
        min-width: 0;
    }

    .topbar-actions[b-8l088lemo6] {
        min-width: 0;
        gap: 6px;
    }

    .topbar-user[b-8l088lemo6] {
        max-width: 130px;
    }

    .topbar-logout-form .ax-btn[b-8l088lemo6] {
        padding-left: 10px;
        padding-right: 10px;
    }
}

@media (max-width: 600px) {
    .topbar-action-button[b-8l088lemo6] {
        display: none;
    }
}

@media (max-width: 520px) {
    .topbar-user[b-8l088lemo6] {
        display: none;
    }

    .topbar-title[b-8l088lemo6] {
        font-size: var(--ax-fs-16);
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* =========================================================================
   NavMenu.razor.css
   Navigazione laterale di Auxilium.
   NOTA: i <NavLink> sono componenti figli, quindi l'<a> renderizzato NON
   riceve l'attributo scoped b-xxx. Per stilizzarlo serve ::deep.
   ========================================================================= */

.navmenu[b-v5d6f3vci2] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: var(--ax-space-3);
    min-width: 0;
}

.navmenu-group-title[b-v5d6f3vci2] {
    padding: var(--ax-space-4) var(--ax-space-2) var(--ax-space-2) var(--ax-space-2);
    font-size: var(--ax-fs-11);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--ax-sidebar-text);
    opacity: 0.7;
}

.navmenu-group-title:first-child[b-v5d6f3vci2] {
    padding-top: var(--ax-space-2);
}

/* ---------- Link renderizzati da <NavLink> (componente figlio: serve ::deep) ---------- */
.navmenu[b-v5d6f3vci2]  a.navmenu-link {
    min-height: 36px;
    padding: var(--ax-space-2) var(--ax-space-3);
    border-radius: var(--ax-radius-sm);
    display: flex;
    align-items: center;
    gap: var(--ax-space-3);
    text-decoration: none;
    color: var(--ax-sidebar-text);
    background: transparent;
    border: 1px solid transparent;
    font-size: var(--ax-fs-13);
    font-weight: 500;
    transition: background 120ms ease, color 120ms ease;
}

.navmenu[b-v5d6f3vci2]  a.navmenu-link:hover {
    background: var(--ax-sidebar-hover-bg);
    color: var(--ax-sidebar-text-strong);
}

.navmenu[b-v5d6f3vci2]  a.navmenu-link.active {
    background: var(--ax-sidebar-active-bg);
    color: var(--ax-sidebar-text-strong);
    box-shadow: inset 3px 0 0 var(--ax-sidebar-active-indicator);
}

.navmenu[b-v5d6f3vci2]  a.navmenu-link-secondary {
    padding-left: var(--ax-space-4);
    font-weight: 400;
    opacity: 0.9;
}

/* ---------- Icon e testo sono <span> scritti direttamente nel file .razor
     quindi ricevono l'attributo scoped e NON servono ::deep ---------- */
.navmenu[b-v5d6f3vci2]  .navmenu-icon,
.navmenu-icon[b-v5d6f3vci2] {
    width: 18px;
    min-width: 18px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    line-height: 1;
    color: inherit;
    fill: currentColor;
    stroke: currentColor;
}

.navmenu[b-v5d6f3vci2]  .navmenu-icon svg {
    color: inherit;
    fill: currentColor;
    stroke: currentColor;
}

.navmenu-text[b-v5d6f3vci2] {
    font-size: inherit;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: inherit;
}

.navmenu-collapsed[b-v5d6f3vci2]  a.navmenu-link {
    justify-content: center;
    padding-left: var(--ax-space-2);
    padding-right: var(--ax-space-2);
}

@media (max-width: 960px) {
    .navmenu[b-v5d6f3vci2] {
        padding-left: var(--ax-space-2);
        padding-right: var(--ax-space-2);
    }

    .navmenu[b-v5d6f3vci2]  a.navmenu-link,
    .navmenu-collapsed[b-v5d6f3vci2]  a.navmenu-link {
        justify-content: center;
        padding-left: var(--ax-space-1);
        padding-right: var(--ax-space-1);
    }

    .navmenu[b-v5d6f3vci2]  a.navmenu-link-secondary {
        padding-left: var(--ax-space-1);
    }

    /* Sotto i 960px la sidebar è forzata a 72px via CSS (indipendentemente
       dallo stato C# MenuCompatto): dobbiamo nascondere via CSS anche
       il titolo di gruppo e il testo dei link, altrimenti restano
       visibili perché il componente li renderizza comunque. */
    .navmenu .navmenu-group-title[b-v5d6f3vci2],
    .navmenu .navmenu-text[b-v5d6f3vci2],
    .navmenu-collapsed .navmenu-group-title[b-v5d6f3vci2],
    .navmenu-collapsed .navmenu-text[b-v5d6f3vci2] {
        display: none;
    }
}

@media (max-width: 768px) {
    .navmenu[b-v5d6f3vci2] {
        padding: var(--ax-space-3);
    }

    /* Overlay mobile: testo e titoli di gruppo tornano visibili
       (il blocco 960px li aveva nascosti con display:none). */
    .navmenu .navmenu-text[b-v5d6f3vci2],
    .navmenu .navmenu-group-title[b-v5d6f3vci2] {
        display: block;
    }

    .navmenu[b-v5d6f3vci2]  a.navmenu-link {
        justify-content: flex-start;
        padding-left: var(--ax-space-3);
        padding-right: var(--ax-space-3);
    }

    .navmenu[b-v5d6f3vci2]  a.navmenu-link-secondary {
        padding-left: var(--ax-space-5);
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-ao6l9rhwc0],
.components-reconnect-repeated-attempt-visible[b-ao6l9rhwc0],
.components-reconnect-failed-visible[b-ao6l9rhwc0],
.components-pause-visible[b-ao6l9rhwc0],
.components-resume-failed-visible[b-ao6l9rhwc0],
.components-rejoining-animation[b-ao6l9rhwc0] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-ao6l9rhwc0],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-ao6l9rhwc0],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-ao6l9rhwc0],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-ao6l9rhwc0],
#components-reconnect-modal.components-reconnect-retrying[b-ao6l9rhwc0],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-ao6l9rhwc0],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-ao6l9rhwc0],
#components-reconnect-modal.components-reconnect-failed[b-ao6l9rhwc0],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-ao6l9rhwc0] {
    display: block;
}


#components-reconnect-modal[b-ao6l9rhwc0] {
    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-ao6l9rhwc0 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-ao6l9rhwc0 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-ao6l9rhwc0 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-ao6l9rhwc0]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-ao6l9rhwc0 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-ao6l9rhwc0 {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-ao6l9rhwc0 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-ao6l9rhwc0 {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-ao6l9rhwc0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-ao6l9rhwc0] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-ao6l9rhwc0] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-ao6l9rhwc0] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-ao6l9rhwc0] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-ao6l9rhwc0] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-ao6l9rhwc0] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-ao6l9rhwc0 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-ao6l9rhwc0] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-ao6l9rhwc0 {
    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/Admin/Configurazione.razor.rz.scp.css */
/* =========================================================================
   Configurazione.razor.css
   Pagina /admin/configurazione: sezioni separate per i limiti di piano
   (3 card) e per i toggle a flag singolo (es. consulenza pubblica).
   Riusa le classi admin-page / admin-header / admin-alert / ax-btn dei
   token globali.
   ========================================================================= */

.config-section[b-dvjbx3x0bv] {
    background: var(--ax-card-bg);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-md);
    box-shadow: var(--ax-shadow-1);
    padding: var(--ax-space-6);
    margin-top: var(--ax-space-5);
}

.config-section-title[b-dvjbx3x0bv] {
    margin: 0 0 var(--ax-space-2) 0;
    font-size: var(--ax-fs-18);
    font-weight: 600;
    color: var(--ax-text-1);
}

.config-section-help[b-dvjbx3x0bv] {
    margin: 0 0 var(--ax-space-5) 0;
    color: var(--ax-text-2);
    font-size: var(--ax-fs-13);
    line-height: 1.55;
}

.config-section-help code[b-dvjbx3x0bv] {
    background: var(--ax-paper-bg-2);
    padding: 1px 6px;
    border-radius: var(--ax-radius-xs);
    font-size: var(--ax-fs-12);
}

/* ------------------------------------------------- Limiti di piano (cards) */
.config-piani-grid[b-dvjbx3x0bv] {
    display: grid;
    gap: var(--ax-layout-gap);
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.config-piano-card[b-dvjbx3x0bv] {
    background: var(--ax-card-bg-soft);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-md);
    padding: var(--ax-space-4);
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-3);
}

.config-piano-header[b-dvjbx3x0bv] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--ax-space-2);
}

.config-piano-titolo[b-dvjbx3x0bv] {
    margin: 0;
    font-size: var(--ax-fs-16);
    font-weight: 600;
    color: var(--ax-highlight-strong);
}

.config-piano-chiave[b-dvjbx3x0bv] {
    font-family: var(--ax-font-mono);
    font-size: var(--ax-fs-11);
    color: var(--ax-text-3);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.config-campo[b-dvjbx3x0bv] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.config-campo-label[b-dvjbx3x0bv] {
    font-size: var(--ax-fs-12);
    font-weight: 600;
    color: var(--ax-text-3);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.config-piano-card .campo-input[b-dvjbx3x0bv] {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid var(--ax-input-border);
    border-radius: var(--ax-radius-sm);
    background: var(--ax-input-bg);
    color: var(--ax-input-text);
    font-family: var(--ax-font-mono);
    font-variant-numeric: tabular-nums;
    font-size: var(--ax-fs-14);
}

.config-piano-card .campo-input:focus[b-dvjbx3x0bv] {
    outline: none;
    border-color: var(--ax-input-border-focus);
    box-shadow: var(--ax-shadow-focus);
}

.config-piano-save[b-dvjbx3x0bv] {
    margin-top: var(--ax-space-2);
}

/* ----------------------------------------------------- Toggle (singolo flag) */
.config-toggle[b-dvjbx3x0bv] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    user-select: none;
}

.config-toggle input[type="checkbox"][b-dvjbx3x0bv] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.config-toggle-track[b-dvjbx3x0bv] {
    width: 44px;
    height: 24px;
    border-radius: 999px;
    background: var(--ax-gray-300);
    position: relative;
    transition: background-color 0.15s ease;
}

.config-toggle-thumb[b-dvjbx3x0bv] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    transition: left 0.15s ease;
}

.config-toggle input:checked + .config-toggle-track[b-dvjbx3x0bv] {
    background: var(--ax-success);
}

.config-toggle input:checked + .config-toggle-track .config-toggle-thumb[b-dvjbx3x0bv] {
    left: 22px;
}

.config-toggle-label[b-dvjbx3x0bv] {
    font-size: var(--ax-fs-14);
    color: var(--ax-text-2);
}

.config-actions[b-dvjbx3x0bv] {
    margin-top: var(--ax-space-4);
}
/* /Components/Pages/Admin/Dashboard.razor.rz.scp.css */
/* =========================================================================
   Dashboard.razor.css
   Pannello /admin: header in stile pagine admin + griglia di card.
   Riusa classi dalle altre pagine admin; aggiunge specifiche per le card
   della dashboard e il toggle custom.
   ========================================================================= */

.admin-page[b-282i51hrxv] {
    padding: var(--ax-page-padding);
    max-width: var(--ax-page-max);
    margin: 0 auto;
    color: var(--ax-text-1);
}

.admin-header[b-282i51hrxv] {
    margin-bottom: var(--ax-space-5);
}

.admin-kicker[b-282i51hrxv] {
    font-size: var(--ax-fs-12);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ax-primary-700);
    margin-bottom: 6px;
}

.admin-title[b-282i51hrxv] {
    margin: 0 0 4px;
    font-size: clamp(var(--ax-fs-24), 2.4vw, var(--ax-fs-32));
    font-weight: 700;
    letter-spacing: -0.015em;
    color: var(--ax-text-1);
}

.admin-subtitle[b-282i51hrxv] {
    margin: 0;
    max-width: 720px;
    font-size: var(--ax-fs-14);
    line-height: 1.6;
    color: var(--ax-text-2);
}

.admin-alert[b-282i51hrxv] {
    padding: var(--ax-space-3) var(--ax-space-4);
    border-radius: var(--ax-radius-md);
    border: 1px solid var(--ax-border-soft);
    margin-bottom: var(--ax-space-4);
    font-size: var(--ax-fs-13);
    line-height: 1.55;
}

.admin-alert.is-success[b-282i51hrxv] {
    border-color: var(--ax-success-600, #059669);
    background: var(--ax-success-50, #ecfdf5);
}

.admin-alert.is-error[b-282i51hrxv] {
    border-color: var(--ax-danger-600, #dc2626);
    background: var(--ax-danger-50, #fef2f2);
}

/* ---------- GRIGLIA CARD DASHBOARD ---------- */
.admin-cards-grid[b-282i51hrxv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: var(--ax-space-4);
}

.admin-card[b-282i51hrxv] {
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-3);
    padding: var(--ax-space-5);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    background: var(--ax-panel-bg);
    box-shadow: var(--ax-shadow-1);
    min-height: 240px;
}

.admin-card-header[b-282i51hrxv] {
    display: grid;
    gap: 2px;
}

.admin-card-title[b-282i51hrxv] {
    font-size: var(--ax-fs-16);
    font-weight: 600;
    color: var(--ax-text-1);
    letter-spacing: -0.005em;
}

.admin-card-subtitle[b-282i51hrxv] {
    font-size: var(--ax-fs-12);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ax-text-3);
}

.admin-card-body[b-282i51hrxv] {
    flex: 1;
}

.admin-card-body p[b-282i51hrxv] {
    margin: 0 0 var(--ax-space-3);
    font-size: var(--ax-fs-13);
    line-height: 1.55;
    color: var(--ax-text-2);
}

.admin-card-body code[b-282i51hrxv] {
    padding: 1px 6px;
    border-radius: 4px;
    background: var(--ax-primary-50);
    color: var(--ax-primary-700);
    font-size: var(--ax-fs-12);
}

.admin-card-actions[b-282i51hrxv] {
    display: flex;
    gap: var(--ax-space-2);
    justify-content: flex-end;
    padding-top: var(--ax-space-3);
    border-top: 1px solid var(--ax-border-soft);
}

/* ---------- TOGGLE CUSTOM ---------- */
.admin-toggle[b-282i51hrxv] {
    display: inline-flex;
    align-items: center;
    gap: var(--ax-space-3);
    cursor: pointer;
    user-select: none;
    margin-top: var(--ax-space-2);
}

.admin-toggle input[type="checkbox"][b-282i51hrxv] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.admin-toggle-track[b-282i51hrxv] {
    position: relative;
    width: 40px;
    height: 22px;
    border-radius: 999px;
    background: var(--ax-border-soft);
    transition: background-color 140ms ease;
    flex-shrink: 0;
}

.admin-toggle-thumb[b-282i51hrxv] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
    transition: transform 140ms ease;
}

.admin-toggle input[type="checkbox"]:checked + .admin-toggle-track[b-282i51hrxv] {
    background: var(--ax-primary-700);
}

.admin-toggle input[type="checkbox"]:checked + .admin-toggle-track .admin-toggle-thumb[b-282i51hrxv] {
    transform: translateX(18px);
}

.admin-toggle input[type="checkbox"]:disabled + .admin-toggle-track[b-282i51hrxv] {
    opacity: 0.5;
    cursor: not-allowed;
}

.admin-toggle input[type="checkbox"]:focus-visible + .admin-toggle-track[b-282i51hrxv] {
    box-shadow: 0 0 0 3px var(--ax-primary-100);
}

.admin-toggle-label[b-282i51hrxv] {
    font-size: var(--ax-fs-13);
    font-weight: 500;
    color: var(--ax-text-2);
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 640px) {
    .admin-cards-grid[b-282i51hrxv] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Admin/Norme.razor.rz.scp.css */
.norme-editor-header[b-ynmmk9h7r5] {
    align-items: flex-start;
}

.norme-alert-body[b-ynmmk9h7r5] {
    flex: 1;
    line-height: 1.5;
}

.norme-tabs[b-ynmmk9h7r5] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1rem;
    border-bottom: 1px solid var(--ax-border, #d8dee8);
}

.norme-tab[b-ynmmk9h7r5] {
    appearance: none;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--ax-muted, #5f6b7a);
    cursor: pointer;
    font-weight: 700;
    padding: 0.65rem 0.85rem;
}

.norme-tab.is-active[b-ynmmk9h7r5] {
    border-bottom-color: var(--ax-primary, #164f8f);
    color: var(--ax-primary, #164f8f);
}

.norme-builder[b-ynmmk9h7r5] {
    display: grid;
    grid-template-columns: minmax(13rem, 0.8fr) minmax(22rem, 2.4fr);
    gap: 1rem;
    margin-top: 1rem;
    align-items: start;
}

.norme-panel[b-ynmmk9h7r5] {
    border: 1px solid var(--ax-border, #d8dee8);
    border-radius: 8px;
    background: #fff;
    padding: 1rem;
}

.norme-panel-header[b-ynmmk9h7r5],
.norme-edit-block header[b-ynmmk9h7r5],
.norme-row-actions[b-ynmmk9h7r5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.norme-node-buttons[b-ynmmk9h7r5],
.norme-mini-list[b-ynmmk9h7r5] {
    display: grid;
    gap: 0.65rem;
}

.norme-node-buttons[b-ynmmk9h7r5] {
    margin-top: 1rem;
}

.norme-node-button[b-ynmmk9h7r5] {
    appearance: none;
    border: 1px solid var(--ax-border, #d8dee8);
    border-radius: 8px;
    background: #fff;
    color: inherit;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.75rem;
    text-align: left;
}

.norme-node-button.is-active[b-ynmmk9h7r5] {
    border-color: var(--ax-primary, #164f8f);
    box-shadow: inset 3px 0 0 var(--ax-primary, #164f8f);
}

.norme-node-button small[b-ynmmk9h7r5] {
    color: var(--ax-muted, #5f6b7a);
}

.norme-subsection[b-ynmmk9h7r5] {
    border-top: 1px solid var(--ax-border, #d8dee8);
    margin-top: 1rem;
    padding-top: 1rem;
}

.norme-subsection h3[b-ynmmk9h7r5],
.norme-schema-card h3[b-ynmmk9h7r5] {
    font-size: 0.95rem;
    margin: 0 0 0.75rem;
}

.norme-edit-block[b-ynmmk9h7r5] {
    border: 1px solid var(--ax-border, #d8dee8);
    border-radius: 8px;
    display: grid;
    gap: 0.75rem;
    margin-top: 0.75rem;
    padding: 0.85rem;
}

.norme-edit-block-inner[b-ynmmk9h7r5] {
    background: #f8fafc;
}

.norme-key-value[b-ynmmk9h7r5],
.norme-transition-row[b-ynmmk9h7r5] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: 0.5rem;
    align-items: center;
}

.norme-transition-row[b-ynmmk9h7r5] {
    grid-template-columns: minmax(9rem, 0.8fr) minmax(0, 1.3fr) minmax(8rem, 0.9fr) auto;
    margin-top: 0.65rem;
}

.norme-check-field[b-ynmmk9h7r5] {
    align-items: flex-start;
}

.norme-check-field input[b-ynmmk9h7r5] {
    inline-size: 1.2rem;
    block-size: 1.2rem;
}

.norme-small-textarea[b-ynmmk9h7r5] {
    min-height: 5.5rem;
}

.norme-yaml-editor[b-ynmmk9h7r5] {
    margin-top: 1rem;
}

.norme-yaml-editor textarea[b-ynmmk9h7r5] {
    font-family: Consolas, "Courier New", monospace;
    min-height: 28rem;
}

.norme-schema-grid[b-ynmmk9h7r5] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.norme-schema-card[b-ynmmk9h7r5] {
    border: 1px solid var(--ax-border, #d8dee8);
    border-radius: 8px;
    padding: 1rem;
}

.norme-schema-card ul[b-ynmmk9h7r5] {
    display: grid;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.norme-schema-card li[b-ynmmk9h7r5] {
    display: grid;
    gap: 0.2rem;
}

.norme-schema-card code[b-ynmmk9h7r5] {
    font-weight: 700;
}

.norme-schema-row[b-ynmmk9h7r5] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.norme-schema-tipo[b-ynmmk9h7r5] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #b45309;
    background: #fef3c7;
    border-radius: 4px;
    padding: 0.1rem 0.35rem;
}

.norme-schema-opt[b-ynmmk9h7r5] {
    font-size: 0.72rem;
    color: var(--ax-muted, #5f6b7a);
    background: #f1f5f9;
    border-radius: 4px;
    padding: 0.1rem 0.35rem;
}

.norme-schema-esempio[b-ynmmk9h7r5] {
    font-size: 0.78rem;
    color: #166534;
    background: #dcfce7;
    border-radius: 4px;
    padding: 0.15rem 0.4rem;
    display: inline-block;
    margin-top: 0.1rem;
    font-weight: 400;
}

/* ── Header di sezione con titolo + bottone affiancati ─────────────────── */
.norme-section-header[b-ynmmk9h7r5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.norme-section-header h3[b-ynmmk9h7r5],
.norme-section-header span[b-ynmmk9h7r5] {
    margin: 0;
}

/* ── Contenitore sottoparagrafi ─────────────────────────────────────────── */
.norme-sottopara-section[b-ynmmk9h7r5] {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px dashed var(--ax-border, #d8dee8);
}

/* ── Etichetta piccola (usata nei sottoparagrafi) ───────────────────────── */
.norme-label-sm[b-ynmmk9h7r5] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--ax-muted, #5f6b7a);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ── Badge tipo nodo ─────────────────────────────────────────────────────── */
.norme-node-badge[b-ynmmk9h7r5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    font-size: 0.72rem;
    font-weight: 800;
    flex-shrink: 0;
    color: #fff;
    background: #94a3b8;
}

.norme-node-badge--domanda[b-ynmmk9h7r5]      { background: #164f8f; }
.norme-node-badge--informativo[b-ynmmk9h7r5]  { background: #475569; }
.norme-node-badge--calcolo[b-ynmmk9h7r5]      { background: #b45309; }
.norme-node-badge--fine[b-ynmmk9h7r5]         { background: #166534; }

/* Variante pill per la sidebar: mostra il numero di paragrafo invece della lettera */
.norme-node-badge--num[b-ynmmk9h7r5] {
    width: auto;
    min-width: 1.6rem;
    border-radius: 0.7rem;
    padding: 0 0.45rem;
    font-size: 0.62rem;
    letter-spacing: 0;
}

.norme-node-label[b-ynmmk9h7r5] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.norme-node-meta[b-ynmmk9h7r5] {
    color: var(--ax-muted, #5f6b7a);
    font-size: 0.78rem;
    flex-shrink: 0;
}

/* ── Accordion details/summary (sezioni nodo) ───────────────────────────── */
.norme-accordion[b-ynmmk9h7r5] {
    border-top: 1px solid var(--ax-border, #d8dee8);
    margin-top: 0.75rem;
}

.norme-accordion > summary[b-ynmmk9h7r5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.65rem 0;
    cursor: pointer;
    list-style: none;
    font-weight: 700;
    font-size: 0.92rem;
}

.norme-accordion > summary[b-ynmmk9h7r5]::-webkit-details-marker { display: none; }

.norme-accordion > summary > span[b-ynmmk9h7r5]::before {
    content: "▶ ";
    font-size: 0.65rem;
    color: var(--ax-muted, #5f6b7a);
}

.norme-accordion[open] > summary > span[b-ynmmk9h7r5]::before { content: "▼ "; }

.norme-summary-btn[b-ynmmk9h7r5] {
    margin-left: auto;
}

/* ── Gruppo pulsanti "Aggiungi" inline ──────────────────────────────────── */
.norme-add-group[b-ynmmk9h7r5] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.5rem;
}

/* ── Mappa SVG ───────────────────────────────────────────────────────────── */
.norme-mappa-wrap[b-ynmmk9h7r5] {
    margin-top: 1rem;
    border: 1px solid var(--ax-border, #d8dee8);
    border-radius: 8px;
    background: #f8fafc;
    padding: 1rem;
    overflow: auto;
}

.norme-mappa-svg[b-ynmmk9h7r5] {
    display: block;
    width: 100%;
    min-height: 10rem;
}

.norme-mappa-node-id[b-ynmmk9h7r5] {
    font-size: 11px;
    font-weight: 700;
    text-anchor: middle;
    dominant-baseline: middle;
    pointer-events: none;
}

.norme-mappa-node-tipo[b-ynmmk9h7r5] {
    font-size: 9px;
    text-anchor: middle;
    dominant-baseline: middle;
    pointer-events: none;
    opacity: 0.8;
}

.norme-mappa-edge-label[b-ynmmk9h7r5] {
    font-size: 9px;
    fill: #64748b;
    text-anchor: middle;
    dominant-baseline: middle;
    pointer-events: none;
}

/* ── Albero nodi (tab Mappa) ─────────────────────────────────────────────── */
.norme-albero-nodo[b-ynmmk9h7r5] {
    border: none;
    margin: 0;
    padding: 0;
}

.norme-albero-summary[b-ynmmk9h7r5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.5rem;
    cursor: default;
    border-radius: 6px;
    user-select: none;
}

.norme-albero-summary:hover[b-ynmmk9h7r5],
.norme-albero-terminale:hover[b-ynmmk9h7r5] {
    background: #f1f5f9;
}

/* Indicatore ▶/▼ per expand/collapse — stato gestito da classe .is-open in C# */
.norme-albero-toggle[b-ynmmk9h7r5] {
    display: inline-block;
    width: 0.75rem;
    font-size: 0.55rem;
    color: var(--ax-muted, #5f6b7a);
    flex-shrink: 0;
    text-align: center;
    cursor: pointer;
}

.norme-albero-toggle[b-ynmmk9h7r5]::before { content: "▶"; }
.norme-albero-toggle.is-open[b-ynmmk9h7r5]::before { content: "▼"; }

/* Nodi foglia (senza figli): nascondi l'indicatore */
.norme-albero-nodo.is-leaf > .norme-albero-summary .norme-albero-toggle[b-ynmmk9h7r5] {
    visibility: hidden;
}

/* Badge nella mappa: click per espandere/contrarre */
.norme-albero-summary .norme-node-badge[b-ynmmk9h7r5] {
    cursor: pointer;
}

.norme-albero-id[b-ynmmk9h7r5] {
    font-weight: 700;
    font-size: 0.9rem;
    cursor: pointer;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.norme-albero-id:hover[b-ynmmk9h7r5] {
    text-decoration: underline;
    color: var(--ax-primary, #164f8f);
}

.norme-albero-id.is-selected[b-ynmmk9h7r5] {
    color: var(--ax-primary, #164f8f);
}

.norme-albero-figli[b-ynmmk9h7r5] {
    padding-left: 1.6rem;
    border-left: 2px solid var(--ax-border, #d8dee8);
    margin-left: 0.95rem;
}

/* Nodo terminale "fine" — a livello radice, non annidato */
.norme-albero-terminale[b-ynmmk9h7r5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.5rem;
    cursor: pointer;
    border-radius: 6px;
    user-select: none;
}

.norme-albero-terminale.is-selected .norme-albero-id[b-ynmmk9h7r5] {
    color: var(--ax-primary, #164f8f);
}

/* ── Preview relazione (tab Relazione) ───────────────────────────────────── */
.norme-relazione-preview[b-ynmmk9h7r5] {
    margin-top: 1rem;
    max-width: 56rem;
}

.norme-rel-paragrafo[b-ynmmk9h7r5] {
    border-top: 1px solid var(--ax-border, #d8dee8);
    padding-top: 1.25rem;
    margin-top: 1.25rem;
}

.norme-rel-paragrafo:first-child[b-ynmmk9h7r5] {
    border-top: none;
    margin-top: 0;
}

.norme-rel-heading[b-ynmmk9h7r5] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 1rem;
    margin: 0 0 0.75rem;
}

.norme-rel-heading-sotto[b-ynmmk9h7r5] {
    font-size: 0.92rem;
    margin: 0.75rem 0 0.4rem;
    color: var(--ax-muted, #5f6b7a);
}

.norme-rel-testo[b-ynmmk9h7r5] {
    margin: 0 0 0.5rem;
    line-height: 1.6;
}

.norme-rel-formula[b-ynmmk9h7r5] {
    background: #f8fafc;
    border: 1px solid var(--ax-border, #d8dee8);
    border-radius: 6px;
    padding: 0.6rem 0.9rem;
    margin: 0.5rem 0;
    font-family: var(--ax-font-sans);
    font-size: 0.9rem;
}

.norme-rel-tabella-wrap[b-ynmmk9h7r5] {
    margin: 0.5rem 0;
    overflow-x: auto;
}

.norme-rel-sottoparagrafo[b-ynmmk9h7r5] {
    padding-left: 1rem;
    border-left: 3px solid var(--ax-border, #d8dee8);
    margin-top: 0.75rem;
}

@media (max-width: 1100px) {
    .norme-builder[b-ynmmk9h7r5] {
        grid-template-columns: 1fr;
    }

    .norme-key-value[b-ynmmk9h7r5],
    .norme-transition-row[b-ynmmk9h7r5] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Admin/Sospensioni.razor.rz.scp.css */
/* =========================================================================
   Sospensioni.razor.css
   Pagina admin "/admin/sospensioni": una card per tipo di studio con
   toggle on/off e textarea per il messaggio motivazionale. Riusa molti
   token già definiti per le altre pagine admin. Lo switch è implementato
   in CSS puro (no JS), con :checked sul checkbox sotto.
   ========================================================================= */

.sospensioni-grid[b-ry3s5k4afx] {
    display: grid;
    gap: var(--ax-layout-gap);
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    margin-top: var(--ax-space-5);
}

.sospensione-card[b-ry3s5k4afx] {
    background: var(--ax-card-bg);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-md);
    box-shadow: var(--ax-shadow-1);
    padding: var(--ax-space-5);
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-4);
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

/* Quando lo studio è sospeso, evidenzio la card con un bordo warm
   per dare riscontro visivo immediato senza dover leggere il toggle. */
.sospensione-card-attiva[b-ry3s5k4afx] {
    border-color: color-mix(in srgb, var(--ax-highlight) 50%, transparent);
    background: var(--ax-highlight-soft);
}

.sospensione-card-header[b-ry3s5k4afx] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--ax-space-3);
}

.sospensione-card-title[b-ry3s5k4afx] {
    margin: 0;
    font-size: var(--ax-fs-18);
    font-weight: 600;
    color: var(--ax-text-1);
}

.sospensione-card-slug[b-ry3s5k4afx] {
    font-family: var(--ax-font-mono);
    font-size: var(--ax-fs-12);
    color: var(--ax-text-3);
    margin-top: 4px;
}

/* ----------------------------------------------------------------- toggle */
.sospensione-toggle[b-ry3s5k4afx] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
    flex-shrink: 0;
}

.sospensione-toggle input[type="checkbox"][b-ry3s5k4afx] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.sospensione-toggle-track[b-ry3s5k4afx] {
    width: 40px;
    height: 22px;
    border-radius: 999px;
    background: var(--ax-gray-300);
    position: relative;
    transition: background-color 0.15s ease;
}

.sospensione-toggle-thumb[b-ry3s5k4afx] {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    transition: left 0.15s ease;
}

.sospensione-toggle input:checked + .sospensione-toggle-track[b-ry3s5k4afx] {
    background: var(--ax-highlight);
}

.sospensione-toggle input:checked + .sospensione-toggle-track .sospensione-toggle-thumb[b-ry3s5k4afx] {
    left: 20px;
}

.sospensione-toggle input:focus-visible + .sospensione-toggle-track[b-ry3s5k4afx] {
    box-shadow: 0 0 0 3px var(--ax-highlight-soft);
}

.sospensione-toggle-label[b-ry3s5k4afx] {
    font-size: var(--ax-fs-13);
    font-weight: 500;
    color: var(--ax-text-2);
    min-width: 60px;
}

/* ----------------------------------------------------------------- campo  */
.sospensione-campo[b-ry3s5k4afx] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sospensione-campo-label[b-ry3s5k4afx] {
    font-size: var(--ax-fs-12);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 600;
    color: var(--ax-text-3);
}

.sospensione-campo .campo-input[b-ry3s5k4afx] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--ax-input-border);
    border-radius: var(--ax-radius-sm);
    background: var(--ax-input-bg);
    color: var(--ax-input-text);
    font-family: var(--ax-font-sans);
    font-size: var(--ax-fs-13);
    line-height: 1.5;
    resize: vertical;
}

.sospensione-campo .campo-input:focus[b-ry3s5k4afx] {
    outline: none;
    border-color: var(--ax-input-border-focus);
    box-shadow: var(--ax-shadow-focus);
}

/* ----------------------------------------------------------------- footer */
.sospensione-card-footer[b-ry3s5k4afx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--ax-space-3);
    padding-top: var(--ax-space-3);
    border-top: 1px solid var(--ax-border-soft);
}

.sospensione-meta[b-ry3s5k4afx] {
    font-size: var(--ax-fs-12);
    color: var(--ax-text-3);
}

@media (max-width: 540px) {
    .sospensione-card-footer[b-ry3s5k4afx] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* /Components/Pages/Admin/Utenti.razor.rz.scp.css */
/* =========================================================================
   Utenti.razor.css
   Gli stili dell'admin panel sono ora centralizzati in
   wwwroot/css/auxilium.admin.css così possono essere condivisi con le
   pagine di dettaglio (e future admin views). Questo file è lasciato vuoto
   di proposito: Blazor lo mantiene come bundle scoped "per componente"
   ma non vi aggiunge alcun override.
   ========================================================================= */
/* /Components/Pages/ConsulenzaIngegneristica.razor.rz.scp.css */
/* =========================================================================
   ConsulenzaIngegneristica.razor.css
   Pagina pubblica di richiesta consulenza. Riusa i token Auxilium e le
   classi .hero-* della Home. Aggiunge stili specifici per il form.
   ========================================================================= */

.consulenza-page[b-iqem6jchh6] {
    min-height: 100%;
    padding: var(--ax-page-padding);
    color: var(--ax-text-1);
    background: transparent;
}

.consulenza-shell[b-iqem6jchh6] {
    max-width: var(--ax-page-max);
    margin: 0 auto;
    display: grid;
    gap: var(--ax-space-6);
}

/* Banner visibile solo quando la pagina è in anteprima admin (noindex). */
.consulenza-anteprima[b-iqem6jchh6] {
    padding: var(--ax-space-3) var(--ax-space-4);
    border: 1px dashed var(--ax-primary-500);
    border-radius: var(--ax-radius-md);
    background: var(--ax-primary-50);
    color: var(--ax-text-2);
    font-size: var(--ax-fs-13);
    line-height: 1.55;
}

.consulenza-anteprima code[b-iqem6jchh6] {
    font-size: var(--ax-fs-12);
    padding: 1px 6px;
    border-radius: 4px;
    background: var(--ax-primary-100);
    color: var(--ax-primary-700);
}

/* ---------- HERO (riusa i token della Home) ---------- */
[b-iqem6jchh6] .hero-section {
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    background: var(--ax-hero-bg);
    box-shadow: var(--ax-shadow-1);
    padding: var(--ax-space-7) var(--ax-space-7);
}

[b-iqem6jchh6] .hero-section-landing {
    padding: var(--ax-space-7) var(--ax-space-7);
}

[b-iqem6jchh6] .hero-content {
    display: grid;
    gap: var(--ax-space-4);
    max-width: 960px;
}

[b-iqem6jchh6] .hero-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--ax-space-2);
    width: fit-content;
    padding: 6px 12px;
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-pill);
    background: var(--ax-primary-50);
    color: var(--ax-primary-700);
    font-size: var(--ax-fs-12);
    font-weight: 600;
    letter-spacing: 0.02em;
}

[b-iqem6jchh6] .hero-badge-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--ax-primary-700);
    box-shadow: 0 0 0 3px var(--ax-primary-100);
}

[b-iqem6jchh6] .hero-title {
    margin: 0;
    font-size: clamp(var(--ax-fs-24), 2.6vw, var(--ax-fs-40));
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--ax-text-1);
    font-weight: 700;
}

[b-iqem6jchh6] .hero-title-accent {
    color: var(--ax-primary-700);
}

[b-iqem6jchh6] .hero-title-sub {
    display: block;
    margin-top: var(--ax-space-2);
    font-size: clamp(var(--ax-fs-18), 1.6vw, var(--ax-fs-24));
    font-weight: 500;
    color: var(--ax-text-2);
    letter-spacing: -0.005em;
    line-height: 1.25;
}

[b-iqem6jchh6] .hero-description {
    margin: 0;
    color: var(--ax-text-2);
    font-size: var(--ax-fs-16);
    line-height: 1.6;
    max-width: 780px;
}

/* ---------- SEZIONE GENERICA ---------- */
[b-iqem6jchh6] .section-block {
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    background: var(--ax-panel-bg);
    box-shadow: var(--ax-shadow-1);
    padding: var(--ax-space-6);
}

[b-iqem6jchh6] .section-header {
    display: grid;
    gap: var(--ax-space-1);
    margin-bottom: var(--ax-space-5);
}

[b-iqem6jchh6] .section-header h2 {
    margin: 0;
    font-size: var(--ax-fs-20);
    letter-spacing: -0.01em;
    color: var(--ax-text-1);
    font-weight: 600;
}

[b-iqem6jchh6] .section-header p {
    margin: 0;
    max-width: 780px;
    color: var(--ax-text-3);
    font-size: var(--ax-fs-14);
    line-height: 1.55;
}

/* ---------- ALERT ---------- */
.consulenza-alert[b-iqem6jchh6] {
    padding: var(--ax-space-3) var(--ax-space-4);
    border-radius: var(--ax-radius-md);
    border: 1px solid var(--ax-border-soft);
    margin-bottom: var(--ax-space-4);
    font-size: var(--ax-fs-14);
    line-height: 1.55;
    color: var(--ax-text-2);
}

.consulenza-alert.is-success[b-iqem6jchh6] {
    border-color: var(--ax-success-600, #059669);
    background: var(--ax-success-50, #ecfdf5);
    color: var(--ax-text-1);
}

.consulenza-alert.is-error[b-iqem6jchh6] {
    border-color: var(--ax-danger-600, #dc2626);
    background: var(--ax-danger-50, #fef2f2);
    color: var(--ax-text-1);
}

/* ---------- FORM ---------- */
.form-grid[b-iqem6jchh6] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ax-space-4);
}

.form-field[b-iqem6jchh6] {
    display: grid;
    gap: 6px;
}

.form-field-full[b-iqem6jchh6] {
    grid-column: 1 / -1;
}

.form-field label[b-iqem6jchh6] {
    color: var(--ax-text-1);
    font-size: var(--ax-fs-13);
    font-weight: 600;
    letter-spacing: -0.005em;
}

[b-iqem6jchh6] .input-field {
    appearance: none;
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-md);
    background: var(--ax-card-bg);
    color: var(--ax-text-1);
    font-size: var(--ax-fs-14);
    line-height: 1.4;
    font-family: inherit;
    transition: border-color 120ms ease, box-shadow 120ms ease;
}

[b-iqem6jchh6] .input-field:focus {
    outline: none;
    border-color: var(--ax-primary-500);
    box-shadow: 0 0 0 3px var(--ax-primary-100);
}

[b-iqem6jchh6] .input-field:disabled {
    background: var(--ax-hero-bg);
    cursor: not-allowed;
    opacity: 0.7;
}

[b-iqem6jchh6] .input-field-textarea {
    resize: vertical;
    min-height: 120px;
}

.form-field-checkbox .form-checkbox[b-iqem6jchh6] {
    display: flex;
    gap: var(--ax-space-2);
    align-items: flex-start;
    font-size: var(--ax-fs-13);
    line-height: 1.55;
    color: var(--ax-text-2);
    font-weight: 400;
}

.form-field-checkbox .form-checkbox input[type="checkbox"][b-iqem6jchh6] {
    margin-top: 3px;
    flex-shrink: 0;
}

.form-field-checkbox .form-checkbox a[b-iqem6jchh6] {
    color: var(--ax-primary-700);
    text-decoration: underline;
    text-underline-offset: 2px;
}

[b-iqem6jchh6] .form-validation {
    color: var(--ax-danger-600, #dc2626);
    font-size: var(--ax-fs-12);
    margin-top: 2px;
}

.form-actions[b-iqem6jchh6] {
    display: flex;
    justify-content: flex-end;
    margin-top: var(--ax-space-5);
}

/* ---------- BENEFIT GRID (stili locali, la pagina non eredita Home.razor.css) ---------- */
[b-iqem6jchh6] .benefit-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: var(--ax-space-4);
}

[b-iqem6jchh6] .benefit-card {
    border: 1px solid var(--ax-border-soft);
    border-left: 3px solid var(--ax-primary-500);
    border-radius: var(--ax-radius-md);
    background: var(--ax-card-bg);
    padding: var(--ax-space-4);
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-2);
}

[b-iqem6jchh6] .benefit-card-title {
    margin: 0;
    color: var(--ax-text-1);
    font-size: var(--ax-fs-15);
    font-weight: 600;
}

[b-iqem6jchh6] .benefit-card-text {
    margin: 0;
    color: var(--ax-text-2);
    font-size: var(--ax-fs-13);
    line-height: 1.55;
}

[b-iqem6jchh6] .benefit-card-text strong {
    color: var(--ax-text-1);
    font-weight: 600;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 767px) {
    .form-grid[b-iqem6jchh6] {
        grid-template-columns: 1fr;
    }

    [b-iqem6jchh6] .hero-section,
    [b-iqem6jchh6] .hero-section-landing {
        padding: var(--ax-space-5);
    }

    [b-iqem6jchh6] .section-block {
        padding: var(--ax-space-4);
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* =========================================================================
   Home.razor.css
   Pagina iniziale di Auxilium: hero + elenco studi disponibili.
   Consumer dei token Auxilium.
   ========================================================================= */

.home-page[b-urjqosx9iv] {
    min-height: 100%;
    padding: var(--ax-page-padding);
    color: var(--ax-text-1);
    background: transparent;
}

.home-shell[b-urjqosx9iv] {
    max-width: var(--ax-page-max);
    margin: 0 auto;
    display: grid;
    gap: var(--ax-space-6);
}

/* ---------- HERO ---------- */
.hero-section[b-urjqosx9iv] {
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    background: var(--ax-hero-bg);
    box-shadow: var(--ax-shadow-1);
    padding: var(--ax-space-7) var(--ax-space-7);
    overflow: hidden;
}

.hero-section-simple[b-urjqosx9iv] {
    /* variant compatta per home */
    padding: var(--ax-space-6) var(--ax-space-7);
}

.hero-content[b-urjqosx9iv] {
    display: grid;
    gap: var(--ax-space-4);
    max-width: 960px;
}

.hero-badge[b-urjqosx9iv] {
    display: inline-flex;
    align-items: center;
    gap: var(--ax-space-2);
    width: fit-content;
    padding: 6px 12px;
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-pill);
    background: var(--ax-primary-50);
    color: var(--ax-primary-700);
    font-size: var(--ax-fs-12);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.hero-badge-dot[b-urjqosx9iv] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--ax-primary-700);
    box-shadow: 0 0 0 3px var(--ax-primary-100);
}

/* Saluto personalizzato sopra il titolo (visibile solo se autenticato). */
.hero-greeting[b-urjqosx9iv] {
    margin: 0;
    font-size: var(--ax-fs-16);
    color: var(--ax-text-2);
    line-height: 1.4;
}

.hero-greeting strong[b-urjqosx9iv] {
    color: var(--ax-text-1);
    font-weight: 700;
}

.hero-title[b-urjqosx9iv] {
    margin: 0;
    font-size: clamp(var(--ax-fs-24), 2.6vw, var(--ax-fs-40));
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--ax-text-1);
    font-weight: 700;
}

.hero-description[b-urjqosx9iv] {
    margin: 0;
    color: var(--ax-text-2);
    font-size: var(--ax-fs-16);
    line-height: 1.6;
    max-width: 780px;
}

/* ---------- SEZIONI ---------- */
.section-block[b-urjqosx9iv] {
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    background: var(--ax-panel-bg);
    box-shadow: var(--ax-shadow-1);
    padding: var(--ax-space-6);
}

.section-header[b-urjqosx9iv] {
    display: grid;
    gap: var(--ax-space-1);
    margin-bottom: var(--ax-space-5);
}

.section-header h2[b-urjqosx9iv] {
    margin: 0;
    font-size: var(--ax-fs-20);
    letter-spacing: -0.01em;
    color: var(--ax-text-1);
    font-weight: 600;
}

.section-header p[b-urjqosx9iv] {
    margin: 0;
    max-width: 780px;
    color: var(--ax-text-3);
    font-size: var(--ax-fs-14);
    line-height: 1.55;
}

/* ---------- GRID STUDI ---------- */
.studi-grid[b-urjqosx9iv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(var(--ax-study-card-min), 1fr));
    gap: var(--ax-space-4);
}

/* ---------- STUDIO CARD ---------- */
.studio-card[b-urjqosx9iv] {
    background: var(--ax-card-bg);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    padding: var(--ax-space-5);
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-3);
    min-height: 220px;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
    box-shadow: none;
}

.studio-card:hover[b-urjqosx9iv] {
    border-color: var(--ax-primary-500);
    box-shadow: var(--ax-shadow-2);
    transform: translateY(-1px);
}

.studio-card-icon[b-urjqosx9iv] {
    width: 36px;
    height: 36px;
    border-radius: var(--ax-radius-sm);
    background: var(--ax-primary-100);
    color: var(--ax-primary-700);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}

.studio-card-header[b-urjqosx9iv] {
    display: grid;
    gap: 2px;
}

.studio-card-title[b-urjqosx9iv] {
    color: var(--ax-text-1);
    font-size: var(--ax-fs-16);
    line-height: 1.25;
    font-weight: 600;
    letter-spacing: -0.01em;
    margin: 0;
}

.studio-card-subtitle[b-urjqosx9iv] {
    color: var(--ax-text-3);
    font-size: var(--ax-fs-11);
    line-height: 1.2;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.studio-card-text[b-urjqosx9iv] {
    color: var(--ax-text-2);
    line-height: 1.55;
    font-size: var(--ax-fs-13);
    margin: 0;
}

.studio-card-actions[b-urjqosx9iv] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--ax-space-3);
    margin-top: auto;
    padding-top: var(--ax-space-3);
    border-top: 1px solid var(--ax-border-soft);
}

/* ---------- FOOTER ---------- */
.home-footer[b-urjqosx9iv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ax-space-4);
    padding-top: var(--ax-space-5);
    border-top: 1px solid var(--ax-border-soft);
    color: var(--ax-text-3);
    font-size: var(--ax-fs-12);
}

.home-footer-link[b-urjqosx9iv] {
    color: var(--ax-primary-700);
    text-decoration: none;
    font-weight: 500;
    transition: color 120ms ease;
}

.home-footer-link:hover[b-urjqosx9iv],
.home-footer-link:focus-visible[b-urjqosx9iv] {
    color: var(--ax-primary-800);
    text-decoration: underline;
}

.home-footer-links[b-urjqosx9iv] {
    display: inline-flex;
    gap: var(--ax-space-2);
    align-items: center;
}

.home-footer-sep[b-urjqosx9iv] {
    opacity: 0.6;
}

/* Banner disclaimer sopra il footer. */
.home-disclaimer[b-urjqosx9iv] {
    padding: var(--ax-space-3) var(--ax-space-4);
    border: 1px solid var(--ax-border-soft);
    border-left: 4px solid var(--ax-primary-700);
    border-radius: var(--ax-radius-md);
    background: var(--ax-primary-50);
    color: var(--ax-text-2);
    font-size: var(--ax-fs-12);
    line-height: 1.6;
}

.home-disclaimer a[b-urjqosx9iv] {
    color: var(--ax-primary-700);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
    margin-left: 4px;
}

/* =========================================================================
   LANDING PUBBLICA
   Hero esteso, "a chi serve", vantaggi SaaS, come funziona, roadmap, CTA.
   Le regole sono isolate sotto i nomi *-landing / target-* / benefit-* /
   flow-* / roadmap-* / cta-* per non intaccare le pagine che riusano i
   token base (.hero-section, .section-block, ecc.).
   ========================================================================= */

/* ---------- HERO (variante landing) ---------- */
.hero-section-landing[b-urjqosx9iv] {
    padding: var(--ax-space-8) var(--ax-space-7);
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 360px);
    align-items: center;
    gap: var(--ax-space-7);
}

.hero-title-accent[b-urjqosx9iv] {
    /* Arancio "warm" sulla parola chiave del titolo: guida l'occhio
       sul valore (es. "guidati") senza competere con i CTA blu. */
    color: var(--ax-highlight);
    white-space: nowrap;
}

/* Fila brand all'inizio dell'hero: logo + badge "Auxilium Engineering". */
.hero-brand-row[b-urjqosx9iv] {
    display: flex;
    align-items: center;
    gap: var(--ax-space-3);
    margin-bottom: var(--ax-space-4);
}

.hero-brand-logo[b-urjqosx9iv] {
    width: 56px;
    height: 56px;
    border-radius: var(--ax-radius-md);
    object-fit: contain;
    background: var(--ax-shell-bg);
    box-shadow: var(--ax-shadow-1);
    padding: 6px;
    border: 1px solid var(--ax-border-soft);
}

.hero-logo-stage[b-urjqosx9iv] {
    min-height: 280px;
    display: flex;
    align-items: center;
    justify-content: center;
    perspective: 900px;
    pointer-events: none;
}

.hero-logo-orbit[b-urjqosx9iv] {
    width: clamp(220px, 22vw, 320px);
    height: clamp(220px, 22vw, 320px);
    object-fit: contain;
    filter: drop-shadow(0 18px 28px rgba(11, 61, 145, 0.22));
    transform-style: preserve-3d;
    animation: auxilium-logo-settle-b-urjqosx9iv 3.6s cubic-bezier(0.08, 0.78, 0.16, 1) 180ms both;
    will-change: transform;
}

@keyframes auxilium-logo-settle-b-urjqosx9iv {
    0% {
        opacity: 0;
        transform: rotateY(-1080deg) scale(0.9);
    }

    62% {
        opacity: 1;
        transform: rotateY(-90deg) scale(1.02);
    }

    82% {
        transform: rotateY(18deg) scale(1);
    }

    100% {
        opacity: 1;
        transform: rotateY(0deg) scale(1);
    }
}

/* Lista delle "capability" (cosa puoi fare / strumento online): bullet warm
   in arancio per agganciare l'occhio sull'enumerazione, niente card pesanti. */
.capabilities-list[b-urjqosx9iv] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-3);
}

.capability-item[b-urjqosx9iv] {
    display: flex;
    align-items: flex-start;
    gap: var(--ax-space-3);
    padding: var(--ax-space-3) var(--ax-space-4);
    background: var(--ax-card-bg);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-md);
    color: var(--ax-text-2);
    line-height: 1.55;
}

.capability-bullet[b-urjqosx9iv] {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    margin-top: 8px;
    border-radius: 50%;
    background: var(--ax-highlight);
    box-shadow: 0 0 0 3px var(--ax-highlight-soft);
}

/* Lista dei ruoli ("Per chi è pensato"): formato discreto, in linea, NON
   schede descrittive. L'idea è che chi si riconosce in un ruolo lo trovi
   subito senza dover leggere paragrafi marketing. */
.role-list[b-urjqosx9iv] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--ax-space-2) var(--ax-space-3);
}

.role-list li[b-urjqosx9iv] {
    padding: var(--ax-space-2) var(--ax-space-4);
    background: var(--ax-highlight-soft);
    color: var(--ax-highlight-strong);
    border-radius: var(--ax-radius-pill);
    font-size: var(--ax-fs-13);
    font-weight: 500;
    border: 1px solid color-mix(in srgb, var(--ax-highlight) 25%, transparent);
}

.section-footer-note[b-urjqosx9iv] {
    margin: var(--ax-space-5) 0 0 0;
    color: var(--ax-text-3);
    font-size: var(--ax-fs-13);
    font-style: italic;
}

/* Riga di sottotitolo sotto all'h1 principale (es. "HVAC, idrici, antincendio").
   Più leggera per non competere con l'accent, ma sempre dentro l'h1 per SEO. */
.hero-title-sub[b-urjqosx9iv] {
    display: block;
    margin-top: var(--ax-space-2);
    font-size: clamp(var(--ax-fs-18), 1.6vw, var(--ax-fs-24));
    font-weight: 500;
    color: var(--ax-text-2);
    letter-spacing: -0.005em;
    line-height: 1.25;
}

.hero-cta-row[b-urjqosx9iv] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ax-space-3);
    margin-top: var(--ax-space-3);
}

.hero-cta-primary[b-urjqosx9iv],
.hero-cta-secondary[b-urjqosx9iv] {
    min-width: 220px;
    justify-content: center;
}

.hero-meta-list[b-urjqosx9iv] {
    list-style: none;
    margin: var(--ax-space-4) 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--ax-space-4);
    color: var(--ax-text-2);
    font-size: var(--ax-fs-13);
}

.hero-meta-list li[b-urjqosx9iv] {
    display: inline-flex;
    align-items: center;
    gap: var(--ax-space-2);
}

.hero-meta-dot[b-urjqosx9iv] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--ax-primary-700);
    flex-shrink: 0;
}

/* ---------- A CHI SERVE ---------- */
.target-grid[b-urjqosx9iv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: var(--ax-space-4);
}

.target-card[b-urjqosx9iv] {
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-md);
    background: var(--ax-card-bg);
    padding: var(--ax-space-4);
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-2);
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.target-card:hover[b-urjqosx9iv] {
    border-color: var(--ax-primary-500);
    box-shadow: var(--ax-shadow-2);
}

.target-card-title[b-urjqosx9iv] {
    margin: 0;
    color: var(--ax-text-1);
    font-size: var(--ax-fs-15);
    font-weight: 600;
    line-height: 1.3;
}

.target-card-text[b-urjqosx9iv] {
    margin: 0;
    color: var(--ax-text-2);
    font-size: var(--ax-fs-13);
    line-height: 1.55;
}

.target-card-text strong[b-urjqosx9iv] {
    color: var(--ax-text-1);
    font-weight: 600;
}

/* ---------- VANTAGGI SAAS ---------- */
.benefit-grid[b-urjqosx9iv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: var(--ax-space-4);
}

.benefit-card[b-urjqosx9iv] {
    border: 1px solid var(--ax-border-soft);
    border-left: 3px solid var(--ax-primary-500);
    border-radius: var(--ax-radius-md);
    background: var(--ax-card-bg);
    padding: var(--ax-space-4);
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-2);
}

.benefit-card-title[b-urjqosx9iv] {
    margin: 0;
    color: var(--ax-text-1);
    font-size: var(--ax-fs-15);
    font-weight: 600;
    letter-spacing: -0.005em;
}

.benefit-card-text[b-urjqosx9iv] {
    margin: 0;
    color: var(--ax-text-2);
    font-size: var(--ax-fs-13);
    line-height: 1.55;
}

.benefit-card-text strong[b-urjqosx9iv] {
    color: var(--ax-text-1);
    font-weight: 600;
}

/* ---------- COME FUNZIONA ---------- */
.flow-steps[b-urjqosx9iv] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: var(--ax-space-4);
    counter-reset: flow-counter;
}

.flow-step[b-urjqosx9iv] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--ax-space-4);
    align-items: flex-start;
    padding: var(--ax-space-4);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-md);
    background: var(--ax-card-bg);
}

.flow-step-index[b-urjqosx9iv] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--ax-primary-700);
    color: #fff;
    font-weight: 700;
    font-size: var(--ax-fs-16);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.flow-step-body[b-urjqosx9iv] {
    display: grid;
    gap: 4px;
}

.flow-step-title[b-urjqosx9iv] {
    color: var(--ax-text-1);
    font-size: var(--ax-fs-15);
    font-weight: 600;
    line-height: 1.3;
}

.flow-step-text[b-urjqosx9iv] {
    margin: 0;
    color: var(--ax-text-2);
    font-size: var(--ax-fs-13);
    line-height: 1.55;
}

/* ---------- ROADMAP (in preparazione) ---------- */
.roadmap-block[b-urjqosx9iv] {
    margin-top: var(--ax-space-6);
    padding-top: var(--ax-space-5);
    border-top: 1px dashed var(--ax-border-soft);
}

.roadmap-header[b-urjqosx9iv] {
    display: grid;
    gap: 4px;
    margin-bottom: var(--ax-space-4);
}

.roadmap-header h3[b-urjqosx9iv] {
    margin: 0;
    color: var(--ax-text-1);
    font-size: var(--ax-fs-16);
    font-weight: 600;
    letter-spacing: -0.005em;
}

.roadmap-header p[b-urjqosx9iv] {
    margin: 0;
    color: var(--ax-text-3);
    font-size: var(--ax-fs-13);
    line-height: 1.55;
}

.roadmap-grid[b-urjqosx9iv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: var(--ax-space-3);
}

.roadmap-card[b-urjqosx9iv] {
    position: relative;
    padding: var(--ax-space-4);
    border: 1px dashed var(--ax-border-soft);
    border-radius: var(--ax-radius-md);
    background: var(--ax-hero-bg);
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--ax-space-3);
    align-items: flex-start;
    opacity: 0.82;
}

.roadmap-card-icon[b-urjqosx9iv] {
    width: 28px;
    height: 28px;
    border-radius: var(--ax-radius-sm);
    background: var(--ax-primary-50);
    color: var(--ax-text-3);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    grid-row: 1 / span 2;
}

.roadmap-card-title[b-urjqosx9iv] {
    color: var(--ax-text-1);
    font-size: var(--ax-fs-14);
    font-weight: 600;
    line-height: 1.3;
}

.roadmap-card-text[b-urjqosx9iv] {
    color: var(--ax-text-3);
    font-size: var(--ax-fs-12);
    line-height: 1.5;
}

/* ---------- CTA FINALE ---------- */
.cta-block[b-urjqosx9iv] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--ax-space-4);
    padding: var(--ax-space-6);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    background: var(--ax-primary-50);
    box-shadow: var(--ax-shadow-1);
}

.cta-content[b-urjqosx9iv] {
    display: grid;
    gap: 6px;
    max-width: 640px;
}

.cta-title[b-urjqosx9iv] {
    margin: 0;
    color: var(--ax-text-1);
    font-size: var(--ax-fs-20);
    font-weight: 700;
    letter-spacing: -0.01em;
}

.cta-text[b-urjqosx9iv] {
    margin: 0;
    color: var(--ax-text-2);
    font-size: var(--ax-fs-14);
    line-height: 1.55;
}

.cta-actions[b-urjqosx9iv] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ax-space-3);
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 960px) {
    .home-footer[b-urjqosx9iv] {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--ax-space-2);
    }

    .cta-block[b-urjqosx9iv] {
        flex-direction: column;
        align-items: stretch;
    }

    .cta-actions[b-urjqosx9iv] {
        justify-content: flex-start;
    }
}

@media (max-width: 767px) {
    .hero-section[b-urjqosx9iv] {
        padding: var(--ax-space-5);
    }

    .hero-section-landing[b-urjqosx9iv] {
        padding: var(--ax-space-6) var(--ax-space-5);
        grid-template-columns: 1fr;
    }

    .hero-logo-stage[b-urjqosx9iv] {
        display: none;
    }

    .hero-title-accent[b-urjqosx9iv] {
        white-space: normal;
    }

    .hero-cta-primary[b-urjqosx9iv],
    .hero-cta-secondary[b-urjqosx9iv] {
        min-width: 0;
        width: 100%;
    }

    .section-block[b-urjqosx9iv] {
        padding: var(--ax-space-4);
    }

    .studi-grid[b-urjqosx9iv],
    .target-grid[b-urjqosx9iv],
    .benefit-grid[b-urjqosx9iv],
    .roadmap-grid[b-urjqosx9iv] {
        grid-template-columns: 1fr;
    }

    .flow-step[b-urjqosx9iv] {
        grid-template-columns: 1fr;
        gap: var(--ax-space-2);
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero-logo-orbit[b-urjqosx9iv] {
        animation: none;
    }
}
/* /Components/Pages/PaginaStudi.razor.rz.scp.css */
/* =========================================================================
   PaginaStudi.razor.css
   Elenco completo degli studi disponibili con descrizione estesa e meta.
   Consumer dei token Auxilium.
   ========================================================================= */

.studi-page[b-m9teb8232i] {
    min-height: 100%;
    padding: var(--ax-page-padding);
    color: var(--ax-text-1);
    background: transparent;
}

.studi-shell[b-m9teb8232i] {
    max-width: var(--ax-page-max);
    margin: 0 auto;
    display: grid;
    gap: var(--ax-space-6);
}

/* ---------- HERO ---------- */
.hero-section[b-m9teb8232i] {
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    background: var(--ax-hero-bg);
    box-shadow: var(--ax-shadow-1);
    padding: var(--ax-space-7) var(--ax-space-7);
    overflow: hidden;
}

.hero-content[b-m9teb8232i] {
    display: grid;
    gap: var(--ax-space-4);
    max-width: 960px;
}

.hero-badge[b-m9teb8232i] {
    display: inline-flex;
    align-items: center;
    gap: var(--ax-space-2);
    width: fit-content;
    padding: 6px 12px;
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-pill);
    background: var(--ax-primary-50);
    color: var(--ax-primary-700);
    font-size: var(--ax-fs-12);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.hero-badge-dot[b-m9teb8232i] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--ax-primary-700);
    box-shadow: 0 0 0 3px var(--ax-primary-100);
}

.hero-title[b-m9teb8232i] {
    margin: 0;
    font-size: clamp(var(--ax-fs-24), 2.6vw, var(--ax-fs-40));
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--ax-text-1);
    font-weight: 700;
}

.hero-description[b-m9teb8232i] {
    margin: 0;
    color: var(--ax-text-2);
    font-size: var(--ax-fs-16);
    line-height: 1.6;
    max-width: 780px;
}

/* ---------- SEZIONI ---------- */
.section-block[b-m9teb8232i] {
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    background: var(--ax-panel-bg);
    box-shadow: var(--ax-shadow-1);
    padding: var(--ax-space-6);
}

.section-header[b-m9teb8232i] {
    display: grid;
    gap: var(--ax-space-1);
    margin-bottom: var(--ax-space-5);
}

.section-header h2[b-m9teb8232i] {
    margin: 0;
    font-size: var(--ax-fs-20);
    letter-spacing: -0.01em;
    color: var(--ax-text-1);
    font-weight: 600;
}

.section-header p[b-m9teb8232i] {
    margin: 0;
    max-width: 780px;
    color: var(--ax-text-3);
    font-size: var(--ax-fs-14);
    line-height: 1.55;
}

/* ---------- GRID STUDI ---------- */
.studi-grid[b-m9teb8232i] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(var(--ax-study-card-min), 1fr));
    gap: var(--ax-space-4);
}

/* ---------- STUDIO CARD ---------- */
.studio-card[b-m9teb8232i] {
    background: var(--ax-card-bg);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    padding: var(--ax-space-5);
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-3);
    min-height: 260px;
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
    box-shadow: none;
}

.studio-card:hover[b-m9teb8232i] {
    border-color: var(--ax-primary-500);
    box-shadow: var(--ax-shadow-2);
    transform: translateY(-1px);
}

.studio-card-disabled[b-m9teb8232i] {
    opacity: 0.70;
}

.studio-card-disabled:hover[b-m9teb8232i] {
    border-color: var(--ax-border-soft);
    box-shadow: none;
    transform: none;
}

.studio-card-header[b-m9teb8232i] {
    display: grid;
    gap: 2px;
}

.studio-card-title[b-m9teb8232i] {
    color: var(--ax-text-1);
    font-size: var(--ax-fs-16);
    line-height: 1.25;
    font-weight: 600;
    letter-spacing: -0.01em;
    margin: 0;
}

.studio-card-subtitle[b-m9teb8232i] {
    color: var(--ax-text-3);
    font-size: var(--ax-fs-11);
    line-height: 1.2;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.studio-card-body[b-m9teb8232i] {
    display: grid;
    gap: var(--ax-space-3);
}

.studio-card-text[b-m9teb8232i] {
    color: var(--ax-text-2);
    line-height: 1.55;
    font-size: var(--ax-fs-13);
    margin: 0;
}

/* ---------- META ITEM ---------- */
.studio-card-meta[b-m9teb8232i] {
    display: grid;
    gap: var(--ax-space-2);
}

.studio-meta-item[b-m9teb8232i] {
    display: grid;
    gap: 2px;
    padding: 8px 10px;
    border-radius: var(--ax-radius-sm);
    background: var(--ax-panel-bg-soft);
    border: 1px solid var(--ax-border-soft);
}

.studio-meta-label[b-m9teb8232i] {
    color: var(--ax-text-3);
    font-size: var(--ax-fs-11);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 600;
}

.studio-meta-value[b-m9teb8232i] {
    color: var(--ax-text-1);
    font-size: var(--ax-fs-13);
    font-family: var(--ax-font-mono);
    font-weight: 500;
}

/* ---------- AZIONI ---------- */
.studio-card-actions[b-m9teb8232i] {
    display: flex;
    align-items: center;
    gap: var(--ax-space-3);
    margin-top: auto;
    padding-top: var(--ax-space-3);
    border-top: 1px solid var(--ax-border-soft);
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 767px) {
    .studi-page[b-m9teb8232i] {
        padding: var(--ax-page-padding);
    }

    .hero-section[b-m9teb8232i] {
        padding: var(--ax-space-5);
    }

    .section-block[b-m9teb8232i] {
        padding: var(--ax-space-4);
    }

    .studi-grid[b-m9teb8232i] {
        grid-template-columns: 1fr;
    }
}

/* =========================================================================
   STUDIO SOSPESO (lista /studi)
   Stato visivo della card quando l'admin ha sospeso il modulo da
   /admin/sospensioni. Bordo warm + sfondo soft per dare evidenza, badge
   "Sospeso" in alto a destra e azione disabilitata in fondo.
   ========================================================================= */
.studio-card-sospeso[b-m9teb8232i] {
    border-color: color-mix(in srgb, var(--ax-highlight) 40%, transparent);
    background: var(--ax-highlight-soft);
    color: var(--ax-gray-900);
}

.studio-card-sospeso .studio-card-header[b-m9teb8232i] {
    position: relative;
}

.studio-card-sospeso .studio-card-title[b-m9teb8232i] {
    color: var(--ax-gray-900);
}

.studio-card-sospeso .studio-card-subtitle[b-m9teb8232i],
.studio-card-sospeso .studio-card-text[b-m9teb8232i] {
    color: var(--ax-gray-700);
}

.studio-card-badge-sospeso[b-m9teb8232i] {
    position: absolute;
    top: 0;
    right: 0;
    padding: 2px 10px;
    font-size: var(--ax-fs-11);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 600;
    color: var(--ax-highlight-on);
    background: var(--ax-highlight);
    border-radius: var(--ax-radius-pill);
}

.studio-card-sospeso-msg[b-m9teb8232i] {
    margin-top: var(--ax-space-3);
    padding: var(--ax-space-3) var(--ax-space-4);
    background: rgba(255, 255, 255, 0.5);
    border: 1px dashed color-mix(in srgb, var(--ax-highlight) 40%, transparent);
    border-radius: var(--ax-radius-sm);
    color: var(--ax-gray-700);
    font-size: var(--ax-fs-13);
    line-height: 1.55;
    white-space: pre-line;
}
/* /Components/Pages/Progetti/Progetti.razor.rz.scp.css */
/* =========================================================================
   Progetti.razor.css
   Stili scoped per la pagina /progetti (lista + form inline di crea/modifica).
   I blocchi visivi più generici (admin-card, admin-table, area-page,
   area-form-grid) vengono dal CSS globale; qui aggiungiamo solo i dettagli
   specifici del CRUD progetti.
   ========================================================================= */

/* Form inline di creazione / modifica sopra la tabella. */
.progetti-form[b-gttx9vsxms] {
    margin: var(--ax-space-4) 0 var(--ax-space-5);
    padding: var(--ax-space-4) var(--ax-space-5);
    background: var(--ax-panel-bg-soft);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-md);
}

.progetti-form-title[b-gttx9vsxms] {
    margin: 0 0 var(--ax-space-3);
    font-size: var(--ax-fs-14);
    font-weight: 600;
    color: var(--ax-text-1);
    letter-spacing: 0.01em;
    text-transform: uppercase;
}

/* Textarea descrittiva: altezza leggermente maggiore dell'input standard. */
.progetti-textarea[b-gttx9vsxms] {
    min-height: 88px;
    resize: vertical;
    line-height: 1.5;
}

/* Colonna descrizione della tabella: limita larghezza e taglia le righe
   lunghe con ellissi su un massimo di 2 righe. */
.progetti-descrizione[b-gttx9vsxms] {
    max-width: 360px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}
/* /Components/Pages/Studi/ApplicazioneNorma.razor.rz.scp.css */
.applicazione-norma-page[b-231eujqjoh] {
    gap: var(--ax-space-5);
}

.applicazione-norma-panel[b-231eujqjoh] {
    background: var(--ax-panel-bg);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-md);
    box-shadow: var(--ax-shadow-1);
    padding: var(--ax-space-5);
    min-width: 0;
}

.applicazione-norma-panel-header[b-231eujqjoh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--ax-space-4);
    margin-bottom: var(--ax-space-4);
}

.applicazione-norma-panel-header h2[b-231eujqjoh] {
    margin: 0;
    color: var(--ax-text-1);
    font-size: var(--ax-fs-18);
    font-weight: 600;
}

.applicazione-norma-panel-header p[b-231eujqjoh] {
    margin: var(--ax-space-1) 0 0;
    color: var(--ax-text-3);
    font-size: var(--ax-fs-13);
    line-height: 1.5;
}

.applicazione-norma-panel-header span[b-231eujqjoh] {
    color: var(--ax-text-3);
    font-size: var(--ax-fs-13);
    white-space: nowrap;
}

.applicazione-norma-alert[b-231eujqjoh] {
    background: var(--ax-danger-bg);
    border: 1px solid var(--ax-danger-border);
    color: var(--ax-danger-strong);
    border-radius: var(--ax-radius-sm);
    padding: var(--ax-space-3) var(--ax-space-4);
    font-size: var(--ax-fs-13);
}

.applicazione-norma-muted[b-231eujqjoh] {
    margin: 0;
    color: var(--ax-text-3);
    font-size: var(--ax-fs-13);
}

.applicazione-norma-table-wrap[b-231eujqjoh] {
    overflow-x: auto;
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-md);
}

.applicazione-norma-table[b-231eujqjoh] {
    width: 100%;
    border-collapse: collapse;
    min-width: 760px;
    font-size: var(--ax-fs-13);
}

.applicazione-norma-table th[b-231eujqjoh] {
    text-align: left;
    padding: var(--ax-space-3) var(--ax-space-4);
    background: var(--ax-panel-bg-soft);
    border-bottom: 1px solid var(--ax-border-soft);
    color: var(--ax-text-3);
    font-size: var(--ax-fs-12);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.applicazione-norma-table td[b-231eujqjoh] {
    padding: var(--ax-space-3) var(--ax-space-4);
    border-bottom: 1px solid var(--ax-border-soft);
    color: var(--ax-text-1);
    vertical-align: middle;
}

.applicazione-norma-table tr:last-child td[b-231eujqjoh] {
    border-bottom: none;
}

.applicazione-norma-table td:first-child[b-231eujqjoh] {
    min-width: 220px;
}

.applicazione-norma-table td:first-child span[b-231eujqjoh] {
    display: block;
    margin-top: 4px;
    color: var(--ax-text-3);
    font-size: var(--ax-fs-12);
}

.applicazione-norma-actions[b-231eujqjoh] {
    text-align: right;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .applicazione-norma-panel[b-231eujqjoh] {
        padding: var(--ax-space-4);
    }

    .applicazione-norma-panel-header[b-231eujqjoh] {
        flex-direction: column;
        gap: var(--ax-space-2);
    }
}
/* /Components/Pages/Studi/ConversioneGas.razor.rz.scp.css */
/* =========================================================================
   ConversioneGas.razor.css
   Pagina studio "Conversione gas Nm³/Sm³".
   Stessa impalcatura visiva di EnergiaClimatizzazione: i selettori sono
   scoped alla component, quindi non c'è conflitto. Aggiunge una
   variante .input-editor-wide per le dropdown senza unità di misura.
   ========================================================================= */

.studio-page[b-xiiizh4cfa] {
    min-height: 100%;
    padding: var(--ax-page-padding);
    color: var(--ax-text-1);
    background: transparent;
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-6);
    max-width: var(--ax-page-max);
    margin: 0 auto;
    width: 100%;
}

/* =========================================================================
   HERO
   ========================================================================= */
.studio-hero[b-xiiizh4cfa] {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.85fr);
    gap: var(--ax-space-6);
    align-items: start;
    padding: var(--ax-space-6) var(--ax-space-7);
    border-radius: var(--ax-radius-lg);
    background: linear-gradient(135deg, var(--ax-primary-900) 0%, var(--ax-primary-800) 60%, var(--ax-primary-700) 100%);
    box-shadow: var(--ax-shadow-2);
    border: 1px solid var(--ax-primary-800);
    color: #ffffff;
}

.studio-breadcrumb[b-xiiizh4cfa] {
    font-size: var(--ax-fs-12);
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: var(--ax-space-2);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
}

.studio-title[b-xiiizh4cfa] {
    margin: 0;
    font-size: clamp(var(--ax-fs-24), 2.6vw, var(--ax-fs-40));
    line-height: 1.12;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: -0.02em;
}

.studio-subtitle[b-xiiizh4cfa] {
    margin: var(--ax-space-3) 0 0 0;
    max-width: 52rem;
    font-size: var(--ax-fs-14);
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.85);
}

.studio-hero-right[b-xiiizh4cfa] {
    display: flex;
    justify-content: flex-end;
}

.studio-meta-card[b-xiiizh4cfa] {
    width: 100%;
    max-width: 22rem;
    padding: var(--ax-space-4);
    border-radius: var(--ax-radius-md);
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(6px);
}

.studio-meta-row + .studio-meta-row[b-xiiizh4cfa] {
    margin-top: var(--ax-space-3);
}

.studio-meta-label[b-xiiizh4cfa] {
    display: block;
    font-size: var(--ax-fs-11);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(255, 255, 255, 0.65);
    margin-bottom: 2px;
    font-weight: 600;
}

.studio-meta-value[b-xiiizh4cfa] {
    display: block;
    font-size: var(--ax-fs-14);
    font-weight: 600;
    color: #ffffff;
}

/* =========================================================================
   AZIONI TOOLBAR (Calcola / Reset / Copia relazione)
   ========================================================================= */
.studio-actions[b-xiiizh4cfa] {
    display: flex;
    gap: var(--ax-space-3);
    flex-wrap: wrap;
}

.studio-button[b-xiiizh4cfa] {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--ax-space-2);
    min-height: 38px;
    padding: 8px 16px;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-strong);
    background: var(--ax-gray-0);
    color: var(--ax-text-2);
    font-family: var(--ax-font-sans);
    font-size: var(--ax-fs-13);
    font-weight: 500;
    line-height: 1.2;
    cursor: pointer;
    transition: background 120ms ease, border-color 120ms ease, color 120ms ease, box-shadow 120ms ease;
}

.studio-button:hover:not(:disabled)[b-xiiizh4cfa] {
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-1);
    border-color: var(--ax-primary-500);
}

.studio-button:focus-visible[b-xiiizh4cfa] {
    outline: none;
    box-shadow: var(--ax-shadow-focus);
}

.studio-button-primary[b-xiiizh4cfa] {
    background: var(--ax-primary-700);
    color: var(--ax-text-on-primary);
    border-color: var(--ax-primary-700);
}

.studio-button-primary:hover:not(:disabled)[b-xiiizh4cfa] {
    background: var(--ax-primary-800);
    border-color: var(--ax-primary-800);
    color: var(--ax-text-on-primary);
}

.studio-button-secondary[b-xiiizh4cfa] {
    background: var(--ax-gray-0);
    color: var(--ax-text-2);
    border-color: var(--ax-border-strong);
}

/* =========================================================================
   DIALOG SALVATAGGIO STUDIO
   ========================================================================= */
.studio-dialog-backdrop[b-xiiizh4cfa] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    z-index: 40;
}

.studio-dialog[b-xiiizh4cfa] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(92vw, 480px);
    background: var(--ax-panel-bg);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    box-shadow: var(--ax-shadow-2, 0 12px 32px rgba(15, 23, 42, 0.22));
    padding: var(--ax-space-5);
    z-index: 50;
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-4);
}

.studio-dialog-header[b-xiiizh4cfa] {
    border-bottom: 1px solid var(--ax-border-soft);
    padding-bottom: var(--ax-space-3);
}

.studio-dialog-title[b-xiiizh4cfa] {
    margin: 0;
    font-size: var(--ax-fs-16);
    font-weight: 600;
    color: var(--ax-text-1);
}

.studio-dialog-body[b-xiiizh4cfa] {
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-3);
}

.studio-dialog-field[b-xiiizh4cfa] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.studio-dialog-field > span[b-xiiizh4cfa] {
    font-size: var(--ax-fs-11);
    font-weight: 600;
    color: var(--ax-text-3);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.studio-dialog-hint[b-xiiizh4cfa] {
    margin: 0;
    font-size: var(--ax-fs-12);
    color: var(--ax-text-3);
    line-height: 1.4;
}

.studio-dialog-actions[b-xiiizh4cfa] {
    display: flex;
    justify-content: flex-end;
    gap: var(--ax-space-2);
    border-top: 1px solid var(--ax-border-soft);
    padding-top: var(--ax-space-3);
}

/* =========================================================================
   GRID INPUT + RISULTATI
   ========================================================================= */
.studio-grid[b-xiiizh4cfa] {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.9fr);
    gap: var(--ax-space-5);
}

/* =========================================================================
   PANEL CARD (input, risultati, relazione)
   ========================================================================= */
.panel-card[b-xiiizh4cfa] {
    position: relative;
    border-radius: var(--ax-radius-lg);
    padding: var(--ax-space-5);
    background: var(--ax-panel-bg);
    border: 1px solid var(--ax-border-soft);
    box-shadow: var(--ax-shadow-1);
}

.panel-header[b-xiiizh4cfa] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--ax-space-4);
    margin-bottom: var(--ax-space-4);
    padding-bottom: var(--ax-space-3);
    border-bottom: 1px solid var(--ax-border-soft);
}

.panel-title-wrap[b-xiiizh4cfa] {
    display: flex;
    align-items: flex-start;
    gap: var(--ax-space-3);
    min-width: 0;
}

.panel-title-accent[b-xiiizh4cfa] {
    width: 3px;
    min-width: 3px;
    height: 1.2rem;
    margin-top: 4px;
    border-radius: var(--ax-radius-pill);
    background: var(--ax-primary-700);
}

.panel-title[b-xiiizh4cfa] {
    margin: 0;
    font-size: var(--ax-fs-18);
    line-height: 1.2;
    font-weight: 600;
    color: var(--ax-text-1);
    letter-spacing: -0.01em;
}

.panel-subtitle[b-xiiizh4cfa] {
    margin-top: 4px;
    font-size: var(--ax-fs-13);
    line-height: 1.45;
    color: var(--ax-text-3);
}

.panel-header-dots[b-xiiizh4cfa] {
    font-size: var(--ax-fs-18);
    line-height: 1;
    font-weight: 700;
    color: var(--ax-text-3);
    padding-top: 2px;
    cursor: pointer;
    user-select: none;
}

.panel-body[b-xiiizh4cfa] {
    min-width: 0;
}

/* =========================================================================
   LISTA INPUT
   ========================================================================= */
.input-list[b-xiiizh4cfa] {
    display: flex;
    flex-direction: column;
}

.input-row[b-xiiizh4cfa] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(230px, 300px);
    gap: var(--ax-space-4);
    align-items: center;
    padding: var(--ax-space-3) 0;
    border-bottom: 1px solid var(--ax-border-soft);
}

.input-row:last-child[b-xiiizh4cfa] {
    border-bottom: none;
}

.input-name[b-xiiizh4cfa] {
    font-size: var(--ax-fs-14);
    font-weight: 600;
    color: var(--ax-text-1);
}

.input-description[b-xiiizh4cfa] {
    margin-top: 2px;
    font-size: var(--ax-fs-12);
    line-height: 1.45;
    color: var(--ax-text-3);
}

.input-editor[b-xiiizh4cfa] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 6.2rem;
    gap: var(--ax-space-2);
}

/* Variante "wide": usata per i select Gas e Tipo grandezza che non
   hanno la colonna unità di misura a destra e occupano tutta la
   larghezza del riquadro editor. */
.input-editor-wide[b-xiiizh4cfa] {
    grid-template-columns: minmax(0, 1fr);
}

/* Separatore di sezione usato fra i blocchi "Stato di partenza (A)"
   e "Stato di arrivo (B)" per guidare visivamente l'utente sulla
   natura bidirezionale della conversione. */
.input-section-divider[b-xiiizh4cfa] {
    display: flex;
    align-items: center;
    gap: var(--ax-space-3);
    margin-top: var(--ax-space-3);
    padding: var(--ax-space-2) 0 6px 0;
    font-size: var(--ax-fs-11);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ax-primary-700);
    border-bottom: 1px solid var(--ax-border-soft);
}

/* Stato "disabilitato" degli input quando lo stato selezionato è NTP / STP:
   i campi P e T mostrano i valori definitorii ma non sono modificabili. */
.input-field:disabled[b-xiiizh4cfa] {
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-3);
    cursor: not-allowed;
    opacity: 0.85;
}

.input-field[b-xiiizh4cfa] {
    box-sizing: border-box;
    width: 100%;
    min-height: 38px;
    padding: 8px 12px;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-input-border);
    background: var(--ax-input-bg);
    color: var(--ax-input-text);
    font-family: var(--ax-font-mono);
    font-size: var(--ax-fs-14);
    font-variant-numeric: tabular-nums;
    outline: none;
    transition: border-color 120ms ease, box-shadow 120ms ease;
}

.input-field:focus[b-xiiizh4cfa] {
    border-color: var(--ax-input-border-focus);
    box-shadow: var(--ax-shadow-focus);
}

.input-unit[b-xiiizh4cfa] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 8px 12px;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-soft);
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-2);
    font-family: var(--ax-font-mono);
    font-size: var(--ax-fs-13);
    font-weight: 500;
}

/* =========================================================================
   RISULTATI
   ========================================================================= */
.result-message[b-xiiizh4cfa] {
    border-radius: var(--ax-radius-md);
    padding: var(--ax-space-4);
    background: var(--ax-info-bg);
    border: 1px solid var(--ax-info-border);
    color: var(--ax-info-strong);
}

.result-message-error[b-xiiizh4cfa] {
    background: var(--ax-danger-bg);
    border-color: var(--ax-danger-border);
    color: var(--ax-danger-strong);
}

.result-message-title[b-xiiizh4cfa] {
    font-size: var(--ax-fs-14);
    font-weight: 600;
    margin-bottom: 4px;
}

.result-message-text[b-xiiizh4cfa] {
    font-size: var(--ax-fs-13);
    line-height: 1.5;
    color: var(--ax-text-2);
}

.result-message-error .result-message-text[b-xiiizh4cfa] {
    color: var(--ax-danger-strong);
}

.result-grid[b-xiiizh4cfa] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ax-space-3);
}

.result-card[b-xiiizh4cfa] {
    border-radius: var(--ax-radius-md);
    padding: var(--ax-space-4);
    background: var(--ax-card-bg-soft);
    border: 1px solid var(--ax-border-soft);
}

.result-title[b-xiiizh4cfa] {
    font-size: var(--ax-fs-13);
    font-weight: 600;
    color: var(--ax-text-2);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.result-description[b-xiiizh4cfa] {
    margin-top: 4px;
    font-size: var(--ax-fs-12);
    line-height: 1.45;
    color: var(--ax-text-3);
    min-height: 2.4rem;
}

.result-value-row[b-xiiizh4cfa] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 4.5rem;
    gap: var(--ax-space-2);
    margin-top: var(--ax-space-3);
}

.result-value[b-xiiizh4cfa],
.result-unit[b-xiiizh4cfa] {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-soft);
    /* --ax-input-bg è tematizzato (bianco in light, #171d26 in dark):
       evita l'effetto "bianco su bianco" in dark theme che invece si
       verificherebbe usando direttamente --ax-gray-0. */
    background: var(--ax-input-bg);
    color: var(--ax-text-1);
    min-height: 38px;
    padding: 8px 12px;
    font-family: var(--ax-font-mono);
    font-size: var(--ax-fs-14);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.result-unit[b-xiiizh4cfa] {
    justify-content: center;
    color: var(--ax-text-2);
    background: var(--ax-panel-bg-soft);
    font-weight: 500;
    font-size: var(--ax-fs-12);
}

/* =========================================================================
   RELAZIONE - menu e feedback
   ========================================================================= */
.relazione-card[b-xiiizh4cfa] {
    overflow: visible;
}

.menu-relazione-wrap[b-xiiizh4cfa] {
    position: relative;
    flex: 0 0 auto;
}

.menu-relazione-toggle[b-xiiizh4cfa] {
    appearance: none;
    min-width: 38px;
    height: 32px;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-strong);
    background: var(--ax-gray-0);
    color: var(--ax-text-2);
    font-size: var(--ax-fs-16);
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}

.menu-relazione-toggle:hover[b-xiiizh4cfa] {
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-1);
    border-color: var(--ax-primary-500);
}

.menu-relazione-overlay[b-xiiizh4cfa] {
    position: fixed;
    inset: 0;
    border: none;
    background: transparent;
    z-index: 70;
}

.menu-relazione-popup[b-xiiizh4cfa] {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 14rem;
    padding: var(--ax-space-1);
    border-radius: var(--ax-radius-md);
    background: var(--ax-panel-bg);
    border: 1px solid var(--ax-border-soft);
    box-shadow: var(--ax-shadow-3);
    z-index: 71;
}

.menu-relazione-item[b-xiiizh4cfa] {
    width: 100%;
    appearance: none;
    border: none;
    background: transparent;
    color: var(--ax-text-1);
    text-align: left;
    padding: 10px 12px;
    border-radius: var(--ax-radius-sm);
    font-size: var(--ax-fs-13);
    font-weight: 500;
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease;
}

.menu-relazione-item:hover:not(:disabled)[b-xiiizh4cfa] {
    background: var(--ax-primary-50);
    color: var(--ax-primary-700);
}

.menu-relazione-item:disabled[b-xiiizh4cfa] {
    opacity: 0.45;
    cursor: default;
    color: var(--ax-text-4);
}

/* =========================================================================
   FEEDBACK RELAZIONE
   ========================================================================= */
.relazione-feedback[b-xiiizh4cfa],
.relazione-empty[b-xiiizh4cfa] {
    border-radius: var(--ax-radius-md);
    padding: var(--ax-space-4);
    font-size: var(--ax-fs-13);
    line-height: 1.5;
}

.relazione-feedback-success[b-xiiizh4cfa] {
    margin-bottom: var(--ax-space-3);
    background: var(--ax-success-bg);
    border: 1px solid var(--ax-success-border);
    color: var(--ax-success-strong);
}

.relazione-feedback-error[b-xiiizh4cfa] {
    margin-bottom: var(--ax-space-3);
    background: var(--ax-danger-bg);
    border: 1px solid var(--ax-danger-border);
    color: var(--ax-danger-strong);
}

.relazione-empty[b-xiiizh4cfa] {
    background: var(--ax-panel-bg-soft);
    border: 1px solid var(--ax-border-soft);
    color: var(--ax-text-3);
    text-align: center;
}

/* =========================================================================
   DOCUMENTO RELAZIONE TECNICA (paper look)
   ========================================================================= */
.relazione-documento[b-xiiizh4cfa] {
    position: relative;
    overflow: hidden;
    border-radius: var(--ax-radius-md);
    border: 1px solid var(--ax-paper-border);
    background: var(--ax-paper-bg);
    color: var(--ax-paper-text);
    box-shadow: var(--ax-shadow-1);
}

.relazione-documento[b-xiiizh4cfa]::before {
    content: "Auxilium Engineering";
    position: absolute;
    top: 48%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-28deg);
    font-size: 3.5rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: rgba(11, 61, 145, 0.04);
    white-space: nowrap;
    pointer-events: none;
    font-family: var(--ax-font-sans);
}

.relazione-contenuto[b-xiiizh4cfa] {
    position: relative;
    z-index: 1;
    padding: var(--ax-space-6) var(--ax-space-6);
}

.relazione-heading[b-xiiizh4cfa] {
    padding-bottom: var(--ax-space-4);
    margin-bottom: var(--ax-space-4);
    border-bottom: 1px solid var(--ax-paper-border);
}

.relazione-kicker[b-xiiizh4cfa] {
    font-size: var(--ax-fs-11);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--ax-primary-700);
    margin-bottom: 4px;
    font-weight: 700;
}

.relazione-titolo[b-xiiizh4cfa] {
    font-size: var(--ax-fs-24);
    line-height: 1.15;
    font-weight: 700;
    color: var(--ax-paper-text);
    letter-spacing: -0.01em;
}

.relazione-capitolo-blocco + .relazione-capitolo-blocco[b-xiiizh4cfa] {
    margin-top: var(--ax-space-6);
}

.relazione-capitolo[b-xiiizh4cfa] {
    margin: 0 0 var(--ax-space-3) 0;
    font-size: var(--ax-fs-18);
    line-height: 1.2;
    font-weight: 600;
    color: var(--ax-paper-text);
    letter-spacing: -0.01em;
    padding-bottom: var(--ax-space-2);
    border-bottom: 1px solid var(--ax-paper-border);
}

.relazione-paragrafo + .relazione-paragrafo[b-xiiizh4cfa] {
    margin-top: var(--ax-space-4);
}

.relazione-paragrafo-titolo[b-xiiizh4cfa] {
    margin: 0 0 var(--ax-space-2) 0;
    font-size: var(--ax-fs-14);
    line-height: 1.25;
    font-weight: 600;
    color: var(--ax-text-2);
}

.relazione-testo[b-xiiizh4cfa] {
    font-size: var(--ax-fs-14);
    line-height: 1.7;
    color: var(--ax-paper-text-soft);
    text-align: justify;
}

.relazione-testo + .relazione-formula[b-xiiizh4cfa],
.relazione-formula + .relazione-testo[b-xiiizh4cfa],
.relazione-formula + .relazione-formula[b-xiiizh4cfa] {
    margin-top: var(--ax-space-3);
}

.relazione-formula[b-xiiizh4cfa] {
    display: flex;
    justify-content: center;
}

.relazione-formula-box[b-xiiizh4cfa] {
    width: 100%;
    padding: var(--ax-space-4);
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-paper-border);
    background: var(--ax-paper-bg-2);
    color: var(--ax-paper-text);
    font-family: var(--ax-font-mono);
}

/* =========================================================================
   RESPONSIVE
   ========================================================================= */
@media (max-width: 1200px) {
    .studio-grid[b-xiiizh4cfa] {
        grid-template-columns: 1fr;
    }

    .studio-hero[b-xiiizh4cfa] {
        grid-template-columns: 1fr;
    }

    .studio-hero-right[b-xiiizh4cfa] {
        justify-content: flex-start;
    }
}

@media (max-width: 900px) {
    .result-grid[b-xiiizh4cfa] {
        grid-template-columns: 1fr;
    }

    .input-row[b-xiiizh4cfa] {
        grid-template-columns: 1fr;
    }

    .input-editor[b-xiiizh4cfa] {
        grid-template-columns: minmax(0, 1fr) 5.5rem;
    }
}

@media (max-width: 640px) {
    .studio-hero[b-xiiizh4cfa] {
        padding: var(--ax-space-5);
    }

    .panel-card[b-xiiizh4cfa] {
        padding: var(--ax-space-4);
    }

    .relazione-contenuto[b-xiiizh4cfa] {
        padding: var(--ax-space-5) var(--ax-space-4);
    }

    .relazione-testo[b-xiiizh4cfa] {
        font-size: var(--ax-fs-13);
        line-height: 1.62;
        text-align: left;
    }

    .menu-relazione-popup[b-xiiizh4cfa] {
        min-width: 12rem;
    }
}
/* /Components/Pages/Studi/EnergiaClimatizzazione.razor.rz.scp.css */
/* =========================================================================
   EnergiaClimatizzazione.razor.css
   Pagina studio "Energia di climatizzazione".
   Consumer dei token Auxilium (wwwroot/css/auxilium.tokens.css)
   Tema chiaro di default, layout pulito ad ispirazione professionale.
   ========================================================================= */

.studio-page[b-q2csgfd7cf] {
    min-height: 100%;
    padding: var(--ax-page-padding);
    color: var(--ax-text-1);
    background: transparent;
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-6);
    max-width: var(--ax-page-max);
    margin: 0 auto;
    width: 100%;
}

/* =========================================================================
   HERO
   ========================================================================= */
.studio-hero[b-q2csgfd7cf] {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.85fr);
    gap: var(--ax-space-6);
    align-items: start;
    padding: var(--ax-space-6) var(--ax-space-7);
    border-radius: var(--ax-radius-lg);
    background: linear-gradient(135deg, var(--ax-primary-900) 0%, var(--ax-primary-800) 60%, var(--ax-primary-700) 100%);
    box-shadow: var(--ax-shadow-2);
    border: 1px solid var(--ax-primary-800);
    color: #ffffff;
}

.studio-breadcrumb[b-q2csgfd7cf] {
    font-size: var(--ax-fs-12);
    color: rgba(255, 255, 255, 0.75);
    margin-bottom: var(--ax-space-2);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
}

.studio-title[b-q2csgfd7cf] {
    margin: 0;
    font-size: clamp(var(--ax-fs-24), 2.6vw, var(--ax-fs-40));
    line-height: 1.12;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: -0.02em;
}

.studio-subtitle[b-q2csgfd7cf] {
    margin: var(--ax-space-3) 0 0 0;
    max-width: 52rem;
    font-size: var(--ax-fs-14);
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.85);
}

.studio-hero-right[b-q2csgfd7cf] {
    display: flex;
    justify-content: flex-end;
}

.studio-meta-card[b-q2csgfd7cf] {
    width: 100%;
    max-width: 22rem;
    padding: var(--ax-space-4);
    border-radius: var(--ax-radius-md);
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(6px);
}

.studio-meta-row + .studio-meta-row[b-q2csgfd7cf] {
    margin-top: var(--ax-space-3);
}

.studio-meta-label[b-q2csgfd7cf] {
    display: block;
    font-size: var(--ax-fs-11);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: rgba(255, 255, 255, 0.65);
    margin-bottom: 2px;
    font-weight: 600;
}

.studio-meta-value[b-q2csgfd7cf] {
    display: block;
    font-size: var(--ax-fs-14);
    font-weight: 600;
    color: #ffffff;
}

/* =========================================================================
   AZIONI TOOLBAR (Calcola / Reset / Copia relazione)
   ========================================================================= */
.studio-actions[b-q2csgfd7cf] {
    display: flex;
    gap: var(--ax-space-3);
    flex-wrap: wrap;
}

.studio-button[b-q2csgfd7cf] {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--ax-space-2);
    min-height: 38px;
    padding: 8px 16px;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-strong);
    background: var(--ax-gray-0);
    color: var(--ax-text-2);
    font-family: var(--ax-font-sans);
    font-size: var(--ax-fs-13);
    font-weight: 500;
    line-height: 1.2;
    cursor: pointer;
    transition: background 120ms ease, border-color 120ms ease, color 120ms ease, box-shadow 120ms ease;
}

.studio-button:hover:not(:disabled)[b-q2csgfd7cf] {
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-1);
    border-color: var(--ax-primary-500);
}

.studio-button:focus-visible[b-q2csgfd7cf] {
    outline: none;
    box-shadow: var(--ax-shadow-focus);
}

.studio-button-primary[b-q2csgfd7cf] {
    background: var(--ax-primary-700);
    color: var(--ax-text-on-primary);
    border-color: var(--ax-primary-700);
}

.studio-button-primary:hover:not(:disabled)[b-q2csgfd7cf] {
    background: var(--ax-primary-800);
    border-color: var(--ax-primary-800);
    color: var(--ax-text-on-primary);
}

.studio-button-secondary[b-q2csgfd7cf] {
    background: var(--ax-gray-0);
    color: var(--ax-text-2);
    border-color: var(--ax-border-strong);
}

/* =========================================================================
   DIALOG SALVATAGGIO STUDIO
   ========================================================================= */
.studio-dialog-backdrop[b-q2csgfd7cf] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    z-index: 40;
}

.studio-dialog[b-q2csgfd7cf] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(92vw, 480px);
    background: var(--ax-panel-bg);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    box-shadow: var(--ax-shadow-2, 0 12px 32px rgba(15, 23, 42, 0.22));
    padding: var(--ax-space-5);
    z-index: 50;
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-4);
}

.studio-dialog-header[b-q2csgfd7cf] {
    border-bottom: 1px solid var(--ax-border-soft);
    padding-bottom: var(--ax-space-3);
}

.studio-dialog-title[b-q2csgfd7cf] {
    margin: 0;
    font-size: var(--ax-fs-16);
    font-weight: 600;
    color: var(--ax-text-1);
}

.studio-dialog-body[b-q2csgfd7cf] {
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-3);
}

.studio-dialog-field[b-q2csgfd7cf] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.studio-dialog-field > span[b-q2csgfd7cf] {
    font-size: var(--ax-fs-11);
    font-weight: 600;
    color: var(--ax-text-3);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.studio-dialog-hint[b-q2csgfd7cf] {
    margin: 0;
    font-size: var(--ax-fs-12);
    color: var(--ax-text-3);
    line-height: 1.4;
}

.studio-dialog-actions[b-q2csgfd7cf] {
    display: flex;
    justify-content: flex-end;
    gap: var(--ax-space-2);
    border-top: 1px solid var(--ax-border-soft);
    padding-top: var(--ax-space-3);
}

/* =========================================================================
   GRID INPUT + RISULTATI
   ========================================================================= */
.studio-grid[b-q2csgfd7cf] {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.9fr);
    gap: var(--ax-space-5);
}

/* =========================================================================
   PANEL CARD (input, risultati, relazione)
   ========================================================================= */
.panel-card[b-q2csgfd7cf] {
    position: relative;
    border-radius: var(--ax-radius-lg);
    padding: var(--ax-space-5);
    background: var(--ax-panel-bg);
    border: 1px solid var(--ax-border-soft);
    box-shadow: var(--ax-shadow-1);
}

.panel-header[b-q2csgfd7cf] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--ax-space-4);
    margin-bottom: var(--ax-space-4);
    padding-bottom: var(--ax-space-3);
    border-bottom: 1px solid var(--ax-border-soft);
}

.panel-title-wrap[b-q2csgfd7cf] {
    display: flex;
    align-items: flex-start;
    gap: var(--ax-space-3);
    min-width: 0;
}

.panel-title-accent[b-q2csgfd7cf] {
    width: 3px;
    min-width: 3px;
    height: 1.2rem;
    margin-top: 4px;
    border-radius: var(--ax-radius-pill);
    background: var(--ax-primary-700);
}

.panel-title[b-q2csgfd7cf] {
    margin: 0;
    font-size: var(--ax-fs-18);
    line-height: 1.2;
    font-weight: 600;
    color: var(--ax-text-1);
    letter-spacing: -0.01em;
}

.panel-subtitle[b-q2csgfd7cf] {
    margin-top: 4px;
    font-size: var(--ax-fs-13);
    line-height: 1.45;
    color: var(--ax-text-3);
}

.panel-header-dots[b-q2csgfd7cf] {
    font-size: var(--ax-fs-18);
    line-height: 1;
    font-weight: 700;
    color: var(--ax-text-3);
    padding-top: 2px;
    cursor: pointer;
    user-select: none;
}

.panel-body[b-q2csgfd7cf] {
    min-width: 0;
}

/* =========================================================================
   LISTA INPUT
   ========================================================================= */
.input-list[b-q2csgfd7cf] {
    display: flex;
    flex-direction: column;
}

.input-row[b-q2csgfd7cf] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(230px, 300px);
    gap: var(--ax-space-4);
    align-items: center;
    padding: var(--ax-space-3) 0;
    border-bottom: 1px solid var(--ax-border-soft);
}

.input-row:last-child[b-q2csgfd7cf] {
    border-bottom: none;
}

.input-name[b-q2csgfd7cf] {
    font-size: var(--ax-fs-14);
    font-weight: 600;
    color: var(--ax-text-1);
}

.input-description[b-q2csgfd7cf] {
    margin-top: 2px;
    font-size: var(--ax-fs-12);
    line-height: 1.45;
    color: var(--ax-text-3);
}

.input-editor[b-q2csgfd7cf] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 6.2rem;
    gap: var(--ax-space-2);
}

.input-field[b-q2csgfd7cf] {
    box-sizing: border-box;
    width: 100%;
    min-height: 38px;
    padding: 8px 12px;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-input-border);
    background: var(--ax-input-bg);
    color: var(--ax-input-text);
    font-family: var(--ax-font-mono);
    font-size: var(--ax-fs-14);
    font-variant-numeric: tabular-nums;
    outline: none;
    transition: border-color 120ms ease, box-shadow 120ms ease;
}

.input-field:focus[b-q2csgfd7cf] {
    border-color: var(--ax-input-border-focus);
    box-shadow: var(--ax-shadow-focus);
}

.input-unit[b-q2csgfd7cf] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 8px 12px;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-soft);
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-2);
    font-family: var(--ax-font-mono);
    font-size: var(--ax-fs-13);
    font-weight: 500;
}

/* =========================================================================
   RISULTATI
   ========================================================================= */
.result-message[b-q2csgfd7cf] {
    border-radius: var(--ax-radius-md);
    padding: var(--ax-space-4);
    background: var(--ax-info-bg);
    border: 1px solid var(--ax-info-border);
    color: var(--ax-info-strong);
}

.result-message-error[b-q2csgfd7cf] {
    background: var(--ax-danger-bg);
    border-color: var(--ax-danger-border);
    color: var(--ax-danger-strong);
}

.result-message-title[b-q2csgfd7cf] {
    font-size: var(--ax-fs-14);
    font-weight: 600;
    margin-bottom: 4px;
}

.result-message-text[b-q2csgfd7cf] {
    font-size: var(--ax-fs-13);
    line-height: 1.5;
    color: var(--ax-text-2);
}

.result-message-error .result-message-text[b-q2csgfd7cf] {
    color: var(--ax-danger-strong);
}

.result-grid[b-q2csgfd7cf] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ax-space-3);
}

.result-card[b-q2csgfd7cf] {
    border-radius: var(--ax-radius-md);
    padding: var(--ax-space-4);
    background: var(--ax-card-bg-soft);
    border: 1px solid var(--ax-border-soft);
}

.result-title[b-q2csgfd7cf] {
    font-size: var(--ax-fs-13);
    font-weight: 600;
    color: var(--ax-text-2);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.result-description[b-q2csgfd7cf] {
    margin-top: 4px;
    font-size: var(--ax-fs-12);
    line-height: 1.45;
    color: var(--ax-text-3);
    min-height: 2.4rem;
}

.result-value-row[b-q2csgfd7cf] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 4.5rem;
    gap: var(--ax-space-2);
    margin-top: var(--ax-space-3);
}

.result-value[b-q2csgfd7cf],
.result-unit[b-q2csgfd7cf] {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-soft);
    /* --ax-input-bg è tematizzato (bianco in light, #171d26 in dark):
       evita l'effetto "bianco su bianco" in dark theme che invece si
       verificherebbe usando direttamente --ax-gray-0. */
    background: var(--ax-input-bg);
    color: var(--ax-text-1);
    min-height: 38px;
    padding: 8px 12px;
    font-family: var(--ax-font-mono);
    font-size: var(--ax-fs-14);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.result-unit[b-q2csgfd7cf] {
    justify-content: center;
    color: var(--ax-text-2);
    background: var(--ax-panel-bg-soft);
    font-weight: 500;
    font-size: var(--ax-fs-12);
}

/* =========================================================================
   RELAZIONE - menu e feedback
   ========================================================================= */
.relazione-card[b-q2csgfd7cf] {
    overflow: visible;
}

.menu-relazione-wrap[b-q2csgfd7cf] {
    position: relative;
    flex: 0 0 auto;
}

.menu-relazione-toggle[b-q2csgfd7cf] {
    appearance: none;
    min-width: 38px;
    height: 32px;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-strong);
    background: var(--ax-gray-0);
    color: var(--ax-text-2);
    font-size: var(--ax-fs-16);
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: background 120ms ease, border-color 120ms ease, color 120ms ease;
}

.menu-relazione-toggle:hover[b-q2csgfd7cf] {
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-1);
    border-color: var(--ax-primary-500);
}

.menu-relazione-overlay[b-q2csgfd7cf] {
    position: fixed;
    inset: 0;
    border: none;
    background: transparent;
    z-index: 70;
}

.menu-relazione-popup[b-q2csgfd7cf] {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 14rem;
    padding: var(--ax-space-1);
    border-radius: var(--ax-radius-md);
    background: var(--ax-panel-bg);
    border: 1px solid var(--ax-border-soft);
    box-shadow: var(--ax-shadow-3);
    z-index: 71;
}

.menu-relazione-item[b-q2csgfd7cf] {
    width: 100%;
    appearance: none;
    border: none;
    background: transparent;
    color: var(--ax-text-1);
    text-align: left;
    padding: 10px 12px;
    border-radius: var(--ax-radius-sm);
    font-size: var(--ax-fs-13);
    font-weight: 500;
    cursor: pointer;
    transition: background 120ms ease, color 120ms ease;
}

.menu-relazione-item:hover:not(:disabled)[b-q2csgfd7cf] {
    background: var(--ax-primary-50);
    color: var(--ax-primary-700);
}

.menu-relazione-item:disabled[b-q2csgfd7cf] {
    opacity: 0.45;
    cursor: default;
    color: var(--ax-text-4);
}

/* =========================================================================
   FEEDBACK RELAZIONE
   ========================================================================= */
.relazione-feedback[b-q2csgfd7cf],
.relazione-empty[b-q2csgfd7cf] {
    border-radius: var(--ax-radius-md);
    padding: var(--ax-space-4);
    font-size: var(--ax-fs-13);
    line-height: 1.5;
}

.relazione-feedback-success[b-q2csgfd7cf] {
    margin-bottom: var(--ax-space-3);
    background: var(--ax-success-bg);
    border: 1px solid var(--ax-success-border);
    color: var(--ax-success-strong);
}

.relazione-feedback-error[b-q2csgfd7cf] {
    margin-bottom: var(--ax-space-3);
    background: var(--ax-danger-bg);
    border: 1px solid var(--ax-danger-border);
    color: var(--ax-danger-strong);
}

.relazione-empty[b-q2csgfd7cf] {
    background: var(--ax-panel-bg-soft);
    border: 1px solid var(--ax-border-soft);
    color: var(--ax-text-3);
    text-align: center;
}

/* =========================================================================
   DOCUMENTO RELAZIONE TECNICA (paper look)
   ========================================================================= */
.relazione-documento[b-q2csgfd7cf] {
    position: relative;
    overflow: hidden;
    border-radius: var(--ax-radius-md);
    border: 1px solid var(--ax-paper-border);
    background: var(--ax-paper-bg);
    color: var(--ax-paper-text);
    box-shadow: var(--ax-shadow-1);
}

.relazione-documento[b-q2csgfd7cf]::before {
    content: "Auxilium Engineering";
    position: absolute;
    top: 48%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-28deg);
    font-size: 3.5rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: rgba(11, 61, 145, 0.04);
    white-space: nowrap;
    pointer-events: none;
    font-family: var(--ax-font-sans);
}

.relazione-contenuto[b-q2csgfd7cf] {
    position: relative;
    z-index: 1;
    padding: var(--ax-space-6) var(--ax-space-6);
}

.relazione-heading[b-q2csgfd7cf] {
    padding-bottom: var(--ax-space-4);
    margin-bottom: var(--ax-space-4);
    border-bottom: 1px solid var(--ax-paper-border);
}

.relazione-kicker[b-q2csgfd7cf] {
    font-size: var(--ax-fs-11);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--ax-primary-700);
    margin-bottom: 4px;
    font-weight: 700;
}

.relazione-titolo[b-q2csgfd7cf] {
    font-size: var(--ax-fs-24);
    line-height: 1.15;
    font-weight: 700;
    color: var(--ax-paper-text);
    letter-spacing: -0.01em;
}

.relazione-capitolo-blocco + .relazione-capitolo-blocco[b-q2csgfd7cf] {
    margin-top: var(--ax-space-6);
}

.relazione-capitolo[b-q2csgfd7cf] {
    margin: 0 0 var(--ax-space-3) 0;
    font-size: var(--ax-fs-18);
    line-height: 1.2;
    font-weight: 600;
    color: var(--ax-paper-text);
    letter-spacing: -0.01em;
    padding-bottom: var(--ax-space-2);
    border-bottom: 1px solid var(--ax-paper-border);
}

.relazione-paragrafo + .relazione-paragrafo[b-q2csgfd7cf] {
    margin-top: var(--ax-space-4);
}

.relazione-paragrafo-titolo[b-q2csgfd7cf] {
    margin: 0 0 var(--ax-space-2) 0;
    font-size: var(--ax-fs-14);
    line-height: 1.25;
    font-weight: 600;
    color: var(--ax-text-2);
}

.relazione-testo[b-q2csgfd7cf] {
    font-size: var(--ax-fs-14);
    line-height: 1.7;
    color: var(--ax-paper-text-soft);
    text-align: justify;
}

.relazione-testo + .relazione-formula[b-q2csgfd7cf],
.relazione-formula + .relazione-testo[b-q2csgfd7cf],
.relazione-formula + .relazione-formula[b-q2csgfd7cf] {
    margin-top: var(--ax-space-3);
}

.relazione-formula[b-q2csgfd7cf] {
    display: flex;
    justify-content: center;
}

.relazione-formula-box[b-q2csgfd7cf] {
    width: 100%;
    padding: var(--ax-space-4);
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-paper-border);
    background: var(--ax-paper-bg-2);
    color: var(--ax-paper-text);
    font-family: var(--ax-font-mono);
}

/* =========================================================================
   RESPONSIVE
   ========================================================================= */
@media (max-width: 1200px) {
    .studio-grid[b-q2csgfd7cf] {
        grid-template-columns: 1fr;
    }

    .studio-hero[b-q2csgfd7cf] {
        grid-template-columns: 1fr;
    }

    .studio-hero-right[b-q2csgfd7cf] {
        justify-content: flex-start;
    }
}

@media (max-width: 900px) {
    .result-grid[b-q2csgfd7cf] {
        grid-template-columns: 1fr;
    }

    .input-row[b-q2csgfd7cf] {
        grid-template-columns: 1fr;
    }

    .input-editor[b-q2csgfd7cf] {
        grid-template-columns: minmax(0, 1fr) 5.5rem;
    }
}

@media (max-width: 640px) {
    .studio-hero[b-q2csgfd7cf] {
        padding: var(--ax-space-5);
    }

    .panel-card[b-q2csgfd7cf] {
        padding: var(--ax-space-4);
    }

    .relazione-contenuto[b-q2csgfd7cf] {
        padding: var(--ax-space-5) var(--ax-space-4);
    }

    .relazione-testo[b-q2csgfd7cf] {
        font-size: var(--ax-fs-13);
        line-height: 1.62;
        text-align: left;
    }

    .menu-relazione-popup[b-q2csgfd7cf] {
        min-width: 12rem;
    }
}
/* /Components/Pages/Studi/PerditeCaricoTubazioni.razor.rz.scp.css */
.metodo-riga[b-n84hy3scme] {
    position: relative;
    display: grid;
    gap: .25rem;
    padding: .65rem .75rem;
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-sm);
    background: var(--ax-panel-bg);
}

.metodo-box[b-n84hy3scme] {
    display: grid;
    align-content: start;
    gap: .75rem;
}

.metodo-box-disabled[b-n84hy3scme] {
    opacity: .72;
}

.campo-help[b-n84hy3scme] {
    display: block;
    margin-top: .35rem;
    color: var(--ax-text-2);
    font-size: .82rem;
    line-height: 1.4;
}

.metodo-riga + .metodo-riga[b-n84hy3scme] {
    margin-top: .5rem;
}

.metodo-riga-ok[b-n84hy3scme] {
    border-color: color-mix(in srgb, #f97316 58%, var(--ax-border-soft));
    background:
        linear-gradient(
            0deg,
            color-mix(in srgb, #f97316 13%, transparent),
            color-mix(in srgb, #f97316 13%, transparent)
        ),
        var(--ax-panel-bg);
    box-shadow: inset 3px 0 0 #f97316;
    color: var(--ax-text-1);
}

.metodo-riga-ok .formula-metodo[b-n84hy3scme] {
    background: color-mix(in srgb, #f97316 10%, var(--ax-panel-bg-soft));
    color: var(--ax-text-1);
}

.metodo-riga-ok .metodo-help[b-n84hy3scme] {
    border-color: color-mix(in srgb, #f97316 65%, transparent);
    background: color-mix(in srgb, #f97316 12%, white);
    color: #9a3412;
}

.metodo-riga-disabled[b-n84hy3scme] {
    color: var(--ax-text-2);
    background: var(--ax-panel-bg-soft);
}

.metodo-riga-header[b-n84hy3scme] {
    display: flex;
    align-items: center;
    gap: .45rem;
    min-width: 0;
}

.metodo-help[b-n84hy3scme] {
    position: relative;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--ax-primary-500) 55%, transparent);
    color: var(--ax-primary-700);
    background: color-mix(in srgb, var(--ax-primary-500) 10%, white);
    font-size: .72rem;
    font-weight: 700;
    line-height: 1;
    cursor: help;
}

.metodo-tooltip[b-n84hy3scme] {
    position: absolute;
    left: 50%;
    bottom: calc(100% + .55rem);
    z-index: 5;
    width: 15rem;
    min-height: 4rem;
    max-height: 5rem;
    transform: translateX(-50%) translateY(.2rem);
    padding: .55rem .65rem;
    border: 1px solid var(--ax-border-strong);
    border-radius: var(--ax-radius-sm);
    background: var(--ax-gray-950, #111827);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .18);
    color: #ffffff;
    font-size: .78rem;
    font-weight: 500;
    line-height: 1.35;
    white-space: normal;
    opacity: 0;
    pointer-events: none;
    transition: opacity .12s ease, transform .12s ease;
}

.metodo-tooltip[b-n84hy3scme]::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    width: .55rem;
    height: .55rem;
    transform: translate(-50%, -50%) rotate(45deg);
    background: var(--ax-gray-950, #111827);
    border-right: 1px solid var(--ax-border-strong);
    border-bottom: 1px solid var(--ax-border-strong);
}

.metodo-help:hover .metodo-tooltip[b-n84hy3scme],
.metodo-help:focus .metodo-tooltip[b-n84hy3scme],
.metodo-help:focus-visible .metodo-tooltip[b-n84hy3scme] {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.formula-metodo[b-n84hy3scme] {
    margin-top: .4rem;
    padding: .45rem .55rem;
    border-radius: var(--ax-radius-sm);
    background: var(--ax-panel-bg-soft);
}

.tratti-lista[b-n84hy3scme] {
    display: grid;
    gap: 1rem;
    margin-top: 1rem;
}

.tratto-box[b-n84hy3scme] {
    display: grid;
    gap: .85rem;
    padding: 1rem;
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-sm);
    background: var(--ax-panel-bg);
}

.tratto-header[b-n84hy3scme] {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
}

.tratto-azioni[b-n84hy3scme] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .4rem;
}

.tratto-lunghezza[b-n84hy3scme] {
    max-width: 18rem;
}

.raccordi-tabella-wrapper[b-n84hy3scme] {
    overflow-x: auto;
}

.raccordi-collapsible[b-n84hy3scme] {
    display: grid;
    gap: .65rem;
}

.raccordi-toggle[b-n84hy3scme] {
    justify-self: start;
}

.raccordi-tabella[b-n84hy3scme] {
    width: 100%;
    min-width: 760px;
}

.raccordo-immagine[b-n84hy3scme] {
    display: grid;
    place-items: center;
    width: 3.25rem;
    height: 2.35rem;
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-sm);
    background: var(--ax-panel-bg-soft);
    color: var(--ax-primary-700);
    font-size: .72rem;
    font-weight: 700;
}

.raccordo-immagine svg[b-n84hy3scme] {
    width: 2.65rem;
    height: 1.75rem;
}

.raccordo-quantita[b-n84hy3scme] {
    width: 5.5rem;
    margin-left: auto;
}

.raccordo-coefficiente[b-n84hy3scme] {
    width: 5.5rem;
    margin-left: auto;
}

.azioni-calcolo[b-n84hy3scme] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .75rem;
    margin-top: 1rem;
}

.errore-calcolo[b-n84hy3scme] {
    color: var(--ax-danger-700, #b42318);
    font-weight: 600;
}

.risultati-totali[b-n84hy3scme] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.risultati-totali > div[b-n84hy3scme] {
    display: grid;
    gap: .25rem;
    padding: .85rem;
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-sm);
    background: var(--ax-panel-bg-soft);
}

.risultati-totali strong[b-n84hy3scme] {
    font-size: 1.05rem;
}

.velocita-alta[b-n84hy3scme] {
    color: var(--ax-danger-700, #b42318);
    font-weight: 700;
}

.relazione-card[b-n84hy3scme] {
    overflow: visible;
}

.panel-header[b-n84hy3scme] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.menu-relazione-wrap[b-n84hy3scme] {
    position: relative;
    flex: 0 0 auto;
}

.menu-relazione-toggle[b-n84hy3scme] {
    appearance: none;
    min-width: 2.4rem;
    height: 2.1rem;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-strong);
    background: var(--ax-gray-0);
    color: var(--ax-text-2);
    font-size: .95rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

.menu-relazione-overlay[b-n84hy3scme] {
    position: fixed;
    inset: 0;
    border: none;
    background: transparent;
    z-index: 70;
}

.menu-relazione-popup[b-n84hy3scme] {
    position: absolute;
    top: calc(100% + .5rem);
    right: 0;
    min-width: 14rem;
    padding: .25rem;
    border-radius: var(--ax-radius-sm);
    background: var(--ax-panel-bg);
    border: 1px solid var(--ax-border-soft);
    box-shadow: var(--ax-shadow-3);
    z-index: 71;
}

.menu-relazione-item[b-n84hy3scme] {
    width: 100%;
    appearance: none;
    border: none;
    background: transparent;
    color: var(--ax-text-1);
    text-align: left;
    padding: .65rem .75rem;
    border-radius: var(--ax-radius-sm);
    font-size: .86rem;
    font-weight: 500;
    cursor: pointer;
}

.menu-relazione-item:hover:not(:disabled)[b-n84hy3scme] {
    background: var(--ax-primary-50);
    color: var(--ax-primary-700);
}

.menu-relazione-item:disabled[b-n84hy3scme] {
    opacity: .45;
    cursor: default;
}

.relazione-feedback[b-n84hy3scme],
.relazione-empty[b-n84hy3scme] {
    border-radius: var(--ax-radius-sm);
    padding: .85rem;
    font-size: .88rem;
    line-height: 1.45;
}

.relazione-feedback-success[b-n84hy3scme] {
    margin-bottom: .75rem;
    background: var(--ax-success-bg);
    border: 1px solid var(--ax-success-border);
    color: var(--ax-success-strong);
}

.relazione-feedback-error[b-n84hy3scme] {
    margin-bottom: .75rem;
    background: var(--ax-danger-bg);
    border: 1px solid var(--ax-danger-border);
    color: var(--ax-danger-strong);
}

.relazione-empty[b-n84hy3scme] {
    background: var(--ax-panel-bg-soft);
    border: 1px solid var(--ax-border-soft);
    color: var(--ax-text-3);
}

.relazione-documento[b-n84hy3scme] {
    position: relative;
    overflow: hidden;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-paper-border);
    background: var(--ax-paper-bg);
    color: var(--ax-paper-text);
}

.relazione-contenuto[b-n84hy3scme] {
    padding: 1.25rem;
}

.relazione-heading[b-n84hy3scme] {
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--ax-paper-border);
}

.relazione-kicker[b-n84hy3scme] {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--ax-primary-700);
    font-weight: 700;
}

.relazione-titolo[b-n84hy3scme] {
    margin-top: .25rem;
    font-size: 1.35rem;
    line-height: 1.2;
    font-weight: 700;
}

.relazione-capitolo-blocco + .relazione-capitolo-blocco[b-n84hy3scme] {
    margin-top: 1.25rem;
}

.relazione-capitolo[b-n84hy3scme] {
    margin: 0 0 .65rem;
    font-size: 1.05rem;
    font-weight: 700;
}

.relazione-testo[b-n84hy3scme] {
    font-size: .92rem;
    line-height: 1.65;
    color: var(--ax-paper-text-soft);
}

.relazione-formula[b-n84hy3scme] {
    display: flex;
    justify-content: center;
    margin: .75rem 0;
}

.relazione-formula-box[b-n84hy3scme] {
    width: 100%;
    padding: .85rem;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-paper-border);
    background: var(--ax-paper-bg-2);
}

.relazione-tabella-wrap[b-n84hy3scme] {
    width: 100%;
    overflow-x: auto;
    margin: .85rem 0;
}

.relazione-tabella[b-n84hy3scme] {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: .82rem;
    color: var(--ax-paper-text);
}

.relazione-tabella th[b-n84hy3scme],
.relazione-tabella td[b-n84hy3scme] {
    padding: .45rem .55rem;
    border: 1px solid var(--ax-paper-border);
    text-align: right;
    vertical-align: top;
    white-space: nowrap;
}

.relazione-tabella th[b-n84hy3scme] {
    background: var(--ax-paper-bg-2);
    font-weight: 700;
}

.relazione-tabella th:nth-child(2)[b-n84hy3scme],
.relazione-tabella td:nth-child(2)[b-n84hy3scme],
.relazione-tabella th:nth-child(10)[b-n84hy3scme],
.relazione-tabella td:nth-child(10)[b-n84hy3scme] {
    text-align: left;
}

@media (max-width: 720px) {
    .metodo-tooltip[b-n84hy3scme] {
        left: 0;
        width: min(15rem, 75vw);
        transform: translateY(.2rem);
    }

    .metodo-help:hover .metodo-tooltip[b-n84hy3scme],
    .metodo-help:focus .metodo-tooltip[b-n84hy3scme],
    .metodo-help:focus-visible .metodo-tooltip[b-n84hy3scme] {
        transform: translateY(0);
    }

    .tratto-header[b-n84hy3scme] {
        display: grid;
    }

    .tratto-azioni[b-n84hy3scme] {
        justify-content: flex-start;
    }

    .risultati-totali[b-n84hy3scme] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Studi/RicambiAriaUni16798.razor.rz.scp.css */
/* =========================================================================
   RicambiAriaUni16798.razor.css
   Pagina studio "Relazione ricambi aria" (UNI 10339 / UNI EN 16798-1).
   Stessa impalcatura visiva delle altre pagine studio
   (ConversioneGas, EnergiaClimatizzazione) ma con wizard a 5 step e
   tabelle dinamiche per locali / dettaglio portate.
   Consumer dei token Auxilium (wwwroot/css/auxilium.tokens.css).
   ========================================================================= */

.studio-page[b-pvow8todjb] {
    min-height: 100%;
    padding: var(--ax-page-padding);
    color: var(--ax-text-1);
    background: transparent;
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-6);
    max-width: var(--ax-page-max);
    margin: 0 auto;
    width: 100%;
}

/* =========================================================================
   HERO
   ========================================================================= */
.studio-hero[b-pvow8todjb] {
    padding: var(--ax-space-6) var(--ax-space-7);
    border-radius: var(--ax-radius-lg);
    background: linear-gradient(135deg, var(--ax-primary-900) 0%, var(--ax-primary-800) 60%, var(--ax-primary-700) 100%);
    box-shadow: var(--ax-shadow-2);
    border: 1px solid var(--ax-primary-800);
    color: #ffffff;
}

.studio-hero-inner[b-pvow8todjb] {
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-3);
}

.studio-hero-tag[b-pvow8todjb] {
    align-self: flex-start;
    display: inline-block;
    font-size: var(--ax-fs-11);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.85);
    padding: 2px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
}

.studio-hero-title[b-pvow8todjb] {
    margin: 0;
    font-size: clamp(var(--ax-fs-24), 2.6vw, var(--ax-fs-40));
    line-height: 1.12;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: -0.02em;
}

.studio-hero-subtitle[b-pvow8todjb] {
    margin: 0;
    max-width: 56rem;
    font-size: var(--ax-fs-14);
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.85);
}

.studio-hero-progress[b-pvow8todjb] {
    display: flex;
    gap: var(--ax-space-2);
    margin-top: var(--ax-space-3);
}

.pallino[b-pvow8todjb] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.22);
    font-size: var(--ax-fs-12);
    font-weight: 600;
    color: rgba(255, 255, 255, 0.85);
}

.pallino-attivo[b-pvow8todjb] {
    background: #ffffff;
    color: var(--ax-primary-800);
    border-color: #ffffff;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.22);
}

.pallino-fatto[b-pvow8todjb] {
    background: rgba(255, 255, 255, 0.6);
    color: var(--ax-primary-900);
    border-color: rgba(255, 255, 255, 0.6);
}

/* =========================================================================
   PANEL CARD (contenitore dei singoli passi del wizard)
   ========================================================================= */
.panel-card[b-pvow8todjb] {
    background: var(--ax-panel-bg);
    border: 1px solid var(--ax-border-soft);
    border-radius: var(--ax-radius-lg);
    padding: var(--ax-space-6) var(--ax-space-7);
    box-shadow: var(--ax-shadow-1);
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-4);
}

.panel-title[b-pvow8todjb] {
    margin: 0;
    font-size: var(--ax-fs-20);
    font-weight: 600;
    color: var(--ax-text-1);
}

.panel-subtitle[b-pvow8todjb] {
    margin: var(--ax-space-5) 0 var(--ax-space-2) 0;
    font-size: var(--ax-fs-13);
    font-weight: 600;
    /* Arancio "warm" per i sottotitoli di sezione: guida l'occhio sull'organizzazione
       dei contenuti senza competere con il blu primario (riservato ai CTA). */
    color: var(--ax-highlight);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.panel-help[b-pvow8todjb] {
    margin: 0;
    color: var(--ax-text-2);
    font-size: var(--ax-fs-14);
    line-height: 1.55;
}

/* =========================================================================
   CAMPI FORM
   ========================================================================= */
.campo-grid[b-pvow8todjb] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: var(--ax-space-4);
}

.campo[b-pvow8todjb] {
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-2);
}

.campo-label[b-pvow8todjb] {
    font-size: var(--ax-fs-12);
    font-weight: 600;
    color: var(--ax-text-2);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.campo-input[b-pvow8todjb] {
    width: 100%;
    padding: 8px 12px;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-strong);
    background: var(--ax-gray-0);
    color: var(--ax-text-1);
    font-family: var(--ax-font-sans);
    font-size: var(--ax-fs-14);
    line-height: 1.3;
}

.campo-input:focus-visible[b-pvow8todjb] {
    outline: none;
    border-color: var(--ax-primary-500);
    box-shadow: var(--ax-shadow-focus);
}

/* Hint testuale sotto un input: usato per spiegare brevemente cosa
   valorizza il campo o quando si applica (es. correzione altitudine). */
.campo-hint[b-pvow8todjb] {
    font-size: var(--ax-fs-12);
    color: var(--ax-text-3);
    line-height: 1.45;
    margin-top: 4px;
}

.campo-check[b-pvow8todjb] {
    flex-direction: row;
    align-items: center;
    gap: var(--ax-space-2);
}

.campo-check input[type="checkbox"][b-pvow8todjb] {
    width: 18px;
    height: 18px;
    accent-color: var(--ax-primary-700);
}

/* =========================================================================
   TABELLA LOCALI
   ========================================================================= */
.locali-table[b-pvow8todjb] {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--ax-fs-13);
}

.locali-table th[b-pvow8todjb],
.locali-table td[b-pvow8todjb] {
    padding: 8px 10px;
    border-bottom: 1px solid var(--ax-border-soft);
    text-align: left;
    vertical-align: middle;
}

.locali-table thead th[b-pvow8todjb] {
    background: var(--ax-panel-bg-soft);
    font-size: var(--ax-fs-12);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ax-text-2);
    font-weight: 600;
    border-bottom: 1px solid var(--ax-border-strong);
}

.locali-table .campo-input[b-pvow8todjb] {
    padding: 6px 8px;
    font-size: var(--ax-fs-13);
}

/* =========================================================================
   RIEPILOGO (step 4)
   ========================================================================= */
.riepilogo[b-pvow8todjb] {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--ax-space-2);
    color: var(--ax-text-1);
}

.riepilogo li[b-pvow8todjb] {
    padding: 8px 12px;
    background: var(--ax-panel-bg-soft);
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-soft);
}

/* =========================================================================
   RISULTATO (step 5)
   ========================================================================= */
.result-grid[b-pvow8todjb] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--ax-space-4);
}

.result-card[b-pvow8todjb] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: var(--ax-space-4);
    border-radius: var(--ax-radius-md);
    background: var(--ax-panel-bg-soft);
    border: 1px solid var(--ax-border-soft);
}

.result-label[b-pvow8todjb] {
    font-size: var(--ax-fs-11);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ax-text-2);
    font-weight: 600;
}

.result-value[b-pvow8todjb] {
    font-size: var(--ax-fs-22);
    font-weight: 700;
    color: var(--ax-text-1);
}

.result-hint[b-pvow8todjb] {
    font-size: var(--ax-fs-12);
    color: var(--ax-text-3);
}

.result-ok[b-pvow8todjb] {
    background: color-mix(in srgb, var(--ax-success-500, #16a34a) 12%, transparent);
    border-color: color-mix(in srgb, var(--ax-success-500, #16a34a) 40%, transparent);
}

.result-ko[b-pvow8todjb] {
    background: color-mix(in srgb, var(--ax-danger-500, #dc2626) 12%, transparent);
    border-color: color-mix(in srgb, var(--ax-danger-500, #dc2626) 40%, transparent);
}

/* =========================================================================
   BUTTONS
   ========================================================================= */
.studio-actions-row[b-pvow8todjb] {
    display: flex;
    gap: var(--ax-space-3);
    flex-wrap: wrap;
}

.studio-actions-row-center[b-pvow8todjb] {
    justify-content: space-between;
    margin-top: var(--ax-space-4);
}

.studio-button[b-pvow8todjb] {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--ax-space-2);
    min-height: 38px;
    padding: 8px 16px;
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-strong);
    background: var(--ax-gray-0);
    color: var(--ax-text-2);
    font-family: var(--ax-font-sans);
    font-size: var(--ax-fs-13);
    font-weight: 500;
    line-height: 1.2;
    cursor: pointer;
    transition: background 120ms ease, border-color 120ms ease, color 120ms ease, box-shadow 120ms ease;
}

.studio-button:hover:not(:disabled)[b-pvow8todjb] {
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-1);
    border-color: var(--ax-primary-500);
}

.studio-button:focus-visible[b-pvow8todjb] {
    outline: none;
    box-shadow: var(--ax-shadow-focus);
}

.studio-button-primary[b-pvow8todjb] {
    background: var(--ax-primary-700);
    color: var(--ax-text-on-primary);
    border-color: var(--ax-primary-700);
}

.studio-button-primary:hover:not(:disabled)[b-pvow8todjb] {
    background: var(--ax-primary-800);
    border-color: var(--ax-primary-800);
    color: var(--ax-text-on-primary);
}

.studio-button-secondary[b-pvow8todjb] {
    background: var(--ax-gray-0);
    color: var(--ax-text-2);
    border-color: var(--ax-border-strong);
}

.studio-button-ghost[b-pvow8todjb] {
    background: transparent;
    color: var(--ax-text-2);
    border-color: transparent;
}

.studio-button-ghost:hover:not(:disabled)[b-pvow8todjb] {
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-1);
    border-color: var(--ax-border-soft);
}

/* =========================================================================
   ALERT
   ========================================================================= */
.alert[b-pvow8todjb] {
    padding: var(--ax-space-3) var(--ax-space-4);
    border-radius: var(--ax-radius-sm);
    border: 1px solid var(--ax-border-soft);
    background: var(--ax-panel-bg-soft);
    color: var(--ax-text-1);
    font-size: var(--ax-fs-14);
}

.alert-info[b-pvow8todjb] {
    background: color-mix(in srgb, var(--ax-primary-500) 10%, transparent);
    border-color: color-mix(in srgb, var(--ax-primary-500) 30%, transparent);
}

.alert-errore[b-pvow8todjb] {
    background: color-mix(in srgb, var(--ax-danger-500, #dc2626) 10%, transparent);
    border-color: color-mix(in srgb, var(--ax-danger-500, #dc2626) 40%, transparent);
    color: var(--ax-danger-700, #991b1b);
}

/* =========================================================================
   RESPONSIVE
   ========================================================================= */
@media (max-width: 640px) {
    .panel-card[b-pvow8todjb] {
        padding: var(--ax-space-4) var(--ax-space-5);
    }

    .studio-hero[b-pvow8todjb] {
        padding: var(--ax-space-5) var(--ax-space-5);
    }

    .locali-table[b-pvow8todjb] {
        display: block;
        overflow-x: auto;
    }
}

/* =========================================================================
   Studio-intro: introduzione "A cosa serve questo studio" sempre visibile
   sopra il wizard. Realizzata con <details> nativo: l'utente la apre/chiude
   senza bisogno di JavaScript. Resta in pagina anche quando si naviga tra
   i passi del wizard, così il contesto è sempre richiamabile.
   ========================================================================= */
.studio-intro[b-pvow8todjb] {
    background: var(--ax-card-bg);
    border: 1px solid var(--ax-border-soft);
    border-left: 3px solid var(--ax-highlight);
    border-radius: var(--ax-radius-md);
    box-shadow: var(--ax-shadow-1);
    margin-bottom: var(--ax-layout-gap);
    overflow: hidden;
}

.studio-intro-summary[b-pvow8todjb] {
    list-style: none;
    cursor: pointer;
    padding: var(--ax-space-3) var(--ax-space-5);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ax-space-3);
    user-select: none;
}

.studio-intro-summary[b-pvow8todjb]::-webkit-details-marker {
    display: none;
}

.studio-intro-summary[b-pvow8todjb]::after {
    content: "▾";
    color: var(--ax-text-3);
    font-size: var(--ax-fs-12);
    transition: transform 0.15s ease;
}

.studio-intro:not([open]) .studio-intro-summary[b-pvow8todjb]::after {
    transform: rotate(-90deg);
}

.studio-intro-summary-label[b-pvow8todjb] {
    font-weight: 600;
    color: var(--ax-highlight-strong);
    font-size: var(--ax-fs-14);
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.studio-intro-summary-hint[b-pvow8todjb] {
    font-size: var(--ax-fs-12);
    color: var(--ax-text-3);
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
}

.studio-intro-body[b-pvow8todjb] {
    padding: 0 var(--ax-space-5) var(--ax-space-5);
    border-top: 1px solid var(--ax-border-soft);
}

.studio-intro-body .panel-help:first-child[b-pvow8todjb] {
    margin-top: var(--ax-space-4);
}

/* =========================================================================
   Badge "Stai calcolando con: X"
   Mostrato in cima ai passi 2-5 perché i dropdown della norma stanno solo
   nel Passo 1; senza badge l'utente che torna nei passi seguenti perde il
   contesto su quale norma sta applicando, soprattutto se gestisce più
   studi in parallelo.
   ========================================================================= */
.badge-norma-corrente[b-pvow8todjb] {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    padding: 6px 12px;
    margin: 4px 0 var(--ax-space-3) 0;
    background: var(--ax-highlight-soft);
    border: 1px solid color-mix(in srgb, var(--ax-highlight) 25%, transparent);
    border-radius: var(--ax-radius-sm);
    font-size: var(--ax-fs-12);
    color: var(--ax-text-2);
}

.badge-norma-corrente-label[b-pvow8todjb] {
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ax-text-3);
    font-weight: 600;
}

.badge-norma-corrente strong[b-pvow8todjb] {
    color: var(--ax-highlight-strong);
    font-weight: 600;
}