:root {
  --o-slider-navigation-background-color: #000;
  --o-slider-navigation-hover-background-color: #da3038;
  --o-slider-navigation-size: 2.5rem;
  --o-slider-pagination-background-color: #d5d5d5;
  --o-slider-pagination-active-background-color: #da3038;
  --o-slider-pagination-icon-size: 0.5rem;
  --o-slider-pagination-gap: 0.3125rem;
  --o-slider-pagination-height: 2rem;

  --o-slider-quote-icon-width: 2.25rem;
  --o-slider-quote-icon-height: 2rem;
  --o-slider-quote-icon-color: #da3038;

  --o-slider-quoted-box-padding: 1.875rem;

  --o-slider-marquee-background-gradient-base: var(--bs-white);
  --o-slider-quote-background-gradient-base: var(--bs-white);
}

.o-slider {
  color: var(--bs-body-color);
}

/* Avoid layout shift */
:is([data-quoted-wrapper]:not(.slider-bs-processed), [data-carousel-type="quote_slider"]:not(.slider-bs-processed)) .o-slider__item:not(:first-child) {
  /* display: none; */
}

:is([data-carousel-type="quote_carousel"]:not(.slider-bs-processed), [data-carousel-type="simple_carousel"]:not(.slider-bs-processed), [data-carousel-type="customer_story"]:not(.slider-bs-processed), [data-quoted-wrapper]:not(.slider-bs-processed)) .o-slider__wrapper {
  display: grid;
}

:is([data-carousel-type="quote_carousel"]:not(.slider-bs-processed), [data-carousel-type="simple_carousel"]:not(.slider-bs-processed), [data-carousel-type="customer_story"]:not(.slider-bs-processed), [data-quoted-wrapper]:not(.slider-bs-processed)) .o-slider__item {
  grid-column: 1;
  grid-row: 1;
}

:is([data-carousel-type="quote_carousel"]:not(.slider-bs-processed), [data-carousel-type="simple_carousel"]:not(.slider-bs-processed), [data-carousel-type="customer_story"]:not(.slider-bs-processed), [data-quoted-wrapper]:not(.slider-bs-processed)) .o-slider__item:not(:first-child) {
  opacity: 0;
}

[data-bs-theme="dark"] {
  --o-slider-navigation-background-color: #fff;
  --o-slider-navigation-hover-background-color: #da3038;
  --o-slider-pagination-background-color: #fff;
  --o-slider-pagination-active-background-color: #da3038;
}

[data-carousel-type="customer_story"] {
  --o-slider-pagination-active-background-color: #7cbdff;
  --o-slider-pagination-icon-size: 0.625rem;
  --o-slider-navigation-background-color: #7cbdff;
  --o-slider-navigation-hover-background-color: #7cbdff;
  --o-slider-navigation-size: 9rem;
}

[data-carousel-type="customer_story"] .o-slider__pagination {
  display: none;
}

@media (min-width: 768px) {
  [data-carousel-type="customer_story"] .o-slider__pagination {
    display: flex;
    grid-row: 4;
    margin-block-start: 1.5rem;
  }
}

[data-carousel-type="customer_story"] [class*="o-slider__nav--"] {
  display: none;
  text-transform: uppercase;
  height: auto;
  color: var(--o-slider-navigation-background-color);
  line-height: 1;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}

@media (min-width: 768px) {
  [data-carousel-type="customer_story"] [class*="o-slider__nav--"] {
    grid-row: 4;
    display: flex;
    margin-block-start: 1.5rem;
  }
}

[data-carousel-type="marquee"] {
  --swiper-wrapper-transition-timing-function: ease !important;
}

[data-carousel-type="marquee"] .o-slider__wrapper {
  transition-timing-function: linear;
}

[data-carousel-type="marquee"] .o-slider__box::after,
[data-carousel-type="marquee"] .o-slider__box::before {
  position: absolute;
  top: 0;
  width: 5rem;
  height: 100%;
  content: "";
  z-index: 2;
}

@media (min-width: 1400px) {
  [data-carousel-type="marquee"] .o-slider__box::after,
  [data-carousel-type="marquee"] .o-slider__box::before {
    width: 10rem;
  }
}

[data-carousel-type="marquee"] .o-slider__box::before {
  left: 0;
  background: linear-gradient(to right, var(--o-slider-marquee-background-gradient-base) 0%, transparent 100%);
}

[data-carousel-type="marquee"] .o-slider__box::after {
  right: 0;
  background: linear-gradient(to left, var(--o-slider-marquee-background-gradient-base) 0%, transparent 100%);
}

[data-carousel-type="marquee"] .o-slider__item {
  display: flex;
  justify-content: center;
  align-items: center;
  width: auto;
}

[data-carousel-type="marquee"] .o-slider__item img {
  margin-inline: 2.5rem;
  max-width: 160px;
  max-height: 72px;
  height: auto;
  width: auto;
}

[data-carousel-type="simple_carousel"] .o-slider__box {
  grid-template-rows: 1fr var(--o-slider-pagination-height);
}

[data-carousel-type="simple_carousel"] .o-slider__wrapper {
  grid-row: 1;
}

[data-carousel-type="simple_carousel"] .o-slider__pagination {
  grid-row: 2;
}

[data-carousel-type="simple_carousel"] [class*="o-slider__nav--"] {
  grid-row: 1;
}

[data-quoted-wrapper] {
  --o-slider-navigation-size: 2rem;
  --o-slider-pagination-height: 1rem;

  display: grid;
  grid-template-columns: var(--o-slider-quoted-box-padding) 1fr var(--o-slider-quoted-box-padding);
  grid-template-rows: 1rem 1rem 1fr 1rem 1rem;
}

[data-quoted-wrapper] .o-slider__box {
  grid-column: 1 / span 3;
  grid-row: 2 / span 3;
  padding: var(--o-slider-quoted-box-padding);
  background-color: var(--bs-white);
  border-radius: 10px;
  min-height: 240px;
}

[data-quoted-wrapper] .o-slider__icon--open {
  grid-column: 2;
}

[data-quoted-wrapper] .o-slider__icon--close {
  grid-column: 2;
  grid-row: 4;
  justify-self: end;
}

[data-quoted-wrapper] [class*="o-slider__nav--"] {
  margin-block-end: 0.5rem;
}

[data-quoted-wrapper] .o-slider__wrapper {
  grid-row: 2;
}

[data-quoted-wrapper] .o-slider__item {
  padding-block: 0.5rem;
  padding-inline: var(--o-slider-navigation-size);
  height: 100%;
}

[data-quoted-wrapper] .o-slider__pagination {
  align-self: end;
}

@media (min-width: 768px) {
  [data-quoted-wrapper] .o-slider__pagination {
    align-self: start;
  }
}

@media (min-width: 768px) {
  [data-quoted-wrapper] .o-slider__item {
    padding-inline: 16.66%;
  }
}

[data-carousel-type="quote_carousel"] {
  --o-slider-pagination-gap: 0.25rem;
  --swiper-wrapper-transition-timing-function: ease-in-out;
}

[data-carousel-type="quote_carousel"] [class*="o-slider__nav--"] {
  margin-block-end: 2.5rem;
}

[data-carousel-type="quote_carousel"] .o-slider__pagination {
  margin-block-start: 1.5rem;
}

[data-carousel-type="quote_slider"] {
  --o-slider-navigation-hover-background-color: #0067cb;

  display: grid;
  grid-template-rows: 5rem 1fr 5rem;
}

@media (min-width: 992px) {
  [data-carousel-type="quote_slider"] {
    grid-template-columns: 1fr 3fr;
    column-gap: 10px;
  }
}

[data-carousel-type="quote_slider"] .o-slider__box {
  grid-template-rows: 5rem 1fr 5rem;
  grid-template-columns: 1fr var(--o-slider-navigation-size) var(--o-slider-navigation-size);
  column-gap: 0.5rem;
  grid-row: 1 / span 3;
  grid-column: 1;
}

@media (min-width: 992px) {
  [data-carousel-type="quote_slider"] .o-slider__box {
    grid-column: 2;
  }
}

[data-carousel-type="quote_slider"] .o-slider__icon--open {
  grid-row: 1;
  grid-column: 1;
  margin-block-start: 0.625rem;
}

@media (min-width: 992px) {
  [data-carousel-type="quote_slider"] .o-slider__icon--open {
    grid-column: 2;
    margin-inline-start: 100px;
  }
}

[data-carousel-type="quote_slider"] .o-slider__icon--close {
  margin-block-end: 0.625rem;
  align-self: end;
  justify-self: end;
  grid-column: 1;
  grid-row: 3;
}

@media (min-width: 992px) {
  [data-carousel-type="quote_slider"] .o-slider__icon--close {
    grid-column: 2;
  }
}

[data-carousel-type="quote_slider"] .o-slider__nav--prev {
  grid-column: 2;
  grid-row: 1;
  align-self: start;
}

[data-carousel-type="quote_slider"] .o-slider__nav--next {
  grid-column: 3;
  grid-row: 1;
  align-self: start;
}

[data-carousel-type="quote_slider"] .o-slider__wrapper {
  grid-row: 2;
}

[data-carousel-type="quote_slider"] .o-slider__pagination {
  grid-column: 1 / span 3;
  align-self: end;
  margin-block-end: 1.325rem;
}

[data-carousel-type="quote_slider"] .o-slider__box::after {
  position: absolute;
  top: 5rem;
  bottom: 5rem;
  width: 10rem;
  height: 100%;
  content: "";
  z-index: 1;
  right: 0;
  background: linear-gradient(to left, var(--o-slider-quote-background-gradient-base, #fff) 0%, transparent 100%);
}

[data-carousel-type="quote_slider"] .o-slider__item {
  width: calc(100vw - 119px);
}

@media (min-width: 768px) {
  [data-carousel-type="quote_slider"] .o-slider__item {
    width: calc(((100vw - 119px) / 2 - 28px));
  }
}

@media (min-width: 992px) {
  [data-carousel-type="quote_slider"] .o-slider__item {
    width: calc(((75vw - 119px) / 2 - 28px));
  }
}

@media (min-width: 1200px) {
  [data-carousel-type="quote_slider"] .o-slider__item {
    width: 362px;
  }
}

@media (min-width: 1400px) {
  [data-carousel-type="quote_slider"] .o-slider__item {
    width: 407px;
  }
}

[class*="o-slider__icon"] {
  width: var(--o-slider-quote-icon-width);
  height: var(--o-slider-quote-icon-height);
  fill: var(--o-slider-quote-icon-color);
  z-index: 2;
}

.o-slider__box {
  max-width: 100%;
  position: relative;
  display: grid;
  grid-template-columns: var(--o-slider-navigation-size) 1fr var(--o-slider-navigation-size);
  grid-template-rows: var(--o-slider-pagination-height) 1fr var(--o-slider-pagination-height);
}

.o-slider__caption:empty {
  display: none;
}

.o-slider__caption {
  font-style: italic;
  color: #282730;
  margin-block: 1.185rem;
  text-align: center;
}

.o-slider__customer-icon {
  width: 1rem;
  height: 1rem;
}

[class*="o-slider__nav--"] {
  display: inline-block;
  align-self: center;
  border: none;
  padding: 0;
  background-color: transparent;
  cursor: pointer;
  fill: var(--o-slider-navigation-background-color);
  z-index: 1;
  width: var(--o-slider-navigation-size);
  height: var(--o-slider-navigation-size);
}

[class*="o-slider__nav--"]:hover {
  fill: var(--o-slider-navigation-hover-background-color);
}

[class*="o-slider__nav--"]:disabled,
[class*="o-slider__nav--"]:disabled:hover {
  opacity: 0.2;
  fill: var(--o-slider-navigation-background-color);
}

.o-slider__nav--prev {
  grid-column: 1;
  grid-row: 2;
}

.o-slider__nav--next {
  grid-column: 3;
  grid-row: 2;
}

.o-slider__nav-icon {
  fill: inherit;
}

.o-slider__pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--o-slider-pagination-gap);
  grid-column: 2;
  grid-row: 3;
  z-index: 1;
}

.o-slider__pagination-button {
  display: block;
  padding: 0;
  border: 0;
  background-color: var(--o-slider-pagination-background-color);
  cursor: pointer;
  width: var(--o-slider-pagination-icon-size);
  height: var(--o-slider-pagination-icon-size);
  border-radius: 50%;

  &.active {
    background-color: var(--o-slider-pagination-active-background-color);
  }
}

.o-slider__quote-image {
  display: none;
}

@media (min-width: 992px) {
  .o-slider__quote-image {
    display: block;
    grid-column: 1 / span 1;
    grid-row: 1 / span 3;
    position: relative;
    margin-inline-end: -85px;
    margin-inline-start: -15px;
    overflow: hidden;
    border-radius: 12px;
  }
}

.o-slider__quote-image img {
  position: absolute;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.o-slider__wrapper {
  position: relative;
  grid-column: 1 / span 3;
  grid-row: 1 / span 3;
}

/* marquee card and carousel css */
.card-img-style .card-text .paragraph.paragraph--type--marque-slide .o-slider__item .field__items,
.section-autoplay-images .paragraph.paragraph--type--marque-slide .o-slider__item .field__items {
  display: flex;
}

.paragraph.paragraph--type--marque-slide.paragraph--view-mode--default {
  margin: 40px auto;
}
