/* 0.3.52 — Menú lateral: desplazamiento discreto y nombres completos. */
.sidebar {
  min-height: 0;
}
.sidebar > .brand {
  flex-shrink: 0;
}
.sidebar > .brand > b {
  flex-shrink: 0;
}
.sidebar > .brand > span {
  overflow-wrap: anywhere;
}
.sidebar > nav {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: 4px;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 3px 4px 10px 0;
  scrollbar-width: thin;
  scrollbar-color: #64869e transparent;
  scrollbar-gutter: stable;
  overscroll-behavior-y: contain;
  scroll-padding-block: 8px;
  -webkit-overflow-scrolling: touch;
}
.sidebar > nav:hover,
.sidebar > nav:focus-within {
  scrollbar-color: #8bafc4 transparent;
}
.sidebar > nav > a {
  min-width: 0;
  min-height: 44px;
  gap: 10px;
  padding: 10px 12px;
  font-size: 13.5px;
  line-height: 1.4;
  white-space: normal;
}
.sidebar > nav > a > span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.sidebar > nav > a:focus-visible {
  outline: 2px solid #76e7dd;
  outline-offset: -2px;
}
.sidebar > nav > a.active {
  box-shadow: inset 3px 0 #38d4c0;
}
/* Chromium y Safari: barra sin flechas ni pista blanca. Firefox usa thin. */
@supports selector(::-webkit-scrollbar) {
  .sidebar > nav,
  .sidebar > nav:hover,
  .sidebar > nav:focus-within {
    scrollbar-width: auto;
    scrollbar-color: auto;
  }
  .sidebar > nav::-webkit-scrollbar {
    width: 6px;
    height: 0;
  }
  .sidebar > nav::-webkit-scrollbar-track,
  .sidebar > nav::-webkit-scrollbar-corner {
    background: transparent;
  }
  .sidebar > nav::-webkit-scrollbar-thumb {
    background: #64869e;
    border-radius: 999px;
    min-height: 36px;
  }
  .sidebar > nav:hover::-webkit-scrollbar-thumb,
  .sidebar > nav:focus-within::-webkit-scrollbar-thumb {
    background: #8bafc4;
  }
  .sidebar > nav::-webkit-scrollbar-thumb:hover {
    background: #ace1df;
  }
  .sidebar > nav::-webkit-scrollbar-button {
    display: none;
    width: 0;
    height: 0;
  }
}
@media (max-width: 820px) {
  .sidebar,
  .sidebar-collapsed .sidebar {
    height: 100vh;
    height: 100dvh;
    padding-bottom: max(15px, env(safe-area-inset-bottom));
  }
  .sidebar-collapsed .sidebar > nav > a {
    padding: 10px 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .sidebar,
  .app {
    transition: none;
  }
}
@media (forced-colors: active) {
  .sidebar > nav {
    scrollbar-width: auto;
    scrollbar-color: auto;
  }
  .sidebar > nav > a.active {
    outline: 1px solid Highlight;
    outline-offset: -1px;
  }
  .sidebar > nav::-webkit-scrollbar-thumb {
    background: ButtonText;
  }
}