/* ADVENTURE-060 — full-height central panel with two intentional scroll contexts. */

/* Keep the browser document as the only outer scroll root.  The legacy theme
 * hides horizontal overflow on body, which otherwise computes overflow-y:auto
 * and creates a second viewport-level scroll context. */
html {
    overflow-x: hidden;
    overflow-y: auto;
}

body {
    overflow: visible !important;
}

/* The page itself keeps the browser scrollbar.  Only the middle column gets
 * an inner scroller; the outer flex container never captures the wheel. */
@media (min-width: 900px) {
    .container {
        min-height: clamp(410px, calc(100vh - 180px), 920px) !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        align-items: stretch !important;
    }

    .container > .content {
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        align-self: stretch !important;
        contain: size;
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        scrollbar-gutter: stable;
        -webkit-overflow-scrolling: touch;
    }

    .container > .left-sidebar,
    .container > .right-sidebar {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        align-self: flex-start !important;
        overflow: visible !important;
    }

    .container > .content:focus-within {
        outline: 2px solid rgba(89, 199, 255, .45);
        outline-offset: -2px;
    }

    /* Do not create a third nested scrollbar inside rankings. */
    .adventure-rankings .adventure-ranking-table-wrap {
        max-height: none !important;
        min-height: 0;
        overflow: visible !important;
    }
}

@media (max-width: 899px) {
    .container {
        height: auto !important;
        max-height: none !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    .container > .content {
        height: auto;
        overflow: visible;
    }

    .adventure-rankings .adventure-ranking-table-wrap {
        max-height: none;
        min-height: 0;
        overflow: visible !important;
    }
}
