// Global styles for panels opened through ZenduOverlayService.
//
// The overlay pane is rendered in the CDK overlay container (at the end of
// <body>), so it lives outside any component's style scope — these rules must
// be global. Requires `@angular/cdk/overlay-prebuilt.css` to be loaded by the
// host app (it provides the structural .cdk-overlay-* styles).

.zen-overlay-panel.cdk-overlay-pane {
    // The flexible connected-position strategy caps the pane's max-height/width
    // to the space available in the viewport. Make the pane a flex column and
    // let its child (the component's own panel) fill it and scroll internally,
    // so a tall panel never overflows the screen — it scrolls instead.
    display: flex;
    flex-direction: column;

    > * {
        // Cap the component's panel to the pane (which the flexible strategy
        // already sized to the viewport) and let it shrink, so its own inner
        // scroll region takes over instead of the panel overflowing the screen.
        min-height: 0;
        max-height: 100%;
    }
}