/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* Layout: top bar + left menu on wide screens; menu collapses behind ☰ on phones. */
.topbar[b-dsfjyeqjar] {
    position: sticky; top: 0; z-index: 10;
    display: flex; align-items: center; gap: 1rem;
    height: 3.25rem; padding: 0 1rem;
    background: #fff; border-bottom: 1px solid var(--wsl-border);
}
.brand[b-dsfjyeqjar] { font-weight: 600; color: var(--wsl-text); text-decoration: none; white-space: nowrap; }
.userbox[b-dsfjyeqjar] { margin-left: auto; display: flex; align-items: center; gap: .75rem; min-width: 0; }
.user-name[b-dsfjyeqjar] { color: var(--wsl-muted); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 14rem; }
.menu-toggle[b-dsfjyeqjar] { display: none; }
.menu-button[b-dsfjyeqjar] { display: none; cursor: pointer; font-size: 1.4rem; margin: 0; }

.sidebar[b-dsfjyeqjar] {
    position: fixed; top: 3.25rem; left: 0; bottom: 0; width: 15rem;
    overflow-y: auto; background: var(--wsl-surface); border-right: 1px solid var(--wsl-border);
    padding: 1rem .5rem;
}
.content[b-dsfjyeqjar] { margin-left: 15rem; padding: 1.5rem 2rem; max-width: 72rem; }

@media (max-width: 767.98px) {
    .menu-button[b-dsfjyeqjar] { display: block; }
    .sidebar[b-dsfjyeqjar] { display: none; width: 100%; bottom: auto; max-height: calc(100vh - 3.25rem); border-right: 0; border-bottom: 1px solid var(--wsl-border); }
    .menu-toggle:checked ~ .sidebar[b-dsfjyeqjar] { display: block; }
    .content[b-dsfjyeqjar] { margin-left: 0; padding: 1rem; }
    .user-name[b-dsfjyeqjar] { display: none; }
}
