/* Keep the brand and first navigation item from overlapping on short or zoomed viewports. */
.app-sider .sidebar-brand,
.mobile-sidebar-panel .sidebar-brand {
  flex: 0 0 88px;
  height: 88px;
  position: relative;
  z-index: 2;
  background: var(--bg-sidebar);
}

.app-sider .nav,
.mobile-sidebar-panel .nav {
  align-content: start;
  padding-top: 8px;
  overflow-y: auto;
  scroll-padding-top: 18px;
}

.app-sider .nav > .nav-item:first-of-type,
.mobile-sidebar-panel .nav > .nav-item:first-of-type {
  scroll-margin-top: 18px;
}

@media (max-height: 760px) {
  .app-sider .nav,
  .mobile-sidebar-panel .nav {
    gap: 8px;
    padding-top: 6px;
    padding-bottom: 12px;
  }
}