/* === FLEX UTILITIES WITH RESPONSIVE BREAKPOINTS === */

/* Breakpoints:
   - Mobile: up to 639px
   - Tablet: 640px to 1023px
   - Desktop: 1024px and up
*/

/* Mobile: default (no prefix, applies to all) */
.flex {
  display: flex !important;
}
.inline-flex {
  display: inline-flex !important;
}
.flex-row {
  flex-direction: row !important;
}
.flex-row-reverse {
  flex-direction: row-reverse !important;
}
.flex-col {
  flex-direction: column !important;
}
.flex-col-reverse {
  flex-direction: column-reverse !important;
}
.flex-wrap {
  flex-wrap: wrap !important;
}
.flex-nowrap {
  flex-wrap: nowrap !important;
}
.flex-wrap-reverse {
  flex-wrap: wrap-reverse !important;
}
.justify-start {
  justify-content: flex-start !important;
}
.justify-center {
  justify-content: center !important;
}
.justify-end {
  justify-content: flex-end !important;
}
.justify-between {
  justify-content: space-between !important;
}
.justify-around {
  justify-content: space-around !important;
}
.justify-evenly {
  justify-content: space-evenly !important;
}
.items-start {
  align-items: flex-start !important;
}
.items-center {
  align-items: center !important;
}
.items-end {
  align-items: flex-end !important;
}
.items-stretch {
  align-items: stretch !important;
}
.items-baseline {
  align-items: baseline !important;
}
.content-start {
  align-content: flex-start !important;
}
.content-center {
  align-content: center !important;
}
.content-end {
  align-content: flex-end !important;
}
.content-between {
  align-content: space-between !important;
}
.content-around {
  align-content: space-around !important;
}
.content-evenly {
  align-content: space-evenly !important;
}
.self-auto {
  align-self: auto !important;
}
.self-start {
  align-self: flex-start !important;
}
.self-center {
  align-self: center !important;
}
.self-end {
  align-self: flex-end !important;
}
.self-stretch {
  align-self: stretch !important;
}
.flex-grow {
  flex-grow: 1 !important;
}
.flex-grow-0 {
  flex-grow: 0 !important;
}
.flex-shrink {
  flex-shrink: 1 !important;
}
.flex-shrink-0 {
  flex-shrink: 0 !important;
}
.flex-1 {
  flex: 1 1 0% !important;
}
.flex-auto {
  flex: 1 1 auto !important;
}
.flex-initial {
  flex: 0 1 auto !important;
}
.flex-none {
  flex: none !important;
}
.d-none {
  display: none !important;
}

/* Tablet: min-width 640px */
@media (min-width: 640px) {
  .tablet--flex {
    display: flex !important;
  }
  .tablet--inline-flex {
    display: inline-flex !important;
  }
  .tablet--flex-row {
    flex-direction: row !important;
  }
  .tablet--flex-row-reverse {
    flex-direction: row-reverse !important;
  }
  .tablet--flex-col {
    flex-direction: column !important;
  }
  .tablet--flex-col-reverse {
    flex-direction: column-reverse !important;
  }
  .tablet--flex-wrap {
    flex-wrap: wrap !important;
  }
  .tablet--flex-nowrap {
    flex-wrap: nowrap !important;
  }
  .tablet--flex-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
  .tablet--justify-start {
    justify-content: flex-start !important;
  }
  .tablet--justify-center {
    justify-content: center !important;
  }
  .tablet--justify-end {
    justify-content: flex-end !important;
  }
  .tablet--justify-between {
    justify-content: space-between !important;
  }
  .tablet--justify-around {
    justify-content: space-around !important;
  }
  .tablet--justify-evenly {
    justify-content: space-evenly !important;
  }
  .tablet--items-start {
    align-items: flex-start !important;
  }
  .tablet--items-center {
    align-items: center !important;
  }
  .tablet--items-end {
    align-items: flex-end !important;
  }
  .tablet--items-stretch {
    align-items: stretch !important;
  }
  .tablet--items-baseline {
    align-items: baseline !important;
  }
  .tablet--content-start {
    align-content: flex-start !important;
  }
  .tablet--content-center {
    align-content: center !important;
  }
  .tablet--content-end {
    align-content: flex-end !important;
  }
  .tablet--content-between {
    align-content: space-between !important;
  }
  .tablet--content-around {
    align-content: space-around !important;
  }
  .tablet--content-evenly {
    align-content: space-evenly !important;
  }
  .tablet--self-auto {
    align-self: auto !important;
  }
  .tablet--self-start {
    align-self: flex-start !important;
  }
  .tablet--self-center {
    align-self: center !important;
  }
  .tablet--self-end {
    align-self: flex-end !important;
  }
  .tablet--self-stretch {
    align-self: stretch !important;
  }
  .tablet--flex-grow {
    flex-grow: 1 !important;
  }
  .tablet--flex-grow-0 {
    flex-grow: 0 !important;
  }
  .tablet--flex-shrink {
    flex-shrink: 1 !important;
  }
  .tablet--flex-shrink-0 {
    flex-shrink: 0 !important;
  }
  .tablet--flex-1 {
    flex: 1 1 0% !important;
  }
  .tablet--flex-auto {
    flex: 1 1 auto !important;
  }
  .tablet--flex-initial {
    flex: 0 1 auto !important;
  }
  .tablet--flex-none {
    flex: none !important;
  }
  .tablet--d-block {
    display: block !important;
  }
  .tablet--d-none {
    display: none !important;
  }
}

/* Desktop: min-width 1024px */
@media (min-width: 1024px) {
  .desktop--flex {
    display: flex !important;
  }
  .desktop--inline-flex {
    display: inline-flex !important;
  }
  .desktop--flex-row {
    flex-direction: row !important;
  }
  .desktop--flex-row-reverse {
    flex-direction: row-reverse !important;
  }
  .desktop--flex-col {
    flex-direction: column !important;
  }
  .desktop--flex-col-reverse {
    flex-direction: column-reverse !important;
  }
  .desktop--flex-wrap {
    flex-wrap: wrap !important;
  }
  .desktop--flex-nowrap {
    flex-wrap: nowrap !important;
  }
  .desktop--flex-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
  .desktop--justify-start {
    justify-content: flex-start !important;
  }
  .desktop--justify-center {
    justify-content: center !important;
  }
  .desktop--justify-end {
    justify-content: flex-end !important;
  }
  .desktop--justify-between {
    justify-content: space-between !important;
  }
  .desktop--justify-around {
    justify-content: space-around !important;
  }
  .desktop--justify-evenly {
    justify-content: space-evenly !important;
  }
  .desktop--items-start {
    align-items: flex-start !important;
  }
  .desktop--items-center {
    align-items: center !important;
  }
  .desktop--items-end {
    align-items: flex-end !important;
  }
  .desktop--items-stretch {
    align-items: stretch !important;
  }
  .desktop--items-baseline {
    align-items: baseline !important;
  }
  .desktop--content-start {
    align-content: flex-start !important;
  }
  .desktop--content-center {
    align-content: center !important;
  }
  .desktop--content-end {
    align-content: flex-end !important;
  }
  .desktop--content-between {
    align-content: space-between !important;
  }
  .desktop--content-around {
    align-content: space-around !important;
  }
  .desktop--content-evenly {
    align-content: space-evenly !important;
  }
  .desktop--self-auto {
    align-self: auto !important;
  }
  .desktop--self-start {
    align-self: flex-start !important;
  }
  .desktop--self-center {
    align-self: center !important;
  }
  .desktop--self-end {
    align-self: flex-end !important;
  }
  .desktop--self-stretch {
    align-self: stretch !important;
  }
  .desktop--flex-grow {
    flex-grow: 1 !important;
  }
  .desktop--flex-grow-0 {
    flex-grow: 0 !important;
  }
  .desktop--flex-shrink {
    flex-shrink: 1 !important;
  }
  .desktop--flex-shrink-0 {
    flex-shrink: 0 !important;
  }
  .desktop--flex-1 {
    flex: 1 1 0% !important;
  }
  .desktop--flex-auto {
    flex: 1 1 auto !important;
  }
  .desktop--flex-initial {
    flex: 0 1 auto !important;
  }
  .desktop--flex-none {
    flex: none !important;
  }
  .desktop--d-block {
    display: block !important;
  }
  .desktop--d-none {
    display: none !important;
  }
}

/* === CUSTOM SPECIFIC CLASSES === */

.min-height-0 {
  min-height: 0px !important;
}

.min-height-fix {
  min-height: 10px !important;
}

.margin-0 {
  margin: 0 !important;
}

.gap-1 {
  gap: 1.5rem !important;
}
.gap-2 {
  gap: 2rem !important;
}
.gap-3 {
  gap: 3rem !important;
}
.gap-4 {
  gap: 4rem !important;
}

.uppercase {
  text-transform: uppercase;
}

.fit-content {
  width: fit-content !important;
}

 ul.red-bullet li::marker {
  color: #FE2C55 !important;
}


 ul.green-bullet li::marker {
  color: #2DCCD3 !important;
}

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