@import "../mixins/mixins";
@import "../config/variables";

@include b(container) {
  display: flex;
  flex-direction: row;
  flex: 1;
  flex-basis: auto;
  box-sizing: border-box;
  min-width: 0;

  @include when(vertical) {
    flex-direction: column;
  }

  @include when(fixed) {
    @media (min-width: $--screen-sm) {
      width: $--container-sm;
    }
    @media (min-width: $--screen-md) {
      width: $--container-md;
    }
    @media (min-width: $--screen-lg) {
      width: $--container-lg;
    }
  }

  @include when(fluid) {
    width: 100%;
  }
}