/**
 * @file
 * Viewport fitting (biopama_libraries/viewport): the one rule set for
 * "fill the viewport below the page header". The offsets are measured by
 * js/viewport.js: --biopama-header-height on :root (toolbar, EC banner,
 * navbar) and --biopama-top-offset on elements carrying
 * data-biopama-fill-viewport (their own top, inherited by descendants).
 * dvh follows the mobile browser chrome where supported.
 */

.screen-vh,
.screen-vh-admin,
.screen-vh-tools-admin {
  height: calc(100vh - var(--biopama-top-offset, var(--biopama-header-height, 0px)));
  height: calc(100dvh - var(--biopama-top-offset, var(--biopama-header-height, 0px)));
}

/* Fixed full-page wrappers (tool and storymap iframes) start below the header. */
#iframe_wrapper.screen-vh,
#iframe_wrapper.screen-vh-admin,
#iframe_wrapper.screen-vh-tools-admin {
  top: var(--biopama-header-height, 0px);
}