/* ------------------------------------ *\
  CONTENTS
\* ------------------------------------ */

/**
 * CONTENTS..............You’re reading it!
 * SLIDER STYLE ............................
 * MEDIA QUERIES ..........................
*/

/* ------------------------------------ *\
  ==SLIDER STYLE
\* ------------------------------------ */
/* ------------------------------------ *\
  ==SLIDER
\* ------------------------------------ */
div.paragraph--type--slider .slick-slider .slick-dots {
  height: 0;
  align-self: center;
}

div.paragraph--type--slider
  .slick-slider
  .slick-dots
  li.slick-active
  button
  .slick-dot-icon,
div.paragraph--type--slider
  .slick-slider
  .slick-dots
  li
  button:focus
  .slick-dot-icon::before {
  color: var(--bs-black);
}

.paragraph.paragraph--type--slider
  .slick-slider
  .slick-dots
  li.slick-active
  button
  .slick-dot-icon::before {
  margin-top: 0;
  font-size: 12px;
}

.slick-dots li button {
  margin-top: -5px;
  margin-left: -5px;
}

div.paragraph--type--slider
  .slick-slider
  .slick-dots
  li:not(.slick-active)
  button
  .slick-dot-icon::before {
  width: unset;
  height: unset;
  border: 0;
  background-color: unset;
  color: var(--bs-gray-550);
}

.paragraph--type--slider
  .slick-slider
  .slick-dots
  li.slick-active
  button
  .slick-dot-icon::before {
  margin-top: 0;
  font-size: 8px;
}

.slick-dots li button .slick-dot-icon::before {
  position: unset;
}

.slick-dots li.slick-active button .slick-dot-icon::before {
  margin-top: 0;
  margin-left: 0;
  font-size: 12px;
}

.paragraph.paragraph--type--slider
  .slick-slider
  .slick-dots
  li.slick-active
  button
  .slick-dot-icon::before,
.slick-dots li button .slick-dot-icon::before,
.slick-dots li.slick-active button .slick-dot-icon::before {
  margin-top: 0;
  margin-left: 0;
  font-size: 12px;
  color: var(--bs-blue);
}

.field .paragraph--type--slider .slick-slider ul.slick-dots {
  top: calc(100% + 1rem);
}

.paragraph--type--slider
  .slick-slider
  .slick-dots
  li:not(.slick-active)
  button
  .slick-dot-icon::before {
  align-items: unset;
  background-repeat: unset;
  background-position: unset;
  background-size: unset;
  width: 0;
  height: 0;
  border-radius: 0;
  border: 0;
  color: unset;
}

.paragraph.paragraph--type--slider .paragraph {
  width: 100%;
}

.paragraph--type--slider .slick-slider {
  position: relative;
}

.slick-initialized .slick-slide {
  display: block;
  position: relative;
}

.paragraph--type--slider .slick-slider .slick-arrow span:focus {
  outline: var(--bs-focus-ring-width) solid var(--bs-focus-ring-color);
  height: 100%;
}

.paragraph--type--slider .slick-slider .slick-arrow {
  position: absolute;
  top: 0;
  height: 100%;
  color: var(--bs-blue);
  cursor: pointer;
  font-size: 1.25rem;
  align-content: center;
}

.paragraph--type--slider .slick-slider .next-arrow {
  right: -1rem;
}

.paragraph--type--slider .slick-slider .prev-arrow {
  left: -1rem;
}

.slider--multiple .slick-slide {
  margin: 0 1rem;
  position: relative;
}