/* Layout native HomeLayout (sidebar + content).
   Objectif: menu collapsible performant, sans dépendance Syncfusion.
   Le contenu du menu est libre (NavMenuV2 est vide pour l'instant). */

.home-layout {
    --home-sidebar-width: 280px;
    --home-sidebar-collapsed-width: 65px;
    --home-sidebar-current-width: var(--home-sidebar-width);

    display: grid;
    grid-template-columns: 1fr;
    height: 100vh;
    min-height: 0;
}

.home-layout--closed {
    --home-sidebar-current-width: var(--home-sidebar-collapsed-width);
}

.home-layout--open {
    --home-sidebar-current-width: var(--home-sidebar-width);
}

.home-layout__sidebar {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    min-height: 0;
    width: var(--home-sidebar-current-width);
    overflow: hidden;
    background: var(--primary-color);
    display: flex;
    flex-direction: column;

    transition: width 180ms ease;
    will-change: width;
}

.home-layout__sidebar-top {
    flex: 0 0 auto;
    padding: 0.5rem;
}

.home-layout__toggler {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.12);
}

.home-layout__toggler:hover {
    background: rgba(255, 255, 255, 0.18);
}

.home-layout__toggler:focus-visible {
    outline: 3px solid rgba(255, 255, 255, 0.75);
    outline-offset: 2px;
}

.home-layout__sidebar-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.home-layout__content {
    min-height: 0;
    overflow: hidden;

    /* Push content to the right, animated */
    margin-left: var(--home-sidebar-current-width);
    transition: margin-left 180ms ease;
    will-change: margin-left;
}

.home-layout__content .body-container {
    height: 100%;
    min-height: 0;
}