/* FlomiPost — scrollable sidebar menu (2026-10-10)
 * Cause: .fp-sidebar is a viewport-height flex column with overflow:hidden, and
 * .fp-nav never shrank, so menu items below the bottom of the screen were cut off.
 * Fix: the brand block and footer stay pinned; only the menu scrolls.
 * Loaded from index.html after the main stylesheet (this server has no frontend
 * source tree to rebuild from). To revert, remove the <link> in index.html. */

.fp-sidebar-wrap,
.fp-sidebar {
  height: 100dvh; /* the bundle's 100vh stays as fallback; dvh fits mobile browser bars */
}

.fp-sidebar .fp-brand,
.fp-sidebar .fp-sidebar-footer {
  flex-shrink: 0;
}

.fp-sidebar .fp-nav {
  --fp-scrollbar-thumb: rgba(156, 29, 29, 0.35);
  --fp-scrollbar-track: transparent;

  flex: 1 1 auto;
  min-height: 0;                /* let the menu shrink below its content so it can scroll */
  overflow-y: auto;
  overscroll-behavior: contain; /* reaching the end of the menu doesn't scroll the page */
  scrollbar-gutter: stable;
  scrollbar-width: thin;        /* slim, visible scrollbar so it's clear the menu scrolls */
  scrollbar-color: var(--fp-scrollbar-thumb) var(--fp-scrollbar-track);
}

/* Browsers without scrollbar-color: replace the bundle's hidden WebKit scrollbar
 * (.fp-nav::-webkit-scrollbar{display:none}) with a slim visible one. */
@supports not (scrollbar-color: auto) {
  .fp-sidebar .fp-nav::-webkit-scrollbar {
    display: block;
    width: 6px;
  }
  .fp-sidebar .fp-nav::-webkit-scrollbar-thumb {
    background: var(--fp-scrollbar-thumb);
    border-radius: 3px;
  }
  .fp-sidebar .fp-nav::-webkit-scrollbar-track {
    background: var(--fp-scrollbar-track);
  }
}
