/* G-Hub glass design system chrome + dashboard — scoped to .ghub-shell / .ghub-dashboard */

.ghub-shell {
    --ghub-glass-blur: 28px;
    --ghub-radius: 12px;
    /* Fallback accent (agent) — ogni ghub-module--* sovrascrive */
    --ghub-accent-rgb: 125, 255, 224;
    --ghub-surface-rgb: 14, 42, 32;
    /* Accento UI interattivo G-Hub (icone accese, placeholder, primary/info Mud) */
    --ghub-interactive: #ff9800;
    --ghub-interactive-rgb: 255, 152, 0;
    --ghub-interactive-soft: rgba(255, 152, 0, 0.22);
    /* Label campi / hint / collapse — grigio chiaro opaco (senza alpha) */
    --ghub-form-muted: #a0a0a0;
    --ghub-grid-sticky-bg: rgb(var(--ghub-surface-rgb));
    --ghub-grid-sticky-bg-head: rgb(var(--ghub-surface-rgb));
    position: relative;
    min-height: 100vh;
}

.ghub-shell .mud-main-content {
    position: relative;
    z-index: 0;
    background-color: transparent !important;
    --mud-palette-surface: transparent !important;
    --mud-palette-background: transparent !important;
    --mud-palette-primary: var(--ghub-interactive);
    --mud-palette-info: var(--ghub-interactive);
    --mud-palette-info-lighten: var(--ghub-interactive-soft);
    --mud-palette-primary-lighten: var(--ghub-interactive-soft);
    --mud-palette-primary-darken: #e65100;
    /* Testo/icone su filled primary (arancione): scuro per contrasto leggibile */
    --mud-palette-primary-text: #1a1a1a;
    --mud-palette-text-primary: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96));
    --mud-palette-text-secondary: rgba(255, 255, 255, 0.72);
    --mud-palette-text-disabled: rgba(255, 255, 255, 0.42);
    --mud-palette-action-default: rgba(255, 255, 255, 0.78);
}

/* Dialog: solo token palette — NON transparent / z-index basso (lo scrim overlay starebbe sopra) */
body:has(.ghub-shell) .mud-dialog-container .mud-dialog {
    --mud-palette-primary: var(--ghub-interactive, #ff9800);
    --mud-palette-info: var(--ghub-interactive, #ff9800);
    --mud-palette-info-lighten: var(--ghub-interactive-soft, rgba(255, 152, 0, 0.22));
    --mud-palette-primary-lighten: var(--ghub-interactive-soft, rgba(255, 152, 0, 0.22));
    --mud-palette-primary-darken: #e65100;
    --mud-palette-primary-text: #1a1a1a;
    --mud-palette-surface: rgb(var(--ghub-surface-rgb, 38, 32, 12));
    --mud-palette-background: rgb(var(--ghub-surface-rgb, 38, 32, 12));
    --mud-palette-text-primary: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96));
    /* Icone default + HelperText Mud usano text-secondary (altrimenti restano neri) */
    --mud-palette-text-secondary: rgba(255, 255, 255, 0.72);
    --mud-palette-text-disabled: rgba(255, 255, 255, 0.42);
    --mud-palette-action-default: rgba(255, 255, 255, 0.78);
}

/* Viewer 3D: titolo a tema, area rendering bianca edge-to-edge, senza contorni (solo G-Hub) */
body:has(.ghub-shell) .mud-dialog-container .mud-dialog.ghub-viewer3d-dialog {
    border: none !important;
    outline: none !important;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.55) !important;
    overflow: hidden;
    background-color: rgb(var(--ghub-surface-rgb, 38, 32, 12)) !important;
    background-image: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

body:has(.ghub-shell) .mud-dialog-container .mud-dialog.ghub-viewer3d-dialog .mud-dialog-title {
    background-color: rgb(var(--ghub-surface-rgb, 38, 32, 12)) !important;
    background-image: none !important;
    color: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96)) !important;
    border: none !important;
    border-bottom: none !important;
}

body:has(.ghub-shell) .mud-dialog-container .mud-dialog.ghub-viewer3d-dialog .mud-dialog-title .mud-typography {
    color: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96)) !important;
}

body:has(.ghub-shell) .mud-dialog-container .mud-dialog.ghub-viewer3d-dialog .mud-dialog-title .mud-button-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog.ghub-viewer3d-dialog .mud-dialog-title .mud-icon-button .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog.ghub-viewer3d-dialog .mud-dialog-title .mud-icon-button .mud-svg-icon {
    color: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96)) !important;
}

body:has(.ghub-shell) .mud-dialog-container .mud-dialog.ghub-viewer3d-dialog .mud-dialog-content {
    background-color: #ffffff !important;
    background-image: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

/* FileUploadDialog — riga selezionata: solo sfondo a contrasto (niente bordo/font) */
body:has(.ghub-shell) .mud-dialog-container .file-upload-existing-list .mud-list-item.file-upload-selected,
body:has(.ghub-shell) .mud-dialog-container .file-upload-existing-list .mud-list-item.mud-selected-item {
    background-color: rgba(var(--ghub-interactive-rgb, 255, 152, 0), 0.28) !important;
    background-image: none !important;
}

/* MultimediaFilesPage — tree cartelle: altezza ≥ 2 righe nome + selezione a tutta riga.
   MudBlazor 9: mud-treeview-item-selected è su .mud-treeview-item-content, non sul li. */
.ghub-shell .mud-main-content .mm-folder-tree .mud-treeview-item-content {
    min-height: 56px;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    box-sizing: border-box;
    align-items: center !important;
}

/* BodyContent sta dentro .mud-treeview-item-label (non è figlio diretto di content). */
.ghub-shell .mud-main-content .mm-folder-tree .mud-treeview-item-label {
    display: flex;
    min-width: 0;
    align-items: center;
}

.ghub-shell .mud-main-content .mm-folder-tree .mm-folder-row {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    gap: 6px;
}

.ghub-shell .mud-main-content .mm-folder-tree .mm-folder-name {
    flex: 1 1 auto !important;
    min-width: 0;
}

.ghub-shell .mud-main-content .mm-folder-tree .mm-folder-actions {
    flex-shrink: 0;
    margin-left: auto;
}

.ghub-shell .mud-main-content .mm-folder-tree .mud-treeview-item-content.mud-treeview-item-selected,
.ghub-shell .mud-main-content .mm-folder-tree .mud-treeview-item.mm-folder-selected > .mud-treeview-item-content,
.ghub-shell .mud-main-content .mm-folder-tree .mud-treeview-item-content.mm-folder-row-selected {
    background-color: rgba(var(--ghub-interactive-rgb, 255, 152, 0), 0.28) !important;
    background-image: none !important;
    border-radius: 4px;
}

.ghub-shell .mud-main-content .mm-folder-tree .mud-treeview-item.mud-treeview-item-selected {
    background-color: transparent !important;
}

/* Badge conteggio: grigio a contrasto + numero accent (non primary su cartella Warning). */
.ghub-shell .mud-main-content .mm-folder-tree .mm-folder-badge .mud-badge {
    font-size: 0.55rem !important;
    min-width: 1rem !important;
    height: 1rem !important;
    padding: 0 0.2rem !important;
    line-height: 1rem !important;
    background-color: #000000 !important;
    color: var(--ghub-interactive, #ff9800) !important;
}

.ghub-shell .mud-main-content .mm-folder-tree .mm-folder-badge .mud-badge.mm-folder-count,
.ghub-shell .mud-main-content .mm-folder-tree .mm-folder-badge .mud-badge.mud-badge-bottom.center,
.ghub-shell .mud-main-content .mm-folder-tree .mm-folder-badge .mud-badge.mud-badge-bottom.center.mud-badge-overlap {
    inset: unset !important;
    top: 72% !important;
    left: 28% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
}

.ghub-shell .mud-main-content .mm-folder-tree .mm-folder-info-icon.mud-icon-button {
    width: 2.25rem !important;
    height: 2.25rem !important;
    padding: 0.375rem !important;
}

.ghub-shell .mud-main-content .mm-folder-tree .mm-folder-info-icon.mud-icon-button .mud-icon-root,
.ghub-shell .mud-main-content .mm-folder-tree .mm-folder-info-icon.mud-icon-button .mud-svg-icon,
.ghub-shell .mud-main-content .mm-folder-tree .mm-folder-info-icon.mud-icon-button svg {
    font-size: 1.35rem !important;
    width: 1.35rem !important;
    height: 1.35rem !important;
    color: rgba(255, 255, 255, 0.92) !important;
    fill: currentColor !important;
}

/* Lucchetto auth senza grant: bianco illuminato (esclude --on / Info) */
.ghub-shell .mud-main-content .mm-folder-tree .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on) .mud-icon-root,
.ghub-shell .mud-main-content .mm-folder-tree .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on) .mud-svg-icon,
.ghub-shell .mud-main-content .mm-folder-tree .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on) svg,
.ghub-shell .mud-main-content .mud-data-grid .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on):not(.mud-info-text) .mud-icon-root,
.ghub-shell .mud-main-content .mud-data-grid .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on):not(.mud-info-text) .mud-svg-icon,
.ghub-shell .mud-main-content .mud-data-grid .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on):not(.mud-info-text) svg {
    color: rgba(255, 255, 255, 0.92) !important;
    fill: currentColor !important;
    opacity: 1 !important;
    filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0.35));
}

.ghub-viewer3d-dialog__stage {
    width: 100%;
    height: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background-color: #ffffff;
    margin: 0;
    padding: 0;
    border: none;
}

.ghub-viewer3d-dialog__stage babylon-viewer {
    display: block;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    border: none;
    outline: none;
}

.ghub-simulator3d-paper {
    overflow: hidden;
}

.ghub-simulator3d-stage {
    position: relative;
    width: 100%;
    height: min(62vh, 640px);
    min-height: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
}

.ghub-simulator3d-stage babylon-viewer {
    display: block;
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
}

.ghub-simulator3d-stage__loading {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.55);
}

.ghub-simulator3d-stage__placeholder {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    background: rgba(255, 255, 255, 0.92);
}

/* ScreenCheckDialog: blur sullo scrim (BackgroundClass) */
.custom-blur-dialog {
    backdrop-filter: blur(10px);
}

/* ---- Scuro (ex Illuminato): palette per modulo (colore lettera logo) ---- */
.ghub-module--hub.ghub-shell--dark {
    --ghub-accent-rgb: 255, 138, 128;
    --ghub-surface-rgb: 42, 16, 14;
    --ghub-bg: #140807;
    --ghub-bg-accent: #2a100e;
    --ghub-glass-bg: rgba(32, 12, 10, 0.38);
    --ghub-glass-chrome: rgba(20, 6, 5, 0.88);
    --ghub-glass-bg-strong: rgba(32, 12, 10, 0.7);
    --ghub-glass-card: rgba(42, 16, 14, 0.52);
    --ghub-glass-card-strong: rgba(52, 20, 18, 0.62);
    --ghub-glass-border: rgba(255, 138, 128, 0.32);
    --ghub-glass-edge: rgba(255, 200, 190, 0.7);
    --ghub-cyan: rgba(255, 138, 128, 0.55);
    --ghub-glow: rgba(255, 138, 128, 0.42);
    --ghub-glow-soft: rgba(229, 57, 53, 0.22);
    --ghub-active: rgba(255, 138, 128, 0.22);
    --ghub-active-bar: #ff8a80;
    --ghub-chrome-fg: rgba(255, 248, 246, 0.96);
    --ghub-pattern: rgba(255, 138, 128, 0.11);
    --ghub-drawer-glass: rgba(58, 22, 20, 0.58);
    --ghub-drawer-border: rgba(255, 138, 128, 0.28);
    --ghub-card-glass: rgba(42, 18, 16, 0.58);
    --ghub-card-border: rgba(255, 138, 128, 0.35);
    --ghub-card-border-top: rgba(255, 180, 170, 0.5);
    --ghub-dash-card-top: rgba(52, 18, 16, 0.88);
    --ghub-dash-card-bottom: rgba(32, 10, 8, 0.92);
    --ghub-dash-card-border: rgba(229, 57, 53, 0.36);
    --ghub-dash-card-glow: rgba(229, 57, 53, 0.2);
    --ghub-dash-hover-top: rgba(62, 22, 18, 0.92);
    --ghub-dash-hover-bottom: rgba(38, 12, 10, 0.94);
    --ghub-select-glass: rgba(68, 28, 24, 0.55);
    --ghub-select-border: rgba(255, 160, 150, 0.38);
    --ghub-appbar-edge: rgba(10, 4, 3, 0.92);
    --ghub-appbar-mid: rgba(28, 10, 8, 0.78);
    --ghub-appbar-center: rgba(42, 16, 12, 0.72);
    --ghub-appbar-center-glow: rgba(255, 138, 128, 0.22);
    --ghub-appbar-bottom-line: rgba(255, 138, 128, 0.55);
    --ghub-logo-glow: rgba(255, 138, 128, 0.42);
    --ghub-clickable-fg: #ff8a80;
}

.ghub-module--agent.ghub-shell--dark {
    --ghub-accent-rgb: 125, 255, 224;
    --ghub-surface-rgb: 14, 42, 32;
    --ghub-bg: #07140f;
    --ghub-bg-accent: #0e2a1c;
    --ghub-glass-bg: rgba(10, 32, 24, 0.38);
    --ghub-glass-chrome: rgba(4, 16, 11, 0.88);
    --ghub-glass-bg-strong: rgba(10, 32, 24, 0.7);
    --ghub-glass-card: rgba(14, 42, 32, 0.52);
    --ghub-glass-card-strong: rgba(18, 52, 40, 0.62);
    --ghub-glass-border: rgba(80, 255, 210, 0.32);
    --ghub-glass-edge: rgba(170, 255, 235, 0.7);
    --ghub-cyan: rgba(80, 255, 230, 0.55);
    --ghub-glow: rgba(0, 245, 200, 0.42);
    --ghub-glow-soft: rgba(0, 220, 190, 0.22);
    --ghub-active: rgba(0, 230, 160, 0.22);
    --ghub-active-bar: #00f0a8;
    --ghub-chrome-fg: rgba(245, 255, 250, 0.96);
    --ghub-pattern: rgba(0, 230, 170, 0.11);
    --ghub-drawer-glass: rgba(22, 58, 44, 0.58);
    --ghub-drawer-border: rgba(80, 255, 210, 0.28);
    --ghub-card-glass: rgba(14, 45, 34, 0.58);
    --ghub-card-border: rgba(80, 255, 210, 0.35);
    --ghub-card-border-top: rgba(120, 255, 220, 0.5);
    --ghub-dash-card-top: rgba(14, 52, 38, 0.88);
    --ghub-dash-card-bottom: rgba(8, 32, 22, 0.92);
    --ghub-dash-card-border: rgba(0, 168, 102, 0.36);
    --ghub-dash-card-glow: rgba(0, 140, 88, 0.2);
    --ghub-dash-hover-top: rgba(18, 62, 46, 0.92);
    --ghub-dash-hover-bottom: rgba(10, 38, 26, 0.94);
    --ghub-select-glass: rgba(28, 68, 54, 0.55);
    --ghub-select-border: rgba(100, 255, 210, 0.38);
    --ghub-appbar-edge: rgba(2, 10, 7, 0.92);
    --ghub-appbar-mid: rgba(6, 28, 20, 0.78);
    --ghub-appbar-center: rgba(10, 42, 30, 0.72);
    --ghub-appbar-center-glow: rgba(0, 220, 160, 0.22);
    --ghub-appbar-bottom-line: rgba(80, 255, 230, 0.55);
    --ghub-logo-glow: rgba(0, 230, 170, 0.42);
    --ghub-clickable-fg: #7dffe0;
}

.ghub-module--bridge.ghub-shell--dark {
    --ghub-accent-rgb: 130, 177, 255;
    --ghub-surface-rgb: 16, 28, 42;
    --ghub-bg: #070d14;
    --ghub-bg-accent: #0e182a;
    --ghub-glass-bg: rgba(10, 20, 32, 0.38);
    --ghub-glass-chrome: rgba(4, 10, 20, 0.88);
    --ghub-glass-bg-strong: rgba(10, 20, 32, 0.7);
    --ghub-glass-card: rgba(14, 28, 42, 0.52);
    --ghub-glass-card-strong: rgba(18, 36, 52, 0.62);
    --ghub-glass-border: rgba(130, 177, 255, 0.32);
    --ghub-glass-edge: rgba(190, 210, 255, 0.7);
    --ghub-cyan: rgba(130, 177, 255, 0.55);
    --ghub-glow: rgba(130, 177, 255, 0.42);
    --ghub-glow-soft: rgba(30, 136, 229, 0.22);
    --ghub-active: rgba(130, 177, 255, 0.22);
    --ghub-active-bar: #82b1ff;
    --ghub-chrome-fg: rgba(246, 250, 255, 0.96);
    --ghub-pattern: rgba(130, 177, 255, 0.11);
    --ghub-drawer-glass: rgba(22, 38, 58, 0.58);
    --ghub-drawer-border: rgba(130, 177, 255, 0.28);
    --ghub-card-glass: rgba(16, 32, 48, 0.58);
    --ghub-card-border: rgba(130, 177, 255, 0.35);
    --ghub-card-border-top: rgba(170, 200, 255, 0.5);
    --ghub-dash-card-top: rgba(16, 36, 52, 0.88);
    --ghub-dash-card-bottom: rgba(8, 22, 36, 0.92);
    --ghub-dash-card-border: rgba(30, 136, 229, 0.36);
    --ghub-dash-card-glow: rgba(30, 136, 229, 0.2);
    --ghub-dash-hover-top: rgba(20, 44, 62, 0.92);
    --ghub-dash-hover-bottom: rgba(10, 28, 42, 0.94);
    --ghub-select-glass: rgba(28, 48, 68, 0.55);
    --ghub-select-border: rgba(150, 190, 255, 0.38);
    --ghub-appbar-edge: rgba(2, 6, 14, 0.92);
    --ghub-appbar-mid: rgba(6, 18, 32, 0.78);
    --ghub-appbar-center: rgba(10, 28, 42, 0.72);
    --ghub-appbar-center-glow: rgba(130, 177, 255, 0.22);
    --ghub-appbar-bottom-line: rgba(130, 177, 255, 0.55);
    --ghub-logo-glow: rgba(130, 177, 255, 0.42);
    --ghub-clickable-fg: #82b1ff;
}

.ghub-module--sync.ghub-shell--dark {
    --ghub-accent-rgb: 225, 190, 231;
    --ghub-surface-rgb: 28, 18, 42;
    --ghub-bg: #0f0714;
    --ghub-bg-accent: #180e2a;
    --ghub-glass-bg: rgba(20, 12, 32, 0.38);
    --ghub-glass-chrome: rgba(10, 5, 18, 0.88);
    --ghub-glass-bg-strong: rgba(20, 12, 32, 0.7);
    --ghub-glass-card: rgba(28, 18, 42, 0.52);
    --ghub-glass-card-strong: rgba(36, 24, 52, 0.62);
    --ghub-glass-border: rgba(225, 190, 231, 0.32);
    --ghub-glass-edge: rgba(240, 220, 245, 0.7);
    --ghub-cyan: rgba(225, 190, 231, 0.55);
    --ghub-glow: rgba(225, 190, 231, 0.42);
    --ghub-glow-soft: rgba(126, 87, 194, 0.22);
    --ghub-active: rgba(225, 190, 231, 0.22);
    --ghub-active-bar: #e1bee7;
    --ghub-chrome-fg: rgba(252, 248, 255, 0.96);
    --ghub-pattern: rgba(225, 190, 231, 0.11);
    --ghub-drawer-glass: rgba(38, 24, 58, 0.58);
    --ghub-drawer-border: rgba(225, 190, 231, 0.28);
    --ghub-card-glass: rgba(32, 20, 48, 0.58);
    --ghub-card-border: rgba(225, 190, 231, 0.35);
    --ghub-card-border-top: rgba(240, 210, 248, 0.5);
    --ghub-dash-card-top: rgba(32, 20, 48, 0.88);
    --ghub-dash-card-bottom: rgba(18, 10, 32, 0.92);
    --ghub-dash-card-border: rgba(126, 87, 194, 0.36);
    --ghub-dash-card-glow: rgba(126, 87, 194, 0.2);
    --ghub-dash-hover-top: rgba(38, 24, 56, 0.92);
    --ghub-dash-hover-bottom: rgba(22, 14, 36, 0.94);
    --ghub-select-glass: rgba(48, 32, 68, 0.55);
    --ghub-select-border: rgba(210, 180, 230, 0.38);
    --ghub-appbar-edge: rgba(6, 3, 12, 0.92);
    --ghub-appbar-mid: rgba(16, 10, 28, 0.78);
    --ghub-appbar-center: rgba(24, 16, 38, 0.72);
    --ghub-appbar-center-glow: rgba(225, 190, 231, 0.22);
    --ghub-appbar-bottom-line: rgba(225, 190, 231, 0.55);
    --ghub-logo-glow: rgba(225, 190, 231, 0.42);
    --ghub-clickable-fg: #e1bee7;
}

.ghub-module--atelier.ghub-shell--dark {
    --ghub-accent-rgb: 255, 245, 157;
    --ghub-surface-rgb: 42, 36, 14;
    --ghub-bg: #141007;
    --ghub-bg-accent: #2a220e;
    --ghub-glass-bg: rgba(32, 26, 10, 0.38);
    --ghub-glass-chrome: rgba(18, 14, 4, 0.88);
    --ghub-glass-bg-strong: rgba(32, 26, 10, 0.7);
    --ghub-glass-card: rgba(42, 34, 14, 0.52);
    --ghub-glass-card-strong: rgba(52, 42, 18, 0.62);
    --ghub-glass-border: rgba(255, 245, 157, 0.3);
    --ghub-glass-edge: rgba(255, 248, 200, 0.7);
    --ghub-cyan: rgba(255, 245, 157, 0.5);
    --ghub-glow: rgba(255, 245, 157, 0.38);
    --ghub-glow-soft: rgba(253, 216, 53, 0.2);
    --ghub-active: rgba(255, 245, 157, 0.2);
    --ghub-active-bar: #fff59d;
    --ghub-chrome-fg: rgba(255, 252, 240, 0.96);
    --ghub-pattern: rgba(255, 245, 157, 0.1);
    --ghub-drawer-glass: rgba(58, 48, 22, 0.58);
    --ghub-drawer-border: rgba(255, 245, 157, 0.26);
    --ghub-card-glass: rgba(48, 40, 16, 0.58);
    --ghub-card-border: rgba(255, 245, 157, 0.32);
    --ghub-card-border-top: rgba(255, 248, 180, 0.48);
    --ghub-dash-card-top: rgba(48, 40, 16, 0.88);
    --ghub-dash-card-bottom: rgba(28, 22, 8, 0.92);
    --ghub-dash-card-border: rgba(253, 216, 53, 0.34);
    --ghub-dash-card-glow: rgba(253, 216, 53, 0.18);
    --ghub-dash-hover-top: rgba(56, 46, 18, 0.92);
    --ghub-dash-hover-bottom: rgba(34, 28, 10, 0.94);
    --ghub-select-glass: rgba(68, 56, 24, 0.55);
    --ghub-select-border: rgba(255, 230, 120, 0.36);
    --ghub-appbar-edge: rgba(10, 8, 2, 0.92);
    --ghub-appbar-mid: rgba(28, 22, 6, 0.78);
    --ghub-appbar-center: rgba(42, 34, 10, 0.72);
    --ghub-appbar-center-glow: rgba(255, 245, 157, 0.2);
    --ghub-appbar-bottom-line: rgba(255, 245, 157, 0.5);
    --ghub-logo-glow: rgba(255, 245, 157, 0.38);
    --ghub-clickable-fg: #fff59d;
}

.ghub-module--passport.ghub-shell--dark {
    --ghub-accent-rgb: 255, 204, 128;
    --ghub-surface-rgb: 42, 28, 12;
    --ghub-bg: #140c06;
    --ghub-bg-accent: #2a1a0c;
    --ghub-glass-bg: rgba(32, 20, 10, 0.38);
    --ghub-glass-chrome: rgba(16, 10, 4, 0.88);
    --ghub-glass-bg-strong: rgba(32, 20, 10, 0.7);
    --ghub-glass-card: rgba(42, 28, 12, 0.52);
    --ghub-glass-card-strong: rgba(52, 34, 16, 0.62);
    --ghub-glass-border: rgba(255, 183, 77, 0.32);
    --ghub-glass-edge: rgba(255, 224, 178, 0.7);
    --ghub-cyan: rgba(255, 183, 77, 0.55);
    --ghub-glow: rgba(251, 140, 0, 0.42);
    --ghub-glow-soft: rgba(251, 140, 0, 0.22);
    --ghub-active: rgba(251, 140, 0, 0.18);
    --ghub-active-bar: #fb8c00;
    --ghub-chrome-fg: rgba(255, 248, 240, 0.96);
    --ghub-pattern: rgba(251, 140, 0, 0.11);
    --ghub-drawer-glass: rgba(52, 32, 14, 0.58);
    --ghub-drawer-border: rgba(255, 183, 77, 0.28);
    --ghub-card-glass: rgba(48, 30, 12, 0.58);
    --ghub-card-border: rgba(255, 183, 77, 0.35);
    --ghub-card-border-top: rgba(255, 204, 128, 0.5);
    --ghub-dash-card-top: rgba(52, 32, 14, 0.88);
    --ghub-dash-card-bottom: rgba(28, 16, 8, 0.92);
    --ghub-dash-card-border: rgba(251, 140, 0, 0.36);
    --ghub-dash-card-glow: rgba(251, 140, 0, 0.2);
    --ghub-dash-hover-top: rgba(58, 36, 16, 0.92);
    --ghub-dash-hover-bottom: rgba(32, 18, 10, 0.94);
    --ghub-select-glass: rgba(58, 36, 16, 0.55);
    --ghub-select-border: rgba(255, 183, 77, 0.38);
    --ghub-appbar-edge: rgba(10, 6, 2, 0.92);
    --ghub-appbar-mid: rgba(28, 16, 8, 0.78);
    --ghub-appbar-center: rgba(42, 26, 12, 0.72);
    --ghub-appbar-center-glow: rgba(251, 140, 0, 0.22);
    --ghub-appbar-bottom-line: rgba(255, 183, 77, 0.55);
    --ghub-logo-glow: rgba(251, 140, 0, 0.42);
    --ghub-clickable-fg: #ffcc80;
}

.ghub-module--sell.ghub-shell--dark {
    --ghub-accent-rgb: 255, 171, 145;
    --ghub-surface-rgb: 42, 22, 16;
    --ghub-bg: #140906;
    --ghub-bg-accent: #2a140c;
    --ghub-glass-bg: rgba(32, 16, 12, 0.38);
    --ghub-glass-chrome: rgba(16, 8, 4, 0.88);
    --ghub-glass-bg-strong: rgba(32, 16, 12, 0.7);
    --ghub-glass-card: rgba(42, 22, 16, 0.52);
    --ghub-glass-card-strong: rgba(52, 28, 20, 0.62);
    --ghub-glass-border: rgba(255, 171, 145, 0.32);
    --ghub-glass-edge: rgba(255, 204, 188, 0.7);
    --ghub-cyan: rgba(255, 171, 145, 0.55);
    --ghub-glow: rgba(255, 112, 67, 0.42);
    --ghub-glow-soft: rgba(255, 112, 67, 0.22);
    --ghub-active: rgba(255, 112, 67, 0.18);
    --ghub-active-bar: #ff7043;
    --ghub-chrome-fg: rgba(255, 246, 242, 0.96);
    --ghub-pattern: rgba(255, 112, 67, 0.11);
    --ghub-drawer-glass: rgba(52, 26, 18, 0.58);
    --ghub-drawer-border: rgba(255, 171, 145, 0.28);
    --ghub-card-glass: rgba(48, 24, 16, 0.58);
    --ghub-card-border: rgba(255, 171, 145, 0.35);
    --ghub-card-border-top: rgba(255, 171, 145, 0.5);
    --ghub-dash-card-top: rgba(52, 26, 18, 0.88);
    --ghub-dash-card-bottom: rgba(28, 12, 8, 0.92);
    --ghub-dash-card-border: rgba(255, 112, 67, 0.36);
    --ghub-dash-card-glow: rgba(255, 112, 67, 0.2);
    --ghub-dash-hover-top: rgba(58, 30, 20, 0.92);
    --ghub-dash-hover-bottom: rgba(32, 14, 10, 0.94);
    --ghub-select-glass: rgba(58, 30, 20, 0.55);
    --ghub-select-border: rgba(255, 171, 145, 0.38);
    --ghub-appbar-edge: rgba(10, 4, 2, 0.92);
    --ghub-appbar-mid: rgba(28, 12, 8, 0.78);
    --ghub-appbar-center: rgba(42, 20, 14, 0.72);
    --ghub-appbar-center-glow: rgba(255, 112, 67, 0.22);
    --ghub-appbar-bottom-line: rgba(255, 171, 145, 0.55);
    --ghub-logo-glow: rgba(255, 112, 67, 0.42);
    --ghub-clickable-fg: #ffab91;
}

/* ---- Chiaro: grigio #EBEBEB + tint modulo (no glow) ---- */
.ghub-shell--light {
    /* Accent UI pi� scuro: leggibile su sfondi chiari (grafici, primary, refresh) */
    --ghub-interactive: #e65100;
    --ghub-interactive-rgb: 230, 81, 0;
    --ghub-interactive-soft: rgba(230, 81, 0, 0.2);
    --mud-palette-primary: #e65100;
    --mud-palette-info: #e65100;
    --mud-palette-primary-darken: #bf360c;
    --mud-palette-primary-lighten: rgba(230, 81, 0, 0.2);
    --mud-palette-info-lighten: rgba(230, 81, 0, 0.2);
    --mud-palette-primary-text: #ffffff;
    --mud-palette-info-text: #ffffff;
    --ghub-bg: #EBEBEB;
    --ghub-bg-accent: #E4E4E4;
    --ghub-glass-bg: rgba(255, 255, 255, 0.78);
    --ghub-glass-chrome: rgba(255, 255, 255, 0.92);
    --ghub-glass-bg-strong: rgba(255, 255, 255, 0.95);
    --ghub-glass-card: rgba(255, 255, 255, 0.9);
    --ghub-glass-card-strong: rgba(255, 255, 255, 0.96);
    --ghub-glass-border: rgba(0, 0, 0, 0.1);
    --ghub-glass-edge: rgba(255, 255, 255, 0.95);
    --ghub-cyan: rgba(0, 0, 0, 0.18);
    --ghub-glow: transparent;
    --ghub-glow-soft: transparent;
    --ghub-active: rgba(0, 0, 0, 0.06);
    --ghub-active-bar: rgba(0, 0, 0, 0.4);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
    --ghub-pattern: rgba(0, 0, 0, 0.035);
    --ghub-drawer-glass: rgba(255, 255, 255, 0.92);
    --ghub-drawer-border: rgba(0, 0, 0, 0.1);
    --ghub-card-glass: rgba(255, 255, 255, 0.92);
    --ghub-card-border: rgba(0, 0, 0, 0.1);
    --ghub-card-border-top: rgba(0, 0, 0, 0.14);
    --ghub-dash-card-top: rgba(255, 255, 255, 0.96);
    --ghub-dash-card-bottom: rgba(247, 247, 247, 0.98);
    --ghub-dash-card-border: rgba(0, 0, 0, 0.1);
    --ghub-dash-card-glow: transparent;
    --ghub-dash-hover-top: rgba(255, 255, 255, 1);
    --ghub-dash-hover-bottom: rgba(245, 245, 245, 1);
    --ghub-select-glass: rgba(255, 255, 255, 0.95);
    --ghub-select-border: rgba(0, 0, 0, 0.16);
    --ghub-appbar-edge: rgba(235, 235, 235, 0.96);
    --ghub-appbar-mid: rgba(245, 245, 245, 0.94);
    --ghub-appbar-center: rgba(255, 255, 255, 0.92);
    --ghub-appbar-center-glow: transparent;
    --ghub-appbar-bottom-line: rgba(0, 0, 0, 0.12);
    --ghub-logo-glow: transparent;
    --ghub-form-muted: #757575;
    /* Sticky: tono unico, solo un filo piu scuro dello sfondo griglia */
    --ghub-grid-sticky-bg: color-mix(in srgb, rgb(var(--ghub-surface-rgb)) 97%, #000000 3%);
    --ghub-grid-sticky-bg-head: color-mix(in srgb, rgb(var(--ghub-surface-rgb)) 95%, #000000 5%);
}

.ghub-module--hub.ghub-shell--light {
    --ghub-accent-rgb: 229, 57, 53;
    --ghub-surface-rgb: 250, 240, 240;
    --ghub-bg: color-mix(in srgb, #e53935 6%, #EBEBEB);
    --ghub-bg-accent: color-mix(in srgb, #e53935 10%, #EBEBEB);
    --ghub-clickable-fg: #e53935;
    --ghub-active-bar: #c62828;
    --ghub-active: rgba(198, 40, 40, 0.26);
    --ghub-glow: transparent;
    --ghub-glow-soft: transparent;
    --ghub-pattern: rgba(229, 57, 53, 0.05);
    --ghub-glass-border: rgba(229, 57, 53, 0.18);
    --ghub-select-glass: color-mix(in srgb, #e53935 14%, #ffffff);
    --ghub-select-border: rgba(229, 57, 53, 0.32);
    --ghub-drawer-glass: color-mix(in srgb, #e53935 12%, #ffffff);
    --ghub-drawer-border: rgba(229, 57, 53, 0.2);
    --ghub-card-glass: color-mix(in srgb, #e53935 12%, #ffffff);
    --ghub-card-border: rgba(229, 57, 53, 0.2);
    --ghub-card-border-top: rgba(229, 57, 53, 0.32);
    --ghub-dash-card-top: color-mix(in srgb, #e53935 14%, #ffffff);
    --ghub-dash-card-bottom: color-mix(in srgb, #e53935 10%, #f7f7f7);
    --ghub-dash-card-border: rgba(229, 57, 53, 0.26);
    --ghub-dash-card-glow: transparent;
    --ghub-appbar-edge: color-mix(in srgb, #e53935 8%, #EBEBEB);
    --ghub-appbar-mid: color-mix(in srgb, #e53935 10%, #f5f5f5);
    --ghub-appbar-center: color-mix(in srgb, #e53935 12%, #ffffff);
    --ghub-appbar-center-glow: transparent;
    --ghub-appbar-bottom-line: rgba(229, 57, 53, 0.4);
    --ghub-logo-glow: transparent;
    --ghub-dash-hover-top: color-mix(in srgb, #e53935 18%, #ffffff);
    --ghub-dash-hover-bottom: color-mix(in srgb, #e53935 12%, #f5f5f5);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
}

.ghub-module--agent.ghub-shell--light {
    --ghub-accent-rgb: 82, 217, 138;
    --ghub-surface-rgb: 236, 248, 242;
    --ghub-bg: color-mix(in srgb, #52d98a 6%, #EBEBEB);
    --ghub-bg-accent: color-mix(in srgb, #52d98a 10%, #EBEBEB);
    --ghub-clickable-fg: #52d98a;
    --ghub-active-bar: #2e7d32;
    --ghub-active: rgba(46, 125, 50, 0.26);
    --ghub-glow: transparent;
    --ghub-glow-soft: transparent;
    --ghub-pattern: rgba(82, 217, 138, 0.06);
    --ghub-glass-border: rgba(46, 125, 79, 0.18);
    --ghub-select-glass: color-mix(in srgb, #52d98a 14%, #ffffff);
    --ghub-select-border: rgba(46, 125, 79, 0.32);
    --ghub-drawer-glass: color-mix(in srgb, #52d98a 12%, #ffffff);
    --ghub-drawer-border: rgba(46, 125, 79, 0.2);
    --ghub-card-glass: color-mix(in srgb, #52d98a 12%, #ffffff);
    --ghub-card-border: rgba(46, 125, 79, 0.2);
    --ghub-card-border-top: rgba(46, 125, 79, 0.32);
    --ghub-dash-card-top: color-mix(in srgb, #52d98a 14%, #ffffff);
    --ghub-dash-card-bottom: color-mix(in srgb, #52d98a 10%, #f7f7f7);
    --ghub-dash-card-border: rgba(46, 125, 79, 0.26);
    --ghub-dash-card-glow: transparent;
    --ghub-appbar-edge: color-mix(in srgb, #52d98a 8%, #EBEBEB);
    --ghub-appbar-mid: color-mix(in srgb, #52d98a 10%, #f5f5f5);
    --ghub-appbar-center: color-mix(in srgb, #52d98a 12%, #ffffff);
    --ghub-appbar-center-glow: transparent;
    --ghub-appbar-bottom-line: rgba(46, 125, 79, 0.4);
    --ghub-logo-glow: transparent;
    --ghub-dash-hover-top: color-mix(in srgb, #52d98a 18%, #ffffff);
    --ghub-dash-hover-bottom: color-mix(in srgb, #52d98a 12%, #f5f5f5);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
}

.ghub-module--bridge.ghub-shell--light {
    --ghub-accent-rgb: 30, 136, 229;
    --ghub-surface-rgb: 236, 244, 252;
    --ghub-bg: color-mix(in srgb, #1e88e5 6%, #EBEBEB);
    --ghub-bg-accent: color-mix(in srgb, #1e88e5 10%, #EBEBEB);
    --ghub-clickable-fg: #1e88e5;
    --ghub-active-bar: #1565c0;
    --ghub-active: rgba(21, 101, 192, 0.24);
    --ghub-glow: transparent;
    --ghub-glow-soft: transparent;
    --ghub-pattern: rgba(30, 136, 229, 0.05);
    --ghub-glass-border: rgba(30, 136, 229, 0.18);
    --ghub-select-glass: color-mix(in srgb, #1e88e5 14%, #ffffff);
    --ghub-select-border: rgba(30, 136, 229, 0.32);
    --ghub-drawer-glass: color-mix(in srgb, #1e88e5 12%, #ffffff);
    --ghub-drawer-border: rgba(30, 136, 229, 0.2);
    --ghub-card-glass: color-mix(in srgb, #1e88e5 12%, #ffffff);
    --ghub-card-border: rgba(30, 136, 229, 0.2);
    --ghub-card-border-top: rgba(30, 136, 229, 0.32);
    --ghub-dash-card-top: color-mix(in srgb, #1e88e5 14%, #ffffff);
    --ghub-dash-card-bottom: color-mix(in srgb, #1e88e5 10%, #f7f7f7);
    --ghub-dash-card-border: rgba(30, 136, 229, 0.26);
    --ghub-dash-card-glow: transparent;
    --ghub-appbar-edge: color-mix(in srgb, #1e88e5 8%, #EBEBEB);
    --ghub-appbar-mid: color-mix(in srgb, #1e88e5 10%, #f5f5f5);
    --ghub-appbar-center: color-mix(in srgb, #1e88e5 12%, #ffffff);
    --ghub-appbar-center-glow: transparent;
    --ghub-appbar-bottom-line: rgba(30, 136, 229, 0.4);
    --ghub-logo-glow: transparent;
    --ghub-dash-hover-top: color-mix(in srgb, #1e88e5 18%, #ffffff);
    --ghub-dash-hover-bottom: color-mix(in srgb, #1e88e5 12%, #f5f5f5);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
}

.ghub-module--sync.ghub-shell--light {
    --ghub-accent-rgb: 126, 87, 194;
    --ghub-surface-rgb: 244, 238, 250;
    --ghub-bg: color-mix(in srgb, #7e57c2 6%, #EBEBEB);
    --ghub-bg-accent: color-mix(in srgb, #7e57c2 10%, #EBEBEB);
    --ghub-clickable-fg: #7e57c2;
    --ghub-active-bar: #5e35b1;
    --ghub-active: rgba(94, 53, 177, 0.24);
    --ghub-glow: transparent;
    --ghub-glow-soft: transparent;
    --ghub-pattern: rgba(126, 87, 194, 0.05);
    --ghub-glass-border: rgba(126, 87, 194, 0.18);
    --ghub-select-glass: color-mix(in srgb, #7e57c2 14%, #ffffff);
    --ghub-select-border: rgba(126, 87, 194, 0.32);
    --ghub-drawer-glass: color-mix(in srgb, #7e57c2 12%, #ffffff);
    --ghub-drawer-border: rgba(126, 87, 194, 0.2);
    --ghub-card-glass: color-mix(in srgb, #7e57c2 12%, #ffffff);
    --ghub-card-border: rgba(126, 87, 194, 0.2);
    --ghub-card-border-top: rgba(126, 87, 194, 0.32);
    --ghub-dash-card-top: color-mix(in srgb, #7e57c2 14%, #ffffff);
    --ghub-dash-card-bottom: color-mix(in srgb, #7e57c2 10%, #f7f7f7);
    --ghub-dash-card-border: rgba(126, 87, 194, 0.26);
    --ghub-dash-card-glow: transparent;
    --ghub-appbar-edge: color-mix(in srgb, #7e57c2 8%, #EBEBEB);
    --ghub-appbar-mid: color-mix(in srgb, #7e57c2 10%, #f5f5f5);
    --ghub-appbar-center: color-mix(in srgb, #7e57c2 12%, #ffffff);
    --ghub-appbar-center-glow: transparent;
    --ghub-appbar-bottom-line: rgba(126, 87, 194, 0.4);
    --ghub-logo-glow: transparent;
    --ghub-dash-hover-top: color-mix(in srgb, #7e57c2 18%, #ffffff);
    --ghub-dash-hover-bottom: color-mix(in srgb, #7e57c2 12%, #f5f5f5);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
}

.ghub-module--atelier.ghub-shell--light {
    --ghub-accent-rgb: 201, 145, 0;
    --ghub-surface-rgb: 252, 248, 230;
    --ghub-bg: color-mix(in srgb, #fdd835 7%, #EBEBEB);
    --ghub-bg-accent: color-mix(in srgb, #fdd835 12%, #EBEBEB);
    /* Giallo scuro (resta giallo, non arancio): contrasto su cream */
    --ghub-clickable-fg: #c99100;
    --ghub-active-bar: #c99100;
    --ghub-active: rgba(201, 145, 0, 0.28);
    --ghub-glow: transparent;
    --ghub-glow-soft: transparent;
    --ghub-pattern: rgba(201, 145, 0, 0.07);
    --ghub-glass-border: rgba(201, 145, 0, 0.28);
    --ghub-select-glass: color-mix(in srgb, #fdd835 16%, #ffffff);
    --ghub-select-border: rgba(201, 145, 0, 0.35);
    --ghub-drawer-glass: color-mix(in srgb, #fdd835 14%, #ffffff);
    --ghub-drawer-border: rgba(201, 145, 0, 0.28);
    --ghub-card-glass: color-mix(in srgb, #fdd835 14%, #ffffff);
    --ghub-card-border: rgba(201, 145, 0, 0.28);
    --ghub-card-border-top: rgba(201, 145, 0, 0.4);
    --ghub-dash-card-top: color-mix(in srgb, #fdd835 16%, #ffffff);
    --ghub-dash-card-bottom: color-mix(in srgb, #fdd835 11%, #f7f7f7);
    --ghub-dash-card-border: rgba(201, 145, 0, 0.3);
    --ghub-dash-card-glow: transparent;
    --ghub-appbar-edge: color-mix(in srgb, #fdd835 9%, #EBEBEB);
    --ghub-appbar-mid: color-mix(in srgb, #fdd835 12%, #f5f5f5);
    --ghub-appbar-center: color-mix(in srgb, #fdd835 14%, #ffffff);
    --ghub-appbar-center-glow: transparent;
    --ghub-appbar-bottom-line: rgba(201, 145, 0, 0.45);
    --ghub-logo-glow: transparent;
    --ghub-dash-hover-top: color-mix(in srgb, #fdd835 20%, #ffffff);
    --ghub-dash-hover-bottom: color-mix(in srgb, #fdd835 14%, #f5f5f5);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
}

.ghub-module--passport.ghub-shell--light {
    --ghub-accent-rgb: 251, 140, 0;
    --ghub-surface-rgb: 252, 244, 232;
    --ghub-bg: color-mix(in srgb, #fb8c00 6%, #EBEBEB);
    --ghub-bg-accent: color-mix(in srgb, #fb8c00 10%, #EBEBEB);
    --ghub-clickable-fg: #fb8c00;
    --ghub-active-bar: #e65100;
    --ghub-active: rgba(230, 81, 0, 0.26);
    --ghub-glow: transparent;
    --ghub-glow-soft: transparent;
    --ghub-pattern: rgba(251, 140, 0, 0.05);
    --ghub-glass-border: rgba(239, 108, 0, 0.18);
    --ghub-select-glass: color-mix(in srgb, #fb8c00 14%, #ffffff);
    --ghub-select-border: rgba(239, 108, 0, 0.32);
    --ghub-drawer-glass: color-mix(in srgb, #fb8c00 12%, #ffffff);
    --ghub-drawer-border: rgba(239, 108, 0, 0.2);
    --ghub-card-glass: color-mix(in srgb, #fb8c00 12%, #ffffff);
    --ghub-card-border: rgba(239, 108, 0, 0.2);
    --ghub-card-border-top: rgba(239, 108, 0, 0.32);
    --ghub-dash-card-top: color-mix(in srgb, #fb8c00 14%, #ffffff);
    --ghub-dash-card-bottom: color-mix(in srgb, #fb8c00 10%, #f7f7f7);
    --ghub-dash-card-border: rgba(239, 108, 0, 0.26);
    --ghub-dash-card-glow: transparent;
    --ghub-appbar-edge: color-mix(in srgb, #fb8c00 8%, #EBEBEB);
    --ghub-appbar-mid: color-mix(in srgb, #fb8c00 10%, #f5f5f5);
    --ghub-appbar-center: color-mix(in srgb, #fb8c00 12%, #ffffff);
    --ghub-appbar-center-glow: transparent;
    --ghub-appbar-bottom-line: rgba(239, 108, 0, 0.4);
    --ghub-logo-glow: transparent;
    --ghub-dash-hover-top: color-mix(in srgb, #fb8c00 18%, #ffffff);
    --ghub-dash-hover-bottom: color-mix(in srgb, #fb8c00 12%, #f5f5f5);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
}

.ghub-module--sell.ghub-shell--light {
    --ghub-accent-rgb: 255, 112, 67;
    --ghub-surface-rgb: 252, 240, 236;
    --ghub-bg: color-mix(in srgb, #ff7043 6%, #EBEBEB);
    --ghub-bg-accent: color-mix(in srgb, #ff7043 10%, #EBEBEB);
    --ghub-clickable-fg: #ff7043;
    --ghub-active-bar: #d84315;
    --ghub-active: rgba(216, 67, 21, 0.26);
    --ghub-glow: transparent;
    --ghub-glow-soft: transparent;
    --ghub-pattern: rgba(255, 112, 67, 0.05);
    --ghub-glass-border: rgba(244, 81, 30, 0.18);
    --ghub-select-glass: color-mix(in srgb, #ff7043 14%, #ffffff);
    --ghub-select-border: rgba(244, 81, 30, 0.32);
    --ghub-drawer-glass: color-mix(in srgb, #ff7043 12%, #ffffff);
    --ghub-drawer-border: rgba(244, 81, 30, 0.2);
    --ghub-card-glass: color-mix(in srgb, #ff7043 12%, #ffffff);
    --ghub-card-border: rgba(244, 81, 30, 0.2);
    --ghub-card-border-top: rgba(244, 81, 30, 0.32);
    --ghub-dash-card-top: color-mix(in srgb, #ff7043 14%, #ffffff);
    --ghub-dash-card-bottom: color-mix(in srgb, #ff7043 10%, #f7f7f7);
    --ghub-dash-card-border: rgba(244, 81, 30, 0.26);
    --ghub-dash-card-glow: transparent;
    --ghub-appbar-edge: color-mix(in srgb, #ff7043 8%, #EBEBEB);
    --ghub-appbar-mid: color-mix(in srgb, #ff7043 10%, #f5f5f5);
    --ghub-appbar-center: color-mix(in srgb, #ff7043 12%, #ffffff);
    --ghub-appbar-center-glow: transparent;
    --ghub-appbar-bottom-line: rgba(244, 81, 30, 0.4);
    --ghub-logo-glow: transparent;
    --ghub-dash-hover-top: color-mix(in srgb, #ff7043 18%, #ffffff);
    --ghub-dash-hover-bottom: color-mix(in srgb, #ff7043 12%, #f5f5f5);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
}

/* Token overlay (dialog/menu/select portati su body) — per modulo */
body:has(.ghub-shell) {
    --ghub-radius: 12px;
    --ghub-form-muted: #a0a0a0;
    /* Accento UI interattivo: obbligatorio su body (dialog fuori da .ghub-shell) */
    --ghub-interactive: #ff9800;
    --ghub-interactive-rgb: 255, 152, 0;
    --ghub-interactive-soft: rgba(255, 152, 0, 0.22);
}

body:has(.ghub-module--hub.ghub-shell--dark) {
    --ghub-accent-rgb: 255, 138, 128;
    --ghub-surface-rgb: 42, 16, 14;
    --ghub-card-glass: rgba(42, 18, 16, 0.58);
    --ghub-card-border: rgba(255, 138, 128, 0.35);
    --ghub-chrome-fg: rgba(255, 248, 246, 0.96);
    --ghub-select-glass: rgba(68, 28, 24, 0.55);
    --ghub-select-border: rgba(255, 160, 150, 0.38);
    --ghub-active: rgba(255, 138, 128, 0.22);
    --ghub-active-bar: #ff8a80;
    --ghub-clickable-fg: #ff8a80;
}

body:has(.ghub-module--hub.ghub-shell--light) {
    --ghub-accent-rgb: 229, 57, 53;
    --ghub-surface-rgb: 250, 240, 240;
    --ghub-card-glass: color-mix(in srgb, #e53935 12%, #ffffff);
    --ghub-card-border: rgba(229, 57, 53, 0.2);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
    --ghub-select-glass: color-mix(in srgb, #e53935 14%, #ffffff);
    --ghub-select-border: rgba(229, 57, 53, 0.32);
    --ghub-active: rgba(229, 57, 53, 0.12);
    --ghub-active-bar: #e53935;
    --ghub-clickable-fg: #e53935;
}

body:has(.ghub-module--agent.ghub-shell--dark) {
    --ghub-accent-rgb: 125, 255, 224;
    --ghub-surface-rgb: 14, 42, 32;
    --ghub-card-glass: rgba(14, 45, 34, 0.58);
    --ghub-card-border: rgba(80, 255, 210, 0.35);
    --ghub-chrome-fg: rgba(245, 255, 250, 0.96);
    --ghub-select-glass: rgba(28, 68, 54, 0.55);
    --ghub-select-border: rgba(100, 255, 210, 0.38);
    --ghub-active: rgba(0, 230, 160, 0.22);
    --ghub-active-bar: #00f0a8;
    --ghub-clickable-fg: #7dffe0;
}

body:has(.ghub-module--agent.ghub-shell--light) {
    --ghub-accent-rgb: 82, 217, 138;
    --ghub-surface-rgb: 236, 248, 242;
    --ghub-card-glass: color-mix(in srgb, #52d98a 12%, #ffffff);
    --ghub-card-border: rgba(46, 125, 79, 0.2);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
    --ghub-select-glass: color-mix(in srgb, #52d98a 14%, #ffffff);
    --ghub-select-border: rgba(46, 125, 79, 0.32);
    --ghub-active: rgba(82, 217, 138, 0.16);
    --ghub-active-bar: #52d98a;
    --ghub-clickable-fg: #52d98a;
}

body:has(.ghub-module--bridge.ghub-shell--dark) {
    --ghub-accent-rgb: 130, 177, 255;
    --ghub-surface-rgb: 16, 28, 42;
    --ghub-card-glass: rgba(16, 32, 48, 0.58);
    --ghub-card-border: rgba(130, 177, 255, 0.35);
    --ghub-chrome-fg: rgba(246, 250, 255, 0.96);
    --ghub-select-glass: rgba(28, 48, 68, 0.55);
    --ghub-select-border: rgba(150, 190, 255, 0.38);
    --ghub-active: rgba(130, 177, 255, 0.22);
    --ghub-active-bar: #82b1ff;
    --ghub-clickable-fg: #82b1ff;
}

body:has(.ghub-module--bridge.ghub-shell--light) {
    --ghub-accent-rgb: 30, 136, 229;
    --ghub-surface-rgb: 236, 244, 252;
    --ghub-card-glass: color-mix(in srgb, #1e88e5 12%, #ffffff);
    --ghub-card-border: rgba(30, 136, 229, 0.2);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
    --ghub-select-glass: color-mix(in srgb, #1e88e5 14%, #ffffff);
    --ghub-select-border: rgba(30, 136, 229, 0.32);
    --ghub-active: rgba(30, 136, 229, 0.12);
    --ghub-active-bar: #1e88e5;
    --ghub-clickable-fg: #1e88e5;
}

body:has(.ghub-module--sync.ghub-shell--dark) {
    --ghub-accent-rgb: 225, 190, 231;
    --ghub-surface-rgb: 28, 18, 42;
    --ghub-card-glass: rgba(32, 20, 48, 0.58);
    --ghub-card-border: rgba(225, 190, 231, 0.35);
    --ghub-chrome-fg: rgba(252, 248, 255, 0.96);
    --ghub-select-glass: rgba(48, 32, 68, 0.55);
    --ghub-select-border: rgba(210, 180, 230, 0.38);
    --ghub-active: rgba(225, 190, 231, 0.22);
    --ghub-active-bar: #e1bee7;
    --ghub-clickable-fg: #e1bee7;
}

body:has(.ghub-module--sync.ghub-shell--light) {
    --ghub-accent-rgb: 126, 87, 194;
    --ghub-surface-rgb: 244, 238, 250;
    --ghub-card-glass: color-mix(in srgb, #7e57c2 12%, #ffffff);
    --ghub-card-border: rgba(126, 87, 194, 0.2);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
    --ghub-select-glass: color-mix(in srgb, #7e57c2 14%, #ffffff);
    --ghub-select-border: rgba(126, 87, 194, 0.32);
    --ghub-active: rgba(126, 87, 194, 0.12);
    --ghub-active-bar: #7e57c2;
    --ghub-clickable-fg: #7e57c2;
}

body:has(.ghub-module--atelier.ghub-shell--dark) {
    --ghub-accent-rgb: 255, 245, 157;
    --ghub-surface-rgb: 42, 36, 14;
    --ghub-card-glass: rgba(48, 40, 16, 0.58);
    --ghub-card-border: rgba(255, 245, 157, 0.32);
    --ghub-chrome-fg: rgba(255, 252, 240, 0.96);
    --ghub-select-glass: rgba(68, 56, 24, 0.55);
    --ghub-select-border: rgba(255, 230, 120, 0.36);
    --ghub-active: rgba(255, 245, 157, 0.2);
    --ghub-active-bar: #fff59d;
    --ghub-clickable-fg: #fff59d;
}

body:has(.ghub-module--atelier.ghub-shell--light) {
    --ghub-accent-rgb: 201, 145, 0;
    --ghub-surface-rgb: 252, 248, 230;
    --ghub-card-glass: color-mix(in srgb, #fdd835 14%, #ffffff);
    --ghub-card-border: rgba(201, 145, 0, 0.28);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
    --ghub-select-glass: color-mix(in srgb, #fdd835 16%, #ffffff);
    --ghub-select-border: rgba(201, 145, 0, 0.35);
    --ghub-active: rgba(201, 145, 0, 0.28);
    --ghub-active-bar: #c99100;
    --ghub-clickable-fg: #c99100;
}

body:has(.ghub-module--passport.ghub-shell--dark) {
    --ghub-accent-rgb: 255, 204, 128;
    --ghub-surface-rgb: 42, 28, 12;
    --ghub-card-glass: rgba(48, 30, 12, 0.58);
    --ghub-card-border: rgba(255, 183, 77, 0.35);
    --ghub-chrome-fg: rgba(255, 248, 240, 0.96);
    --ghub-select-glass: rgba(58, 36, 16, 0.55);
    --ghub-select-border: rgba(255, 183, 77, 0.38);
    --ghub-active: rgba(251, 140, 0, 0.18);
    --ghub-active-bar: #fb8c00;
    --ghub-clickable-fg: #ffcc80;
}

body:has(.ghub-module--passport.ghub-shell--light) {
    --ghub-accent-rgb: 251, 140, 0;
    --ghub-surface-rgb: 252, 244, 232;
    --ghub-card-glass: color-mix(in srgb, #fb8c00 12%, #ffffff);
    --ghub-card-border: rgba(239, 108, 0, 0.2);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
    --ghub-select-glass: color-mix(in srgb, #fb8c00 14%, #ffffff);
    --ghub-select-border: rgba(239, 108, 0, 0.32);
    --ghub-active: rgba(251, 140, 0, 0.12);
    --ghub-active-bar: #fb8c00;
    --ghub-clickable-fg: #fb8c00;
}

body:has(.ghub-module--sell.ghub-shell--dark) {
    --ghub-accent-rgb: 255, 171, 145;
    --ghub-surface-rgb: 42, 22, 16;
    --ghub-card-glass: rgba(48, 24, 16, 0.58);
    --ghub-card-border: rgba(255, 171, 145, 0.35);
    --ghub-chrome-fg: rgba(255, 246, 242, 0.96);
    --ghub-select-glass: rgba(58, 30, 20, 0.55);
    --ghub-select-border: rgba(255, 171, 145, 0.38);
    --ghub-active: rgba(255, 112, 67, 0.18);
    --ghub-active-bar: #ff7043;
    --ghub-clickable-fg: #ffab91;
}

body:has(.ghub-module--sell.ghub-shell--light) {
    --ghub-accent-rgb: 255, 112, 67;
    --ghub-surface-rgb: 252, 240, 236;
    --ghub-card-glass: color-mix(in srgb, #ff7043 12%, #ffffff);
    --ghub-card-border: rgba(244, 81, 30, 0.2);
    --ghub-chrome-fg: rgba(30, 30, 30, 0.92);
    --ghub-select-glass: color-mix(in srgb, #ff7043 14%, #ffffff);
    --ghub-select-border: rgba(244, 81, 30, 0.32);
    --ghub-active: rgba(255, 112, 67, 0.12);
    --ghub-active-bar: #ff7043;
    --ghub-clickable-fg: #ff7043;
}

/* Shell: niente fill opaco Mud; pattern su layer fixed */
.ghub-shell.mud-layout,
.ghub-shell.ghub-shell--dark,
.ghub-shell.ghub-shell--light {
    --mud-palette-background: transparent !important;
    --mud-palette-surface: transparent !important;
    --mud-palette-drawer-background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

/*
  Pattern su layer fixed SEPARATO: background-attachment:fixed sul parent
  fa ignorare backdrop-filter (Chrome/Edge barrano la proprietà in DevTools).
*/
.ghub-shell::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-color: var(--ghub-bg);
    background-image:
        radial-gradient(ellipse 70% 45% at 12% 8%, var(--ghub-bg-accent), transparent 58%),
        radial-gradient(circle at 18% 12%, var(--ghub-glow-soft), transparent 42%),
        radial-gradient(circle at 88% 78%, var(--ghub-glow-soft), transparent 48%),
        radial-gradient(circle at 1px 1px, var(--ghub-pattern) 1px, transparent 0),
        linear-gradient(var(--ghub-pattern) 1px, transparent 1px),
        linear-gradient(90deg, var(--ghub-pattern) 1px, transparent 1px);
    background-size:
        100% 100%,
        100% 100%,
        100% 100%,
        26px 26px,
        52px 52px,
        52px 52px;
}

.ghub-shell::after {
    content: none;
    display: none;
}

.ghub-shell > .mud-main-content {
    position: relative;
    z-index: 1;
    background: transparent !important;
    background-color: transparent !important;
    color: var(--ghub-chrome-fg);
}

.ghub-shell .mud-main-content .mud-typography:not(.mud-text-secondary), body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-typography:not(.mud-text-secondary),
.ghub-shell .mud-main-content h1, body:has(.ghub-shell) .mud-dialog-container .mud-dialog h1,
.ghub-shell .mud-main-content h2, body:has(.ghub-shell) .mud-dialog-container .mud-dialog h2,
.ghub-shell .mud-main-content h3, body:has(.ghub-shell) .mud-dialog-container .mud-dialog h3,
.ghub-shell .mud-main-content h4, body:has(.ghub-shell) .mud-dialog-container .mud-dialog h4,
.ghub-shell .mud-main-content h5, body:has(.ghub-shell) .mud-dialog-container .mud-dialog h5,
.ghub-shell .mud-main-content h6, body:has(.ghub-shell) .mud-dialog-container .mud-dialog h6 {
    color: var(--ghub-chrome-fg) !important;
}

.ghub-shell .mud-main-content .mud-text-secondary, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-text-secondary {
    color: var(--ghub-chrome-fg) !important;
    opacity: 0.72;
}

/* Particles legacy hub: disattiva sotto il vetro Chiaro/Scuro */
body:has(.ghub-shell) #particles-js {
    display: none !important;
    visibility: hidden !important;
}

/* ========== AppBar — sopra al drawer: ombra full-width + glow centrale ========== */
.ghub-shell .ghub-appbar.mud-appbar,
.ghub-shell .mud-appbar.ghub-appbar,
.ghub-shell header.mud-appbar.ghub-appbar {
    --mud-palette-appbar-background: transparent;
    --mud-palette-appbar: transparent;
    z-index: 1300 !important;
    background-color: var(--ghub-glass-chrome) !important;
    background-image:
        radial-gradient(
            ellipse 58% 160% at 50% 40%,
            var(--ghub-appbar-center-glow),
            transparent 68%
        ),
        linear-gradient(
            90deg,
            var(--ghub-appbar-edge) 0%,
            var(--ghub-appbar-mid) 38%,
            var(--ghub-appbar-center) 50%,
            var(--ghub-appbar-mid) 62%,
            var(--ghub-appbar-edge) 100%
        ) !important;
    backdrop-filter: blur(32px) saturate(1.35);
    -webkit-backdrop-filter: blur(32px) saturate(1.35);
    border-bottom: 2px solid var(--ghub-glass-border);
    border-top: 1px solid var(--ghub-cyan);
    /* Ombra sotto AppBar: passa sul drawer (più chiaro) e su tutto il content */
    box-shadow:
        0 3px 6px rgba(0, 0, 0, 0.45),
        0 10px 24px rgba(0, 0, 0, 0.5),
        0 20px 44px rgba(0, 0, 0, 0.32),
        0 1px 0 var(--ghub-appbar-bottom-line),
        inset 0 1px 0 var(--ghub-glass-edge) !important;
    color: var(--ghub-chrome-fg) !important;
}

/* Logo — glow sul testo base (Scuro); Chiaro senza glow */
.ghub-shell--dark .ghub-logo {
    text-shadow:
        0 0 8px var(--ghub-logo-glow),
        0 0 16px var(--ghub-logo-glow);
}

.ghub-shell--light .ghub-logo {
    text-shadow: none !important;
}
/* ---- Chiaro: testo scuro, niente glow residuale ---- */
.ghub-shell--light .mud-main-content,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog {
    --mud-palette-text-primary: rgba(30, 30, 30, 0.92);
    --mud-palette-text-secondary: rgba(30, 30, 30, 0.65);
    --mud-palette-text-disabled: rgba(30, 30, 30, 0.38);
    --mud-palette-action-default: rgba(30, 30, 30, 0.72);
    --mud-palette-surface: #ffffff;
    --mud-palette-background: #EBEBEB;
}

.ghub-shell--light .ghub-appbar.mud-appbar,
.ghub-shell--light .mud-appbar.ghub-appbar,
.ghub-shell--light header.mud-appbar.ghub-appbar {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    border-top: none;
    box-shadow:
        0 2px 4px rgba(0, 0, 0, 0.08),
        0 6px 16px rgba(0, 0, 0, 0.1) !important;
}

/* Chiaro: voce menu attiva pi� marcata (fill + barra sinistra) */
.ghub-shell--light .ghub-drawer .mud-nav-link.active,
.ghub-shell--light .ghub-drawer .mud-nav-link.active:hover,
.ghub-shell--light .ghub-drawer a.mud-nav-link.ghub-nav-link.active {
    background: rgba(var(--ghub-interactive-rgb), 0.5) !important;
    background-color: rgba(var(--ghub-interactive-rgb), 0.5) !important;
}

.ghub-shell--light .ghub-drawer .mud-nav-link.active::before,
.ghub-shell--light .ghub-drawer a.mud-nav-link.active::before {
    width: 4px;
    background: var(--ghub-interactive) !important;
    background-color: var(--ghub-interactive) !important;
    box-shadow: none;
}

body:has(.ghub-shell--light) {
    --ghub-interactive: #e65100;
    --ghub-interactive-rgb: 230, 81, 0;
    --ghub-interactive-soft: rgba(230, 81, 0, 0.2);
    --mud-palette-primary-text: #ffffff;
    --mud-palette-info-text: #ffffff;
}

.ghub-shell--light .ghub-appbar,
.ghub-shell--light .ghub-drawer,
.ghub-shell--light .mud-main-content .mud-paper,
.ghub-shell--light .mud-main-content .mud-card,
.ghub-shell--light .ghub-dash-card,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.ghub-shell--light .ghub-logo,
.ghub-shell--light .ghub-logo__accent,
.ghub-shell--light .ghub-dash-card,
.ghub-shell--light .mud-main-content .mud-icon-button .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-icon-button .mud-svg-icon,
.ghub-shell--light .ghub-drawer .mud-nav-link-icon,
.ghub-shell--light .ghub-drawer .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button .mud-icon-root {
    text-shadow: none !important;
    filter: none !important;
}

.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-input-adornment,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-icon-root {
    color: rgba(30, 30, 30, 0.78) !important;
    fill: currentColor !important;
}

.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-default,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-root {
    color: var(--ghub-interactive) !important;
    fill: currentColor !important;
}

.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-input-underline::before,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-input-underline::after,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-input-underline::before,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-input-underline::after {
    border-bottom-color: rgba(30, 30, 30, 0.35) !important;
}

.ghub-shell--light .mud-main-content .mm-folder-tree .mm-folder-badge .mud-badge {
    color: #ffffff !important;
}

.ghub-shell--light .mud-main-content .mm-folder-tree .mm-folder-info-icon.mud-icon-button .mud-icon-root,
.ghub-shell--light .mud-main-content .mm-folder-tree .mm-folder-info-icon.mud-icon-button .mud-svg-icon,
.ghub-shell--light .mud-main-content .mm-folder-tree .mm-folder-info-icon.mud-icon-button svg,
.ghub-shell--light .mud-main-content .mm-folder-tree .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on) .mud-icon-root,
.ghub-shell--light .mud-main-content .mm-folder-tree .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on) .mud-svg-icon,
.ghub-shell--light .mud-main-content .mm-folder-tree .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on) svg,
.ghub-shell--light .mud-main-content .mud-data-grid .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on):not(.mud-info-text) .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on):not(.mud-info-text) .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-data-grid .mm-auth-icon.mud-icon-button:not(.mm-auth-icon--on):not(.mud-info-text) svg {
    color: rgba(30, 30, 30, 0.78) !important;
    fill: currentColor !important;
    filter: none !important;
}

.ghub-shell--light .ghub-dash-card,
.ghub-shell--light .mud-main-content .mud-paper:not(.ghub-color-swatch),
.ghub-shell--light .mud-main-content .mud-card,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 2px 6px rgba(0, 0, 0, 0.04) !important;
}


/* Drawer sotto l'AppBar così l'ombra la copre */
.ghub-shell .ghub-drawer.mud-drawer,
.ghub-shell .mud-drawer.ghub-drawer {
    z-index: 1100 !important;
}

.ghub-shell .ghub-appbar .mud-toolbar,
.ghub-shell .ghub-appbar .mud-toolbar-gutters {
    background: transparent !important;
    background-color: transparent !important;
}

.ghub-shell .ghub-appbar .mud-button-root,
.ghub-shell .ghub-appbar .mud-icon-button,
.ghub-shell .ghub-appbar .mud-typography {
    color: inherit;
}

/* Company select — vetro verde + freccia chiara */
.ghub-shell .ghub-appbar .ghub-company-select.mud-input-control,
.ghub-shell .ghub-appbar .mud-select.ghub-company-select {
    background: transparent !important;
    padding: 0 !important;
    color: var(--ghub-chrome-fg) !important;
}

.ghub-shell .ghub-appbar .ghub-company-select .mud-input-control-input-container {
    background: var(--ghub-select-glass) !important;
    backdrop-filter: blur(16px) saturate(1.15);
    -webkit-backdrop-filter: blur(16px) saturate(1.15);
    border: 1px solid var(--ghub-select-border) !important;
    border-radius: 14px !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.28),
        inset 1px 0 0 rgba(255, 255, 255, 0.08),
        0 0 12px rgba(0, 0, 0, 0.12);
    overflow: hidden;
}

.ghub-shell .ghub-appbar .ghub-company-select .mud-input,
.ghub-shell .ghub-appbar .ghub-company-select .mud-input-filled,
.ghub-shell .ghub-appbar .ghub-company-select .mud-input-outlined,
.ghub-shell .ghub-appbar .ghub-company-select .mud-input-slot,
.ghub-shell .ghub-appbar .ghub-company-select .mud-input-root,
.ghub-shell .ghub-appbar .ghub-company-select input {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    color: rgba(255, 255, 255, 0.95) !important;
    caret-color: rgba(255, 255, 255, 0.95);
}

.ghub-shell .ghub-appbar .ghub-company-select .mud-input-underline::before,
.ghub-shell .ghub-appbar .ghub-company-select .mud-input-underline::after {
    border: none !important;
    border-bottom: none !important;
    display: none !important;
}

.ghub-shell .ghub-appbar .ghub-company-select .mud-input-adornment,
.ghub-shell .ghub-appbar .ghub-company-select .mud-input-adornment-end,
.ghub-shell .ghub-appbar .ghub-company-select .mud-select-input {
    border: none !important;
    border-left: none !important;
    box-shadow: none !important;
    background: transparent !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

.ghub-shell .ghub-appbar .ghub-company-select .mud-input-adornment-end::before,
.ghub-shell .ghub-appbar .ghub-company-select .mud-input-adornment-end::after {
    display: none !important;
    content: none !important;
    border: none !important;
}

/* Freccia dropdown chiara (override primary scuro del tema) */
.ghub-shell .ghub-appbar .ghub-company-select .mud-icon-root,
.ghub-shell .ghub-appbar .ghub-company-select .mud-svg-icon,
.ghub-shell .ghub-appbar .ghub-company-select .mud-input-adornment svg,
.ghub-shell .ghub-appbar .ghub-company-select .mud-select-icon {
    color: rgba(255, 255, 255, 0.92) !important;
    fill: rgba(255, 255, 255, 0.92) !important;
}

.ghub-shell .ghub-appbar .ghub-company-select .mud-input-label,
.ghub-shell .ghub-appbar .ghub-company-select .mud-input-label-inputlabel {
    color: rgba(255, 255, 255, 0.88) !important;
    opacity: 1;
}

/* ========== Drawer — vetro verde, più chiaro dell'AppBar (ombra visibile) ========== */
.ghub-shell .ghub-drawer.mud-drawer,
.ghub-shell .mud-drawer.ghub-drawer {
    --mud-palette-drawer-background: transparent !important;
    --mud-palette-surface: transparent !important;
    background: var(--ghub-drawer-glass) !important;
    background-color: var(--ghub-drawer-glass) !important;
    background-image: none !important;
    /* backdrop-filter sullo scroll rompe la rotella in Chrome/Edge → layer ::before */
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border-right: 2px solid var(--ghub-drawer-border) !important;
    box-shadow: none !important;
    color: var(--ghub-chrome-fg);
    z-index: 1100 !important;
    overflow: hidden !important;
    isolation: isolate;
}

.ghub-shell .ghub-drawer.mud-drawer::before,
.ghub-shell .mud-drawer.ghub-drawer::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: var(--ghub-drawer-glass);
    background-image: linear-gradient(
        180deg,
        rgba(var(--ghub-accent-rgb), 0.06) 0%,
        transparent 38%,
        rgba(0, 0, 0, 0.14) 100%
    );
    -webkit-backdrop-filter: blur(2px) saturate(1.2);
    backdrop-filter: blur(2px) saturate(1.2);
}

.ghub-shell--light .ghub-drawer.mud-drawer,
.ghub-shell--light .mud-drawer.ghub-drawer {
    background: var(--ghub-drawer-glass) !important;
    background-color: var(--ghub-drawer-glass) !important;
}

.ghub-shell .ghub-drawer .mud-drawer-content {
    position: relative;
    z-index: 1;
    background: transparent !important;
    background-color: transparent !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: 100% !important;
    height: auto !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: rgba(var(--ghub-accent-rgb), 0.5) rgba(0, 0, 0, 0.22);
}

.ghub-shell .ghub-drawer .mud-drawer-content::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important;
    display: block !important;
}

.ghub-shell .ghub-drawer .mud-drawer-content::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.18);
}

.ghub-shell .ghub-drawer .mud-drawer-content::-webkit-scrollbar-thumb {
    background: rgba(var(--ghub-accent-rgb), 0.45);
    border-radius: 4px;
}

.ghub-shell .ghub-drawer .mud-drawer-content::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--ghub-accent-rgb), 0.65);
}

.ghub-shell .ghub-drawer .ghub-drawer-copy {
    padding-left: 4px;
    padding-right: 4px;
    padding-bottom: 8px;
    line-height: 1.2;
    word-break: break-word;
    overflow-wrap: anywhere;
    max-width: 100%;
    box-sizing: border-box;
    flex-shrink: 0;
}

/* Margine sotto l'ombra AppBar — solo menu radice (non sottomenu MudNavGroup) */
.ghub-shell .ghub-drawer .mud-drawer-content > .ghub-navmenu,
.ghub-shell .ghub-drawer .mud-drawer-content > .mud-navmenu.ghub-navmenu {
    padding-top: 28px !important;
}

.ghub-shell .ghub-drawer .mud-nav-group .mud-navmenu {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
}

.ghub-shell .ghub-drawer .mud-nav-group .mud-navgroup-collapse,
.ghub-shell .ghub-drawer .mud-nav-group .mud-collapse-wrapper,
.ghub-shell .ghub-drawer .mud-nav-group .mud-collapse-wrapper-inner {
    padding: 0 !important;
    margin: 0 !important;
}

/* Solo .mud-drawer-content scrolla: niente scrollbar flash sui sottomenu MudNavGroup (shift voci) */
.ghub-shell .ghub-drawer .mud-nav-group .mud-navgroup-collapse,
.ghub-shell .ghub-drawer .mud-nav-group .mud-collapse,
.ghub-shell .ghub-drawer .mud-nav-group .mud-collapse-container,
.ghub-shell .ghub-drawer .mud-nav-group .mud-collapse-wrapper,
.ghub-shell .ghub-drawer .mud-nav-group .mud-collapse-wrapper-inner,
.ghub-shell .ghub-drawer .mud-nav-group .mud-navmenu {
    overflow-x: hidden !important;
    overflow-y: hidden !important;
    scrollbar-width: none !important;
}

.ghub-shell .ghub-drawer .mud-nav-group .mud-collapse-entered .mud-collapse-wrapper,
.ghub-shell .ghub-drawer .mud-nav-group .mud-collapse-entered .mud-collapse-wrapper-inner {
    overflow-y: visible !important;
}

.ghub-shell .ghub-drawer .mud-nav-group .mud-navgroup-collapse::-webkit-scrollbar,
.ghub-shell .ghub-drawer .mud-nav-group .mud-collapse::-webkit-scrollbar,
.ghub-shell .ghub-drawer .mud-nav-group .mud-collapse-wrapper::-webkit-scrollbar,
.ghub-shell .ghub-drawer .mud-nav-group .mud-navmenu::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
}

.ghub-shell .ghub-drawer .mud-nav-link,
.ghub-shell .ghub-drawer a.mud-nav-link.ghub-nav-link {
    position: relative;
    border-radius: 0 !important;
    margin: 2px 6px !important;
    padding-left: 16px !important;
    padding-inline-start: 16px !important;
    color: var(--ghub-chrome-fg) !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    overflow: visible;
}

/*
 * Indentazione sottolivelli — solo drawer aperto.
 * MudBlazor Mini + il padding flat sopra azzerano il rientro nativo;
 * in --closed le icone restano allineate a 16px.
 */
.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu .mud-nav-item > .mud-nav-link,
.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu > .mud-nav-group > .mud-nav-link,
.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu > a.mud-nav-link,
.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu > .mud-nav-link {
    padding-left: 28px !important;
    padding-inline-start: 28px !important;
}

.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu .mud-nav-item > .mud-nav-link,
.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu > .mud-nav-group > .mud-nav-link,
.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu > a.mud-nav-link,
.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu > .mud-nav-link {
    padding-left: 40px !important;
    padding-inline-start: 40px !important;
}

.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu .mud-nav-item > .mud-nav-link,
.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu > .mud-nav-group > .mud-nav-link,
.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu > a.mud-nav-link,
.ghub-shell .ghub-drawer.mud-drawer--open .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu > .mud-nav-group .mud-navmenu > .mud-nav-link {
    padding-left: 52px !important;
    padding-inline-start: 52px !important;
}

.ghub-shell .ghub-drawer .mud-nav-link .mud-nav-link-text {
    color: var(--ghub-chrome-fg) !important;
    text-shadow:
        0 1px 2px rgba(0, 0, 0, 0.55),
        0 2px 6px rgba(0, 0, 0, 0.35);
}

/* Elevation su tutte le icone del menu */
.ghub-shell .ghub-drawer .mud-nav-link .mud-nav-link-icon,
.ghub-shell .ghub-drawer .mud-nav-link .mud-icon-root,
.ghub-shell .ghub-drawer .mud-nav-link .mud-svg-icon {
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.55)) drop-shadow(0 2px 4px rgba(0, 0, 0, 0.35));
}

.ghub-shell .ghub-drawer .mud-nav-link:hover {
    background-color: var(--ghub-active) !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Soft fill + glowing LEFT bar — angoli quadrati */
.ghub-shell .ghub-drawer .mud-nav-link.active,
.ghub-shell .ghub-drawer .mud-nav-link.active:hover,
.ghub-shell .ghub-drawer .mud-nav-link.active:focus,
.ghub-shell .ghub-drawer a.mud-nav-link.ghub-nav-link.active,
.ghub-shell .ghub-drawer a.mud-nav-link.mud-nav-link-default.active {
    background: var(--ghub-active) !important;
    background-color: var(--ghub-active) !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    color: var(--ghub-chrome-fg) !important;
}

.ghub-shell .ghub-drawer .mud-nav-link.active::before,
.ghub-shell .ghub-drawer a.mud-nav-link.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    border-radius: 0;
    background: var(--ghub-active-bar);
    box-shadow:
        0 0 8px var(--ghub-glow),
        0 0 16px var(--ghub-glow-soft),
        0 0 4px var(--ghub-active-bar);
    pointer-events: none;
    z-index: 2;
}

.ghub-shell .ghub-drawer .mud-nav-link.active::after {
    content: none !important;
    display: none !important;
}

.ghub-shell .ghub-drawer .mud-nav-link.active .mud-nav-link-text {
    color: var(--ghub-chrome-fg) !important;
    font-weight: 600;
}

/* ========== Superfici UI pagina — vetro modulare (paper, alert, …) ========== */
.ghub-shell .mud-main-content .mud-paper:not(.ghub-dash-card):not(.ghub-color-swatch):not(.ghub-cal-event), body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-paper:not(.ghub-dash-card):not(.ghub-color-swatch):not(.ghub-cal-event),
.ghub-shell .mud-main-content .mud-alert, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-alert,
.ghub-shell .mud-main-content .mud-card, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-card,
.ghub-shell .mud-main-content .mud-expansion-panels, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-expansion-panels,
.ghub-shell .mud-main-content .mud-stepper, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-stepper,
.ghub-shell .mud-main-content .mud-tabs, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-tabs {
    --mud-palette-surface: transparent !important;
    background: var(--ghub-card-glass) !important;
    background-color: var(--ghub-card-glass) !important;
    background-image: linear-gradient(
        165deg,
        rgba(var(--ghub-accent-rgb), 0.07) 0%,
        transparent 55%
    ) !important;
    -webkit-backdrop-filter: blur(8px) saturate(1.15) !important;
    backdrop-filter: blur(8px) saturate(1.15) !important;
    border: 1px solid var(--ghub-card-border) !important;
    color: var(--ghub-chrome-fg);
}

.ghub-shell .mud-main-content .mud-paper:not(.ghub-dash-card):not(.ghub-color-swatch):not(.ghub-cal-event), body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-paper:not(.ghub-dash-card):not(.ghub-color-swatch):not(.ghub-cal-event),
.ghub-shell .mud-main-content .mud-tabs, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-tabs {
    border-top-color: var(--ghub-card-border-top) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.05),
        0 0 18px rgba(var(--ghub-accent-rgb), 0.12),
        inset 0 1px 0 rgba(var(--ghub-accent-rgb), 0.18) !important;
}

/* MudTabs — bordo card + padding pannelli uniforme in tutto G-Hub */
.ghub-shell .mud-main-content .mud-tabs,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-tabs {
    border: 1px solid var(--ghub-card-border) !important;
    border-radius: var(--ghub-radius, 12px) !important;
    overflow: hidden;
}

.ghub-shell .mud-main-content .mud-tabs .mud-tabs-tabbar,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-tabs .mud-tabs-tabbar {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom: 1px solid var(--ghub-card-border) !important;
}

.ghub-shell .mud-main-content .mud-tabs .mud-tabs-panels,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-tabs .mud-tabs-panels {
    /* Compensa i margin negativi di MudGrid (Spacing tipico 2–3) */
    padding: 1.5rem calc(1.5rem + 8px) !important;
    box-sizing: border-box;
}

/* Anteprima colore (VarColors / Collections / Orders / Calendar) — non vetro */
.ghub-shell .mud-main-content .mud-paper.ghub-color-swatch,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-paper.ghub-color-swatch {
    --mud-palette-surface: transparent !important;
    background: var(--ghub-swatch-color) !important;
    background-color: var(--ghub-swatch-color) !important;
    background-image: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border: 1px solid rgba(255, 255, 255, 0.45) !important;
    box-shadow: none !important;
    flex-shrink: 0;
}

/* MudDataGrid — pannello vetro indipendente (toolbar pagina = pannello separato sopra) */
.ghub-shell .mud-main-content .mud-data-grid, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid {
    --mud-palette-surface: transparent !important;
    background: var(--ghub-card-glass) !important;
    background-color: var(--ghub-card-glass) !important;
    background-image: linear-gradient(
        165deg,
        rgba(var(--ghub-accent-rgb), 0.07) 0%,
        transparent 55%
    ) !important;
    -webkit-backdrop-filter: blur(8px) saturate(1.15) !important;
    backdrop-filter: blur(8px) saturate(1.15) !important;
    border: 1px solid var(--ghub-card-border) !important;
    border-radius: var(--ghub-radius, 12px) !important;
    color: var(--ghub-chrome-fg);
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.05),
        0 0 18px rgba(var(--ghub-accent-rgb), 0.12) !important;
    overflow: hidden;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-root, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-root,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-container, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-container {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* MudCalendar (Heron) — non è MudPaper: usa --mud-palette-surface (trasparente in shell) + table-lines scure */
.ghub-shell .mud-main-content .mud-calendar {
    --mud-palette-table-lines: var(--ghub-card-border);
    --mud-palette-lines-default: var(--ghub-card-border);
    --mud-palette-divider: rgba(var(--ghub-accent-rgb), 0.2);
    --mud-cal-cell-hover: rgba(var(--ghub-interactive-rgb), 0.14);
    background: var(--ghub-card-glass) !important;
    background-color: var(--ghub-card-glass) !important;
    background-image: linear-gradient(
        165deg,
        rgba(var(--ghub-accent-rgb), 0.07) 0%,
        transparent 55%
    ) !important;
    -webkit-backdrop-filter: blur(8px) saturate(1.15) !important;
    backdrop-filter: blur(8px) saturate(1.15) !important;
    border: 1px solid var(--ghub-card-border) !important;
    border-radius: var(--ghub-radius, 12px) !important;
    color: var(--ghub-chrome-fg);
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.05),
        0 0 18px rgba(var(--ghub-accent-rgb), 0.12),
        inset 0 1px 0 rgba(var(--ghub-accent-rgb), 0.18) !important;
    overflow: hidden;
}

.ghub-shell .mud-main-content .mud-calendar.mud-cal-outlined {
    border: 1px solid var(--ghub-card-border) !important;
}

.ghub-shell .mud-main-content .mud-calendar .mud-cal-month-cell,
.ghub-shell .mud-main-content .mud-calendar .mud-cal-week-grid > div.mud-cal-week-not-today,
.ghub-shell .mud-main-content .mud-calendar .mud-cal-work-week-grid > div.mud-cal-week-not-today,
.ghub-shell .mud-main-content .mud-calendar .mud-cal-day-grid > div,
.ghub-shell .mud-main-content .mud-calendar .mud-cal-week-header,
.ghub-shell .mud-main-content .mud-calendar .mud-cal-work-week-header,
.ghub-shell .mud-main-content .mud-calendar .mud-cal-day-header,
.ghub-shell .mud-main-content .mud-calendar .mud-cal-week-cell {
    border-color: var(--ghub-card-border) !important;
}

.ghub-shell .mud-main-content .mud-calendar .mud-cal-week-cell.mud-cal-week-cell-half {
    border-top-color: var(--mud-palette-divider) !important;
}

@media (hover: hover) {
    .ghub-shell .mud-main-content .mud-calendar .mud-cal-month-link:hover,
    .ghub-shell .mud-main-content .mud-calendar .mud-cal-week-link:hover {
        background-color: rgba(var(--ghub-interactive-rgb), 0.1) !important;
    }
}

/* Eventi agenda — colore evento, non vetro paper */
.ghub-shell .mud-main-content .mud-paper.ghub-cal-event,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-paper.ghub-cal-event {
    --mud-palette-surface: transparent !important;
    background: var(--ghub-swatch-color) !important;
    background-color: var(--ghub-swatch-color) !important;
    background-image: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* Toolbar + MudDataGrid = due riquadri distinti.
   Nota: MudBlazor 9 MudStack NON emette più .mud-stack (solo d-flex/flex-column/gap-*),
   quindi non si può dipendere da .mud-stack né da :has(+ .mud-data-grid)
   (durante il loader c’è spesso un sibling intermedio → angoli restavano squadrati). */
.ghub-shell .mud-main-content .mud-paper.position-sticky.sticky-top,
.ghub-shell .mud-main-content .mud-paper.sticky-top,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-paper.position-sticky.sticky-top,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-paper.sticky-top {
    margin-bottom: 8px !important;
    border-radius: var(--ghub-radius, 12px) !important;
    overflow: hidden;
    isolation: isolate;
}

.ghub-shell .mud-main-content .mud-data-grid,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid {
    margin-top: 0 !important;
    border-radius: var(--ghub-radius, 12px) !important;
    overflow: hidden;
    isolation: isolate;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar {
    background: rgba(var(--ghub-surface-rgb), 0.72) !important;
    background-color: rgba(var(--ghub-surface-rgb), 0.72) !important;
    border: none !important;
    border-bottom: 1px solid rgba(var(--ghub-accent-rgb), 0.14) !important;
    box-shadow: none !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-head .mud-table-cell, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-head .mud-table-cell {
    background: rgba(var(--ghub-surface-rgb), 0.65) !important;
    background-color: rgba(var(--ghub-surface-rgb), 0.65) !important;
    color: var(--ghub-form-muted, #a0a0a0) !important;
    border-bottom-color: var(--ghub-card-border) !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-head .mud-table-cell .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-head .mud-table-cell .mud-typography,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-head .mud-table-sort-label,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-head .mud-table-sort-label,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-head .mud-button-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-head .mud-button-root,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-head .mud-table-sort-label .mud-table-sort-label-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-head .mud-table-sort-label .mud-table-sort-label-icon {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    fill: currentColor !important;
    opacity: 1 !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-row .mud-table-cell, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-row .mud-table-cell {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom-color: rgba(var(--ghub-accent-rgb), 0.12) !important;
    color: var(--ghub-chrome-fg) !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-row:hover .mud-table-cell, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-row:hover .mud-table-cell {
    background: rgba(var(--ghub-accent-rgb), 0.1) !important;
    background-color: rgba(var(--ghub-accent-rgb), 0.1) !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-row.mud-selected-item .mud-table-cell, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-row.mud-selected-item .mud-table-cell {
    background: rgba(var(--ghub-accent-rgb), 0.16) !important;
    background-color: rgba(var(--ghub-accent-rgb), 0.16) !important;
}

/* Colonne sticky — sfondo opaco (no trasparenza scroll) */
.ghub-shell .mud-main-content .mud-data-grid .mud-table-cell.sticky-left, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-cell.sticky-left,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-cell.sticky-right, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-cell.sticky-right {
    background-color: var(--ghub-grid-sticky-bg) !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-head .mud-table-cell.sticky-left, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-head .mud-table-cell.sticky-left,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-head .mud-table-cell.sticky-right, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-head .mud-table-cell.sticky-right {
    background-color: var(--ghub-grid-sticky-bg-head) !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-row:hover .mud-table-cell.sticky-left, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-row:hover .mud-table-cell.sticky-left,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-row:hover .mud-table-cell.sticky-right, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-row:hover .mud-table-cell.sticky-right {
    background-color: color-mix(in srgb, var(--ghub-grid-sticky-bg) 72%, rgba(var(--ghub-accent-rgb), 1) 28%) !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-row.mud-selected-item .mud-table-cell.sticky-left, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-row.mud-selected-item .mud-table-cell.sticky-left,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-row.mud-selected-item .mud-table-cell.sticky-right, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-row.mud-selected-item .mud-table-cell.sticky-right {
    background-color: color-mix(in srgb, var(--ghub-grid-sticky-bg) 62%, rgba(var(--ghub-accent-rgb), 1) 38%) !important;
}

.ghub-shell .mud-main-content .mud-alert, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-alert {
    border-radius: var(--ghub-radius) !important;
    box-shadow: 0 0 16px rgba(var(--ghub-interactive-rgb), 0.12) !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-foot .mud-table-cell, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-foot .mud-table-cell,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-pagination, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination {
    background: rgba(var(--ghub-surface-rgb), 0.82) !important;
    background-color: rgba(var(--ghub-surface-rgb), 0.82) !important;
    border-top: 1px solid rgba(var(--ghub-accent-rgb), 0.14) !important;
    border-top-color: rgba(var(--ghub-accent-rgb), 0.14) !important;
    color: var(--ghub-chrome-fg) !important;
}

/* Scuro: bordi toolbar / grid / footer — accent smorzato (non bianco/pastel) */
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-paper.sticky-top,
.ghub-shell--dark .mud-main-content .mud-data-grid,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid {
    border-color: color-mix(in srgb, rgb(var(--ghub-accent-rgb)) 42%, rgba(0, 0, 0, 0.72) 58%) !important;
    border-top-color: color-mix(in srgb, rgb(var(--ghub-accent-rgb)) 48%, rgba(0, 0, 0, 0.65) 52%) !important;
    box-shadow:
        0 0 0 1px color-mix(in srgb, rgb(var(--ghub-accent-rgb)) 18%, transparent),
        0 0 16px rgba(var(--ghub-accent-rgb), 0.1),
        inset 0 1px 0 color-mix(in srgb, rgb(var(--ghub-accent-rgb)) 22%, transparent) !important;
}

.ghub-shell--dark .mud-main-content .mud-data-grid .mud-table-toolbar,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar {
    border-bottom-color: color-mix(in srgb, rgb(var(--ghub-accent-rgb)) 35%, rgba(0, 0, 0, 0.7) 65%) !important;
}

.ghub-shell--dark .mud-main-content .mud-data-grid .mud-table-foot .mud-table-cell,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-foot .mud-table-cell,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-table-pagination,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination {
    border-top-color: color-mix(in srgb, rgb(var(--ghub-accent-rgb)) 35%, rgba(0, 0, 0, 0.7) 65%) !important;
}

/* Scuro: icone toolbar/grid bianche (solo attive); accese (info/primary) arancioni; warn non validate */
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) svg, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) svg,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-icon-root, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-svg-icon, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) svg, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) svg,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-icon-root, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-svg-icon, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-table-pagination .mud-select .mud-icon-root, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination .mud-select .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-checkbox:not(.mud-checked) .mud-icon-root, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-checkbox:not(.mud-checked) .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-checkbox:not(.mud-checked) .mud-svg-icon, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-checkbox:not(.mud-checked) .mud-svg-icon {
    color: rgba(255, 255, 255, 0.92) !important;
    fill: currentColor !important;
}

/* Griglia: icone “record caricati” (Color.Info) → arancione G-Hub */
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) svg,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-toggle-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-toggle-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) svg {
    color: var(--ghub-interactive) !important;
    fill: currentColor !important;
}

/* Chiaro: record inseriti (Color.Info) = azzurro */
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) svg,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-toggle-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-toggle-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) svg {
    color: var(--ghub-interactive) !important;
    fill: currentColor !important;
}

/* Chiaro: toolbar / azioni griglia = grigio scuro attive, grigio chiaro disattive */
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) svg,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text) .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text) .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text) svg,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text) .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-select .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root {
    color: rgba(45, 45, 45, 0.88) !important;
    fill: currentColor !important;
}

.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:disabled .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button.mud-disabled .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:disabled .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button.mud-disabled .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:disabled svg,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button.mud-disabled svg,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:disabled .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button.mud-disabled .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:disabled svg,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button.mud-disabled svg,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:disabled .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-disabled .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:disabled .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-disabled .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:disabled svg,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-disabled svg,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:disabled .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button.mud-disabled .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-icon-button:disabled .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button:disabled .mud-icon-root {
    color: rgba(45, 45, 45, 0.32) !important;
    fill: currentColor !important;
    opacity: 1 !important;
}

/* Lucchetto auth CON grant: accent (dopo le regole “bianco griglia” Scuro) */
.ghub-shell .mud-main-content .mm-folder-tree .mm-auth-icon--on.mud-icon-button .mud-icon-root,
.ghub-shell .mud-main-content .mm-folder-tree .mm-auth-icon--on.mud-icon-button .mud-svg-icon,
.ghub-shell .mud-main-content .mm-folder-tree .mm-auth-icon--on.mud-icon-button svg,
.ghub-shell .mud-main-content .mud-data-grid .mm-auth-icon--on.mud-icon-button .mud-icon-root,
.ghub-shell .mud-main-content .mud-data-grid .mm-auth-icon--on.mud-icon-button .mud-svg-icon,
.ghub-shell .mud-main-content .mud-data-grid .mm-auth-icon--on.mud-icon-button svg,
.ghub-shell--dark .mud-main-content .mud-data-grid .mm-auth-icon--on.mud-icon-button .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mm-auth-icon--on.mud-icon-button .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-data-grid .mm-auth-icon--on.mud-icon-button svg,
.ghub-shell--dark .mud-main-content .mm-folder-tree .mm-auth-icon--on.mud-icon-button .mud-icon-root,
.ghub-shell--dark .mud-main-content .mm-folder-tree .mm-auth-icon--on.mud-icon-button .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mm-folder-tree .mm-auth-icon--on.mud-icon-button svg {
    color: var(--ghub-interactive) !important;
    fill: currentColor !important;
    opacity: 1 !important;
    filter: drop-shadow(0 0 4px rgba(var(--ghub-interactive-rgb, 255, 152, 0), 0.55))
            drop-shadow(0 0 10px rgba(var(--ghub-interactive-rgb, 255, 152, 0), 0.28));
}

/* Griglia: icone non validate (Entities) */
.ghub-shell .mud-main-content .mud-data-grid .mud-icon-button.ghub-grid-icon--warn .mud-icon-root,
.ghub-shell .mud-main-content .mud-data-grid .mud-icon-button.ghub-grid-icon--warn .mud-svg-icon,
.ghub-shell .mud-main-content .mud-data-grid .mud-icon-button.ghub-grid-icon--warn svg,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.ghub-grid-icon--warn .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.ghub-grid-icon--warn .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.ghub-grid-icon--warn svg {
    color: var(--mud-data-grid-custom-notvalidated-icon, #FF683F) !important;
    fill: currentColor !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-icon-button.ghub-grid-icon--warn-fill,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.ghub-grid-icon--warn-fill {
    background-color: var(--mud-data-grid-custom-notvalidated-icon, #FF683F) !important;
    border-radius: 4px;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-icon-button.ghub-grid-icon--warn-fill .mud-icon-root,
.ghub-shell .mud-main-content .mud-data-grid .mud-icon-button.ghub-grid-icon--warn-fill .mud-svg-icon,
.ghub-shell .mud-main-content .mud-data-grid .mud-icon-button.ghub-grid-icon--warn-fill svg,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.ghub-grid-icon--warn-fill .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.ghub-grid-icon--warn-fill .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.ghub-grid-icon--warn-fill svg {
    color: #fff !important;
    fill: currentColor !important;
}

.ghub-shell--dark .mud-main-content .mud-data-grid .mud-checkbox.mud-checked .mud-icon-root, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-checkbox.mud-checked .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-checkbox.mud-checked .mud-svg-icon, body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-checkbox.mud-checked .mud-svg-icon {
    color: var(--ghub-interactive) !important;
    fill: currentColor !important;
}

/* Scuro: pulsanti disabilitati (es. OrdersPage RIATTIVA/SOSPENDI) — grigio chiaro, non nero.
   Esclude MudIconButton/MudToggleIconButton (toolbar): gestiti sotto a opacità bassa. */
.ghub-shell--dark .mud-main-content .mud-button-root:disabled:not(.mud-icon-button):not(.mud-toggle-icon-button),
.ghub-shell--dark .mud-main-content .mud-button-root.mud-disabled:not(.mud-icon-button):not(.mud-toggle-icon-button),
.ghub-shell--dark .mud-main-content .mud-button-root:disabled:not(.mud-icon-button):not(.mud-toggle-icon-button).mud-button-filled,
.ghub-shell--dark .mud-main-content .mud-button-root.mud-disabled:not(.mud-icon-button):not(.mud-toggle-icon-button).mud-button-filled,
.ghub-shell--dark .mud-main-content .mud-button-root:disabled:not(.mud-icon-button):not(.mud-toggle-icon-button)[class*="mud-button-filled"],
.ghub-shell--dark .mud-main-content .mud-button-root.mud-disabled:not(.mud-icon-button):not(.mud-toggle-icon-button)[class*="mud-button-filled"],
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-button-root:disabled:not(.mud-icon-button):not(.mud-toggle-icon-button),
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-button-root.mud-disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) {
    color: #c8c8c8 !important;
    background: rgba(255, 255, 255, 0.16) !important;
    background-color: rgba(255, 255, 255, 0.16) !important;
    background-image: none !important;
    border-color: rgba(255, 255, 255, 0.22) !important;
    box-shadow: none !important;
    opacity: 1 !important;
    --mud-palette-action-disabled: #c8c8c8;
    --mud-palette-action-disabled-background: rgba(255, 255, 255, 0.16);
}

.ghub-shell--dark .mud-main-content .mud-button-root:disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-button-label,
.ghub-shell--dark .mud-main-content .mud-button-root.mud-disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-button-label,
.ghub-shell--dark .mud-main-content .mud-button-root:disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-button-root.mud-disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-button-root:disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-button-root.mud-disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-button-root:disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) svg,
.ghub-shell--dark .mud-main-content .mud-button-root.mud-disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) svg,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-button-root:disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-button-label,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-button-root.mud-disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-button-label,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-button-root:disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-button-root.mud-disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-button-root:disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) svg,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-button-root.mud-disabled:not(.mud-icon-button):not(.mud-toggle-icon-button) svg {
    color: #c8c8c8 !important;
    fill: currentColor !important;
    opacity: 1 !important;
}

/* Icone disabilitate (toolbar + form/dialog) — dopo i pulsanti, così non ereditano #c8c8c8 né il nero Mud light.
   Include sticky-top / data-grid con specificità >= regola icone bianche. */
.ghub-shell--dark .mud-main-content .mud-icon-button:disabled,
.ghub-shell--dark .mud-main-content .mud-icon-button.mud-disabled,
.ghub-shell--dark .mud-main-content .mud-toggle-icon-button:disabled,
.ghub-shell--dark .mud-main-content .mud-toggle-icon-button.mud-disabled,
.ghub-shell--dark .mud-main-content .mud-icon-button:disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-icon-button.mud-disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-icon-button:disabled .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-icon-button.mud-disabled .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-icon-button:disabled svg,
.ghub-shell--dark .mud-main-content .mud-icon-button.mud-disabled svg,
.ghub-shell--dark .mud-main-content .mud-toggle-icon-button:disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-toggle-icon-button.mud-disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-toggle-icon-button:disabled svg,
.ghub-shell--dark .mud-main-content .mud-toggle-icon-button.mud-disabled svg,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-icon-button:disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-icon-button.mud-disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-icon-button:disabled .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-icon-button.mud-disabled .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-icon-button:disabled svg,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-icon-button.mud-disabled svg,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button.mud-disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:disabled svg,
.ghub-shell--dark .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button.mud-disabled svg,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button:disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button.mud-disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button:disabled .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button.mud-disabled .mud-svg-icon,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button:disabled svg,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-icon-button.mud-disabled svg,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-toggle-icon-button:disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-toggle-icon-button.mud-disabled .mud-icon-root,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-toggle-icon-button:disabled svg,
.ghub-shell--dark .mud-main-content .mud-data-grid .mud-toggle-icon-button.mud-disabled svg,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-icon-button:disabled,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-icon-button.mud-disabled,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:disabled,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-disabled,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-icon-button:disabled .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-icon-button.mud-disabled .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-icon-button:disabled .mud-svg-icon,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-icon-button.mud-disabled .mud-svg-icon,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-icon-button:disabled svg,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-icon-button.mud-disabled svg,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:disabled .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-disabled .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:disabled svg,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-disabled svg,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-icon-button:disabled .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-icon-button.mud-disabled .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-icon-button:disabled svg,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-icon-button.mud-disabled svg,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button:disabled .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.mud-disabled .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button:disabled svg,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-icon-button.mud-disabled svg {
    color: rgba(255, 255, 255, 0.22) !important;
    fill: currentColor !important;
    background: transparent !important;
    background-color: transparent !important;
    opacity: 1 !important;
}

.ghub-shell--light .mud-main-content .mud-icon-button:disabled,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-disabled,
.ghub-shell--light .mud-main-content .mud-toggle-icon-button:disabled,
.ghub-shell--light .mud-main-content .mud-toggle-icon-button.mud-disabled,
.ghub-shell--light .mud-main-content .mud-icon-button:disabled .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-disabled .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-icon-button:disabled .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-disabled .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-icon-button:disabled svg,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-disabled svg,
.ghub-shell--light .mud-main-content .mud-toggle-icon-button:disabled .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-toggle-icon-button.mud-disabled .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-toggle-icon-button:disabled svg,
.ghub-shell--light .mud-main-content .mud-toggle-icon-button.mud-disabled svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button:disabled,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button.mud-disabled,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:disabled,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-disabled,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button:disabled .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button.mud-disabled .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button:disabled .mud-svg-icon,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button.mud-disabled .mud-svg-icon,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button:disabled svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button.mud-disabled svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:disabled .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-disabled .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:disabled svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-disabled svg {
    color: color-mix(in srgb, var(--ghub-clickable-fg, #fdd835) 22%, #000 78%) !important;
    fill: currentColor !important;
    background: transparent !important;
    background-color: transparent !important;
    opacity: 1 !important;
}

/* Accento arancione — icone accese, link info, pagination attiva (non disabilitate) */
.ghub-shell .mud-main-content .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell .mud-main-content .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon,
.ghub-shell .mud-main-content .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) svg, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) svg,
.ghub-shell .mud-main-content .mud-button-root.mud-info-text:not(:disabled):not(.mud-disabled), body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-button-root.mud-info-text:not(:disabled):not(.mud-disabled),
.ghub-shell .mud-main-content .mud-button-root.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-button-root.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell .mud-main-content .mud-toggle-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell .mud-main-content .mud-toggle-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon,
.ghub-shell .mud-main-content .mud-icon-button.mud-primary-text:not(:disabled):not(.mud-disabled) .mud-icon-root, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button.mud-primary-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell .mud-main-content .mud-icon-button.mud-primary-text:not(:disabled):not(.mud-disabled) .mud-svg-icon, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button.mud-primary-text:not(:disabled):not(.mud-disabled) .mud-svg-icon {
    color: var(--ghub-interactive) !important;
    fill: currentColor !important;
}

/* MudIconButton / MudToggleIconButton — glow lieve = colore icona */
.ghub-shell .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led) .mud-icon-root,
.ghub-shell .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led) .mud-svg-icon,
.ghub-shell .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led) svg,
.ghub-shell .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
.ghub-shell .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
.ghub-shell .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) svg,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led) .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led) .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led) svg,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) svg {
    filter:
        drop-shadow(0 0 1px color-mix(in srgb, currentColor 70%, transparent))
        drop-shadow(0 0 4px color-mix(in srgb, currentColor 32%, transparent));
    transition: filter 0.18s ease;
}

@media (hover: hover) {
    .ghub-shell .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led):hover .mud-icon-root,
    .ghub-shell .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led):hover .mud-svg-icon,
    .ghub-shell .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led):hover svg,
    .ghub-shell .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):hover .mud-icon-root,
    .ghub-shell .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):hover .mud-svg-icon,
    .ghub-shell .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):hover svg,
    body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led):hover .mud-icon-root,
    body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led):hover .mud-svg-icon,
    body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button:not(:disabled):not(.mud-disabled):not(.ghub-play-led):hover svg,
    body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):hover .mud-icon-root,
    body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):hover .mud-svg-icon,
    body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):hover svg {
        filter:
            drop-shadow(0 0 1.5px color-mix(in srgb, currentColor 82%, transparent))
            drop-shadow(0 0 6px color-mix(in srgb, currentColor 42%, transparent));
    }
}

.ghub-shell .mud-icon-button:disabled .mud-icon-root,
.ghub-shell .mud-icon-button:disabled .mud-svg-icon,
.ghub-shell .mud-icon-button:disabled svg,
.ghub-shell .mud-icon-button.mud-disabled .mud-icon-root,
.ghub-shell .mud-icon-button.mud-disabled .mud-svg-icon,
.ghub-shell .mud-icon-button.mud-disabled svg,
.ghub-shell .mud-toggle-icon-button:disabled .mud-icon-root,
.ghub-shell .mud-toggle-icon-button:disabled .mud-svg-icon,
.ghub-shell .mud-toggle-icon-button:disabled svg,
.ghub-shell .mud-toggle-icon-button.mud-disabled .mud-icon-root,
.ghub-shell .mud-toggle-icon-button.mud-disabled .mud-svg-icon,
.ghub-shell .mud-toggle-icon-button.mud-disabled svg,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button:disabled .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button:disabled .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button:disabled svg,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button.mud-disabled .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button.mud-disabled .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-icon-button.mud-disabled svg,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:disabled .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:disabled .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button:disabled svg,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-disabled .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-disabled .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-disabled svg {
    filter: none !important;
}

.ghub-shell .mud-main-content .mud-input, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input,
.ghub-shell .mud-main-content input.mud-input-root, body:has(.ghub-shell) .mud-dialog-container .mud-dialog input.mud-input-root,
.ghub-shell .mud-main-content div.mud-input-slot.mud-input-root, body:has(.ghub-shell) .mud-dialog-container .mud-dialog div.mud-input-slot.mud-input-root,
.ghub-shell .mud-main-content .mud-select-input, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-select-input,
.ghub-shell .mud-main-content .mud-data-grid .mud-input-slot, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-input-slot {
    color: var(--ghub-chrome-fg) !important;
}

.ghub-shell .mud-main-content .mud-input::placeholder, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input::placeholder,
.ghub-shell .mud-main-content input.mud-input-root::placeholder, body:has(.ghub-shell) .mud-dialog-container .mud-dialog input.mud-input-root::placeholder,
.ghub-shell .mud-main-content .mud-input-control .mud-input::placeholder, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control .mud-input::placeholder {
    color: var(--ghub-interactive) !important;
    opacity: 0.9;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-pagination .mud-select-input, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination .mud-select-input,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-pagination .mud-typography, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination .mud-typography {
    color: var(--ghub-chrome-fg) !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-pagination .mud-select .mud-icon-root, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination .mud-select .mud-icon-root {
    color: var(--ghub-interactive) !important;
}

.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-select .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination .mud-select .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-select-input,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination .mud-select-input,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-typography,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-pagination .mud-typography {
    color: rgba(45, 45, 45, 0.88) !important;
}

/* Header grid — titolo lista + label filtri = grigio muted; MudSelect valore resta arancione */
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar > .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar > .mud-typography,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-typography-h4,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-typography-h5,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-typography-h6,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-typography-subtitle1,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-typography-subtitle2,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-typography-h4,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-typography-h5,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-typography-h6,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-typography-subtitle1,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-typography-subtitle2 {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    opacity: 1 !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-control .mud-input-label, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-control .mud-input-label,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-label, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-label,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-label-inputlabel, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-label-inputlabel,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-label.mud-disabled, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-label.mud-disabled,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-label.mud-input-label-inputcontrol, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-label.mud-input-label-inputcontrol {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    opacity: 1 !important;
    background: transparent !important;
    background-color: transparent !important;
}

/* MudSelect Tipo — testo arancione, linea e freccia bianche (hint resta muted) */
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-input-slot, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-input-slot,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-select-input, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-select-input,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select input, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select input,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-typography:not(.mud-input-label):not(.mud-input-helper-text), body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-typography:not(.mud-input-label):not(.mud-input-helper-text) {
    color: var(--ghub-interactive) !important;
    -webkit-text-fill-color: var(--ghub-interactive) !important;
}

/* Header grid — valori + placeholder campi testo (Cerca, filtri) = arancione */
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar input.mud-input-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar input.mud-input-root,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar div.mud-input-slot.mud-input-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar div.mud-input-slot.mud-input-root,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-slot,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-slot,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar input.mud-input-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar input.mud-input-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar div.mud-input-slot.mud-input-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar div.mud-input-slot.mud-input-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-slot,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-slot {
    color: var(--ghub-interactive) !important;
    -webkit-text-fill-color: var(--ghub-interactive) !important;
    caret-color: var(--ghub-interactive);
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input::placeholder,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input::placeholder,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar input.mud-input-root::placeholder,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar input.mud-input-root::placeholder,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-control .mud-input::placeholder,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-control .mud-input::placeholder {
    color: var(--ghub-interactive) !important;
    -webkit-text-fill-color: var(--ghub-interactive) !important;
    opacity: 0.9;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-icon-root, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-icon-root,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-svg-icon, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-svg-icon,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-input-adornment, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-input-adornment,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-input-adornment svg, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-input-adornment svg {
    color: rgba(255, 255, 255, 0.92) !important;
    fill: currentColor !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-input-underline::before, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-input-underline::before,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-input-underline::after, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-input-underline::after {
    border-bottom-color: rgba(255, 255, 255, 0.85) !important;
}

/* Campo Cerca — MudBlazor: MudIcon in adornment ha classe .mud-input-adornment-icon
   (MudInputAdornment.razor). AdornmentColor tinge l'icona via mud-*-text / mud-icon-default.
   SVG Material (es. Search) include path clip 24×24 con fill="none": non forzare fill su tutti i path. */
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-root, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-root,
.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-default, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-default {
    color: rgba(255, 255, 255, 0.96) !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon svg path[fill="none"], body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon svg path[fill="none"] {
    fill: none !important;
}

.ghub-shell .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon svg path:not([fill="none"]), body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon svg path:not([fill="none"]) {
    fill: currentColor !important;
}

html body .ghub-shell--dark .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-root, html body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-root,
html body .ghub-shell--dark .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-default, html body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-default {
    color: rgba(255, 255, 255, 0.96) !important;
}

/* Chiaro: righe alternate molto discrete (accent minimo) */
.ghub-shell--light .mud-main-content, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog {
    --mud-palette-table-striped: color-mix(in srgb, rgb(var(--ghub-surface-rgb)) 97%, rgb(var(--ghub-accent-rgb)) 3%);
    --mud-palette-table-hover: rgba(var(--ghub-accent-rgb), 0.08);
}

.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd), body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd),
.ghub-shell--light .mud-main-content .mud-data-grid.mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd), body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid.mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd),
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-striped .mud-table-container table tbody tr:nth-of-type(odd), body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-striped .mud-table-container table tbody tr:nth-of-type(odd),
.ghub-shell--light .mud-main-content .mud-data-grid.mud-table-striped .mud-table-container table tbody tr:nth-of-type(odd), body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid.mud-table-striped .mud-table-container table tbody tr:nth-of-type(odd) {
    background-color: color-mix(in srgb, rgb(var(--ghub-surface-rgb)) 96%, rgb(var(--ghub-accent-rgb)) 4%) !important;
}

.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(even), body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(even),
.ghub-shell--light .mud-main-content .mud-data-grid.mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(even), body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid.mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(even),
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-striped .mud-table-container table tbody tr:nth-of-type(even), body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-striped .mud-table-container table tbody tr:nth-of-type(even),
.ghub-shell--light .mud-main-content .mud-data-grid.mud-table-striped .mud-table-container table tbody tr:nth-of-type(even), body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid.mud-table-striped .mud-table-container table tbody tr:nth-of-type(even) {
    background-color: transparent !important;
}

/* Chiaro: sticky uniforme su tutte le righe (no zebra), tono token */
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-body .mud-table-cell.sticky-left,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-body .mud-table-cell.sticky-right,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-striped .mud-table-body .mud-table-row .mud-table-cell.sticky-left,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-striped .mud-table-body .mud-table-row .mud-table-cell.sticky-right,
.ghub-shell--light .mud-main-content .mud-data-grid.mud-table-striped .mud-table-body .mud-table-row .mud-table-cell.sticky-left,
.ghub-shell--light .mud-main-content .mud-data-grid.mud-table-striped .mud-table-body .mud-table-row .mud-table-cell.sticky-right,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell.sticky-left,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell.sticky-right,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(even) .mud-table-cell.sticky-left,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(even) .mud-table-cell.sticky-right,
.ghub-shell--light .mud-main-content .mud-data-grid.mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell.sticky-left,
.ghub-shell--light .mud-main-content .mud-data-grid.mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell.sticky-right,
.ghub-shell--light .mud-main-content .mud-data-grid.mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(even) .mud-table-cell.sticky-left,
.ghub-shell--light .mud-main-content .mud-data-grid.mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(even) .mud-table-cell.sticky-right,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-body .mud-table-cell.sticky-left,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-body .mud-table-cell.sticky-right,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell.sticky-left,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(odd) .mud-table-cell.sticky-right,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(even) .mud-table-cell.sticky-left,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-striped .mud-table-container .mud-table-root .mud-table-body .mud-table-row:nth-of-type(even) .mud-table-cell.sticky-right {
    background-color: var(--ghub-grid-sticky-bg) !important;
    background: var(--ghub-grid-sticky-bg) !important;
}

.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-head .mud-table-cell.sticky-left,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-head .mud-table-cell.sticky-right,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-head .mud-table-cell.sticky-left,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-head .mud-table-cell.sticky-right {
    background-color: var(--ghub-grid-sticky-bg-head) !important;
    background: var(--ghub-grid-sticky-bg-head) !important;
}

.ghub-shell--light .mud-main-content .mud-paper:not(.ghub-dash-card):not(.ghub-color-swatch):not(.ghub-cal-event), body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-paper:not(.ghub-dash-card):not(.ghub-color-swatch):not(.ghub-cal-event),
.ghub-shell--light .mud-main-content .mud-data-grid, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid,
.ghub-shell--light .mud-main-content .mud-calendar, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-calendar,
.ghub-shell--light .mud-main-content .mud-alert, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-alert,
.ghub-shell--light .mud-main-content .mud-card, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-card,
.ghub-shell--light .mud-main-content .mud-expansion-panels, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-expansion-panels,
.ghub-shell--light .mud-main-content .mud-stepper, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-stepper,
.ghub-shell--light .mud-main-content .mud-tabs, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-tabs {
    background: var(--ghub-card-glass) !important;
    background-color: var(--ghub-card-glass) !important;
    border-color: var(--ghub-card-border) !important;
}

.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar {
    background: rgba(var(--ghub-surface-rgb), 0.78) !important;
    background-color: rgba(var(--ghub-surface-rgb), 0.78) !important;
}

.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-head .mud-table-cell, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-head .mud-table-cell {
    background: rgba(var(--ghub-surface-rgb), 0.75) !important;
    background-color: rgba(var(--ghub-surface-rgb), 0.75) !important;
}

/* ========== Dashboard cards — verde scuro + glow neon (mock) ========== */
.ghub-shell .ghub-dashboard .mud-paper.ghub-dash-card,
.ghub-shell .ghub-dashboard .ghub-dash-card.mud-paper,
html body .ghub-shell .ghub-dashboard .mud-paper.ghub-dash-card {
    --mud-palette-surface: transparent !important;
    --mud-palette-background: transparent !important;
    position: relative;
    background: var(--ghub-dash-card-bottom) !important;
    background-color: var(--ghub-dash-card-bottom) !important;
    background-image: linear-gradient(
        180deg,
        var(--ghub-dash-card-top) 0%,
        var(--ghub-dash-card-bottom) 100%
    ) !important;
    -webkit-backdrop-filter: blur(6px) saturate(1.25) !important;
    backdrop-filter: blur(6px) saturate(1.25) !important;
    border: 1px solid var(--ghub-dash-card-border) !important;
    border-radius: var(--ghub-radius) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.1),
        0 0 8px var(--ghub-dash-card-glow),
        0 0 18px rgba(var(--ghub-accent-rgb), 0.16),
        inset 0 1px 0 rgba(var(--ghub-accent-rgb), 0.14) !important;
    color: var(--ghub-chrome-fg);
    transition: box-shadow 0.22s ease, border-color 0.22s ease, transform 0.15s ease, background 0.22s ease;
    overflow: hidden;
}

.ghub-shell--light .ghub-dashboard .mud-paper.ghub-dash-card,
.ghub-shell--light .ghub-dashboard .ghub-dash-card.mud-paper,
html body .ghub-shell--light .ghub-dashboard .mud-paper.ghub-dash-card {
    background: var(--ghub-dash-card-bottom) !important;
    background-color: var(--ghub-dash-card-bottom) !important;
    background-image: linear-gradient(
        180deg,
        var(--ghub-dash-card-top) 0%,
        var(--ghub-dash-card-bottom) 100%
    ) !important;
    border-color: var(--ghub-dash-card-border) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.09),
        0 0 8px var(--ghub-dash-card-glow),
        0 0 16px rgba(var(--ghub-accent-rgb), 0.14),
        inset 0 1px 0 rgba(var(--ghub-accent-rgb), 0.12) !important;
}

.ghub-shell .ghub-dashboard .ghub-dash-card.mud-paper:hover {
    background-image: linear-gradient(
        180deg,
        var(--ghub-dash-hover-top) 0%,
        var(--ghub-dash-hover-bottom) 100%
    ) !important;
    border-color: rgba(var(--ghub-accent-rgb), 0.48) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.14),
        0 0 10px rgba(var(--ghub-accent-rgb), 0.24),
        0 0 22px rgba(var(--ghub-accent-rgb), 0.2),
        inset 0 1px 0 rgba(var(--ghub-accent-rgb), 0.16) !important;
    transform: translateY(-2px);
}

.ghub-shell--light .ghub-dashboard .ghub-dash-card.mud-paper:hover {
    background-image: linear-gradient(
        180deg,
        var(--ghub-dash-hover-top) 0%,
        var(--ghub-dash-hover-bottom) 100%
    ) !important;
}

.ghub-shell .ghub-dashboard .ghub-dash-card.mud-paper::before {
    content: "";
    position: absolute;
    left: 6%;
    right: 6%;
    top: 0;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(var(--ghub-accent-rgb), 0.4) 25%,
        rgba(var(--ghub-accent-rgb), 0.65) 50%,
        rgba(var(--ghub-accent-rgb), 0.4) 75%,
        transparent
    );
    pointer-events: none;
    z-index: 1;
}

.ghub-dashboard .ghub-dash-card .mud-typography,
.ghub-dashboard .ghub-dash-card .mud-text-secondary {
    color: inherit;
}

.ghub-dashboard .ghub-dash-card .mud-text-secondary {
    opacity: 0.72;
}

/* Dashboard: riempie l’area main e centra lo spinner nello spazio sotto la toolbar.
   MudBlazor 9 MudStack non emette più .mud-stack → usare .ghub-dash-fill-stack. */
.ghub-dashboard.ghub-dashboard--fill {
    min-height: calc(100vh - var(--mud-appbar-height, 64px) - 4rem);
    display: flex;
    flex-direction: column;
}

.ghub-dashboard.ghub-dashboard--fill > .ghub-dash-fill-stack {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.ghub-dashboard .ghub-dash-loading {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 0;
}

.ghub-dashboard .ghub-dash-toolbar {
    color: var(--ghub-chrome-fg);
}

.ghub-dashboard .ghub-dash-toolbar .mud-icon-button,
.ghub-dashboard .ghub-dash-cta.mud-button-root,
.ghub-dashboard .ghub-dash-empty.mud-alert,
.ghub-dashboard .ghub-dash-card .mud-icon-button:not(.ghub-play-led) {
    background: rgba(var(--ghub-surface-rgb), 0.45) !important;
    background-color: rgba(var(--ghub-surface-rgb), 0.45) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(var(--ghub-accent-rgb), 0.32) !important;
    color: var(--ghub-chrome-fg) !important;
}

.ghub-shell--light .ghub-dashboard .ghub-dash-toolbar .mud-icon-button,
.ghub-shell--light .ghub-dashboard .ghub-dash-cta.mud-button-root,
.ghub-shell--light .ghub-dashboard .ghub-dash-empty.mud-alert,
.ghub-shell--light .ghub-dashboard .ghub-dash-card .mud-icon-button:not(.ghub-play-led) {
    background: rgba(var(--ghub-surface-rgb), 0.55) !important;
    background-color: rgba(var(--ghub-surface-rgb), 0.55) !important;
    border-color: rgba(var(--ghub-accent-rgb), 0.32) !important;
}

.ghub-dashboard .ghub-dash-toolbar .mud-icon-button {
    border-radius: 10px;
}

.ghub-dashboard .ghub-dash-empty.mud-alert {
    border-radius: var(--ghub-radius);
    box-shadow: 0 0 24px rgba(var(--ghub-accent-rgb), 0.15);
}

.ghub-dashboard .ghub-dash-empty .mud-alert-message,
.ghub-dashboard .ghub-dash-empty .mud-alert-icon {
    color: inherit !important;
}

.ghub-dashboard .ghub-dash-cta.mud-button-root:hover,
.ghub-dashboard .ghub-dash-card .mud-icon-button:not(.ghub-play-led):hover {
    background: rgba(var(--ghub-surface-rgb), 0.58) !important;
    box-shadow: 0 0 18px rgba(var(--ghub-accent-rgb), 0.28);
}

.ghub-shell--dark .ghub-dashboard .ghub-dash-card .mud-button-outlined {
    border-color: rgba(var(--ghub-accent-rgb), 0.4) !important;
}

.ghub-shell--light .ghub-dashboard .ghub-dash-card .mud-button-outlined {
    border-color: rgba(255, 255, 255, 0.35) !important;
}

.ghub-shell--dark .ghub-dashboard .ghub-dash-card .mud-icon-button.mud-button-outlined:not(.ghub-play-led) {
    box-shadow: 0 0 10px rgba(0, 230, 170, 0.25);
}

.ghub-shell--light .ghub-dashboard .ghub-dash-card .mud-icon-button.mud-button-outlined:not(.ghub-play-led) {
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.15);
}

.ghub-dashboard .mud-progress-linear {
    border-radius: 4px;
    overflow: hidden;
}

/* Progress LED: track = spento, fill = acceso */
.ghub-dashboard .ghub-progress-led.mud-progress-linear,
.ghub-dashboard .ghub-progress-led .mud-progress-linear-background {
    background-color: #1f5c42 !important;
    box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.35);
}

.ghub-dashboard .ghub-progress-led .mud-progress-linear-bar {
    background-color: #5cffc2 !important;
    background-image: linear-gradient(
        90deg,
        #00c853 0%,
        #69ffd6 50%,
        #00e676 100%
    ) !important;
    box-shadow:
        0 0 4px #00ff9c,
        0 0 10px rgba(0, 230, 118, 0.7),
        0 0 16px rgba(0, 200, 100, 0.45);
}

/* Play LED spento / acceso (anche se disabled durante run) */
.ghub-dashboard .ghub-dash-card .ghub-play-led.mud-icon-button,
.ghub-dashboard .ghub-dash-card .ghub-play-led.mud-icon-button:disabled,
.ghub-dashboard .ghub-dash-card .ghub-play-led.mud-icon-button.mud-button-outlined {
    background: rgba(10, 30, 22, 0.55) !important;
    background-color: rgba(10, 30, 22, 0.55) !important;
    border: 1px solid rgba(0, 80, 50, 0.55) !important;
    border-radius: 8px !important;
    color: inherit !important;
    opacity: 1 !important;
}

.ghub-dashboard .ghub-dash-card .ghub-play-led .mud-icon-root,
.ghub-dashboard .ghub-dash-card .ghub-play-led .mud-svg-icon,
.ghub-dashboard .ghub-dash-card .ghub-play-led svg {
    fill: currentColor !important;
}

.ghub-dashboard .ghub-dash-card .ghub-play-led--off,
.ghub-dashboard .ghub-dash-card .ghub-play-led--off.mud-button-outlined {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5) !important;
    border-color: rgba(0, 55, 35, 0.7) !important;
}

.ghub-dashboard .ghub-dash-card .ghub-play-led--off .mud-icon-root,
.ghub-dashboard .ghub-dash-card .ghub-play-led--off .mud-svg-icon,
.ghub-dashboard .ghub-dash-card .ghub-play-led--off svg {
    color: #3d9a6e !important;
    filter: none;
    opacity: 1;
}

.ghub-dashboard .ghub-dash-card .ghub-play-led--on,
.ghub-dashboard .ghub-dash-card .ghub-play-led--on.mud-button-outlined,
.ghub-dashboard .ghub-dash-card .ghub-play-led--on:disabled {
    border-color: rgba(0, 230, 160, 0.7) !important;
    box-shadow:
        0 0 8px rgba(0, 255, 156, 0.5),
        0 0 18px rgba(0, 200, 120, 0.35),
        inset 0 0 8px rgba(0, 255, 180, 0.18) !important;
}

.ghub-dashboard .ghub-dash-card .ghub-play-led--on .mud-icon-root,
.ghub-dashboard .ghub-dash-card .ghub-play-led--on .mud-svg-icon,
.ghub-dashboard .ghub-dash-card .ghub-play-led--on svg {
    color: #7dffe0 !important;
    filter: drop-shadow(0 0 4px #00ff9c) drop-shadow(0 0 12px rgba(0, 230, 118, 0.85));
    opacity: 1;
}

.ghub-dashboard .ghub-dash-card .ghub-play-led--off:hover:not(:disabled) .mud-icon-root,
.ghub-dashboard .ghub-dash-card .ghub-play-led--off:hover:not(:disabled) .mud-svg-icon,
.ghub-dashboard .ghub-dash-card .ghub-play-led--off:hover:not(:disabled) svg {
    color: #55c48a !important;
}

/* ========== Chiaro: icone AppBar grigio scuro fisso (non colore modulo) ========== */
.ghub-shell--light .ghub-appbar .mud-icon-button,
.ghub-shell--light .ghub-appbar .mud-button-root,
.ghub-shell--light .ghub-appbar .mud-icon-button .mud-icon-root,
.ghub-shell--light .ghub-appbar .mud-icon-button .mud-svg-icon,
.ghub-shell--light .ghub-appbar .mud-icon-button svg,
.ghub-shell--light .ghub-appbar .mud-button-root .mud-button-label,
.ghub-shell--light .ghub-appbar .ghub-company-select .mud-input-label,
.ghub-shell--light .ghub-appbar .ghub-company-select .mud-input-adornment,
.ghub-shell--light .ghub-appbar .ghub-company-select .mud-input-adornment .mud-icon-root,
.ghub-shell--light .ghub-appbar .ghub-company-select .mud-input-adornment svg,
.ghub-shell--light .ghub-appbar .mud-menu .mud-button-root,
.ghub-shell--light .ghub-appbar .mud-avatar {
    color: rgba(45, 45, 45, 0.88) !important;
}

/* Chiaro AppBar: valori tendine = interactive; bordo lingua = grigio scuro */
.ghub-shell--light .ghub-appbar .mud-select .mud-input-slot,
.ghub-shell--light .ghub-appbar .mud-select .mud-typography:not(.mud-input-label),
.ghub-shell--light .ghub-appbar .mud-select input,
.ghub-shell--light .ghub-appbar .mud-select .mud-select-input,
.ghub-shell--light .ghub-appbar .mud-select .mud-input-root,
.ghub-shell--light .ghub-appbar .mud-select .mud-input,
.ghub-shell--light .ghub-appbar .ghub-company-select .mud-input-slot,
.ghub-shell--light .ghub-appbar .ghub-company-select .mud-typography:not(.mud-input-label),
.ghub-shell--light .ghub-appbar .ghub-company-select input,
.ghub-shell--light .ghub-appbar .ghub-company-select .mud-select-input,
.ghub-shell--light .ghub-appbar .ghub-company-select .mud-input-root,
.ghub-shell--light .ghub-appbar .ghub-company-select .mud-input {
    color: var(--ghub-interactive) !important;
    -webkit-text-fill-color: var(--ghub-interactive) !important;
    caret-color: var(--ghub-interactive);
}

.ghub-shell--light .ghub-appbar .mud-avatar {
    border-color: rgba(45, 45, 45, 0.88) !important;
}


.ghub-shell--light .ghub-drawer .mud-nav-link,
.ghub-shell--light .ghub-drawer a.mud-nav-link.ghub-nav-link,
.ghub-shell--light .ghub-drawer .mud-nav-link .mud-nav-link-text,
.ghub-shell--light .ghub-drawer .mud-nav-link.active,
.ghub-shell--light .ghub-drawer .mud-nav-link.active .mud-nav-link-text {
    color: var(--ghub-chrome-fg) !important;
}

/* Scuro: icone drawer restano multicolore (non ereditare clickable-fg) */
.ghub-shell--light .ghub-drawer .mud-nav-link .mud-nav-link-icon,
.ghub-shell--light .ghub-drawer .mud-nav-link .mud-icon-root,
.ghub-shell--light .ghub-drawer .mud-nav-link .mud-svg-icon {
    color: inherit;
}

.ghub-shell--light .ghub-dashboard .mud-button-root:not(.ghub-play-led):not([class*="mud-button-filled"]),
.ghub-shell--light .ghub-dashboard .mud-button-root:not(.ghub-play-led):not([class*="mud-button-filled"]) .mud-button-label,
.ghub-shell--light .ghub-dashboard a.mud-typography,
.ghub-shell--light .mud-main-content .mud-button-root:not([class*="mud-button-filled"]):not(.mud-icon-button):not(.mud-toggle-icon-button), body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root:not([class*="mud-button-filled"]):not(.mud-icon-button):not(.mud-toggle-icon-button),
.ghub-shell--light .mud-main-content .mud-button-root:not([class*="mud-button-filled"]):not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-button-label, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root:not([class*="mud-button-filled"]):not(.mud-icon-button):not(.mud-toggle-icon-button) .mud-button-label,
.ghub-shell--light .mud-main-content .mud-nav-link, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-nav-link,
.ghub-shell--light .mud-main-content .mud-tab, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-tab,
.ghub-shell--light .mud-main-content a:not(.mud-nav-link), body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content a:not(.mud-nav-link) {
    color: var(--ghub-clickable-fg) !important;
}

/* Scuro: filled (es. refresh primary) — icona/testo scuri su sfondo accent, non clickable-fg */
.ghub-shell--light .mud-main-content .mud-button-root[class*="mud-button-filled"],
.ghub-shell--light .mud-main-content .mud-icon-button[class*="mud-button-filled"],
.ghub-shell--light .ghub-dashboard .mud-button-root[class*="mud-button-filled"],
.ghub-shell--light .ghub-dashboard .mud-icon-button[class*="mud-button-filled"],
.ghub-shell--light .mud-main-content .mud-button-root[class*="mud-button-filled"] .mud-button-label,
.ghub-shell--light .mud-main-content .mud-button-root[class*="mud-button-filled"] .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-button-root[class*="mud-button-filled"] .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-button-root[class*="mud-button-filled"] svg,
.ghub-shell--light .mud-main-content .mud-icon-button[class*="mud-button-filled"] .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-icon-button[class*="mud-button-filled"] .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-icon-button[class*="mud-button-filled"] svg,
.ghub-shell--light .ghub-dashboard .mud-button-root[class*="mud-button-filled"] .mud-button-label,
.ghub-shell--light .ghub-dashboard .mud-icon-button[class*="mud-button-filled"] .mud-icon-root,
.ghub-shell--light .ghub-dashboard .mud-icon-button[class*="mud-button-filled"] .mud-svg-icon,
.ghub-shell--light .ghub-dashboard .mud-icon-button[class*="mud-button-filled"] svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root[class*="mud-button-filled"],
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-icon-button[class*="mud-button-filled"],
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root[class*="mud-button-filled"] .mud-button-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root[class*="mud-button-filled"] .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root[class*="mud-button-filled"] svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-icon-button[class*="mud-button-filled"] .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-icon-button[class*="mud-button-filled"] svg {
    color: #1a1a1a !important;
    fill: currentColor !important;
}

/* Chiaro: filled Primary/Info (sfondo interactive) = testo/icone bianchi */
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-primary,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-primary .mud-button-label,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-primary .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-primary .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-primary svg,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-primary .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-primary .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-primary svg,
.ghub-shell--light .ghub-dashboard .mud-button-root.mud-button-filled-primary,
.ghub-shell--light .ghub-dashboard .mud-button-root.mud-button-filled-primary .mud-button-label,
.ghub-shell--light .ghub-dashboard .mud-button-root.mud-button-filled-primary .mud-icon-root,
.ghub-shell--light .ghub-dashboard .mud-button-root.mud-button-filled-primary svg,
.ghub-shell--light .ghub-dashboard .mud-icon-button.mud-button-filled-primary .mud-icon-root,
.ghub-shell--light .ghub-dashboard .mud-icon-button.mud-button-filled-primary svg,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-info,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-info .mud-button-label,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-info .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-info .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-info svg,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-info .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-info .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-info svg,
.ghub-shell--light .ghub-dashboard .mud-button-root.mud-button-filled-info,
.ghub-shell--light .ghub-dashboard .mud-button-root.mud-button-filled-info .mud-button-label,
.ghub-shell--light .ghub-dashboard .mud-button-root.mud-button-filled-info .mud-icon-root,
.ghub-shell--light .ghub-dashboard .mud-button-root.mud-button-filled-info svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-primary,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-primary .mud-button-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-primary .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-primary svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-icon-button.mud-button-filled-primary .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-icon-button.mud-button-filled-primary svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-info,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-info .mud-button-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-info .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-info svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-icon-button.mud-button-filled-info .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-icon-button.mud-button-filled-info svg {
    color: #ffffff !important;
    fill: currentColor !important;
}
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-filled-primary,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-filled-primary .mud-button-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-filled-primary .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-filled-primary svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-filled-info,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-filled-info .mud-button-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-filled-info .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-filled-info svg {
    color: #ffffff !important;
    fill: currentColor !important;
}


/* Chiaro: toolbar/griglia default = grigio scuro; disattive = grigio chiaro; Info record = arancione interactive */
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled),
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled),
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill),
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-toggle-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text),
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled),
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-checkbox:not(.mud-checked) {
    color: rgba(45, 45, 45, 0.88) !important;
}

html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) svg,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) svg,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-svg-icon,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) svg,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-select .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-checkbox:not(.mud-checked) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-checkbox:not(.mud-checked) .mud-svg-icon {
    color: rgba(45, 45, 45, 0.88) !important;
    fill: currentColor !important;
}

html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:disabled,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button.mud-disabled,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:disabled,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button.mud-disabled,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:disabled,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-disabled,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:disabled,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button.mud-disabled {
    color: rgba(45, 45, 45, 0.32) !important;
}

html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:disabled .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button.mud-disabled .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:disabled svg,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button.mud-disabled svg,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:disabled .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button.mud-disabled .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:disabled svg,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button.mud-disabled svg,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:disabled .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-disabled .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:disabled svg,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-disabled svg,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:disabled .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button.mud-disabled .mud-icon-root {
    color: rgba(45, 45, 45, 0.32) !important;
    fill: currentColor !important;
    opacity: 1 !important;
}

html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled),
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-toggle-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) {
    color: var(--ghub-interactive) !important;
}

html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) svg,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-checkbox.mud-checked .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-checkbox.mud-checked .mud-svg-icon {
    color: var(--ghub-interactive) !important;
    fill: currentColor !important;
}

/* Cerca adornment: stesso arancione dei placeholder */
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-default {
    color: var(--ghub-interactive) !important;
}
/* Filled success/error/warning/info: testo Mud semantico (non primary-text) */
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-success,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-success .mud-button-label,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-success .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-success svg,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-success .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-success svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-success,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-success .mud-button-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-icon-button.mud-button-filled-success .mud-icon-root {
    color: var(--mud-palette-success-text, #fff) !important;
    fill: currentColor !important;
}

.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-error,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-error .mud-button-label,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-error .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-error svg,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-error .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-error svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-error,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-error .mud-button-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-icon-button.mud-button-filled-error .mud-icon-root {
    color: var(--mud-palette-error-text, #fff) !important;
    fill: currentColor !important;
}

.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-warning,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-warning .mud-button-label,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-warning .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-warning svg,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-warning .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-warning svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-warning,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-warning .mud-button-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-icon-button.mud-button-filled-warning .mud-icon-root {
    color: var(--mud-palette-warning-text, #fff) !important;
    fill: currentColor !important;
}

.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-info,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-info .mud-button-label,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-info .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-button-root.mud-button-filled-info svg,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-info .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-button-filled-info svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-info,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-button-root.mud-button-filled-info .mud-button-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-content .mud-icon-button.mud-button-filled-info .mud-icon-root {
    color: #ffffff !important;
    fill: currentColor !important;
}

/* Chiaro: MudChip filled = testo bianco; outlined/trasparente = grigio scuro */
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled,
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled .mud-chip-content,
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled .mud-chip-label,
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled .mud-typography,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled .mud-chip-content,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled .mud-chip-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled .mud-typography {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.ghub-shell--light .mud-main-content .mud-chip.mud-chip-outlined,
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-outlined .mud-chip-content,
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-outlined .mud-chip-label,
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-outlined .mud-typography,
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-text,
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-text .mud-chip-content,
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-text .mud-chip-label,
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-text .mud-typography,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-outlined,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-outlined .mud-chip-content,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-outlined .mud-chip-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-outlined .mud-typography,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-text,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-text .mud-chip-content,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-text .mud-typography {
    color: rgba(45, 45, 45, 0.88) !important;
    -webkit-text-fill-color: rgba(45, 45, 45, 0.88) !important;
}

.ghub-shell--light .mud-main-content .mud-icon-button.mud-info-text .mud-icon-root, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button.mud-info-text .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-info-text .mud-svg-icon, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button.mud-info-text .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-icon-button.mud-primary-text .mud-icon-root, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-icon-button.mud-primary-text .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-toggle-icon-button.mud-info-text .mud-icon-root, body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-toggle-icon-button.mud-info-text .mud-icon-root {
    color: var(--ghub-interactive) !important;
    fill: currentColor !important;
}

.ghub-shell .mud-main-content .mud-selected-row, body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-selected-row {
    background-color: var(--ghub-interactive-soft) !important;
}

/* Dark: LED play/progress come tema chiaro (non silver) */
.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led.mud-icon-button,
.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led.mud-icon-button:disabled,
.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led.mud-icon-button.mud-button-outlined {
    background: rgba(10, 30, 22, 0.65) !important;
    background-color: rgba(10, 30, 22, 0.65) !important;
    border: 1px solid rgba(0, 100, 60, 0.55) !important;
    color: inherit !important;
}

.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led--off,
.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led--off.mud-button-outlined {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.55) !important;
    border-color: rgba(0, 70, 42, 0.75) !important;
}

.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led--off .mud-icon-root,
.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led--off .mud-svg-icon,
.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led--off svg {
    color: #3d9a6e !important;
    filter: none;
}

.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led--on,
.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led--on.mud-button-outlined,
.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led--on:disabled {
    border-color: rgba(0, 230, 160, 0.75) !important;
    box-shadow:
        0 0 8px rgba(0, 255, 156, 0.55),
        0 0 18px rgba(0, 200, 120, 0.4),
        inset 0 0 8px rgba(0, 255, 180, 0.2) !important;
}

.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led--on .mud-icon-root,
.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led--on .mud-svg-icon,
.ghub-shell--light .ghub-dashboard .ghub-dash-card .ghub-play-led--on svg {
    color: #7dffe0 !important;
    filter: drop-shadow(0 0 4px #00ff9c) drop-shadow(0 0 12px rgba(0, 230, 118, 0.9));
}

.ghub-shell--light .ghub-dashboard .ghub-progress-led.mud-progress-linear,
.ghub-shell--light .ghub-dashboard .ghub-progress-led .mud-progress-linear-background {
    background-color: #1f5c42 !important;
}

.ghub-shell--light .ghub-dashboard .ghub-progress-led .mud-progress-linear-bar {
    background-color: #5cffc2 !important;
    background-image: linear-gradient(
        90deg,
        #00c853 0%,
        #69ffd6 50%,
        #00e676 100%
    ) !important;
    box-shadow:
        0 0 4px #00ff9c,
        0 0 10px rgba(0, 230, 118, 0.75),
        0 0 16px rgba(0, 200, 100, 0.5);
}

/* Spinner boot (HomeLayout / layout resolvers): arancione Hub, non Mud Primary verde né nero default. */
.ghub-boot-spinner.mud-progress-circular,
.ghub-boot-spinner.mud-progress-circular svg,
.ghub-boot-spinner.mud-progress-circular circle,
.ghub-shell .ghub-boot-spinner.mud-progress-circular svg circle {
    color: #ff9800 !important;
    stroke: #ff9800 !important;
}

/* ========== Modulo — lettera accent (Scuro accesa / Chiaro piatta) ========== */
.ghub-shell .ghub-logo__accent {
    font-weight: 700;
}

/* Chiaro: lettera accent = stessi colori homepage ModuleHub (AccentColor), no glow */
.ghub-shell--light .ghub-logo .ghub-logo__accent {
    text-shadow: none !important;
    filter: none !important;
}

.ghub-module--hub.ghub-shell--light .ghub-logo__accent {
    color: #e53935 !important;
}

.ghub-module--atelier.ghub-shell--light .ghub-logo__accent {
    color: #fdd835 !important;
}

.ghub-module--sync.ghub-shell--light .ghub-logo__accent {
    color: #7e57c2 !important;
}

.ghub-module--bridge.ghub-shell--light .ghub-logo__accent {
    color: #1e88e5 !important;
}

.ghub-module--agent.ghub-shell--light .ghub-logo__accent {
    color: #00897b !important;
}

.ghub-module--passport.ghub-shell--light .ghub-logo__accent {
    color: #fb8c00 !important;
}

.ghub-module--sell.ghub-shell--light .ghub-logo__accent {
    color: #ff7043 !important;
}

/* Scuro: accent accesa — glow per modulo (shell--dark + module sulla stessa MudLayout) */
.ghub-module--hub.ghub-shell--dark .ghub-logo__accent {
    color: #ff8a80;
    text-shadow:
        0 0 2px #ffffff,
        0 0 8px rgba(255, 138, 128, 0.85),
        0 0 18px rgba(229, 57, 53, 0.65);
}

.ghub-module--agent.ghub-shell--dark .ghub-logo__accent {
    color: #7dffe0;
    text-shadow:
        0 0 2px #ffffff,
        0 0 6px #b8ffe8,
        0 0 12px #00ffb0,
        0 0 22px #00e676,
        0 0 36px rgba(0, 230, 118, 0.7);
}

.ghub-module--bridge.ghub-shell--dark .ghub-logo__accent {
    color: #82b1ff;
    text-shadow:
        0 0 2px #ffffff,
        0 0 8px rgba(130, 177, 255, 0.85),
        0 0 18px rgba(30, 136, 229, 0.6);
}

.ghub-module--sync.ghub-shell--dark .ghub-logo__accent {
    color: #e1bee7;
    text-shadow:
        0 0 2px #ffffff,
        0 0 8px rgba(225, 190, 231, 0.85),
        0 0 18px rgba(126, 87, 194, 0.6);
}

.ghub-module--atelier.ghub-shell--dark .ghub-logo__accent {
    color: #fff59d;
    text-shadow:
        0 0 2px #ffffff,
        0 0 8px rgba(255, 245, 157, 0.85),
        0 0 18px rgba(253, 216, 53, 0.55);
}

.ghub-module--passport.ghub-shell--dark .ghub-logo__accent {
    color: #ffcc80;
    text-shadow:
        0 0 2px #ffffff,
        0 0 8px rgba(255, 204, 128, 0.85),
        0 0 18px rgba(251, 140, 0, 0.6);
}

.ghub-module--sell.ghub-shell--dark .ghub-logo__accent {
    color: #ffab91;
    text-shadow:
        0 0 2px #ffffff,
        0 0 8px rgba(255, 171, 145, 0.85),
        0 0 18px rgba(255, 112, 67, 0.6);
}

/* Nav icone multicolore — slot 1–5 (link, MudNavGroup header, nth-child) */
.ghub-shell .ghub-drawer .ghub-nav-link--1 .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-nav-link--1 .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-nav-link--1 .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-nav-group--1 > .mud-nav-link .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-nav-group--1 > .mud-nav-link .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-nav-group--1 > .mud-nav-link .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+1) .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+1) .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+1) .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+1) > .mud-nav-link .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+1) > .mud-nav-link .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+1) > .mud-nav-link .mud-svg-icon {
    color: #00e5a0 !important;
    fill: #00e5a0 !important;
}

.ghub-shell .ghub-drawer .ghub-nav-link--2 .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-nav-link--2 .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-nav-link--2 .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-nav-group--2 > .mud-nav-link .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-nav-group--2 > .mud-nav-link .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-nav-group--2 > .mud-nav-link .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+2) .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+2) .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+2) .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+2) > .mud-nav-link .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+2) > .mud-nav-link .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+2) > .mud-nav-link .mud-svg-icon {
    color: #64b5f6 !important;
    fill: #64b5f6 !important;
}

.ghub-shell .ghub-drawer .ghub-nav-link--3 .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-nav-link--3 .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-nav-link--3 .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-nav-group--3 > .mud-nav-link .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-nav-group--3 > .mud-nav-link .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-nav-group--3 > .mud-nav-link .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+3) .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+3) .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+3) .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+3) > .mud-nav-link .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+3) > .mud-nav-link .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+3) > .mud-nav-link .mud-svg-icon {
    color: #ffb74d !important;
    fill: #ffb74d !important;
}

.ghub-shell .ghub-drawer .ghub-nav-link--4 .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-nav-link--4 .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-nav-link--4 .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-nav-group--4 > .mud-nav-link .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-nav-group--4 > .mud-nav-link .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-nav-group--4 > .mud-nav-link .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+4) .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+4) .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+4) .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+4) > .mud-nav-link .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+4) > .mud-nav-link .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+4) > .mud-nav-link .mud-svg-icon {
    color: #ce93d8 !important;
    fill: #ce93d8 !important;
}

.ghub-shell .ghub-drawer .ghub-nav-link--5 .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-nav-link--5 .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-nav-link--5 .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-nav-group--5 > .mud-nav-link .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-nav-group--5 > .mud-nav-link .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-nav-group--5 > .mud-nav-link .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+5) .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+5) .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-link:nth-child(5n+5) .mud-svg-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+5) > .mud-nav-link .mud-nav-link-icon,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+5) > .mud-nav-link .mud-icon-root,
.ghub-shell .ghub-drawer .ghub-navmenu > .mud-nav-group:nth-child(5n+5) > .mud-nav-link .mud-svg-icon {
    color: #ef9a9a !important;
    fill: #ef9a9a !important;
}

/* ========== Dialog — chrome + form (renderizzati su body, fuori .ghub-shell) ========== */
/* Pannello opaco: stesso hue di --ghub-surface-rgb, senza alpha (niente griglia sotto) */
body:has(.ghub-shell) .mud-dialog-container .mud-dialog,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog.mud-paper {
    --mud-palette-surface: rgb(var(--ghub-surface-rgb)) !important;
    background: rgb(var(--ghub-surface-rgb)) !important;
    background-color: rgb(var(--ghub-surface-rgb)) !important;
    background-image: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

body:has(.ghub-shell) .mud-dialog-container .mud-dialog-title {
    background: rgb(var(--ghub-surface-rgb)) !important;
    background-color: rgb(var(--ghub-surface-rgb)) !important;
    color: var(--ghub-chrome-fg) !important;
    border-bottom: 1px solid var(--ghub-card-border) !important;
}

body:has(.ghub-shell) .mud-dialog-container .mud-dialog-title .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog-title .mud-icon-root {
    color: var(--ghub-chrome-fg) !important;
}

body:has(.ghub-shell) .mud-dialog-container .mud-dialog-content {
    background: rgb(var(--ghub-surface-rgb)) !important;
    background-color: rgb(var(--ghub-surface-rgb)) !important;
    color: var(--ghub-chrome-fg) !important;
}

body:has(.ghub-shell) .mud-dialog-container .mud-dialog-actions {
    background: rgb(var(--ghub-surface-rgb)) !important;
    background-color: rgb(var(--ghub-surface-rgb)) !important;
    border-top: 1px solid rgba(var(--ghub-accent-rgb), 0.14) !important;
}

/* ---------- Form fields — vetro (pagina + dialog) ---------- */
.ghub-shell .mud-main-content .mud-input.mud-input-outlined,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input.mud-input-outlined {
    border-radius: 10px !important;
    background: var(--ghub-select-glass) !important;
    background-color: var(--ghub-select-glass) !important;
    background-image: linear-gradient(
        165deg,
        rgba(var(--ghub-accent-rgb), 0.08) 0%,
        transparent 55%
    ) !important;
    -webkit-backdrop-filter: blur(8px) saturate(1.15) !important;
    backdrop-filter: blur(8px) saturate(1.15) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.06),
        0 0 16px rgba(var(--ghub-accent-rgb), 0.14),
        inset 0 1px 0 rgba(var(--ghub-accent-rgb), 0.16) !important;
    transition: box-shadow 0.18s ease, background-color 0.18s ease;
}

/* Outer control: niente fill opaco/trasparente inline che annulla il vetro interno */
.ghub-shell .mud-main-content .mud-input-control:not(.ghub-company-select),
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control {
    background: transparent !important;
    background-color: transparent !important;
}

.ghub-shell .mud-main-content .mud-input-outlined .mud-input-outlined-border,
.ghub-shell .mud-main-content fieldset.mud-input-outlined-border,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-outlined .mud-input-outlined-border,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog fieldset.mud-input-outlined-border {
    border-color: var(--ghub-card-border) !important;
    border-radius: 10px !important;
}

.ghub-shell .mud-main-content .mud-input-outlined:hover .mud-input-outlined-border,
.ghub-shell .mud-main-content fieldset.mud-input-outlined-border:hover,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-outlined:hover .mud-input-outlined-border,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog fieldset.mud-input-outlined-border:hover {
    border-color: rgba(var(--ghub-accent-rgb), 0.55) !important;
}

.ghub-shell .mud-main-content .mud-input.mud-input-outlined:hover,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input.mud-input-outlined:hover {
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.1),
        0 0 20px rgba(var(--ghub-accent-rgb), 0.2),
        inset 0 1px 0 rgba(var(--ghub-accent-rgb), 0.2) !important;
}

.ghub-shell .mud-main-content .mud-input-outlined.mud-input-focused .mud-input-outlined-border,
.ghub-shell .mud-main-content .mud-input-outlined.mud-input-focused fieldset.mud-input-outlined-border,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-outlined.mud-input-focused .mud-input-outlined-border,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-outlined.mud-input-focused fieldset.mud-input-outlined-border {
    border-color: var(--ghub-interactive) !important;
    border-width: 2px !important;
}

.ghub-shell .mud-main-content .mud-input.mud-input-outlined.mud-input-focused,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input.mud-input-outlined.mud-input-focused {
    background: var(--ghub-select-glass) !important;
    background-color: var(--ghub-select-glass) !important;
    background-image: linear-gradient(
        165deg,
        rgba(var(--ghub-interactive-rgb), 0.12) 0%,
        transparent 55%
    ) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-interactive-rgb), 0.22),
        0 0 22px rgba(var(--ghub-interactive-rgb), 0.28),
        inset 0 1px 0 rgba(var(--ghub-interactive-rgb), 0.18) !important;
}

.ghub-shell .mud-main-content .mud-input-label-outlined,
.ghub-shell .mud-main-content .mud-input-label-inputcontrol,
.ghub-shell .mud-main-content .mud-input-label,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-label-outlined,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-label-inputcontrol,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-label {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    opacity: 1 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

.ghub-shell .mud-main-content .mud-input-outlined.mud-input-focused .mud-input-label,
.ghub-shell .mud-main-content .mud-input-control:focus-within .mud-input-label-outlined,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-outlined.mud-input-focused .mud-input-label,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control:focus-within .mud-input-label-outlined {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    opacity: 1 !important;
    background: transparent !important;
    background-color: transparent !important;
}

.ghub-shell .mud-main-content .mud-input,
.ghub-shell .mud-main-content input.mud-input-root,
.ghub-shell .mud-main-content div.mud-input-slot.mud-input-root,
.ghub-shell .mud-main-content .mud-select-input,
.ghub-shell .mud-main-content .mud-select .mud-input-slot,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog input.mud-input-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog div.mud-input-slot.mud-input-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-select-input,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-select .mud-input-slot {
    color: var(--ghub-chrome-fg) !important;
}

/* Icone adornment campi (Select / Autocomplete / TextField) — arancione interattivo */
.ghub-shell .mud-main-content .mud-input-control .mud-input-adornment,
.ghub-shell .mud-main-content .mud-input-control .mud-input-adornment .mud-icon-root,
.ghub-shell .mud-main-content .mud-input-control .mud-input-adornment .mud-svg-icon,
.ghub-shell .mud-main-content .mud-input-control .mud-input-adornment .mud-icon-default,
.ghub-shell .mud-main-content .mud-input-control .mud-input-adornment .mud-input-adornment-icon,
.ghub-shell .mud-main-content .mud-select .mud-input-adornment,
.ghub-shell .mud-main-content .mud-autocomplete .mud-input-adornment,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment .mud-icon-default,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment .mud-input-adornment-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-select .mud-input-adornment,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-autocomplete .mud-input-adornment {
    color: var(--ghub-interactive) !important;
}

.ghub-shell .mud-main-content .mud-input-control .mud-input-adornment svg,
.ghub-shell .mud-main-content .mud-input-control .mud-input-adornment svg *:not([fill="none"]),
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment svg,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment svg *:not([fill="none"]) {
    color: var(--ghub-interactive) !important;
    fill: currentColor !important;
}

.ghub-shell .mud-main-content .mud-input-control .mud-input-adornment svg [fill="none"],
.ghub-shell .mud-main-content .mud-input-control .mud-input-adornment svg path[fill="none"],
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment svg [fill="none"],
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment svg path[fill="none"] {
    fill: none !important;
}

/* Freccia MudSelect / clear Autocomplete */
.ghub-shell .mud-main-content .mud-select .mud-input-adornment-end .mud-icon-root,
.ghub-shell .mud-main-content .mud-autocomplete .mud-input-adornment-end .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-select .mud-input-adornment-end .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-autocomplete .mud-input-adornment-end .mud-icon-root {
    color: var(--ghub-interactive) !important;
}

/* HelperText / hint sotto i campi */
.ghub-shell .mud-main-content .mud-input-helper-text,
.ghub-shell .mud-main-content .mud-input-control-helper-container,
.ghub-shell .mud-main-content .mud-input-control-helper-container .mud-typography,
.ghub-shell .mud-main-content .mud-input-helper-text .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-helper-text,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control-helper-container,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control-helper-container .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-helper-text .mud-typography {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    opacity: 1 !important;
}

/* Checkbox / Radio / Switch — testo label = stesso grigio */
.ghub-shell .mud-main-content .mud-checkbox .mud-typography,
.ghub-shell .mud-main-content .mud-radio .mud-typography,
.ghub-shell .mud-main-content .mud-switch .mud-typography,
.ghub-shell .mud-main-content .mud-input-control.mud-checkbox .mud-typography,
.ghub-shell .mud-main-content .mud-input-control.mud-radio .mud-typography,
.ghub-shell .mud-main-content .mud-input-control.mud-switch .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-checkbox .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-radio .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-switch .mud-typography {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    opacity: 1 !important;
}

/* Switch ON — track + thumb in accento interattivo
   MudBlazor 9: track ha .mud-primary → --mud-palette-primary; senza --ghub-interactive su body
   la primary del tema (verde scuro @ opacity .5) resta illeggibile. */
.ghub-shell .mud-main-content .mud-switch .mud-switch-base.mud-checked,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-switch .mud-switch-base.mud-checked {
    color: var(--ghub-interactive, #ff9800) !important;
}

.ghub-shell .mud-main-content .mud-switch .mud-switch-base.mud-checked + .mud-switch-track,
.ghub-shell .mud-main-content .mud-switch .mud-switch-track.mud-primary,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-switch .mud-switch-base.mud-checked + .mud-switch-track,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-switch .mud-switch-track.mud-primary {
    background-color: var(--ghub-interactive, #ff9800) !important;
    opacity: 0.9 !important;
}

/* Checkbox / Radio ON — icona in accento interattivo */
.ghub-shell .mud-main-content .mud-checkbox.mud-checked .mud-icon-root,
.ghub-shell .mud-main-content .mud-checkbox.mud-checked .mud-svg-icon,
.ghub-shell .mud-main-content .mud-radio.mud-checked .mud-icon-root,
.ghub-shell .mud-main-content .mud-radio.mud-checked .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-checkbox.mud-checked .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-checkbox.mud-checked .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-radio.mud-checked .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-radio.mud-checked .mud-svg-icon {
    color: var(--ghub-interactive) !important;
    fill: currentColor !important;
}

/* MudTable (non DataGrid) — titoli colonna */
.ghub-shell .mud-main-content .mud-table .mud-table-head .mud-table-cell,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-table .mud-table-head .mud-table-cell,
.ghub-shell .mud-main-content .mud-table .mud-table-head .mud-table-cell .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-table .mud-table-head .mud-table-cell .mud-typography,
.ghub-shell .mud-main-content .mud-table .mud-table-head .mud-table-sort-label,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-table .mud-table-head .mud-table-sort-label {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    opacity: 1 !important;
}

/* NumericField spinner */
.ghub-shell .mud-main-content .mud-input-numeric-spin .mud-icon-button .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-numeric-spin .mud-icon-button .mud-icon-root {
    color: var(--ghub-chrome-fg) !important;
}

/* ---------- Chiaro: valori campi form = interactive; label/hint = muted ---------- */
.ghub-shell--light .mud-main-content .mud-input,
.ghub-shell--light .mud-main-content input.mud-input-root,
.ghub-shell--light .mud-main-content div.mud-input-slot.mud-input-root,
.ghub-shell--light .mud-main-content .mud-select-input,
.ghub-shell--light .mud-main-content .mud-select .mud-input-slot,
.ghub-shell--light .mud-main-content textarea.mud-input-root,
.ghub-shell--light .mud-main-content .mud-input-slot,
.ghub-shell--light .mud-main-content .mud-typography:not(.mud-input-label):not(.mud-input-helper-text).mud-input-slot,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog input.mud-input-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog div.mud-input-slot.mud-input-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-select-input,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-select .mud-input-slot,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog textarea.mud-input-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-slot {
    color: var(--ghub-interactive) !important;
    -webkit-text-fill-color: var(--ghub-interactive) !important;
    caret-color: var(--ghub-interactive);
}
/* Chiaro: valori tendine/filtri toolbar + periodo dashboard = interactive (dopo clickable-fg form) */
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-select .mud-input-slot,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-select .mud-select-input,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-select input,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-select .mud-typography:not(.mud-input-label):not(.mud-input-helper-text),
.ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-input:not(.mud-input-label),
.ghub-shell--light .mud-main-content .mud-paper.sticky-top input.mud-input-root,
.ghub-shell--light .mud-main-content .mud-paper.sticky-top div.mud-input-slot.mud-input-root,
.ghub-shell--light .mud-main-content .ghub-dashboard .mud-select .mud-input-slot,
.ghub-shell--light .mud-main-content .ghub-dashboard .mud-select .mud-select-input,
.ghub-shell--light .mud-main-content .ghub-dashboard .mud-select input,
.ghub-shell--light .mud-main-content .ghub-dashboard .mud-select .mud-typography:not(.mud-input-label):not(.mud-input-helper-text),
.ghub-shell--light .mud-main-content .ghub-dashboard .fp-kpi-period .mud-input-slot,
.ghub-shell--light .mud-main-content .ghub-dashboard .fp-kpi-period .mud-select-input,
.ghub-shell--light .mud-main-content .ghub-dashboard .fp-kpi-period input,
.ghub-shell--light .mud-main-content .ghub-dashboard .fp-kpi-date .mud-input-slot,
.ghub-shell--light .mud-main-content .ghub-dashboard .fp-kpi-date input,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-input-slot,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-select-input,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select input,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-select .mud-typography:not(.mud-input-label):not(.mud-input-helper-text),
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar input.mud-input-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar div.mud-input-slot.mud-input-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-slot,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-head .mud-input,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-head input.mud-input-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-head div.mud-input-slot.mud-input-root,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-head .mud-input-slot,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-head .mud-select .mud-input-slot,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-head .mud-select .mud-select-input,
.ghub-shell--light .mud-main-content .mud-data-grid .mud-table-head .mud-select input,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-paper.sticky-top .mud-select .mud-input-slot,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-select .mud-input-slot,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-toolbar .mud-input,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-data-grid .mud-table-head .mud-input {
    color: var(--ghub-interactive) !important;
    -webkit-text-fill-color: var(--ghub-interactive) !important;
    caret-color: var(--ghub-interactive);
}

.ghub-shell--light .mud-main-content .mud-input-label-outlined,
.ghub-shell--light .mud-main-content .mud-input-label-inputcontrol,
.ghub-shell--light .mud-main-content .mud-input-label,
.ghub-shell--light .mud-main-content .mud-input-outlined.mud-input-focused .mud-input-label,
.ghub-shell--light .mud-main-content .mud-input-control:focus-within .mud-input-label-outlined,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-label-outlined,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-label-inputcontrol,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-outlined.mud-input-focused .mud-input-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-control:focus-within .mud-input-label-outlined {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    opacity: 1 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

.ghub-shell--light .mud-main-content .mud-input-helper-text,
.ghub-shell--light .mud-main-content .mud-input-control-helper-container,
.ghub-shell--light .mud-main-content .mud-input-control-helper-container .mud-typography,
.ghub-shell--light .mud-main-content .mud-input-helper-text .mud-typography,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-helper-text,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-control-helper-container,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-control-helper-container .mud-typography,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-helper-text .mud-typography {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    opacity: 1 !important;
}

.ghub-shell--light .mud-main-content .mud-input-control .mud-input-adornment,
.ghub-shell--light .mud-main-content .mud-input-control .mud-input-adornment .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-input-control .mud-input-adornment .mud-svg-icon,
.ghub-shell--light .mud-main-content .mud-input-control .mud-input-adornment .mud-icon-default,
.ghub-shell--light .mud-main-content .mud-input-control .mud-input-adornment .mud-input-adornment-icon,
.ghub-shell--light .mud-main-content .mud-select .mud-input-adornment,
.ghub-shell--light .mud-main-content .mud-autocomplete .mud-input-adornment,
.ghub-shell--light .mud-main-content .mud-select .mud-input-adornment-end .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-autocomplete .mud-input-adornment-end .mud-icon-root,
.ghub-shell--light .mud-main-content .mud-input-numeric-spin .mud-icon-button .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment .mud-svg-icon,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment .mud-icon-default,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment .mud-input-adornment-icon,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-select .mud-input-adornment,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-autocomplete .mud-input-adornment,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-select .mud-input-adornment-end .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-autocomplete .mud-input-adornment-end .mud-icon-root,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-numeric-spin .mud-icon-button .mud-icon-root {
    color: var(--ghub-interactive) !important;
}

.ghub-shell--light .mud-main-content .mud-input-control .mud-input-adornment svg,
.ghub-shell--light .mud-main-content .mud-input-control .mud-input-adornment svg *:not([fill="none"]),
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment svg,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-input-control .mud-input-adornment svg *:not([fill="none"]) {
    color: var(--ghub-clickable-fg) !important;
    fill: currentColor !important;
}

/* Chiaro (dopo form adornment): toolbar/griglia default grigio; record Info + cerca = interactive */
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-icon-button:not(:disabled):not(.mud-disabled) svg,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-paper.sticky-top .mud-toggle-icon-button:not(:disabled):not(.mud-disabled) svg,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) .mud-svg-icon,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button:not(:disabled):not(.mud-disabled):not(.mud-info-text):not(.mud-primary-text):not(.ghub-grid-icon--warn):not(.ghub-grid-icon--warn-fill) svg,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-pagination .mud-icon-button:not(:disabled):not(.mud-disabled) .mud-svg-icon,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-checkbox:not(.mud-checked) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-checkbox:not(.mud-checked) .mud-svg-icon {
    color: rgba(45, 45, 45, 0.88) !important;
    fill: currentColor !important;
}

html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) .mud-svg-icon,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-icon-button.mud-info-text:not(:disabled):not(.mud-disabled) svg,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-adornment-icon.mud-icon-default,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-control .mud-input-adornment .mud-icon-root,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-control .mud-input-adornment .mud-svg-icon,
html body .ghub-shell--light .mud-main-content .mud-data-grid .mud-table-toolbar .mud-input-control .mud-input-adornment svg {
    color: var(--ghub-interactive) !important;
    fill: currentColor !important;
}
/* Chiaro: spinner griglia = stesso arancione interactive dei placeholder */
.ghub-shell--light .mud-main-content .mud-progress-circular.mud-progress-circular-color-primary svg,
.ghub-shell--light .mud-main-content .mud-progress-circular.mud-progress-circular-color-primary circle,
.ghub-shell--light .mud-main-content .mud-progress-circular svg circle {
    stroke: var(--ghub-interactive) !important;
}

/*
 * Validazione MudBlazor (.mud-input-error): il tema glass (light/dark) forza
 * bordo/label/hint con !important e spegne il rosso di errore. Dopo gli
 * override form, ripristina bordo, glow, label e messaggio.
 */
.ghub-shell .mud-main-content .mud-input-error .mud-input-outlined-border,
.ghub-shell .mud-main-content .mud-input-error fieldset.mud-input-outlined-border,
.ghub-shell .mud-main-content .mud-input-outlined.mud-input-error .mud-input-outlined-border,
.ghub-shell .mud-main-content .mud-input-outlined.mud-input-error:hover .mud-input-outlined-border,
.ghub-shell .mud-main-content .mud-input-outlined.mud-input-error.mud-input-focused .mud-input-outlined-border,
.ghub-shell .mud-main-content .mud-input-outlined.mud-input-error.mud-input-focused fieldset.mud-input-outlined-border,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-error .mud-input-outlined-border,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-error fieldset.mud-input-outlined-border,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-outlined.mud-input-error .mud-input-outlined-border,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-outlined.mud-input-error:hover .mud-input-outlined-border,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-outlined.mud-input-error.mud-input-focused .mud-input-outlined-border,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-outlined.mud-input-error.mud-input-focused fieldset.mud-input-outlined-border {
    border-color: var(--mud-palette-error, #f44336) !important;
}

.ghub-shell .mud-main-content .mud-input.mud-input-outlined.mud-input-error:hover,
.ghub-shell .mud-main-content .mud-input.mud-input-outlined.mud-input-error.mud-input-focused,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input.mud-input-outlined.mud-input-error:hover,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input.mud-input-outlined.mud-input-error.mud-input-focused {
    box-shadow:
        0 0 0 1px color-mix(in srgb, var(--mud-palette-error, #f44336) 35%, transparent),
        0 0 18px color-mix(in srgb, var(--mud-palette-error, #f44336) 22%, transparent),
        inset 0 1px 0 color-mix(in srgb, var(--mud-palette-error, #f44336) 16%, transparent) !important;
}

.ghub-shell .mud-main-content .mud-input-label.mud-input-error,
.ghub-shell .mud-main-content .mud-input-label-outlined.mud-input-error,
.ghub-shell .mud-main-content .mud-input-label-inputcontrol.mud-input-error,
.ghub-shell .mud-main-content .mud-input-error .mud-input-label,
.ghub-shell .mud-main-content .mud-input-error .mud-input-label-outlined,
.ghub-shell .mud-main-content .mud-input-control.mud-input-error .mud-input-label,
.ghub-shell .mud-main-content .mud-input-outlined.mud-input-error.mud-input-focused .mud-input-label,
.ghub-shell .mud-main-content .mud-input-control.mud-input-error:focus-within .mud-input-label-outlined,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-label.mud-input-error,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-label-outlined.mud-input-error,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-label-inputcontrol.mud-input-error,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-error .mud-input-label,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-error .mud-input-label-outlined,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control.mud-input-error .mud-input-label,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-outlined.mud-input-error.mud-input-focused .mud-input-label,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control.mud-input-error:focus-within .mud-input-label-outlined {
    color: var(--mud-palette-error, #f44336) !important;
    -webkit-text-fill-color: var(--mud-palette-error, #f44336) !important;
}

.ghub-shell .mud-main-content .mud-input-helper-text.mud-input-error,
.ghub-shell .mud-main-content .mud-input-helper-text.mud-input-error .mud-typography,
.ghub-shell .mud-main-content .mud-input-control.mud-input-error .mud-input-helper-text,
.ghub-shell .mud-main-content .mud-input-control.mud-input-error .mud-input-helper-text .mud-typography,
.ghub-shell .mud-main-content .mud-input-control.mud-input-error .mud-input-control-helper-container .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-helper-text.mud-input-error,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-helper-text.mud-input-error .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control.mud-input-error .mud-input-helper-text,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control.mud-input-error .mud-input-helper-text .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control.mud-input-error .mud-input-control-helper-container .mud-typography {
    color: var(--mud-palette-error, #f44336) !important;
    -webkit-text-fill-color: var(--mud-palette-error, #f44336) !important;
}

/* Scuro: footer form — stessi colori del tema Scuro (non accent logo) */
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-text-default,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-text-default .mud-button-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root:not(.mud-button-filled):not([class*="mud-button-text-error"]):not([class*="mud-button-text-success"]):not([class*="mud-button-filled-"]) {
    color: rgba(255, 255, 255, 0.96) !important;
}

body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-text-error,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-text-error .mud-button-label,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-error-text,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-error-text .mud-button-label {
    color: var(--mud-palette-error, #f44336) !important;
}

body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-filled-success,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-dialog-actions .mud-button-root.mud-button-filled-success .mud-button-label {
    color: #fff !important;
    background-color: var(--mud-palette-success, #4caf50) !important;
}

/* ---------- Collapse form (MudStack.bg-light + MudCollapse) ---------- */
.ghub-shell .mud-main-content .bg-light,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .bg-light {
    background: rgba(var(--ghub-surface-rgb), 0.72) !important;
    background-color: rgba(var(--ghub-surface-rgb), 0.72) !important;
    background-image: linear-gradient(
        165deg,
        rgba(var(--ghub-accent-rgb), 0.1) 0%,
        transparent 60%
    ) !important;
    border: 1px solid var(--ghub-card-border) !important;
    border-radius: var(--ghub-radius, 12px) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.05),
        0 0 16px rgba(var(--ghub-accent-rgb), 0.12),
        inset 0 1px 0 rgba(var(--ghub-accent-rgb), 0.16) !important;
    color: var(--ghub-chrome-fg) !important;
    overflow: hidden;
}

.ghub-shell .mud-main-content .bg-light .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .bg-light .mud-typography {
    color: var(--ghub-chrome-fg) !important;
}

/* Chiaro + Scuro: label collapse / campi / hint — stesso grigio muted opaco */
.ghub-shell--dark .mud-main-content .bg-light .mud-typography,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .bg-light .mud-typography,
.ghub-shell--light .mud-main-content .bg-light .mud-typography,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .bg-light .mud-typography {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    opacity: 1 !important;
}

.ghub-shell--dark .mud-main-content .mud-expand-panel .mud-expand-panel-header .mud-typography,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .mud-expand-panel .mud-expand-panel-header .mud-typography,
.ghub-shell--light .mud-main-content .mud-expand-panel .mud-expand-panel-header .mud-typography,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-expand-panel .mud-expand-panel-header .mud-typography {
    color: var(--ghub-form-muted, #a0a0a0) !important;
    -webkit-text-fill-color: var(--ghub-form-muted, #a0a0a0) !important;
    opacity: 1 !important;
}

.ghub-shell .mud-main-content .bg-light .mud-icon-button,
.ghub-shell .mud-main-content .bg-light .mud-icon-button .mud-icon-root,
.ghub-shell .mud-main-content .bg-light .mud-icon-button .mud-svg-icon,
.ghub-shell .mud-main-content .bg-light .mud-icon-button svg,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .bg-light .mud-icon-button,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .bg-light .mud-icon-button .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .bg-light .mud-icon-button .mud-svg-icon,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .bg-light .mud-icon-button svg {
    color: var(--ghub-chrome-fg) !important;
    fill: currentColor !important;
}

.ghub-shell--dark .mud-main-content .bg-light .mud-icon-button .mud-icon-root,
.ghub-shell--dark .mud-main-content .bg-light .mud-icon-button svg,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .bg-light .mud-icon-button .mud-icon-root,
body:has(.ghub-shell--dark) .mud-dialog-container .mud-dialog .bg-light .mud-icon-button svg {
    color: #fff !important;
    fill: #fff !important;
}

/* MudExpansionPanel (se usato nei form) */
.ghub-shell .mud-main-content .mud-expand-panel,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-expand-panel {
    background: rgba(var(--ghub-surface-rgb), 0.72) !important;
    background-color: rgba(var(--ghub-surface-rgb), 0.72) !important;
    border: 1px solid var(--ghub-card-border) !important;
    border-radius: var(--ghub-radius, 12px) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.05),
        0 0 16px rgba(var(--ghub-accent-rgb), 0.12) !important;
    color: var(--ghub-chrome-fg) !important;
    overflow: hidden;
}

.ghub-shell .mud-main-content .mud-expand-panel .mud-expand-panel-header,
.ghub-shell .mud-main-content .mud-expand-panel .mud-expand-panel-content,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-expand-panel .mud-expand-panel-header,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-expand-panel .mud-expand-panel-content {
    background: transparent !important;
    color: var(--ghub-chrome-fg) !important;
}

.ghub-shell .mud-main-content .mud-expand-panel .mud-expand-panel-header .mud-typography,
.ghub-shell .mud-main-content .mud-expand-panel .mud-expand-panel-header .mud-icon-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-expand-panel .mud-expand-panel-header .mud-typography,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-expand-panel .mud-expand-panel-header .mud-icon-root {
    color: var(--ghub-chrome-fg) !important;
}

/* Backdrop: overlay e dialog sono sibling in .mud-dialog-container.
   Scrim = solo .mud-overlay-scrim. Dialog DEVE restare sopra lo scrim
   (Mud: dialog z-index = --mud-zindex-dialog + 2, overlay = +1). */
body:has(.ghub-shell) .mud-dialog-container > .mud-overlay.mud-overlay-dialog {
    background: transparent !important;
    background-color: transparent !important;
    /* non abbassare z-index dell’overlay sotto il default Mud */
}

body:has(.ghub-shell) .mud-dialog-container > .mud-overlay.mud-overlay-dialog .mud-overlay-scrim.mud-overlay-dark {
    background-color: rgba(0, 0, 0, 0.55) !important;
    border-color: transparent !important;
}

body:has(.ghub-shell) .mud-dialog-container {
    background: transparent !important;
    background-color: transparent !important;
}

/* Dialog — pannello solido sopra lo scrim (non transparent, non z-index basso) */
body:has(.ghub-shell) .mud-dialog-container .mud-dialog {
    z-index: calc(var(--mud-zindex-dialog, 1300) + 2) !important;
    background: rgb(var(--ghub-surface-rgb, 38, 32, 12)) !important;
    background-color: rgb(var(--ghub-surface-rgb, 38, 32, 12)) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border: 1px solid var(--ghub-card-border, rgba(80, 255, 210, 0.35)) !important;
    color: var(--ghub-chrome-fg, rgba(245, 255, 250, 0.96)) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb, 0, 230, 170), 0.05),
        0 16px 48px rgba(0, 0, 0, 0.45),
        0 0 24px rgba(var(--ghub-accent-rgb, 0, 230, 170), 0.14) !important;
}

/* Dentro dialog: paper/grid opachi (niente vetro che lascia passare lo scrim) */
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-paper:not(.ghub-dash-card):not(.ghub-color-swatch):not(.ghub-cal-event),
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-data-grid,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-alert,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-card {
    background: rgba(var(--ghub-surface-rgb, 38, 32, 12), 0.98) !important;
    background-color: rgba(var(--ghub-surface-rgb, 38, 32, 12), 0.98) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

/* Lista indirizzi in dialog — aria sotto footer/pager */
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-dialog-content:has(.ghub-dialog-addresses) {
    padding-bottom: 1.25rem !important;
}

body:has(.ghub-shell) .mud-dialog-container .mud-dialog .ghub-dialog-addresses .mud-data-grid {
    margin-bottom: 0.5rem !important;
}

/* Liste in dialog: niente card-in-card (il dialog è già il bordo) */
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .ghub-dialog-flat-list .mud-data-grid,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .ghub-dialog-flat-list__grid {
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

body:has(.ghub-shell) .mud-dialog-container .mud-dialog .ghub-dialog-flat-list .mud-data-grid .mud-table-toolbar {
    border-bottom: 1px solid rgba(var(--ghub-accent-rgb), 0.14) !important;
}

/* ========== Overlay glass (menu, popover/select, snackbar) ========== */
.mud-popover.mud-paper,
.mud-popover .mud-popover-paper,
html body div[id^="popovercontent-"].mud-popover,
html body .mud-popover-provider .mud-popover,
html body .ghub-select-popover,
.mud-menu .mud-menu-content,
.mud-snackbar-content-root,
.mud-picker-popover-paper {
    background: var(--ghub-card-glass, rgba(14, 45, 34, 0.58)) !important;
    background-color: var(--ghub-card-glass, rgba(14, 45, 34, 0.58)) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.2) !important;
    backdrop-filter: blur(12px) saturate(1.2) !important;
    border: 1px solid var(--ghub-card-border, rgba(80, 255, 210, 0.35)) !important;
    color: var(--ghub-chrome-fg, rgba(245, 255, 250, 0.96)) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb, 0, 230, 170), 0.05),
        0 0 24px rgba(var(--ghub-accent-rgb, 0, 230, 170), 0.14) !important;
}

/* MudSelect / MudMenu / Autocomplete — pannello voci allineato al select vetro */
.mud-popover.mud-paper:has(.mud-list),
html body div[id^="popovercontent-"].mud-popover:has(.mud-list),
html body .ghub-select-popover {
    background: var(--ghub-select-glass, var(--ghub-card-glass, rgba(14, 45, 34, 0.58))) !important;
    background-color: var(--ghub-select-glass, var(--ghub-card-glass, rgba(14, 45, 34, 0.58))) !important;
    border-color: var(--ghub-select-border, var(--ghub-card-border, rgba(80, 255, 210, 0.35))) !important;
    border-radius: 14px !important;
    overflow: hidden;
}

.mud-popover.mud-paper .mud-list,
.mud-popover.mud-paper .mud-menu-list-wrapper,
html body div[id^="popovercontent-"] .mud-list,
html body div[id^="popovercontent-"] .mud-menu-list-wrapper,
html body .ghub-select-popover .ghub-select-list,
html body .ghub-select-popover .mud-list {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--ghub-chrome-fg, rgba(245, 255, 250, 0.96)) !important;
}

.mud-popover.mud-paper .mud-list-item,
html body div[id^="popovercontent-"] .mud-list-item,
html body .ghub-select-popover .mud-list-item {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--ghub-chrome-fg, rgba(245, 255, 250, 0.96)) !important;
}

.mud-popover.mud-paper .mud-list-item .mud-list-item-text,
.mud-popover.mud-paper .mud-list-item .mud-typography,
html body div[id^="popovercontent-"] .mud-list-item .mud-list-item-text,
html body div[id^="popovercontent-"] .mud-list-item .mud-typography,
html body .ghub-select-popover .mud-list-item .mud-typography {
    color: inherit !important;
}

.mud-popover.mud-paper .mud-list-item-clickable:hover,
.mud-popover.mud-paper .mud-list-item-clickable:focus-visible,
.mud-popover.mud-paper .mud-list-item-clickable:active,
html body div[id^="popovercontent-"] .mud-list-item-clickable:hover,
html body div[id^="popovercontent-"] .mud-list-item-clickable:focus-visible,
html body div[id^="popovercontent-"] .mud-list-item-clickable:active,
html body .ghub-select-popover .mud-list-item-clickable:hover,
html body .ghub-select-popover .mud-list-item-clickable:focus-visible,
html body .ghub-select-popover .mud-list-item-clickable:active {
    background-color: var(--ghub-active, rgba(0, 230, 160, 0.22)) !important;
}

.mud-popover.mud-paper .mud-list-item.mud-selected-item,
html body div[id^="popovercontent-"] .mud-list-item.mud-selected-item,
html body .ghub-select-popover .mud-list-item.mud-selected-item {
    background-color: var(--ghub-active, rgba(0, 230, 160, 0.22)) !important;
    color: var(--ghub-chrome-fg, rgba(245, 255, 250, 0.96)) !important;
    font-weight: 600;
}

.mud-popover.mud-paper .mud-list-item.mud-selected-item[class*="-text"],
.mud-popover.mud-paper .mud-list-item[class*="-hover"],
html body div[id^="popovercontent-"] .mud-list-item.mud-selected-item[class*="-text"],
html body div[id^="popovercontent-"] .mud-list-item[class*="-hover"],
html body .ghub-select-popover .mud-list-item.mud-selected-item[class*="-text"],
html body .ghub-select-popover .mud-list-item[class*="-hover"] {
    color: var(--ghub-chrome-fg, rgba(245, 255, 250, 0.96)) !important;
}

.mud-popover.mud-paper .mud-list-item.mud-list-item-disabled,
.mud-popover.mud-paper .mud-list-item.mud-list-item-disabled .mud-list-item-text,
html body div[id^="popovercontent-"] .mud-list-item.mud-list-item-disabled,
html body div[id^="popovercontent-"] .mud-list-item.mud-list-item-disabled .mud-list-item-text {
    color: rgba(var(--ghub-accent-rgb, 128, 128, 128), 0.45) !important;
    opacity: 0.55;
}

.mud-popover.mud-paper .mud-list-item-icon,
.mud-popover.mud-paper .mud-list-item .mud-icon-root,
.mud-popover.mud-paper .mud-list-item .mud-svg-icon,
html body div[id^="popovercontent-"] .mud-list-item-icon,
html body div[id^="popovercontent-"] .mud-list-item .mud-icon-root,
html body div[id^="popovercontent-"] .mud-list-item .mud-svg-icon {
    color: var(--ghub-chrome-fg, rgba(245, 255, 250, 0.96)) !important;
    fill: currentColor !important;
}

.mud-popover.mud-paper .mud-list-item.mud-selected-item .mud-list-item-icon,
.mud-popover.mud-paper .mud-list-item.mud-selected-item .mud-icon-root,
.mud-popover.mud-paper .mud-list-item.mud-selected-item .mud-svg-icon,
html body div[id^="popovercontent-"] .mud-list-item.mud-selected-item .mud-icon-root,
html body .ghub-select-popover .mud-list-item.mud-selected-item .mud-icon-root {
    color: var(--ghub-clickable-fg, var(--ghub-active-bar, #00f0a8)) !important;
    fill: currentColor !important;
}

/* MudMenu — icone voci (avatar, lingua, …) bianche sul vetro */
.mud-popover.mud-paper .mud-menu-item > .mud-icon-root,
.mud-popover.mud-paper .mud-menu-item .mud-menu-item-icon,
.mud-popover.mud-paper .mud-menu-item .mud-menu-item-icon .mud-icon-root,
.mud-popover.mud-paper .mud-menu-item .mud-menu-item-icon .mud-svg-icon,
.mud-popover.mud-paper .mud-menu-item .mud-menu-submenu-icon,
html body div[id^="popovercontent-"] .mud-menu-item > .mud-icon-root,
html body div[id^="popovercontent-"] .mud-menu-item .mud-menu-item-icon,
html body div[id^="popovercontent-"] .mud-menu-item .mud-menu-item-icon .mud-icon-root,
html body div[id^="popovercontent-"] .mud-menu-item .mud-menu-item-icon .mud-svg-icon,
html body div[id^="popovercontent-"] .mud-menu-item .mud-menu-submenu-icon {
    color: rgba(255, 255, 255, 0.92) !important;
    fill: currentColor !important;
}

.mud-popover.mud-paper .mud-menu-item,
.mud-popover.mud-paper .mud-menu-item .mud-menu-item-text,
html body div[id^="popovercontent-"] .mud-menu-item,
html body div[id^="popovercontent-"] .mud-menu-item .mud-menu-item-text {
    color: var(--ghub-chrome-fg, rgba(245, 255, 250, 0.96)) !important;
}

.mud-popover.mud-paper .mud-menu-item:hover,
.mud-popover.mud-paper .mud-menu-item:focus-visible,
html body div[id^="popovercontent-"] .mud-menu-item:hover,
html body div[id^="popovercontent-"] .mud-menu-item:focus-visible {
    background-color: var(--ghub-active, rgba(0, 230, 160, 0.22)) !important;
}

.mud-popover.mud-paper .mud-divider,
html body div[id^="popovercontent-"] .mud-divider {
    border-color: var(--ghub-select-border, var(--ghub-card-border, rgba(80, 255, 210, 0.35))) !important;
    opacity: 0.65;
}

.mud-popover.mud-paper .mud-list,
html body div[id^="popovercontent-"] .mud-list,
html body .ghub-select-popover .mud-list {
    scrollbar-width: thin;
    scrollbar-color: rgba(var(--ghub-accent-rgb, 0, 230, 170), 0.45) rgba(0, 0, 0, 0.18);
}

.mud-popover.mud-paper .mud-list::-webkit-scrollbar,
html body div[id^="popovercontent-"] .mud-list::-webkit-scrollbar {
    width: 8px;
}

.mud-popover.mud-paper .mud-list::-webkit-scrollbar-track,
html body div[id^="popovercontent-"] .mud-list::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.18);
}

.mud-popover.mud-paper .mud-list::-webkit-scrollbar-thumb,
html body div[id^="popovercontent-"] .mud-list::-webkit-scrollbar-thumb {
    background: rgba(var(--ghub-accent-rgb, 0, 230, 170), 0.45);
    border-radius: 4px;
}

/*
 * MudBlazor 9 — popover/select in MudPopoverProvider (fuori da .ghub-shell).
 * Override palette Mud + classi primary su hover/selected.
 */
body:has(.ghub-shell) .mud-popover-provider {
    --mud-palette-surface: var(--ghub-select-glass, rgba(52, 44, 16, 0.92));
    --mud-palette-background: var(--ghub-select-glass, rgba(52, 44, 16, 0.92));
    --mud-palette-text-primary: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96));
    --mud-palette-text-secondary: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.72));
    --mud-palette-action-default: rgba(255, 255, 255, 0.92);
    --mud-palette-action-default-hover: var(--ghub-active, rgba(253, 216, 53, 0.14));
    --mud-palette-primary: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96));
    --mud-palette-primary-hover: var(--ghub-active, rgba(253, 216, 53, 0.14));
    --mud-palette-primary-text: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96));
}

/*
 * I Date/Time picker condividono mud-popover-provider con le select.
 * L'override primary→chrome-fg sopra serve alle list-item selected, ma
 * mud-theme-primary sulla toolbar del picker lo usa come background → header chiaro.
 * Ripristina l'accento interattivo solo dentro i picker.
 */
body:has(.ghub-shell) .mud-popover-provider .mud-picker,
body:has(.ghub-shell) .mud-popover-provider .mud-picker-popover-paper,
body:has(.ghub-shell) .mud-popover-provider .mud-picker-container,
body:has(.ghub-shell) .mud-popover-provider .mud-picker-content {
    --mud-palette-primary: var(--ghub-interactive);
    --mud-palette-primary-text: #ffffff;
    --mud-palette-primary-hover: var(--ghub-interactive-soft);
    --mud-palette-primary-lighten: var(--ghub-interactive-soft);
    --mud-palette-primary-darken: #e65100;
}

body:has(.ghub-shell) .mud-popover-provider .mud-picker-toolbar,
body:has(.ghub-shell) .mud-popover-provider .mud-picker-toolbar.mud-theme-primary {
    background-color: var(--ghub-interactive) !important;
    background-image: linear-gradient(
        165deg,
        rgba(255, 255, 255, 0.12) 0%,
        transparent 55%
    ) !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(var(--ghub-interactive-rgb, 255, 152, 0), 0.35);
}

body:has(.ghub-shell) .mud-popover-provider .mud-picker-toolbar .mud-button-root,
body:has(.ghub-shell) .mud-popover-provider .mud-picker-toolbar .mud-typography,
body:has(.ghub-shell) .mud-popover-provider .mud-picker-toolbar button,
body:has(.ghub-shell) .mud-popover-provider .mud-picker-toolbar .mud-picker-toolbar-button {
    color: #ffffff !important;
}

body:has(.ghub-shell) .mud-popover-provider .mud-picker-toolbar .mud-button-root.mud-primary-text,
body:has(.ghub-shell) .mud-popover-provider .mud-picker-toolbar .mud-typography.mud-primary-text {
    color: #ffffff !important;
    opacity: 0.72;
}

body:has(.ghub-shell) .mud-popover-provider .mud-picker-day.mud-selected,
body:has(.ghub-shell) .mud-popover-provider .mud-day.mud-selected {
    background-color: var(--ghub-interactive) !important;
    color: #ffffff !important;
}

body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"].mud-popover.mud-paper,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover.mud-popover.mud-paper {
    background: var(--ghub-select-glass, rgba(52, 44, 16, 0.92)) !important;
    background-color: var(--ghub-select-glass, rgba(52, 44, 16, 0.92)) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.2) !important;
    backdrop-filter: blur(14px) saturate(1.2) !important;
    border: 1px solid var(--ghub-select-border, rgba(253, 216, 53, 0.35)) !important;
    border-radius: 14px !important;
    color: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96)) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb, 253, 216, 53), 0.06),
        0 8px 28px rgba(0, 0, 0, 0.38) !important;
}

body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-list {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96)) !important;
}

body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list-item,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list-item {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96)) !important;
}

body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list-item-gutters,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list-item-gutters {
    padding-left: 14px !important;
    padding-right: 14px !important;
}

body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list-item .mud-typography,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list-item .mud-typography {
    color: inherit !important;
}

body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list-item-clickable:hover,
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list-item-clickable:focus-visible,
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list-item-clickable:active,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list-item-clickable:hover,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list-item-clickable:focus-visible,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list-item-clickable:active {
    background-color: var(--ghub-active, rgba(253, 216, 53, 0.14)) !important;
}

body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list-item.mud-selected-item,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list-item.mud-selected-item,
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list-item.mud-primary-hover,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list-item.mud-primary-hover {
    background-color: var(--ghub-active, rgba(253, 216, 53, 0.14)) !important;
    color: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96)) !important;
    font-weight: 600;
}

body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list-item.mud-primary-text,
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list-item.mud-primary-text,
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list-item[class*="-text"],
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list-item[class*="-text"],
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-list-item[class*="-hover"],
body:has(.ghub-shell) .mud-popover-provider .ghub-select-popover .mud-list-item[class*="-hover"] {
    color: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96)) !important;
    --mud-ripple-color: rgba(var(--ghub-accent-rgb, 253, 216, 53), 0.35) !important;
}
/* Chiaro: voci tendina aziende (popover) = interactive */
body:has(.ghub-shell--light) .mud-popover-provider .ghub-select-popover .mud-list-item,
body:has(.ghub-shell--light) .mud-popover-provider .ghub-select-popover .mud-list-item .mud-list-item-text,
body:has(.ghub-shell--light) .mud-popover-provider .ghub-select-popover .mud-list-item .mud-typography,
body:has(.ghub-shell--light) .mud-popover-provider .ghub-select-popover .mud-list-item.mud-selected-item,
body:has(.ghub-shell--light) .mud-popover-provider .ghub-select-popover .mud-list-item.mud-selected-item .mud-typography,
body:has(.ghub-shell--light) .mud-popover-provider .ghub-select-popover .mud-list-item.mud-primary-text,
body:has(.ghub-shell--light) .mud-popover-provider .ghub-select-popover .mud-list-item[class*="-text"],
body:has(.ghub-shell--light) .ghub-select-popover .mud-list-item,
body:has(.ghub-shell--light) .ghub-select-popover .mud-list-item .mud-typography {
    color: var(--ghub-interactive) !important;
}

body:has(.ghub-shell) .mud-popover-provider .mud-menu-item > .mud-icon-root,
body:has(.ghub-shell) .mud-popover-provider .mud-menu-item .mud-menu-item-icon,
body:has(.ghub-shell) .mud-popover-provider .mud-menu-item .mud-menu-item-icon .mud-icon-root,
body:has(.ghub-shell) .mud-popover-provider .mud-menu-item .mud-menu-item-icon .mud-svg-icon,
body:has(.ghub-shell) .mud-popover-provider .mud-menu-item .mud-menu-submenu-icon,
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-menu-item > .mud-icon-root,
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-menu-item .mud-menu-item-icon .mud-icon-root,
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-menu-item .mud-menu-item-icon .mud-svg-icon {
    color: rgba(255, 255, 255, 0.92) !important;
    fill: currentColor !important;
}

body:has(.ghub-shell) .mud-popover-provider .mud-menu-item,
body:has(.ghub-shell) .mud-popover-provider .mud-menu-item .mud-menu-item-text,
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-menu-item,
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-menu-item .mud-menu-item-text {
    color: var(--ghub-chrome-fg, rgba(245, 245, 245, 0.96)) !important;
}

body:has(.ghub-shell) .mud-popover-provider .mud-menu-item:hover,
body:has(.ghub-shell) .mud-popover-provider .mud-menu-item:focus-visible,
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-menu-item:hover,
body:has(.ghub-shell) .mud-popover-provider div[id^="popovercontent-"] .mud-menu-item:focus-visible {
    background-color: var(--ghub-active, rgba(253, 216, 53, 0.14)) !important;
}

/* ========== LED globale (running / progress) ========== */
.ghub-led--off.mud-icon-button,
.ghub-play-led--off.mud-icon-button {
    background: rgba(10, 30, 22, 0.55) !important;
    border: 1px solid rgba(0, 80, 50, 0.55) !important;
    border-radius: 8px !important;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5) !important;
}

.ghub-led--off .mud-icon-root,
.ghub-led--off .mud-svg-icon,
.ghub-led--off svg,
.ghub-play-led--off .mud-icon-root,
.ghub-play-led--off .mud-svg-icon,
.ghub-play-led--off svg {
    color: #3d9a6e !important;
    filter: none;
}

.ghub-led--on.mud-icon-button,
.ghub-play-led--on.mud-icon-button {
    border-color: rgba(0, 230, 160, 0.7) !important;
    box-shadow:
        0 0 8px rgba(0, 255, 156, 0.5),
        0 0 18px rgba(0, 200, 120, 0.35),
        inset 0 0 8px rgba(0, 255, 180, 0.18) !important;
}

.ghub-led--on .mud-icon-root,
.ghub-led--on .mud-svg-icon,
.ghub-led--on svg,
.ghub-play-led--on .mud-icon-root,
.ghub-play-led--on .mud-svg-icon,
.ghub-play-led--on svg {
    color: #7dffe0 !important;
    filter: drop-shadow(0 0 4px #00ff9c) drop-shadow(0 0 12px rgba(0, 230, 118, 0.85));
}

.ghub-progress-led.mud-progress-linear,
.ghub-progress-led .mud-progress-linear-background {
    background-color: #1f5c42 !important;
}

.ghub-progress-led .mud-progress-linear-bar {
    background-image: linear-gradient(90deg, #00c853 0%, #69ffd6 50%, #00e676 100%) !important;
    box-shadow: 0 0 8px rgba(0, 230, 118, 0.65);
}

/*
 * MudChip filled — sfondo al 50% (griglie + dettaglio richiesta + dialog).
 * Deve stare QUI (dopo MudBlazor): app.css è troppo presto e perde contro Mud.
 */
.ghub-shell .mud-main-content .mud-chip.mud-chip-filled,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled {
    background-color: color-mix(in srgb, var(--mud-palette-action-disabled-background) 50%, transparent) !important;
}

.ghub-shell .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-primary,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-primary {
    background-color: color-mix(in srgb, var(--mud-palette-primary) 50%, transparent) !important;
}

.ghub-shell .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-secondary,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-secondary {
    background-color: color-mix(in srgb, var(--mud-palette-secondary) 50%, transparent) !important;
}

.ghub-shell .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-tertiary,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-tertiary {
    background-color: color-mix(in srgb, var(--mud-palette-tertiary) 50%, transparent) !important;
}

.ghub-shell .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-info,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-info {
    background-color: color-mix(in srgb, var(--mud-palette-info) 50%, transparent) !important;
}

.ghub-shell .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-success,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-success {
    background-color: color-mix(in srgb, var(--mud-palette-success) 50%, transparent) !important;
}

.ghub-shell .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-warning,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-warning {
    background-color: color-mix(in srgb, var(--mud-palette-warning) 50%, transparent) !important;
}

.ghub-shell .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-error,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-error {
    background-color: color-mix(in srgb, var(--mud-palette-error) 50%, transparent) !important;
}

.ghub-shell .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-dark,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-dark {
    background-color: color-mix(in srgb, var(--mud-palette-dark) 50%, transparent) !important;
}
/* Chiaro: MudChip filled = colore semantico pieno (100%) */
.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-primary,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-primary {
    background-color: var(--mud-palette-primary) !important;
}

.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-secondary,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-secondary {
    background-color: var(--mud-palette-secondary) !important;
}

.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-tertiary,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-tertiary {
    background-color: var(--mud-palette-tertiary) !important;
}

.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-info,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-info {
    background-color: var(--mud-palette-info) !important;
}

.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-success,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-success {
    background-color: var(--mud-palette-success) !important;
}

.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-warning,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-warning {
    background-color: var(--mud-palette-warning) !important;
}

.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-error,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-error {
    background-color: var(--mud-palette-error) !important;
}

.ghub-shell--light .mud-main-content .mud-chip.mud-chip-filled.mud-chip-color-dark,
body:has(.ghub-shell--light) .mud-dialog-container .mud-dialog .mud-chip.mud-chip-filled.mud-chip-color-dark {
    background-color: var(--mud-palette-dark) !important;
}

/*
 * Tutti i MudTextField multiline (textarea) — ridimensionabili verticalmente.
 * MudBlazor 9: .mud-input>textarea.mud-input-root { resize:none; background:none }
 * Selettori allineati a quello di Mud + scope G-Hub (pagina e dialog).
 */
.ghub-shell .mud-main-content .mud-input > textarea.mud-input-root,
.ghub-shell .mud-main-content .mud-input > textarea.mud-input-slot,
.ghub-shell .mud-main-content .mud-input-control textarea,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input > textarea.mud-input-root,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input > textarea.mud-input-slot,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control textarea,
.mud-input > textarea.mud-input-root,
.mud-input > textarea.mud-input-slot,
.mud-input-control textarea {
    resize: vertical !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    min-height: 5.5rem;
    padding-bottom: 1.35rem !important;
    /* sovrascrive background:none di Mud così il grip SVG resta visibile */
    background-color: transparent !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='M17 5 L5 17' stroke='%23ff9800' stroke-width='2.2' stroke-linecap='round'/%3E%3Cpath d='M17 10 L10 17' stroke='%23ff9800' stroke-width='2.2' stroke-linecap='round'/%3E%3Cpath d='M17 15 L15 17' stroke='%23ff9800' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 6px bottom 4px !important;
    background-size: 20px 20px !important;
}

.ghub-shell .mud-main-content .mud-input > textarea.mud-input-root::-webkit-resizer,
.ghub-shell .mud-main-content .mud-input-control textarea::-webkit-resizer,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input > textarea.mud-input-root::-webkit-resizer,
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input-control textarea::-webkit-resizer,
.mud-input > textarea.mud-input-root::-webkit-resizer,
.mud-input-control textarea::-webkit-resizer {
    background: transparent;
    border: none;
}

/* Il contenitore non deve clippare la maniglia di resize */
.ghub-shell .mud-main-content .mud-input:has(> textarea),
body:has(.ghub-shell) .mud-dialog-container .mud-dialog .mud-input:has(> textarea),
.mud-input:has(> textarea) {
    overflow: visible !important;
}

/* FormPilot KPI grid (ex formpilot-dashboard.css) */
.fp-kpi-toolbar {
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 0.5rem !important;
}

.fp-kpi-toolbar .fp-kpi-date {
    width: 175px;
    max-width: 175px;
    min-width: 0 !important;
    flex: 0 0 175px;
}

.fp-kpi-toolbar .fp-kpi-date .mud-input-control,
.fp-kpi-toolbar .fp-kpi-date .mud-input-slot,
.fp-kpi-toolbar .fp-kpi-date .mud-input {
    min-width: 0 !important;
}

.fp-kpi-toolbar .fp-kpi-period {
    width: 180px;
    max-width: 180px;
    min-width: 0 !important;
    flex: 0 0 180px;
}

/* Azzerà il margine sotto i campi così il fondo coincide col bordo outlined */
.fp-kpi-toolbar .mud-input-control,
.fp-kpi-toolbar .mud-picker .mud-input-control {
    margin-bottom: 0 !important;
}

/*
 * Slot alto quanto i sibling (stretch); il bottone resta in basso
 * allineato al box outlined (sotto lo spazio della label).
 */
.fp-kpi-toolbar .fp-kpi-refresh-slot {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    flex: 0 0 auto;
    align-self: stretch;
}

.fp-kpi-toolbar .fp-kpi-refresh.mud-button-root {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    min-width: 40px;
    margin: 0 !important;
    padding: 0;
    border-radius: 10px; /* stesso raggio dei campi outlined G-Hub */
}

@media (max-width: 700px) {
    .fp-kpi-toolbar {
        flex-wrap: wrap !important;
    }
}

.fp-kpi-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    align-items: stretch;
}

.fp-kpi-completion,
.fp-kpi-cell,
.fp-kpi-mix {
    min-height: 0;
    height: 100%;
}

.fp-kpi-cell--stack {
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
    min-height: 0;
}

.fp-kpi-cell--stack > .fp-kpi-half {
    flex: 1 1 0;
    min-height: 0;
    width: 100%;
    height: auto !important;
}

.fp-kpi-completion__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    min-height: 0;
}

.fp-kpi-cell .ghub-dash-card,
.fp-kpi-completion .ghub-dash-card,
.fp-kpi-mix .ghub-dash-card {
    min-height: 148px;
}

.fp-kpi-cell--stack > .fp-kpi-half.ghub-dash-card {
    min-height: 0;
}

.fp-kpi-value {
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.15;
}

.fp-kpi-donut {
    position: relative;
    width: 140px;
    height: 140px;
    margin: 8px 0;
}

.fp-kpi-donut--md {
    width: 120px;
    height: 120px;
    margin: 4px 0;
}

.fp-kpi-donut--sm {
    width: 108px;
    height: 108px;
    margin: 4px 0;
}

.fp-kpi-donut__layer {
    position: absolute;
    inset: 0;
}

.fp-kpi-mini-ring-row,
.fp-kpi-delivery {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin-top: 0.35rem;
    flex: 1 1 auto;
}

.fp-kpi-mini-ring {
    position: relative;
    width: 3.35rem;
    height: 3.35rem;
    flex: 0 0 auto;
}

.fp-kpi-mini-ring__label {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--ghub-chrome-fg);
}

.fp-kpi-gauge {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
    overflow: visible;
}

.fp-kpi-gauge__track,
.fp-kpi-gauge__value {
    fill: none;
    stroke-width: 3.4;
}

.fp-kpi-gauge__track {
    stroke: rgba(var(--ghub-accent-rgb), 0.18);
}

.fp-kpi-gauge__value {
    stroke: var(--ghub-clickable-fg);
    stroke-linecap: round;
    filter: drop-shadow(0 0 4px rgba(var(--ghub-accent-rgb), 0.45));
    transition: stroke-dasharray 0.55s ease;
}

.fp-kpi-gauge__value--danger {
    stroke: #ef9a9a;
    filter: drop-shadow(0 0 4px rgba(239, 154, 154, 0.45));
}

.fp-kpi-gauge__value--warn {
    stroke: #ffb74d;
    filter: drop-shadow(0 0 4px rgba(255, 183, 77, 0.45));
}

.fp-kpi-meter {
    width: 100%;
    margin-top: 0.75rem;
}

.fp-kpi-meter__track {
    width: 100%;
    height: 0.42rem;
    border-radius: 999px;
    background: rgba(var(--ghub-accent-rgb), 0.14);
    overflow: hidden;
}

.fp-kpi-meter__fill {
    height: 100%;
    width: 0;
    border-radius: inherit;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    transition: width 0.55s ease;
}

.fp-kpi-meter__fill--info {
    background: linear-gradient(90deg, rgba(100, 181, 246, 0.55), #64b5f6);
    box-shadow: 0 0 8px rgba(100, 181, 246, 0.4);
}

.fp-kpi-meter__fill--warn {
    background: linear-gradient(90deg, rgba(255, 183, 77, 0.5), #ffb74d);
    box-shadow: 0 0 8px rgba(255, 183, 77, 0.4);
}

.fp-kpi-meter__fill--accent {
    background: linear-gradient(90deg, rgba(var(--ghub-accent-rgb), 0.55), var(--ghub-clickable-fg));
    box-shadow: 0 0 8px rgba(var(--ghub-accent-rgb), 0.45);
}

.fp-kpi-meter__ticks {
    display: flex;
    justify-content: space-between;
    margin-top: 0.25rem;
    font-size: 0.62rem;
    opacity: 0.65;
    color: var(--ghub-chrome-fg);
}

.fp-kpi-split {
    width: 100%;
    margin-top: 0.75rem;
}

.fp-kpi-split--footer {
    margin-top: 1rem;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(var(--ghub-accent-rgb), 0.18);
}

.fp-kpi-split--footer .fp-kpi-split__legend {
    margin-top: 0.65rem;
    justify-content: center;
    gap: 0.75rem 1.25rem;
}

.fp-kpi-delivery__caption {
    text-align: center;
    max-width: 100%;
    line-height: 1.35;
    font-size: 0.72rem !important;
}

.fp-kpi-split__bar,
.fp-kpi-stack {
    display: flex;
    width: 100%;
    height: 0.55rem;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(var(--ghub-accent-rgb), 0.12);
}

.fp-kpi-stack {
    height: 0.72rem;
    margin-top: 0.15rem;
}

.fp-kpi-split__seg,
.fp-kpi-stack__seg {
    height: 100%;
    min-width: 0;
    transition: flex 0.45s ease;
}

.fp-kpi-split__seg--empty,
.fp-kpi-stack__seg--empty {
    flex: 1;
    background: rgba(var(--ghub-accent-rgb), 0.1);
}

.fp-kpi-split__seg--wh,
.fp-kpi-dot--wh {
    background: #64b5f6;
}

.fp-kpi-split__seg--ea,
.fp-kpi-dot--ea {
    background: #ce93d8;
}

.fp-kpi-split__seg--other {
    background: rgba(var(--ghub-accent-rgb), 0.35);
}

.fp-kpi-stack__seg--ok,
.fp-kpi-dot--ok {
    background: #66bb6a;
}

.fp-kpi-stack__seg--warn,
.fp-kpi-dot--warn {
    background: #ffb74d;
}

.fp-kpi-stack__seg--danger,
.fp-kpi-dot--danger {
    background: #ef9a9a;
}

.fp-kpi-stack__seg--muted,
.fp-kpi-dot--muted {
    background: rgba(var(--ghub-accent-rgb), 0.38);
}

.fp-kpi-split__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem 0.9rem;
    margin-top: 0.45rem;
}

.fp-kpi-legend {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    opacity: 0.9;
    color: var(--ghub-chrome-fg);
}

.fp-kpi-dot {
    width: 0.48rem;
    height: 0.48rem;
    border-radius: 50%;
    display: inline-block;
    flex: 0 0 auto;
}

.fp-kpi-bars {
    display: flex;
    align-items: flex-end;
    gap: 0.28rem;
    height: 2.4rem;
    margin-top: 0.75rem;
}

.fp-kpi-bars__col {
    flex: 1 1 0;
    height: 100%;
    display: flex;
    align-items: flex-end;
    border-radius: 3px 3px 0 0;
    background: rgba(var(--ghub-accent-rgb), 0.1);
    overflow: hidden;
}

.fp-kpi-bars__fill {
    width: 100%;
    border-radius: 3px 3px 0 0;
    background: linear-gradient(180deg, var(--ghub-clickable-fg), rgba(var(--ghub-accent-rgb), 0.5));
    box-shadow: 0 0 6px rgba(var(--ghub-accent-rgb), 0.4);
    transition: height 0.45s ease;
}

@media (min-width: 600px) {
    .fp-kpi-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .fp-kpi-completion,
    .fp-kpi-mix {
        grid-column: 1 / -1;
    }
}

@media (min-width: 960px) {
    .fp-kpi-grid {
        grid-template-columns: repeat(4, 1fr);
        grid-auto-rows: minmax(148px, auto);
    }

    .fp-kpi-completion {
        grid-column: 1;
        grid-row: 1 / span 2;
    }

    .fp-kpi-mix {
        grid-column: span 2;
    }
}

/* G-Passport dashboard: placement esplicito (Granularità larga + Documenti sotto Stato sync) */
@media (min-width: 960px) {
    .gp-kpi-grid {
        grid-template-rows: minmax(148px, auto) minmax(148px, auto) minmax(180px, auto);
    }

    .gp-kpi-grid .fp-kpi-completion,
    .gp-kpi-grid .fp-kpi-mix {
        grid-column: auto;
        grid-row: auto;
    }

    .gp-kpi-grid .gp-kpi-published {
        grid-column: 1;
        grid-row: 1 / span 2;
    }

    .gp-kpi-grid .gp-kpi-period {
        grid-column: 2;
        grid-row: 1;
    }

    .gp-kpi-grid .gp-kpi-sync-errors {
        grid-column: 3;
        grid-row: 1;
    }

    .gp-kpi-grid .gp-kpi-outbox {
        grid-column: 4;
        grid-row: 1;
    }

    .gp-kpi-grid .gp-kpi-status {
        grid-column: 2 / span 2;
        grid-row: 2;
    }

    .gp-kpi-grid .gp-kpi-sync {
        grid-column: 4;
        grid-row: 2;
    }

    .gp-kpi-grid .gp-kpi-granularity {
        grid-column: 1 / span 3;
        grid-row: 3;
        min-height: 180px;
    }

    .gp-kpi-grid .gp-kpi-docs {
        grid-column: 4;
        grid-row: 3;
        min-height: 180px;
    }

    .gp-kpi-grid .gp-kpi-granularity .ghub-dash-card {
        min-height: 180px;
        justify-content: center;
    }

    .gp-kpi-grid .gp-kpi-granularity .fp-kpi-stack--tall {
        height: 1.1rem;
        margin-top: 0.75rem;
        margin-bottom: 0.35rem;
    }
}

/* G-Atelier dashboard: placement esplicito */
@media (min-width: 960px) {
    .ga-kpi-grid {
        grid-template-rows: minmax(148px, auto) minmax(148px, auto) minmax(148px, auto);
    }

    .ga-kpi-grid .fp-kpi-completion,
    .ga-kpi-grid .fp-kpi-mix {
        grid-column: auto;
        grid-row: auto;
    }

    .ga-kpi-grid .ga-kpi-active {
        grid-column: 1;
        grid-row: 1 / span 2;
    }

    .ga-kpi-grid .ga-kpi-period {
        grid-column: 2;
        grid-row: 1;
    }

    .ga-kpi-grid .ga-kpi-missing {
        grid-column: 3;
        grid-row: 1;
    }

    .ga-kpi-grid .ga-kpi-orders-period {
        grid-column: 4;
        grid-row: 1;
    }

    .ga-kpi-grid .ga-kpi-orders {
        grid-column: 2 / span 2;
        grid-row: 2;
    }

    .ga-kpi-grid .ga-kpi-flags {
        grid-column: 4;
        grid-row: 2;
    }

    .ga-kpi-grid .ga-kpi-customers {
        grid-column: 1;
        grid-row: 3;
        min-height: 148px;
    }

    .ga-kpi-grid .ga-kpi-structure {
        grid-column: 2 / span 3;
        grid-row: 3;
        min-height: 148px;
    }

    .ga-kpi-grid .ga-kpi-structure .ghub-dash-card {
        min-height: 148px;
        justify-content: center;
    }
}

/* ========== Module hub — cards colorate con accent del modulo ========== */
/* Override locale di --ghub-accent-rgb / card tokens: le regole .mud-card le ereditano. */
.ghub-shell .mud-main-content .module-hub-card.module-hub-card--atelier,
.ghub-shell .mud-main-content .module-hub-card.module-hub-card--sync,
.ghub-shell .mud-main-content .module-hub-card.module-hub-card--bridge,
.ghub-shell .mud-main-content .module-hub-card.module-hub-card--agent,
.ghub-shell .mud-main-content .module-hub-card.module-hub-card--passport,
.ghub-shell .mud-main-content .module-hub-card.module-hub-card--sell {
    background-image: linear-gradient(
        165deg,
        rgba(var(--ghub-accent-rgb), 0.28) 0%,
        rgba(var(--ghub-accent-rgb), 0.06) 42%,
        transparent 72%
    ) !important;
    border-color: var(--ghub-card-border) !important;
    border-top-color: var(--ghub-card-border-top) !important;
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.1),
        0 0 22px rgba(var(--ghub-accent-rgb), 0.22),
        inset 0 1px 0 rgba(var(--ghub-accent-rgb), 0.28) !important;
    transition: box-shadow 0.2s ease, border-color 0.2s ease, background-image 0.2s ease;
}

.ghub-shell .mud-main-content .module-hub-card.module-hub-card--atelier:not(.module-hub-card--disabled):hover,
.ghub-shell .mud-main-content .module-hub-card.module-hub-card--sync:not(.module-hub-card--disabled):hover,
.ghub-shell .mud-main-content .module-hub-card.module-hub-card--bridge:not(.module-hub-card--disabled):hover,
.ghub-shell .mud-main-content .module-hub-card.module-hub-card--agent:not(.module-hub-card--disabled):hover,
.ghub-shell .mud-main-content .module-hub-card.module-hub-card--passport:not(.module-hub-card--disabled):hover,
.ghub-shell .mud-main-content .module-hub-card.module-hub-card--sell:not(.module-hub-card--disabled):hover {
    box-shadow:
        0 0 0 1px rgba(var(--ghub-accent-rgb), 0.18),
        0 0 30px rgba(var(--ghub-accent-rgb), 0.36),
        inset 0 1px 0 rgba(var(--ghub-accent-rgb), 0.34) !important;
}

/* Scuro — stessi RGB accent / vetro delle pagine modulo */
.ghub-module--hub.ghub-shell--dark .module-hub-card--atelier {
    --ghub-accent-rgb: 255, 245, 157;
    --ghub-surface-rgb: 42, 36, 14;
    --ghub-card-glass: rgba(48, 40, 16, 0.62);
    --ghub-card-border: rgba(255, 245, 157, 0.42);
    --ghub-card-border-top: rgba(255, 248, 180, 0.58);
}

.ghub-module--hub.ghub-shell--dark .module-hub-card--sync {
    --ghub-accent-rgb: 225, 190, 231;
    --ghub-surface-rgb: 28, 18, 42;
    --ghub-card-glass: rgba(36, 22, 52, 0.62);
    --ghub-card-border: rgba(225, 190, 231, 0.42);
    --ghub-card-border-top: rgba(240, 220, 245, 0.58);
}

.ghub-module--hub.ghub-shell--dark .module-hub-card--bridge {
    --ghub-accent-rgb: 130, 177, 255;
    --ghub-surface-rgb: 16, 28, 42;
    --ghub-card-glass: rgba(16, 32, 48, 0.62);
    --ghub-card-border: rgba(130, 177, 255, 0.42);
    --ghub-card-border-top: rgba(170, 200, 255, 0.58);
}

.ghub-module--hub.ghub-shell--dark .module-hub-card--agent {
    --ghub-accent-rgb: 125, 255, 224;
    --ghub-surface-rgb: 14, 42, 32;
    --ghub-card-glass: rgba(14, 45, 34, 0.62);
    --ghub-card-border: rgba(80, 255, 210, 0.42);
    --ghub-card-border-top: rgba(120, 255, 220, 0.58);
}

.ghub-module--hub.ghub-shell--dark .module-hub-card--passport {
    --ghub-accent-rgb: 255, 204, 128;
    --ghub-surface-rgb: 42, 28, 12;
    --ghub-card-glass: rgba(48, 30, 12, 0.62);
    --ghub-card-border: rgba(255, 183, 77, 0.42);
    --ghub-card-border-top: rgba(255, 204, 128, 0.58);
}

.ghub-module--hub.ghub-shell--dark .module-hub-card--sell {
    --ghub-accent-rgb: 255, 171, 145;
    --ghub-surface-rgb: 42, 22, 16;
    --ghub-card-glass: rgba(48, 24, 16, 0.62);
    --ghub-card-border: rgba(255, 171, 145, 0.42);
    --ghub-card-border-top: rgba(255, 171, 145, 0.58);
}

/* Chiaro ? card pastello chiare (colore modulo pi� leggibile) */
.ghub-module--hub.ghub-shell--light .module-hub-card--atelier {
    --ghub-accent-rgb: 253, 216, 53;
    --ghub-surface-rgb: 255, 252, 235;
    --ghub-card-glass: color-mix(in srgb, #fdd835 22%, #ffffff);
    --ghub-card-border: rgba(249, 168, 37, 0.35);
    --ghub-card-border-top: rgba(249, 168, 37, 0.5);
}

.ghub-module--hub.ghub-shell--light .module-hub-card--sync {
    --ghub-accent-rgb: 126, 87, 194;
    --ghub-surface-rgb: 246, 240, 252;
    --ghub-card-glass: color-mix(in srgb, #7e57c2 18%, #ffffff);
    --ghub-card-border: rgba(126, 87, 194, 0.32);
    --ghub-card-border-top: rgba(126, 87, 194, 0.48);
}

.ghub-module--hub.ghub-shell--light .module-hub-card--bridge {
    --ghub-accent-rgb: 30, 136, 229;
    --ghub-surface-rgb: 236, 246, 255;
    --ghub-card-glass: color-mix(in srgb, #1e88e5 18%, #ffffff);
    --ghub-card-border: rgba(30, 136, 229, 0.32);
    --ghub-card-border-top: rgba(30, 136, 229, 0.48);
}

.ghub-module--hub.ghub-shell--light .module-hub-card--agent {
    --ghub-accent-rgb: 82, 217, 138;
    --ghub-surface-rgb: 236, 250, 242;
    --ghub-card-glass: color-mix(in srgb, #52d98a 20%, #ffffff);
    --ghub-card-border: rgba(46, 125, 79, 0.3);
    --ghub-card-border-top: rgba(46, 125, 79, 0.45);
}

.ghub-module--hub.ghub-shell--light .module-hub-card--passport {
    --ghub-accent-rgb: 251, 140, 0;
    --ghub-surface-rgb: 255, 246, 232;
    --ghub-card-glass: color-mix(in srgb, #fb8c00 18%, #ffffff);
    --ghub-card-border: rgba(239, 108, 0, 0.32);
    --ghub-card-border-top: rgba(239, 108, 0, 0.48);
}

.ghub-module--hub.ghub-shell--light .module-hub-card--sell {
    --ghub-accent-rgb: 255, 112, 67;
    --ghub-surface-rgb: 255, 242, 236;
    --ghub-card-glass: color-mix(in srgb, #ff7043 18%, #ffffff);
    --ghub-card-border: rgba(244, 81, 30, 0.32);
    --ghub-card-border-top: rgba(244, 81, 30, 0.48);
}

.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--atelier,
.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--sync,
.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--bridge,
.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--agent,
.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--passport,
.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--sell {
    background-color: var(--ghub-card-glass) !important;
    background-image: linear-gradient(
        165deg,
        rgba(var(--ghub-accent-rgb), 0.34) 0%,
        rgba(var(--ghub-accent-rgb), 0.12) 48%,
        rgba(255, 255, 255, 0.55) 100%
    ) !important;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.05),
        0 3px 10px rgba(0, 0, 0, 0.06) !important;
}

.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--atelier:not(.module-hub-card--disabled):hover,
.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--sync:not(.module-hub-card--disabled):hover,
.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--bridge:not(.module-hub-card--disabled):hover,
.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--agent:not(.module-hub-card--disabled):hover,
.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--passport:not(.module-hub-card--disabled):hover,
.ghub-shell--light .mud-main-content .module-hub-card.module-hub-card--sell:not(.module-hub-card--disabled):hover {
    box-shadow:
        0 2px 4px rgba(0, 0, 0, 0.06),
        0 6px 14px rgba(0, 0, 0, 0.08) !important;
}

/* ========== Module hub sticky stats footer ========== */
.module-hub-page {
    --module-hub-footer-h: 96px;
    /* Padding inferiore = spazio per il footer fisso (non occorre min-height: il footer è position:fixed) */
    padding-bottom: calc(var(--module-hub-footer-h) + 1.25rem);
    box-sizing: border-box;
}

/* Blocca la scrollbar globale quando la hub page è montata */
body:has(.module-hub-page) {
    overflow: hidden;
}

/* Permette scroll verticale solo dentro il main-content della hub, se le cards sono tante */
body:has(.module-hub-page) .ghub-shell > .mud-main-content {
    overflow-y: auto;
    overflow-x: hidden;
    /* Altezza = viewport meno AppBar (64px) meno footer fisso */
    max-height: calc(100vh - 64px - var(--module-hub-footer-h, 96px));
}

.module-hub-stats-footer {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1200;
    height: var(--module-hub-footer-h);
    display: flex;
    align-items: stretch;
    pointer-events: none;
    background: linear-gradient(
        180deg,
        rgba(var(--ghub-surface-rgb), 0.55) 0%,
        var(--ghub-glass-chrome) 55%
    );
    -webkit-backdrop-filter: blur(var(--ghub-glass-blur)) saturate(1.2);
    backdrop-filter: blur(var(--ghub-glass-blur)) saturate(1.2);
    border-top: 1px solid var(--ghub-glass-border);
    box-shadow:
        0 -1px 0 var(--ghub-glass-edge),
        0 -12px 28px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(var(--ghub-accent-rgb), 0.22);
}

.module-hub-stats-footer__inner {
    pointer-events: auto;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0.55rem 1rem;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-evenly;
    gap: 0.5rem 1rem;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.module-hub-stat {
    flex: 1 1 0;
    min-width: 5.5rem;
    max-width: 11rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
}

.module-hub-stat__visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 2.75rem;
}

.module-hub-stat__visual--bar,
.module-hub-stat__visual--segments,
.module-hub-stat__visual--bars {
    flex-direction: column;
    gap: 0.35rem;
}

.module-hub-stat__value {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--ghub-chrome-fg);
    line-height: 1;
}

.module-hub-stat__value--gauge {
    font-size: 0.58rem;
    font-weight: 600;
    letter-spacing: 0;
}

.module-hub-stat__value--inline {
    position: static;
    font-size: 0.78rem;
}

.module-hub-stat__label {
    font-size: 0.62rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--ghub-chrome-fg);
    opacity: 0.72;
    white-space: nowrap;
    text-align: center;
    line-height: 1.1;
}

.module-hub-gauge {
    width: 2.85rem;
    height: 2.85rem;
    transform: rotate(-90deg);
    overflow: visible;
}

.module-hub-gauge__track,
.module-hub-gauge__value {
    fill: none;
    stroke-width: 3.2;
}

.module-hub-gauge__track {
    stroke: rgba(255, 138, 128, 0.22);
    stroke: rgba(var(--ghub-accent-rgb), 0.22);
}

.module-hub-gauge__value {
    stroke: #ff8a80;
    stroke: var(--ghub-clickable-fg, #ff8a80);
    stroke-linecap: round;
    filter: drop-shadow(0 0 4px rgba(var(--ghub-accent-rgb), 0.55));
    transition: stroke-dasharray 0.55s ease;
}

.module-hub-progress {
    width: 100%;
    height: 0.35rem;
    border-radius: 999px;
    background: rgba(var(--ghub-accent-rgb), 0.16);
    overflow: hidden;
}

.module-hub-progress__fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(
        90deg,
        rgba(var(--ghub-accent-rgb), 0.55),
        var(--ghub-clickable-fg)
    );
    box-shadow: 0 0 8px rgba(var(--ghub-accent-rgb), 0.45);
    transition: width 0.55s ease;
}

.module-hub-progress__fill--unlimited {
    opacity: 0.28;
    background: repeating-linear-gradient(
        -45deg,
        rgba(var(--ghub-accent-rgb), 0.35),
        rgba(var(--ghub-accent-rgb), 0.35) 4px,
        transparent 4px,
        transparent 8px
    );
    box-shadow: none;
}

.module-hub-segments {
    display: flex;
    flex-direction: row;
    gap: 0.28rem;
    align-items: center;
    justify-content: center;
}

.module-hub-segments__dot {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: rgba(var(--ghub-accent-rgb), 0.18);
    border: 1px solid rgba(var(--ghub-accent-rgb), 0.28);
}

.module-hub-segments__dot--on {
    background: var(--ghub-clickable-fg);
    border-color: transparent;
    box-shadow: 0 0 8px rgba(var(--ghub-accent-rgb), 0.55);
}

.module-hub-barchart {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: center;
    gap: 0.35rem;
    width: 100%;
    max-width: 5.5rem;
    min-height: 2.6rem;
}

.module-hub-barchart__col {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    gap: 0.15rem;
    flex: 1 1 0;
    min-width: 0;
}

.module-hub-barchart__track {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 0.42rem;
    height: 28px;
    border-radius: 2px;
    background: rgba(var(--ghub-accent-rgb), 0.14);
    overflow: hidden;
}

.module-hub-barchart__fill {
    width: 100%;
    height: 0;
    border-radius: 2px 2px 0 0;
    background: linear-gradient(
        180deg,
        var(--ghub-clickable-fg),
        rgba(var(--ghub-accent-rgb), 0.55)
    );
    box-shadow: 0 0 6px rgba(var(--ghub-accent-rgb), 0.45);
    transition: height 0.45s ease;
}

.module-hub-barchart__fill--today {
    box-shadow: 0 0 8px rgba(var(--ghub-accent-rgb), 0.7);
    filter: brightness(1.1);
}

.module-hub-barchart__day {
    font-size: 0.55rem;
    font-weight: 600;
    line-height: 1;
    color: var(--ghub-chrome-fg);
    opacity: 0.7;
    letter-spacing: 0;
}

.ghub-shell--light .module-hub-stats-footer {
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.72) 0%,
        color-mix(in srgb, rgb(var(--ghub-surface-rgb)) 55%, #ffffff) 50%,
        #ffffff 100%
    );
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow:
        0 -1px 0 rgba(255, 255, 255, 0.9),
        0 -6px 16px rgba(0, 0, 0, 0.1),
        0 -14px 28px rgba(0, 0, 0, 0.08) !important;
}

@media (max-width: 600px) {
    .module-hub-stats-footer__inner {
        justify-content: flex-start;
        padding: 0.3rem 0.75rem;
        gap: 0.75rem;
    }

    .module-hub-stat {
        flex: 0 0 auto;
        min-width: 4.75rem;
    }

    .module-hub-stat__label {
        font-size: 0.55rem;
    }
}

/* Legacy gagent-* → use ghub-* (gagent-glass.css re-exports ghub-glass.css) */