/* Phase 38 — Stable sidebar shell / independent menu scroll
   The sidebar outer shell must never scroll with its own menu. Only .sidebar-scroll moves.
   This prevents the top controls from drifting upward and removes the blank band that could
   appear at the bottom after nested scrolling. */

/* Structural fix applies to the ERP shell regardless of selected visual theme. Existing theme
   rules continue to provide colors/sizes; this file only owns scroll geometry. */
body.ui-v2 .sidebar{
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  overflow:hidden!important;
  align-self:start;
}
body.ui-v2 .sidebar-collapse-control,
body.ui-v2 .sidebar-search,
body.ui-v2 .sidebar-footer{flex:0 0 auto}
body.ui-v2 .sidebar-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior-y:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(100,116,139,.34) transparent;
  padding-right:2px;
}
body.ui-v2 .sidebar-scroll::-webkit-scrollbar{width:6px}
body.ui-v2 .sidebar-scroll::-webkit-scrollbar-track{background:transparent}
body.ui-v2 .sidebar-scroll::-webkit-scrollbar-thumb{background:rgba(100,116,139,.24);border-radius:999px}
body.ui-v2 .sidebar-scroll:hover::-webkit-scrollbar-thumb{background:rgba(100,116,139,.42)}
body.ui-v2 .sidebar-footer{
  margin-top:8px!important;
  position:relative;
  z-index:2;
}

/* Clarity Pro uses a 60px topbar. 100vh is the fallback; 100dvh fixes dynamic viewport height
   on newer Chrome/Edge/Firefox/mobile browsers without breaking older engines. */
body[data-theme="clarity-pro"] .layout{
  min-height:calc(100vh - 60px)!important;
  min-height:calc(100dvh - 60px)!important;
  align-items:start!important;
}
body[data-theme="clarity-pro"] .sidebar{
  position:sticky!important;
  top:60px!important;
  height:calc(100vh - 60px)!important;
  height:calc(100dvh - 60px)!important;
  max-height:calc(100vh - 60px)!important;
  max-height:calc(100dvh - 60px)!important;
}
body[data-theme="clarity-pro"] .main{
  min-height:calc(100vh - 60px)!important;
  min-height:calc(100dvh - 60px)!important;
}

/* Non-Clarity ui-v2 themes currently use the 70px shell height. Keep the same independent-scroll
   behavior there too so switching themes cannot bring the bug back. */
body.ui-v2:not([data-theme="clarity-pro"]) .sidebar{
  height:calc(100vh - 70px);
  height:calc(100dvh - 70px);
  max-height:calc(100vh - 70px);
  max-height:calc(100dvh - 70px);
}

/* Compact mode keeps the footer anchored and the menu scroll area usable. */
body.ui-v2.sidebar-compact .sidebar-scroll{padding-right:0}
body.ui-v2.sidebar-compact .sidebar-footer{margin-top:6px!important}

/* Mobile remains a fixed off-canvas panel; only its inner menu scrolls. */
@media(max-width:880px){
  body.ui-v2 .sidebar{overflow:hidden!important;align-self:auto}
  body[data-theme="clarity-pro"] .sidebar{
    position:fixed!important;
    top:60px!important;
    height:calc(100vh - 60px)!important;
    height:calc(100dvh - 60px)!important;
    max-height:calc(100vh - 60px)!important;
    max-height:calc(100dvh - 60px)!important;
  }
  body.ui-v2:not([data-theme="clarity-pro"]) .sidebar{
    height:calc(100vh - 70px);
    height:calc(100dvh - 70px);
    max-height:calc(100vh - 70px);
    max-height:calc(100dvh - 70px);
  }
}

@media(max-width:560px){
  body.ui-v2:not([data-theme="clarity-pro"]) .sidebar{
    height:calc(100vh - 66px);
    height:calc(100dvh - 66px);
    max-height:calc(100vh - 66px);
    max-height:calc(100dvh - 66px);
  }
}