@use "../../../settings/constants";

.mykn-page {
  justify-content: start;
  background-color: var(--page-background);
  container-name: page;
  display: flex;
  //flex-direction: column;  // Removed to facilitate NavBar move in BaseTemplate.
  box-sizing: border-box;
  width: 100%;
  min-height: 100%;

  &--container-type-inline-size {
    container-type: inline-size;
  }

  &--container-type-size {
    container-type: size;
  }

  &--container-type-normal {
    container-type: normal;
  }

  &--pad-h {
    padding-inline: var(--sizes-spacing-xs-h);
  }

  &--pad-v {
    padding-block: var(--sizes-spacing-xs-h);

    @media screen and (min-width: constants.$breakpoint-desktop) {
      padding-block: var(--sizes-spacing-xs-v);
    }
  }

  // Warning: setting this may break vertical overflow scrolling with sidebar navigation.
  &--full-height {
    height: 100%;
  }

  &--valign-middle {
    align-items: center;
  }
}