.flex {
  display: flex;
}

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

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

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

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

/* -------------------------------------------------------------------- */

.text-light {
  color: var(--mui-palette-grey-600);
}

/* -------------------------------------------------- */
/* calc(var(--mui-palette-spacing) * ) */
.m-0 {
  margin: calc(var(--mui-palette-spacing) * 0) !important;
}

.m-1\/2 {
  margin: calc(var(--mui-palette-spacing) * 0.5);
}

.m-1 {
  margin: calc(var(--mui-palette-spacing) * 1);
}

.m-2 {
  margin: calc(var(--mui-palette-spacing) * 2);
}

.m-3 {
  margin: calc(var(--mui-palette-spacing) * 3);
}

.gap-0 {
  gap: calc(var(--mui-palette-spacing) * 0);
}

.sb-gap-1 {
  gap: calc(var(--mui-palette-spacing) * 0.5);
}

.shadow {
  box-shadow: 0px 5px 8px 2px rgba(127, 127, 127, 0.13), 0px -1px 1px 0px rgba(127, 127, 127, 0.13);
  /* border-radius: 16px; */
}

.shadow-xs {
  box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
  /* border-radius: 16px; */
}

.shadow-none {
  box-shadow: 'none';
  /* border-radius: 16px; */
}

.border-black {
  border-color: rgb(0 0 0);
}
.border-grey {
  border-color: #b2b2b2;
}

.border-light {
  border-color: var(--mui-palette-border-light);
}

.border-primary {
  border-color: var(--mui-palette-primary-main);
}

.m-auto {
  margin: auto;
}

.mx-0 {
  margin-left: calc(var(--mui-palette-spacing) * 0);
  margin-right: calc(var(--mui-palette-spacing) * 0);
}

.mx-1\/2 {
  margin-left: calc(var(--mui-palette-spacing) * 0.5);
  margin-right: calc(var(--mui-palette-spacing) * 0.5);
}

.mx-1 {
  margin-left: calc(var(--mui-palette-spacing) * 1);
  margin-right: calc(var(--mui-palette-spacing) * 1);
}

.mx-2 {
  margin-left: calc(var(--mui-palette-spacing) * 2);
  margin-right: calc(var(--mui-palette-spacing) * 2);
}

.mx-3 {
  margin-left: calc(var(--mui-palette-spacing) * 3);
  margin-right: calc(var(--mui-palette-spacing) * 3);
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.my-0 {
  margin-top: calc(var(--mui-palette-spacing) * 0);
  margin-bottom: calc(var(--mui-palette-spacing) * 0);
}

.my-1\/2 {
  margin-top: calc(var(--mui-palette-spacing) * 0.5);
  margin-bottom: calc(var(--mui-palette-spacing) * 0.5);
}

.my-1 {
  margin-top: calc(var(--mui-palette-spacing) * 1);
  margin-bottom: calc(var(--mui-palette-spacing) * 1);
}

.my-2 {
  margin-top: calc(var(--mui-palette-spacing) * 2);
  margin-bottom: calc(var(--mui-palette-spacing) * 2);
}

.my-3 {
  margin-top: calc(var(--mui-palette-spacing) * 3);
  margin-bottom: calc(var(--mui-palette-spacing) * 3);
}

.my-4 {
  margin-top: calc(var(--mui-palette-spacing) * 4);
  margin-bottom: calc(var(--mui-palette-spacing) * 4);
}

.my-auto {
  margin-top: auto;
  margin-bottom: auto;
}

.mb-0 {
  margin-bottom: calc(var(--mui-palette-spacing) * 0);
}

.mb-1\/2 {
  margin-bottom: calc(var(--mui-palette-spacing) * 0.5);
}

.mb-1 {
  margin-bottom: calc(var(--mui-palette-spacing) * 1);
}

.mb-2 {
  margin-bottom: calc(var(--mui-palette-spacing) * 2);
}

.mb-3 {
  margin-bottom: calc(var(--mui-palette-spacing) * 3);
}

.mb-4 {
  margin-bottom: calc(var(--mui-palette-spacing) * 4);
}

.mb-auto {
  margin-bottom: auto;
}

.mt-0 {
  margin-top: calc(var(--mui-palette-spacing) * 0);
}

.mt-1\/2 {
  margin-top: calc(var(--mui-palette-spacing) * 0.5);
}

.mt-1 {
  margin-top: calc(var(--mui-palette-spacing) * 1);
}

.mt-2 {
  margin-top: calc(var(--mui-palette-spacing) * 2);
}

.mt-3 {
  margin-top: calc(var(--mui-palette-spacing) * 3);
}

.mt-4 {
  margin-top: calc(var(--mui-palette-spacing) * 4);
}

.mt-auto {
  margin-top: auto;
}

.ml-0 {
  margin-left: calc(var(--mui-palette-spacing) * 0);
}

.ml-1\/2 {
  margin-left: calc(var(--mui-palette-spacing) * 0.5);
}

.ml-1 {
  margin-left: calc(var(--mui-palette-spacing) * 1);
}

.ml-2 {
  margin-left: calc(var(--mui-palette-spacing) * 2);
}

.ml-3 {
  margin-left: calc(var(--mui-palette-spacing) * 3);
}

.ml-4 {
  margin-left: calc(var(--mui-palette-spacing) * 4);
}

.ml-auto {
  margin-left: auto;
}

.mr-0 {
  margin-right: calc(var(--mui-palette-spacing) * 0);
}

.mr-1\/2 {
  margin-right: calc(var(--mui-palette-spacing) * 0.5);
}

.mr-1 {
  margin-right: calc(var(--mui-palette-spacing) * 1);
}

.mr-2 {
  margin-right: calc(var(--mui-palette-spacing) * 2);
}

.mr-3 {
  margin-right: calc(var(--mui-palette-spacing) * 3);
}

.mr-auto {
  margin-right: auto;
}

.p-0 {
  padding: calc(var(--mui-palette-spacing) * 0);
}

.p-1\/2 {
  padding: calc(var(--mui-palette-spacing) * 0.5);
}

.p-1 {
  padding: calc(var(--mui-palette-spacing) * 1);
}

.p-2 {
  padding: calc(var(--mui-palette-spacing) * 2);
}

.p-3 {
  padding: calc(var(--mui-palette-spacing) * 3);
}

.p-4 {
  padding: calc(var(--mui-palette-spacing) * 4);
}

.p-auto {
  padding: auto;
}

.px-0 {
  padding-left: calc(var(--mui-palette-spacing) * 0);
  padding-right: calc(var(--mui-palette-spacing) * 0);
}

.px-1\/2 {
  padding-left: calc(var(--mui-palette-spacing) * 0.5);
  padding-right: calc(var(--mui-palette-spacing) * 0.5);
}

.px-1 {
  padding-left: calc(var(--mui-palette-spacing) * 1);
  padding-right: calc(var(--mui-palette-spacing) * 1);
}

.px-2 {
  padding-left: calc(var(--mui-palette-spacing) * 2);
  padding-right: calc(var(--mui-palette-spacing) * 2);
}

.px-3 {
  padding-left: calc(var(--mui-palette-spacing) * 3);
  padding-right: calc(var(--mui-palette-spacing) * 3);
}

.px-auto {
  padding-left: auto;
  padding-right: auto;
}

.py-0 {
  padding-top: calc(var(--mui-palette-spacing) * 0);
  padding-bottom: calc(var(--mui-palette-spacing) * 0);
}

.py-1\/2 {
  padding-top: calc(var(--mui-palette-spacing) * 0.5);
  padding-bottom: calc(var(--mui-palette-spacing) * 0.5);
}

.py-1 {
  padding-top: calc(var(--mui-palette-spacing) * 1);
  padding-bottom: calc(var(--mui-palette-spacing) * 1);
}

.py-2 {
  padding-top: calc(var(--mui-palette-spacing) * 2);
  padding-bottom: calc(var(--mui-palette-spacing) * 2);
}

.py-3 {
  padding-top: calc(var(--mui-palette-spacing) * 3);
  padding-bottom: calc(var(--mui-palette-spacing) * 3);
}

.py-auto {
  padding-top: auto;
  padding-bottom: auto;
}

.pb-0 {
  padding-bottom: calc(var(--mui-palette-spacing) * 0);
}

.pb-1\/2 {
  padding-bottom: calc(var(--mui-palette-spacing) * 0.5);
}

.pb-1 {
  padding-bottom: calc(var(--mui-palette-spacing) * 1);
}

.pb-2 {
  padding-bottom: calc(var(--mui-palette-spacing) * 2);
}

.pb-3 {
  padding-bottom: calc(var(--mui-palette-spacing) * 3);
}

.pb-auto {
  padding-bottom: auto;
}

.pt-0 {
  padding-top: calc(var(--mui-palette-spacing) * 0);
}

.pt-1\/2 {
  padding-top: calc(var(--mui-palette-spacing) * 0.5);
}

.pt-1 {
  padding-top: calc(var(--mui-palette-spacing) * 1);
}

.pt-2 {
  padding-top: calc(var(--mui-palette-spacing) * 2);
}

.pt-3 {
  padding-top: calc(var(--mui-palette-spacing) * 3);
}

.pt-auto {
  padding-top: auto;
}

.pl-0 {
  padding-left: calc(var(--mui-palette-spacing) * 0);
}

.pl-1\/2 {
  padding-left: calc(var(--mui-palette-spacing) * 0.5);
}

.pl-1 {
  padding-left: calc(var(--mui-palette-spacing) * 1);
}

.pl-2 {
  padding-left: calc(var(--mui-palette-spacing) * 2);
}

.pl-3 {
  padding-left: calc(var(--mui-palette-spacing) * 3);
}

.pl-auto {
  padding-left: auto;
}

.pr-0 {
  padding-right: calc(var(--mui-palette-spacing) * 0);
}

.pr-1\/2 {
  padding-right: calc(var(--mui-palette-spacing) * 0.5);
}

.pr-1 {
  padding-right: calc(var(--mui-palette-spacing) * 1);
}

.pr-2 {
  padding-right: calc(var(--mui-palette-spacing) * 2);
}

.pr-3 {
  padding-right: calc(var(--mui-palette-spacing) * 3);
}

.pr-auto {
  padding-right: auto;
}

.border-0 {
  border-width: 0px;
}

.border-1px {
  border-width: 1px;
  border-style: solid;
}

.border {
  border-width: calc(var(--mui-palette-spacing) * 0.25);
}

.border-2 {
  border-width: calc(var(--mui-palette-spacing) * 0.5);
}

.border-4 {
  border-width: calc(var(--mui-palette-spacing) * 1);
}

.border-8 {
  border-width: calc(var(--mui-palette-spacing) * 2);
}

.border-solid {
  border-style: solid;
}

.border-dashed {
  border-style: dashed;
}

.border-dotted {
  border-style: dotted;
}

.border-double {
  border-style: double;
}

.border-hidden {
  border-style: hidden;
}

.border-none {
  border-style: none;
}

.rounded-none {
  border-radius: 0px;
}

.rounded-xs {
  border-radius: calc(var(--mui-palette-spacing) * 0.5);
}

.rounded {
  border-radius: calc(var(--mui-palette-spacing) * 1);
}

.rounded-md {
  border-radius: calc(var(--mui-palette-spacing) * 1.5);
}

.rounded-lg {
  border-radius: calc(var(--mui-palette-spacing) * 2);
}

.rounded-full {
  border-radius: 9999px;
}

.w-0 {
  width: calc(var(--mui-palette-spacing) * 0);
}

.w-full {
  width: 100%;
}

.w-screen {
  width: 100vw;
}

.w-auto {
  width: auto;
}

.w-min {
  width: min-content;
}

.w-max {
  width: max-content;
}

.w-fit {
  width: fit-content;
}

.min-w-0 {
  min-width: 0px;
}

.min-w-full {
  min-width: 100%;
}

.min-w-min {
  min-width: min-content;
}

.min-w-max {
  min-width: max-content;
}

.min-w-fit {
  min-width: fit-content;
}

.max-w-0 {
  max-width: 0px;
}

.min-w-none {
  max-width: none;
}

.max-w-full {
  max-width: 100%;
}

.max-w-max {
  max-width: max-content;
}

.w-max {
  max-width: max-content;
}

.max-w-fit {
  max-width: fit-content;
}

.h-0 {
  height: calc(var(--mui-palette-spacing) * 0);
}

.h-full {
  height: 100%;
}

.h-screen {
  height: 100vh;
}

.h-auto {
  height: auto;
}

.h-min {
  height: min-content;
}

.h-max {
  height: max-content;
}

.h-fit {
  height: fit-content;
}

.min-h-0 {
  min-height: 0px;
}

.min-h-full {
  min-height: 100%;
}

.min-h-min {
  min-height: min-content;
}

.min-h-max {
  min-height: max-content;
}

.min-h-fit {
  min-height: fit-content;
}

.max-h-0 {
  max-height: 0px;
}

.max-h-none {
  max-height: none;
}

.max-h-full {
  max-height: 100%;
}

.max-h-max {
  max-height: max-content;
}

.max-h-fit {
  max-height: fit-content;
}

.bg-inherit {
  background-color: inherit;
}

.bg-transparent {
  background-color: transparent;
}

.bg-black {
  background-color: rgb(0 0 0);
}

.bg-white {
  background-color: rgb(255 255 255);
}

.bg-p-main {
  background-color: var(--mui-palette-primary-main);
}

.bg-p-light {
  background-color: var(--mui-palette-primary-light);
}

.bg-p-dark {
  background-color: var(--mui-palette-primary-dark);
}

.bg-s-main {
  background-color: var(--mui-palette-secondary-main);
}

.bg-s-light {
  background-color: var(--mui-palette-secondary-light);
}

.bg-s-dark {
  background-color: var(--mui-palette-secondary-dark);
}

.bg-grey {
  background-color: #f4f3f7;
}

.color-p-main {
  color: var(--mui-palette-primary-main);
}

.color-p-light {
  color: var(--mui-palette-primary-light);
}

.color-p-dark {
  color: var(--mui-palette-primary-dark);
}

.underline {
  text-decoration: underline;
}

.link {
  text-decoration: underline;
  color: #4ab56d;
}

.underline-offset-auto {
  text-underline-offset: auto;
}

.underline-offset-0 {
  text-underline-offset: 0px;
}

.underline-offset-1 {
  text-underline-offset: 1px;
}

.underline-offset-2 {
  text-underline-offset: 2px;
}

.underline-offset-4 {
  text-underline-offset: 4px;
}

.underline-offset-8 {
  text-underline-offset: 8px;
}

.bg-p-dark {
  background-color: var(--mui-palette-primary-dark);
}

.bg-s-main {
  background-color: var(--mui-palette-secondary-main);
}

.bg-s-light {
  background-color: var(--mui-palette-secondary-light);
}

.bg-s-dark {
  background-color: var(--mui-palette-secondary-dark);
}

.color-p-main {
  color: var(--mui-palette-primary-main);
}

.color-p-light {
  color: var(--mui-palette-primary-light);
}

.color-p-dark {
  color: var(--mui-palette-primary-dark);
}

.underline-offset-auto {
  text-underline-offset: auto;
}

.underline-offset-0 {
  text-underline-offset: 0px;
}

.underline-offset-1 {
  text-underline-offset: 1px;
}

.underline-offset-2 {
  text-underline-offset: 2px;
}

.underline-offset-4 {
  text-underline-offset: 4px;
}

.underline-offset-8 {
  text-underline-offset: 8px;
}

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

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

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

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

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

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

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

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

.location-height {
  /* height: 44px; */
  font-size: 14px;
  align-content: center;
}

.hover:hover {
  filter: contrast(0.7);
}

.text-decoration-none {
  text-decoration: none;
}

.border-right {
  border-right: 1px solid var(--mui-palette-grey-300);
}

.b-0 {
  border: 0px;
}

.text-decoration-none:visited,
.text-decoration-none:active {
  color: inherit;
}

.h-46 {
  height: 46px;
  min-height: 46px !important;
}

.date-picker {
  height: '44px';
}

.cursor-pointer {
  cursor: pointer;
}

.cursor-not-allowed {
  cursor: not-allowed;
}

.cursor-default {
  cursor: default;
}

.input-height-small {
  height: 28px;
}

.overflow-auto {
  overflow: auto;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.top-0 {
  top: 0;
}

.left-0 {
  left: 0;
}

.disabled {
  filter: blur(2px);
}

.disabled-form {
  opacity: 0.8;
}

.disable-form {
  opacity: 1;
}
.no-pointer-events {
  pointer-events: none;
  cursor: not-allowed;
}

@keyframes append-animate {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }

  to {
    transform: translateX(0%);
    opacity: 1;
  }
}

/* Loading text animation */
@keyframes text-loading-animate {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0.8);
  }
}
