/**
 * Styles for UAGB/Spectra row sliders.
 * Customizes slick dots layout, positioning, and appearance for carousel navigation.
 */

/**----------------- ROW SLIDER -------------*/

.spectra-image-gallery__layout--carousel ul.slick-dots {
  top: unset !important;
  bottom: -30px;
  position: absolute !important;
}

.spectra-image-gallery.spectra-image-gallery__layout--carousel ul.slick-dots {
  margin-bottom: 0 !important;
}

.slick-dots .uagb-slick-carousel ul.slick-dots li button {
  position: relative !important;
  display: flex !important;
  justify-content: center;
  align-items: center;
  background-color: transparent;
}

ul.slick-dots button::before {
  height: 12px !important;
  width: 12px !important;
  background-color: var(--color-1) !important;
  color: transparent !important;
  opacity: 1 !important;
  border-radius: 50% !important;
  left: unset !important;
  top: unset !important;
}

ul.slick-dots button[aria-selected="true"]:before {
  color: transparent !important;
}

/* Slider Zimmer */

.cont-slider .spectra-image-gallery__layout--carousel ul.slick-dots {
  top: unset !important;
  position: absolute !important;
  padding-right: var(--gap-m);
  left: unset !important;
  display: flex !important;
  justify-content: flex-end;
  /* bottom: 0 !important; */
}

/* Slider Region .cont-slider-text */
.cont-slider-text .wp-block-uagb-image-gallery {
  margin-bottom: var(--gap-l);
}