@use '../abstract/_all';
@use '../abstract/breakpoints';
@use '../abstract/setup';

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-left {
  text-align: left;
}

.text-justify {
  text-align: justify;
}

.text-nowrap {
  white-space: nowrap;
}

.is-flex {
  display: flex;
}

.is-inlineflex {
  display: inline-flex;
}

.flex-column {
  flex-direction: column;
}

.flex-row {
  flex-direction: row;
}

.flex-nowrap {
  flex-wrap: nowrap;
}

.flex-wrap {
  flex-wrap: wrap;
}

.content-start {
  justify-content: flex-start;
}

.content-end {
  justify-content: flex-end;
}

.content-center {
  justify-content: center;
}

.content-sp-between {
  justify-content: space-between;
}

.content-sp-around {
  justify-content: space-around;
}

.content-sp-evenly {
  justify-content: space-evenly;
}

.align-top {
  align-items: flex-start;
}

.align-middle {
  display: flex;
  align-content: center;
  flex-wrap: wrap;
}

.align-bottom {
  align-items: flex-end;
}

.align-stretch {
  align-items: stretch;
}

.align-multi-top {
  align-content: flex-start;
  flex-wrap: wrap;
}

.align-multi-bottom {
  align-content: flex-end;
  flex-wrap: wrap;
}

.align-multi-center {
  align-content: center;
  flex-wrap: wrap;
}

.align-multi-between {
  align-content: space-between;
  flex-wrap: wrap;
}

.align-multi-around {
  align-content: space-around;
  flex-wrap: wrap;
}

.align-multi-stretch {
  align-content: stretch;
  flex-wrap: wrap;
}

.align-vertical {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.align-items-center {
  display: flex;
  align-items: center;
}

.align-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.sticky-bottom {
  width: 100%;
  position: absolute;
  box-sizing: border-box;
  left: 0;
  padding: 0 setup.$padding-global setup.$padding-global;
  bottom: 0;
}

.xs\:text-center {
  @media (min-width: #{breakpoints.$break-sm}) {
    text-align: center;
  }
}

.sm\:text-center {
  @media (min-width: #{breakpoints.$break-sm}) {
    text-align: center;
  }
}

.md\:text-center {
  @media (min-width: #{breakpoints.$break-md}) {
    text-align: center;
  }
}

.lg\:text-center {
  @media (min-width: #{breakpoints.$break-lg}) {
    text-align: center;
  }
}

.xs\:text-left {
  @media (min-width: #{breakpoints.$break-sm }) {
    text-align: left;
  }
}

.sm\:text-left {
  @media (min-width: #{breakpoints.$break-sm }) {
    text-align: left;
  }
}

.md\:text-left {
  @media (min-width: #{breakpoints.$break-md }) {
    text-align: left;
  }
}

.lg\:text-left {
  @media (min-width: #{breakpoints.$break-lg }) {
    text-align: left;
  }
}

.xs\:text-right {
  @media (min-width: #{breakpoints.$break-sm }) {
    text-align: right;
  }
}

.sm\:text-right {
  @media (min-width: #{breakpoints.$break-sm }) {
    text-align: right;
  }
}

.md\:text-right {
  @media (min-width: #{breakpoints.$break-md }) {
    text-align: right;
  }
}

.lg\:text-right {
  @media (min-width: #{breakpoints.$break-lg }) {
    text-align: right;
  }
}

.sm\:align-middle {
  @media (min-width: breakpoints.$break-sm) {
    display: flex;
    align-content: center;
    flex-wrap: wrap;
  }
}
.md\:align-middle {
  @media (min-width: breakpoints.$break-md) {
    display: flex;
    align-content: center;
    flex-wrap: wrap;
  }
}