@use "../../../../styles/int.scss";
@use "./constants.scss";

.container {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  height: 100%;
  max-height: 100%;

  @include int.is-mobile {
    &:not(.limit) {
      min-height: constants.$sm-max-height;
    }
  }

  &.overflow {
    height: auto;
  }
}

.inner {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0px;
  min-height: 0;
  overflow-y: clip;

  .overflow &.inner {
    overflow-y: initial;
    flex-grow: unset;
    flex-shrink: unset;
    flex-basis: unset;
    min-height: unset;
  }
}

.overline {
  color: int.$warmgray-70;
  display: block;
  margin-bottom: int.$spacing-2;

  @include int.overline();
}
