/* Keep long navigation lists inside the visible viewport on every device. */
main.bee-section-nav-layout > .bee-section-nav-host .bee-section-nav,
.wb-canvas.bee-section-nav-layout > .bee-section-nav-host .wb-section-nav-preview {
    box-sizing: border-box;
    max-height: calc(100dvh - var(--bee-nav-sticky-top, 90px) - 28px) !important;
    overflow: hidden !important;
}
main.bee-section-nav-layout > .bee-section-nav-host .bee-section-nav-items,
.wb-canvas.bee-section-nav-layout > .bee-section-nav-host .wb-section-nav-preview > div {
    max-height: calc(100dvh - var(--bee-nav-sticky-top, 90px) - 50px);
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: color-mix(in srgb, var(--nav-accent) 55%, transparent) transparent;
    -webkit-overflow-scrolling: touch;
}
main.bee-section-nav-layout > .bee-section-nav-host .bee-section-nav-items::-webkit-scrollbar,
.wb-canvas.bee-section-nav-layout
    > .bee-section-nav-host
    .wb-section-nav-preview
    > div::-webkit-scrollbar {
    display: block;
    width: 5px;
    height: 5px;
}
main.bee-section-nav-layout > .bee-section-nav-host .bee-section-nav-items::-webkit-scrollbar-thumb,
.wb-canvas.bee-section-nav-layout
    > .bee-section-nav-host
    .wb-section-nav-preview
    > div::-webkit-scrollbar-thumb {
    border-radius: 99px;
    background: color-mix(in srgb, var(--nav-accent) 55%, transparent);
}
@media (max-width: 991px) {
    main.bee-section-nav-layout > .bee-section-nav-host .bee-section-nav {
        max-height: calc(100dvh - 92px) !important;
    }
    main.bee-section-nav-layout > .bee-section-nav-host .bee-section-nav-items {
        max-height: calc(100dvh - 116px);
    }
    .wb-canvas.bee-section-nav-layout > .bee-section-nav-host .wb-section-nav-preview {
        max-height: calc(100dvh - 132px) !important;
    }
    .wb-canvas.bee-section-nav-layout > .bee-section-nav-host .wb-section-nav-preview > div {
        max-height: calc(100dvh - 156px);
    }
}
@media (max-width: 760px) {
    .wb-canvas.bee-section-nav-layout > .bee-section-nav-host .wb-section-nav-preview > div {
        flex-direction: column !important;
        align-items: stretch !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }
    .wb-canvas.bee-section-nav-layout > .bee-section-nav-host .wb-section-nav-preview span {
        flex: 0 0 auto;
        white-space: normal !important;
    }
}