/* Hide element visually, keeping it focusable (with keyboard) and available for screen-readers */
.Frame {
  /* Set color on root of component. It can be overridden after the @include */
  color: var(--colorsTextDefault, #141414);
  /* Make sure font-family goes across entire component */
  font-family: "Nunito Sans", sans-serif;
  display: flex;
  flex-direction: column;
  height: 100vh;
}

.Frame__header {
  z-index: 990;
}

.Frame__content {
  position: relative;
  display: flex;
  flex-grow: 1;
  overflow: hidden;
}

/*
 * Hacky way of handling with mobile Chrome's head and 100vh layout.
 * To be removed after Chrome to support dvh units.
 */
@media (hover: none) and (pointer: coarse) {
  @supports (height: 100dvh) {
    .Frame {
      height: 100dvh;
    }
  }
  @supports not (height: 100dvh) {
    html.with-frame-inside {
      height: 100vh;
      max-height: -moz-available;
      max-height: -webkit-fill-available;
      max-height: stretch;
    }

    .with-frame-inside,
.Frame {
      height: 100%;
    }
  }
}

/*# sourceMappingURL=Frame.css.map */
