/* Pannello unico: "liquid glass" scuro, in stile iOS, sopra il tema di Filament. */
:root {
    --glass-bg: rgba(24, 27, 44, .50);
    --glass-edge: rgba(255, 255, 255, .20);
    --glass-shadow: 0 12px 36px rgba(0, 0, 0, .45), 0 2px 6px rgba(0, 0, 0, .3);
    --glass-text: #f4f6ff;
}

body.fi-body {
    color: var(--glass-text);
    background:
        radial-gradient(52rem 38rem at 0% 0%, rgba(255, 150, 40, .55) 0%, transparent 62%),
        radial-gradient(48rem 38rem at 100% 5%, rgba(95, 120, 255, .55) 0%, transparent 62%),
        radial-gradient(54rem 44rem at 45% 105%, rgba(255, 80, 160, .42) 0%, transparent 62%),
        #0b0d1a;
    background-attachment: fixed;
}

.fi-sidebar, .fi-topbar, .fi-section, .fi-ta-ctn, .fi-wi-stats-overview-stat, .fi-modal-window, .fi-dropdown-panel, .fi-simple-main {
    background: var(--glass-bg) !important;
    -webkit-backdrop-filter: blur(28px) saturate(200%);
    backdrop-filter: blur(28px) saturate(200%);
    border: 1px solid var(--glass-edge) !important;
    box-shadow: var(--glass-shadow), inset 0 1px 0 rgba(255, 255, 255, .28) !important;
}
.fi-section, .fi-ta-ctn, .fi-wi-stats-overview-stat { border-radius: 1.75rem !important; }
.fi-sidebar { border-radius: 0 1.75rem 1.75rem 0 !important; }
.fi-topbar { margin: .6rem; border-radius: 1.75rem !important; }
.fi-simple-main { border-radius: 2rem !important; }
.fi-btn { border-radius: 999px !important; font-weight: 600; }
.fi-input-wrp { border-radius: 1rem !important; background: rgba(255, 255, 255, .08) !important; }

.hub-tiles { display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
.hub-tile {
    position: relative; display: flex; flex-direction: column; gap: .3rem; padding: 1.5rem;
    border-radius: 2rem; text-decoration: none; color: var(--glass-text); overflow: hidden;
    background: linear-gradient(160deg, rgba(255, 255, 255, .20), rgba(255, 255, 255, .05));
    -webkit-backdrop-filter: blur(28px) saturate(200%); backdrop-filter: blur(28px) saturate(200%);
    border: 1px solid rgba(255, 255, 255, .24); box-shadow: var(--glass-shadow), inset 0 1px 0 rgba(255, 255, 255, .35);
    transition: transform .35s cubic-bezier(.2, .8, .2, 1), box-shadow .35s;
}
.hub-tile:hover { transform: translateY(-5px) scale(1.02); box-shadow: 0 24px 54px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .45); }
.hub-tile:active { transform: scale(.98); }
.hub-chip {
    display: grid; place-items: center; width: 3.4rem; height: 3.4rem; margin-bottom: .6rem;
    border-radius: 1.1rem; color: #fff;
    box-shadow: 0 8px 18px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .55);
}
.hub-chip-0 { background: linear-gradient(145deg, #ffb340, #ff7a00); }
.hub-chip-1 { background: linear-gradient(145deg, #5ee08a, #12a84a); }
.hub-chip-2 { background: linear-gradient(145deg, #c58bff, #7a3cf0); }
.hub-chip-3 { background: linear-gradient(145deg, #6aa6ff, #2f5bff); }
.hub-tile-nome { font-size: 1.3rem; font-weight: 700; letter-spacing: -.01em; }
.hub-tile-testo { font-size: .92rem; color: rgba(244, 246, 255, .75); }

@media (prefers-reduced-transparency: reduce) {
    .fi-sidebar, .fi-topbar, .fi-section, .fi-ta-ctn, .fi-wi-stats-overview-stat, .fi-simple-main, .hub-tile {
        -webkit-backdrop-filter: none; backdrop-filter: none; background: #171a2c !important;
    }
}

/* Pagina Controllo Malossi: giorni e report notturno */
.malossi-giorno {
    padding: .3rem .8rem; border-radius: 999px; font-size: .85rem; font-weight: 600; text-decoration: none;
    color: var(--glass-text); background: rgba(255, 255, 255, .08); border: 1px solid var(--glass-edge);
}
.malossi-giorno.is-scelto { background: #f59e0b; color: #1b1f2a; border-color: #f59e0b; }
.malossi-giorno.is-bloccato { box-shadow: inset 0 0 0 2px #ef4444; }
.malossi-report h1 { font-size: 1.35rem; font-weight: 700; margin-bottom: .5rem; }
.malossi-report h2 { font-size: 1.05rem; font-weight: 700; margin: 1.25rem 0 .4rem; color: #fbbf24; }
.malossi-report p { margin: .25rem 0; }
.malossi-report ul { list-style: disc; padding-left: 1.25rem; display: flex; flex-direction: column; gap: .2rem; font-size: .9rem; }