/*!**********************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./node_modules/@wordpress/scripts/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[3]!./packages/module-library/image-carousel/style.scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
/*
 * Swiper 12+ core CSS targets `.swiper` for overflow clipping. Our markup still
 * uses `swiper-container` (D4 / Swiper 4 era). Legacy `divi-4/public/css/swiper.css`
 * added `.dsm_image_carousel .swiper-container { overflow: hidden; width: 100%; }`.
 * Without this, slides/images extend past the module on the frontend.
 */
.dsm_image_carousel .swiper-container {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
  width: 100%;
  max-width: 100%;
}

/*
 * Firefox: flatten wrapper stacking for typical slides (fixes z-index glitches).
 * 3D effects need preserve-3d — flat breaks Swiper’s transform math.
 * Legacy Swiper 4 used .swiper-container-cube; Swiper 12+ uses .swiper.swiper-cube on
 * the root — our markup is still .swiper-container, so :not(.swiper-container-cube)
 * no longer excludes cube. Use data-effect (mirrors PHP / edit.js) + old class.
 */
@-moz-document url-prefix() {
  .dsm_image_carousel .swiper-container:not(.swiper-container-cube):not(.swiper-cube) .swiper-wrapper {
    transform-style: flat !important;
  }
  /*
   * Must match or exceed the flat rule’s specificity (0,5,0): two :not() on the
   * wrapper’s parent beat a lone [data-effect]. Cube skips the flat rule via
   * .swiper-cube; coverflow/flip do not, so they need this bump or Firefox stays flat.
   */
  .dsm_image_carousel .swiper-container.dsm_image_carousel_container[data-effect=coverflow] .swiper-wrapper,
  .dsm_image_carousel .swiper-container.dsm_image_carousel_container[data-effect=flip] .swiper-wrapper,
  .dsm_image_carousel .swiper-container.dsm_image_carousel_container[data-effect=cube] .swiper-wrapper {
    transform-style: preserve-3d !important;
  }
}
.dsm_image_carousel .dsm_image_carousel_container:not(.dsm_image_carousel_slideshow) {
  margin-bottom: 60px;
}

/*
 * Swiper 12+ navigation (swiper-bundle.css) positions arrows with
 * left/right: var(--swiper-navigation-sides-offset, 4px) and sibling selectors
 * (.swiper-horizontal ~ .swiper-button-prev). That often loads after our rules and wins
 * the cascade. Drive offsets via these variables so Swiper’s declarations stay correct.
 */
.dsm_image_carousel {
  --swiper-navigation-size: 40px;
}

.dsm_image_carousel.dsm_image_carousel_horizontal.dsm_image_carousel_arrow_outside {
  --swiper-navigation-sides-offset: -40px;
}

.dsm_image_carousel.dsm_image_carousel_horizontal.dsm_image_carousel_arrow_inside {
  --swiper-navigation-sides-offset: 0px;
}

.dsm_image_carousel.dsm_image_carousel_vertical.dsm_image_carousel_arrow_outside {
  --swiper-navigation-sides-offset: -40px;
}

.dsm_image_carousel.dsm_image_carousel_vertical.dsm_image_carousel_arrow_inside {
  --swiper-navigation-sides-offset: 0px;
}

.dsm_image_carousel.dsm_image_carousel_vertical .swiper-button-prev,
.dsm_image_carousel.dsm_image_carousel_vertical .swiper-button-next {
  transform: rotate(90deg);
}

.dsm_image_carousel.dsm_image_carousel_vertical .swiper-button-next {
  top: auto !important;
}

.dsm_image_carousel .swiper-button-prev,
.dsm_image_carousel .swiper-button-next {
  height: 40px;
  width: 40px;
  background-image: none;
  background-size: initial;
  display: flex;
  align-items: center;
  margin-top: -30px;
  border-style: solid;
}

/* Horizontal left/right come from --swiper-navigation-sides-offset (see block above). */
.dsm_image_carousel_vertical.dsm_image_carousel_arrow_inside .swiper-button-prev {
  top: 0px;
}

.dsm_image_carousel_vertical.dsm_image_carousel_arrow_inside .swiper-button-next {
  bottom: 0px;
}

.dsm_image_carousel_vertical.dsm_image_carousel_arrow_outside .swiper-button-prev {
  top: -40px;
}

.dsm_image_carousel_vertical.dsm_image_carousel_arrow_outside .swiper-button-next {
  bottom: -40px;
}

.dsm_image_carousel .swiper-button-prev:after,
.dsm_image_carousel .swiper-button-next:after {
  display: none;
}

/* Swiper 12+ ships SVG navigation icons; we use Divi/ET font icons via :before. */
.dsm_image_carousel .swiper-button-prev .swiper-navigation-icon,
.dsm_image_carousel .swiper-button-next .swiper-navigation-icon,
.dsm_image_carousel .swiper-button-prev svg,
.dsm_image_carousel .swiper-button-next svg {
  display: none;
}

.dsm_image_carousel_vertical .swiper-pagination {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: -moz-fit-content !important;
  width: fit-content !important;
}

.dsm_image_carousel_pagi_placement_right .swiper-pagination {
  left: auto !important;
}

.dsm_image_carousel_pagi_placement_left .swiper-pagination {
  right: auto !important;
}

/*
 * Horizontal bullet row: Swiper uses bottom: var(--swiper-pagination-bottom, 8px).
 * Default offset lives on the module so it doesn’t fight dots_horizontal_placement from CommonStyle.
 */
.dsm_image_carousel.dsm_image_carousel_horizontal {
  --swiper-pagination-bottom: -30px;
}

/*
 * Pagination is a sibling of `.dsm_image_carousel_container`, not a child — do not require
 * `.swiper-container-horizontal` / `.swiper-horizontal` as an ancestor (Swiper 12+ uses the latter).
 */
.dsm_image_carousel .swiper-pagination-bullets,
.dsm_image_carousel .swiper-pagination-custom,
.dsm_image_carousel .swiper-pagination-fraction {
  left: 0;
  width: 100%;
}

.dsm_image_carousel .swiper-pagination-bullets {
  left: 0;
  width: 100%;
}

.dsm_image_carousel .swiper-pagination-bullets .swiper-pagination-bullet,
.et-db #et-boc .et-l .dsm_image_carousel .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
}

.dsm_image_carousel_pagination_outside .dsm_image_carousel_container {
  padding-bottom: 30px;
}

.dsm_image_carousel_pagination_outside .swiper-pagination-bullets,
.dsm_image_carousel_pagination_outside .swiper-pagination-custom,
.dsm_image_carousel_pagination_outside .swiper-pagination-fraction {
  bottom: 0;
}

.dsm_image_carousel .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: rgba(0, 0, 0, 0.75);
}

.dsm_image_carousel .dsm_image_carousel_container .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  -webkit-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
}

.dsm_image_carousel .swiper-slide img {
  width: auto;
  border-style: solid;
}

.dsm_image_carousel.dsm_image_carousel_vertical .swiper-slide img {
  width: 100%;
  height: 100%;
}

/* SVG in custom-link slides only: fills the width-100% anchor when intrinsic sizing is unusable.
 * Raster JPEG/PNG/WebP keep `.swiper-slide img { width:auto }` + srcset/sizes. */
.dsm_image_carousel .swiper-slide .dsm_image_carousel_link img:is([src$=".svg" i],
[src*=".svg?" i],
[src*=".svg#" i],
[src^="data:image/svg+xml" i]) {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
}

.dsm_image_carousel.dsm_image_carousel_vertical .swiper-slide .dsm_image_carousel_link img:is([src$=".svg" i],
[src*=".svg?" i],
[src*=".svg#" i],
[src^="data:image/svg+xml" i]) {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.dsm_image_carousel .dsm_image_carousel_item a {
  width: 100%;
  display: inline-block;
}

.dsm_image_carousel_infinite_scroll .swiper-wrapper {
  transition-timing-function: linear !important;
}

.dsm_image_carousel_infinite_scroll:hover .swiper-wrapper {
  transition-timing-function: linear !important;
}

.dsm_image_carousel_infinite_scroll .swiper-pagination {
  display: none;
}

/* Thumbnail strip Swiper roots: FE emits .swiper + .dsm_image_gallery_thumbs, VB emits .swiper-container. */
.dsm_image_carousel:not(.dsm_ic_slideshow_thumbs_custom) .dsm_image_gallery_thumbs.swiper,
.dsm_image_carousel:not(.dsm_ic_slideshow_thumbs_custom) .dsm_image_gallery_thumbs.swiper-container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
}

.dsm_image_gallery_thumbs .swiper-slide .dsm_image_carousel_thumbs_image {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  aspect-ratio: 21/9;
}

.dsm_image_gallery_thumbs .swiper-slide .dsm_image_carousel_thumbs_image[data-dsm-lazy-bg] {
  background-color: rgba(0, 0, 0, 0.04);
}

.dsm_image_carousel_slideshow {
  width: 100%;
}

/*
 * Custom (absolute): class on thumbnail Swiper root (VB canvas may skip .et_pb_module_inner).
 */
.dsm_image_carousel.dsm_ic_slideshow_thumbs_custom {
  position: relative;
}

.dsm_image_carousel.dsm_ic_slideshow_thumbs_custom .et_pb_module_inner {
  position: relative;
}

/*
 * Absolute overlay thumbnails: scoped to markup class so builder + frontend match regardless of wrapper.
 */
.dsm_ic_slideshow_thumbs_absolute.swiper,
.dsm_ic_slideshow_thumbs_absolute.swiper-container {
  position: absolute !important;
  box-sizing: border-box !important;
  z-index: 5;
  top: 0;
  right: 0;
  bottom: auto !important;
  left: 0;
  width: auto !important;
  max-width: 100%;
  min-width: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  overflow: hidden;
}

.dsm_image_carousel_slideshow .dsm_image_carousel_item .dsm_image_carousel_slideshow_bg {
  position: relative;
  height: 450px;
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border-style: solid;
  transition: 0.2s all ease-in-out;
}

.dsm_image_carousel_slideshow .dsm_image_carousel_item .dsm_image_carousel_slideshow_bg[data-dsm-lazy-bg] {
  background-color: rgba(0, 0, 0, 0.04);
}

/* Slideshow image overlay: above background image, below title (title follows in DOM). */
.dsm_image_carousel_slideshow .dsm_image_carousel_item .dsm_image_carousel_slideshow_bg .dsm_image_carousel_slideshow_overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  pointer-events: none;
  border-radius: inherit;
}

/*
 * Carousel: tint/gradient overlay on each slide (`dsm_image_carousel_carousel_media`).
 * Wrapper must collapse to the raster height: module-level `a { display: inline-block }`
 * leaves a baseline gap under images, which makes `position:absolute; inset:0` overlays
 * extend past the image (dark strip at bottom). Force block/stacking + clip overflow.
 */
.dsm_image_carousel:not(.dsm_image_carousel_slideshow) .dsm_image_carousel_item .dsm_image_carousel_carousel_media {
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  line-height: 0;
  font-size: 0;
}

.dsm_image_carousel:not(.dsm_image_carousel_slideshow) .dsm_image_carousel_item .dsm_image_carousel_carousel_media > a {
  display: block;
  width: 100%;
  max-width: 100%;
  line-height: 0;
  box-sizing: border-box;
}

.dsm_image_carousel:not(.dsm_image_carousel_slideshow) .dsm_image_carousel_item .dsm_image_carousel_carousel_media > img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  position: relative;
  z-index: 0;
  box-sizing: border-box;
}

/* Lightbox/custom link: image inside anchor (beats loose `.swiper-slide img { width: auto }`). */
.dsm_image_carousel:not(.dsm_image_carousel_slideshow) .dsm_image_carousel_item .dsm_image_carousel_carousel_media a img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  box-sizing: border-box;
}

.dsm_image_carousel:not(.dsm_image_carousel_slideshow) .dsm_image_carousel_item .dsm_image_carousel_carousel_media .dsm_image_carousel_slideshow_overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  width: auto;
  height: auto;
  box-sizing: border-box;
  pointer-events: none;
  min-height: 0;
}

.dsm_image_carousel_slideshow .dsm_image_carousel_item .dsm_image_carousel_slideshow_bg .dsm_image_carousel_slide_title_overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  box-sizing: border-box;
  pointer-events: none;
}

/* Title span: box model for background, padding, border-radius, and shadow. */
.dsm_image_carousel_slideshow .dsm_image_carousel_slide_title {
  display: inline-block;
  max-width: 100%;
  box-sizing: border-box;
  word-break: break-word;
}

.dsm_image_carousel_slideshow .dsm_image_carousel_slideshow_content {
  display: flex;
  flex-direction: column;
  align-items: inherit;
  justify-content: flex-start;
  max-width: 100%;
  box-sizing: border-box;
}

.dsm_image_carousel_slideshow .dsm_image_carousel_slide_description {
  display: inline-block;
  max-width: 100%;
  box-sizing: border-box;
  word-break: break-word;
  margin-top: 0.35em;
}

.dsm_image_carousel_slideshow .dsm_image_carousel_item a.dsm_ic_slideshow_link_title {
  position: relative;
  display: block;
  width: 100%;
}

.dsm_image_carousel_slideshow .dsm_image_carousel_item a.dsm_ic_slideshow_link_title img {
  width: 100%;
  display: block;
}

.dsm_image_carousel_slideshow .dsm_image_carousel_item a.dsm_ic_slideshow_link_title .dsm_image_carousel_slide_title_overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  box-sizing: border-box;
  pointer-events: none;
}

/*
 * Slideshow slide title: avoid the next slide’s title appearing before the
 * entrance animation runs (slideChangeTransitionEnd adds Animate.css classes).
 * Only when Animation In is not "none" (out-only keeps titles always visible).
 *
 * - Non-active slides: title never peeks through during cross-fade.
 * - Active slide: hide until `.animated` is applied (in or out animation).
 */
.dsm_image_carousel_container.dsm_image_carousel_slideshow[data-slideshow-show-slide-title=true][data-slideshow-title-animation]:not([data-slideshow-title-animation=none]) .swiper-slide:not(.swiper-slide-active) .dsm_image_carousel_slide_title {
  opacity: 0;
  visibility: hidden;
}
.dsm_image_carousel_container.dsm_image_carousel_slideshow[data-slideshow-show-slide-title=true][data-slideshow-title-animation]:not([data-slideshow-title-animation=none]) .swiper-slide-active .dsm_image_carousel_slide_title:not(.animated) {
  opacity: 0;
  visibility: hidden;
}

.dsm_image_carousel_container.dsm_image_carousel_slideshow[data-slideshow-show-slide-description=true][data-slideshow-description-animation]:not([data-slideshow-description-animation=none]) .swiper-slide:not(.swiper-slide-active) .dsm_image_carousel_slide_description {
  opacity: 0;
  visibility: hidden;
}
.dsm_image_carousel_container.dsm_image_carousel_slideshow[data-slideshow-show-slide-description=true][data-slideshow-description-animation]:not([data-slideshow-description-animation=none]) .swiper-slide-active .dsm_image_carousel_slide_description:not(.animated) {
  opacity: 0;
  visibility: hidden;
}

.dsm_image_carousel_container.dsm_image_carousel_slideshow[data-slideshow-wrapper-animation-in]:not([data-slideshow-wrapper-animation-in=none]) .swiper-slide:not(.swiper-slide-active) .dsm_image_carousel_slideshow_content {
  opacity: 0;
  visibility: hidden;
}
.dsm_image_carousel_container.dsm_image_carousel_slideshow[data-slideshow-wrapper-animation-in]:not([data-slideshow-wrapper-animation-in=none]) .swiper-slide-active .dsm_image_carousel_slideshow_content:not(.animated) {
  opacity: 0;
  visibility: hidden;
}

.dsm_image_gallery_thumbs {
  box-sizing: border-box;
  padding-top: 10px !important;
}

.dsm_ic_slideshow_thumbs_absolute {
  padding-top: 0 !important;
}

.dsm_image_gallery_thumbs .swiper-slide {
  cursor: pointer;
  height: 100%;
  opacity: 0.4;
}

.dsm_image_gallery_thumbs .swiper-slide-thumb-active {
  opacity: 1;
}

.dsm_image_gallery_thumbs .dsm_image_carousel_thumbs_image {
  border-style: solid;
  transition: 0.2s all ease-in-out;
}

@media only screen and (max-width: 768px) {
  .dsm_image_carousel.dsm_image_carousel_horizontal.dsm_image_carousel_arrow_outside {
    --swiper-navigation-sides-offset: -36px;
  }
  .dsm_image_carousel.dsm_image_carousel_horizontal.dsm_image_carousel_arrow_outside.dsm_image_carousel_arrow_mobile_inside {
    --swiper-navigation-sides-offset: 0px;
  }
  .dsm_image_carousel .swiper-button-prev:before,
  .dsm_image_carousel .swiper-container-rtl .swiper-button-next:before,
  .dsm_image_carousel .swiper-button-next:before,
  .swiper-container-rtl .swiper-button-prev:before {
    font-size: 36px;
  }
  .dsm_image_carousel .swiper-button-prev,
  .dsm_image_carousel .swiper-button-next {
    height: 36px;
    width: 36px;
  }
  .dsm_image_carousel {
    --swiper-navigation-size: 36px;
  }
}
.dsm_image_carousel .swiper-wrapper {
  align-items: center;
}

.dsm_image_carousel .swiper-button-prev,
.dsm_image_carousel .swiper-button-next {
  font-size: 40px;
  color: #666;
}

.dsm_image_carousel.dsm_image_carousel_vertical .swiper-pagination {
  top: 50%;
}

.dsm_image_carousel .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: rgba(0, 0, 0, 0.75);
}

.dsm_image_carousel .swiper-pagination-bullet {
  background-color: rgba(0, 0, 0, 0.2);
}

.dsm_image_carousel.dsm_image_carousel_vertical .swiper-button-prev,
.dsm_image_carousel.dsm_image_carousel_vertical .swiper-button-next {
  left: 50%;
}