/* The result stays below the shared header while the configuration form scrolls.
   Load after each configurator's styles and site-consistency.css. */
@media screen and (min-width: 861px) {
  body.questionnaire-page .questionnaire-content .workspace {
    align-items: start;
  }
  body.questionnaire-page .questionnaire-content .workspace > .result {
    position: sticky !important;
    top: var(--header-offset, 128px);
    align-self: start;
    min-width: 0;
    min-height: 0;
    max-height: calc(100vh - var(--header-offset, 128px) - 16px);
    max-height: calc(100dvh - var(--header-offset, 128px) - 16px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scrollbar-gutter: stable;
  }
}

/* A one-column form uses the page's ordinary scrolling. */
@media screen and (max-width: 860px) {
  body.questionnaire-page .questionnaire-content .workspace > .result {
    position: static !important;
    top: auto;
    max-height: none;
    overflow: visible;
    scrollbar-gutter: auto;
  }
}

/* Do not crop model details, request text or controls in print layouts. */
@media print {
  body.questionnaire-page .questionnaire-content .workspace > .result {
    position: static !important;
    top: auto;
    max-height: none;
    overflow: visible;
    scrollbar-gutter: auto;
  }
}