@import "./variables";

.edisabled {
  -moz-user-select: none;
  user-select: none;
  pointer-events: none;
  filter: opacity(0.5); //grayscale(1)
}

//padding
.pb-0 {
  padding-bottom: 0px !important;
}

.pb-1 {
  padding-bottom: 0.625rem;
}

.pb-2 {
  padding-bottom: 1.25rem;
}

.pt-1 {
  padding-top: 0.625rem;
}

.pl-1 {
  padding-left: 0.625rem;
}

.pr-1 {
  padding-right: 0.625rem;
}

.pr-2 {
  padding-right: 1.25rem;
}

.pt-0 {
  padding-top: 0px !important;
}

.pl-2 {
  padding-left: 1.25rem !important;
}

.p-0 {
  padding: 0px !important;
}

.pl-0 {
  padding-left: 0px !important;
}

//margin
.mb-0 {
  margin-bottom: 0px !important;
}

.mt-0 {
  margin-top: 0px !important;
}

.mt-1 {
  margin-top: 0.625rem !important;
}

.mb-2 {
  margin-bottom: 1.25rem !important;
}

.mb-1 {
  margin-bottom: 0.625rem !important;
}

.mt-2 {
  margin-top: 1.25rem !important;
}

.mb-1-2 {
  margin-bottom: 0.75rem !important;
}

.mr-2 {
  margin-right: 1.25rem !important;
}

//display
.d-flex {
  display: flex !important;
}

//flex utilis
.justify-content-center {
  justify-content: center !important;
}

.align-items-center {
  align-items: center !important;
}

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

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

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

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

.justify-content-space-evenly {
  justify-content: space-evenly !important;
}

// short f
.fd-column,
.fd-col {
  flex-direction: column !important;
}

.ai-center {
  align-items: center !important;
}

.ai-start {
  align-items: flex-start !important;
}

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

.jc-start {
  justify-content: flex-start !important;
}

.jc-end {
  justify-content: end !important;
}

.fd-col {
  flex-direction: column !important;
}

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

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

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

//width
.w-100 {
  width: 100% !important;
}

.w-25 {
  width: 25%;
}

.w-50 {
  width: 50%;
}

.w-40 {
  width: 60%;
}

.w-60 {
  width: 60%;
}

//height
.h-100 {
  height: 100% !important;
}

.vh-100 {
  height: 100vh !important;
}

//row and cols
.row {
  width: 100%;
  display: flex;
  margin: 0.625rem;
}

.col-9 {
  width: 75%;
}

.col-8 {
  width: 66.64%;
}

.col-7 {
  width: 58.31%;
}

.col-6 {
  width: 50%;
}

.col-5 {
  width: 41.65%;
}

.col-4 {
  width: 33.32%;
}

.col-3 {
  width: 25%;
}

.col {
  width: 33.33%;
}

.h1 {
  font-size: 1.75rem;
  line-height: 140%;
  letter-spacing: -0.035rem;
}

.h2 {
  font-size: 1.5rem;
  line-height: 140%;
  letter-spacing: -0.03rem;
}

.h3 {
  font-size: 1.25rem;
  letter-spacing: -0.025rem;
}

.h4 {
  font-size: 1.125rem;
  letter-spacing: -0.0225rem;
}

.h5 {
  font-size: 1rem;
  letter-spacing: -0.02rem;
}

.s1 {
  font-size: 1.125rem; // 18px
  letter-spacing: -0.0225rem;
}

.s2 {
  font-size: 1rem; // 16px
  letter-spacing: -0.02rem;
}

.s3 {
  font-size: 0.875rem; //14px
  letter-spacing: -0.0175rem;
}

.s4 {
  font-size: 0.8125rem; //13px
  letter-spacing: -0.01625rem;
}

.s5 {
  font-size: 0.75rem; //12px
  letter-spacing: -0.015rem;
}

.normal {
  font-weight: 400;
}

.medium {
  font-weight: 500;
}

.bold {
  font-weight: 600;
}