/*!*********************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** 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/card-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). Ensure clipping so slides do not
 * extend past the module on the frontend.
 */
.dsm_card_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.
 * Use data-effect (mirrors PHP / edit.js) + legacy cube class when present.
 */
@-moz-document url-prefix() {
  .dsm_card_carousel .swiper-container:not(.swiper-container-cube):not(.swiper-cube) .swiper-wrapper {
    transform-style: flat !important;
  }
  .dsm_card_carousel .swiper-container.dsm_card_carousel_container[data-effect=coverflow] .swiper-wrapper,
  .dsm_card_carousel .swiper-container.dsm_card_carousel_container[data-effect=flip] .swiper-wrapper,
  .dsm_card_carousel .swiper-container.dsm_card_carousel_container[data-effect=cube] .swiper-wrapper {
    transform-style: preserve-3d !important;
  }
}
/*
 * D4 CardCarousel.php: prev/next outside offset = -(arrow_size + 20) px — same as hit area
 * (arrowNextPrevWidthHeightCss). Swiper bundle expects these names for nav placement.
 * Sides offset is derived from size so changing arrow size keeps outside alignment.
 */
.dsm_card_carousel {
  margin-bottom: 60px;
  /* Fallback before inline var (default arrow 40px → touch 60px). */
  --swiper-navigation-size: 60px;
}

/* Custom arrow position sets this var from module styles; do not override with calc(). */
.dsm_card_carousel.dsm_card_carousel_slider_horizontal.dsm_card_carousel_arrow_outside:not(.dsm_card_carousel_use_arrow_custom_position) {
  --swiper-navigation-sides-offset: calc(-1 * var(--swiper-navigation-size));
}

.dsm_card_carousel.dsm_card_carousel_slider_horizontal.dsm_card_carousel_arrow_inside {
  --swiper-navigation-sides-offset: 0px;
}

.dsm_card_carousel .dsm_card_carousel_arrow {
  border-style: solid;
}

.dsm_card_carousel .et_pb_button {
  display: inline-block;
}

.swiper-flip .dsm_card_carousel_child.swiper-slide {
  backface-visibility: hidden;
}

.dsm_card_carousel_slider_vertical.et_pb_module .dsm_card_carousel_arrow {
  width: 40px !important;
  height: 40px !important;
  transform: rotate(90deg);
}

/*
 * Vertical prev/next use top/bottom (not --swiper-navigation-sides-offset).
 * Do not use !important here — module CommonStyle must control
 * top_navi_ver_position / bottom_navi_ver_position (matches dsm/image-carousel).
 */
.dsm_card_carousel_arrow_inside.dsm_card_carousel_slider_vertical .swiper-button-prev {
  top: 0px;
  margin-top: 0px;
}

.dsm_card_carousel_arrow_inside.dsm_card_carousel_slider_vertical .swiper-button-next {
  bottom: 0%;
  top: auto;
}

.dsm_card_carousel_arrow_outside.dsm_card_carousel_slider_vertical .swiper-button-prev {
  top: -45px;
}

.dsm_card_carousel_arrow_outside.dsm_card_carousel_slider_vertical .swiper-button-next {
  bottom: -45px;
  top: auto;
}

.dsm_card_carousel .swiper-button-prev,
.dsm_card_carousel .swiper-button-next {
  background-image: none;
  background-size: initial;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: calc(-0.5 * var(--swiper-navigation-size, 60px));
  position: absolute;
  top: 50%;
  cursor: pointer;
  z-index: 1;
  /* Default arrow color/size on the button so ::before inherits (matches dsm/image-carousel; module arrow_color targets these selectors). */
  color: #666666;
  font-size: 40px;
}

/* Swiper adds .swiper-button-disabled when loop is off; match bundle default so our cursor/color rules do not hide the disabled state. */
.dsm_card_carousel .swiper-button-prev.swiper-button-disabled,
.dsm_card_carousel .swiper-button-next.swiper-button-disabled {
  cursor: not-allowed;
  opacity: 0.35;
  pointer-events: none;
}

/*
 * Swiper 12+ default navigation uses ::after + optional SVG children. We render ET/Divi
 * icons on ::before (same pattern as dsm/image-carousel) so arrows are not doubled.
 */
.dsm_card_carousel .swiper-button-prev::after,
.dsm_card_carousel .swiper-button-next::after {
  display: none;
}

.dsm_card_carousel .swiper-button-prev .swiper-navigation-icon,
.dsm_card_carousel .swiper-button-next .swiper-navigation-icon,
.dsm_card_carousel .swiper-button-prev svg,
.dsm_card_carousel .swiper-button-next svg {
  display: none;
}

/* Horizontal: vertical slider uses top/bottom rules above, not these insets. */
.dsm_card_carousel.dsm_card_carousel_slider_horizontal.dsm_card_carousel_arrow_outside .swiper-button-prev {
  left: var(--swiper-navigation-sides-offset);
}

.dsm_card_carousel.dsm_card_carousel_slider_horizontal.dsm_card_carousel_arrow_outside .swiper-button-next {
  right: var(--swiper-navigation-sides-offset);
}

.dsm_card_carousel.dsm_card_carousel_slider_horizontal.dsm_card_carousel_arrow_inside .swiper-button-prev {
  left: var(--swiper-navigation-sides-offset) !important;
}

.dsm_card_carousel.dsm_card_carousel_slider_horizontal.dsm_card_carousel_arrow_inside .swiper-button-next {
  right: var(--swiper-navigation-sides-offset) !important;
}

.dsm_card_carousel img.swiper-lazy {
  opacity: 1;
}

/*equal height*/
.dsm_card_carousel_equal_height .dsm_card_carousel_wrapper .dsm_card_carousel_child:not(.dsm_card_carousel_child_vb_outer_wrapper),
.dsm_card_carousel_equal_height .dsm_card_carousel_wrapper .swiper-slide:not(.dsm_card_carousel_child_vb_outer_wrapper),
.et_pb_equal_columns .dsm_card_carousel_wrapper .dsm_card_carousel_child:not(.dsm_card_carousel_child_vb_outer_wrapper),
.et_pb_equal_columns .dsm_card_carousel_wrapper .swiper-slide:not(.dsm_card_carousel_child_vb_outer_wrapper) {
  height: auto !important;
}

.dsm_card_carousel_equal_height .swiper-slide > div:first-of-type,
.dsm_card_carousel_equal_height .dsm_card_carousel_child_vb_outer_wrapper,
.dsm_card_carousel_equal_height .dsm_card_carousel_child_vb_outer_wrapper > div:first-of-type,
.et_pb_equal_columns .dsm_card_carousel_child_vb_outer_wrapper,
.et_pb_equal_columns .dsm_card_carousel_child_vb_outer_wrapper > div:first-of-type {
  height: 100%;
}

.dsm-card-button-alignment .dsm_card_carousel_child > div {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.dsm-card-button-alignment .dsm_card_wrapper {
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* D4 uses .et_pb_button_wrapper; D5 PHP/VB use .et_pb_button_module_wrapper */
.dsm-card-button-alignment-bottom .et_pb_button_module_wrapper,
.dsm-card-button-alignment-bottom .et_pb_button_wrapper {
  margin-top: auto !important;
}

.dsm-card-button-alignment-top .et_pb_button_module_wrapper,
.dsm-card-button-alignment-top .et_pb_button_wrapper {
  margin-bottom: auto;
}

.dsm-card-button-alignment-center .et_pb_button_module_wrapper,
.dsm-card-button-alignment-center .et_pb_button_wrapper {
  margin-bottom: auto;
  margin-top: auto !important;
}

.dsm_card_carousel_badge_hover .dsm_card_carousel_child .dsm_card_carousel_child_badge_text {
  opacity: 0;
}

.dsm_card_carousel_badge_hover .dsm_card_carousel_child:hover .dsm_card_carousel_child_badge_text {
  opacity: 1;
}

/*
 * Design → Card border/radius: styles target the slide root (see module.json `card`).
 * Clip children here — clipping on .et_pb_module_inner alone often fails when that
 * inner is a flex item (min-height:auto) or with image zoom transforms; the slide
 * root establishes a reliable overflow + radius box.
 */
.dsm_card_carousel .swiper-slide.dsm_card_carousel_child {
  overflow: hidden;
}

/* Flex children need min-height:0 for overflow clipping inside the slide */
.dsm_card_carousel .swiper-slide.dsm_card_carousel_child .et_pb_module_inner {
  min-height: 0;
}

/*layout*/
.dsm_card_carousel_layout_inline .dsm_card_carousel_child,
.dsm_card_carousel_layout_inline .dsm_card_carousel_child .et_pb_module_inner {
  display: flex;
  align-items: center;
  width: 100%;
}

.dsm-card-button-alignment.dsm_card_carousel_layout_inline .dsm_card_carousel_child > div {
  flex-direction: initial;
}

.dsm-card-button-alignment.dsm_card_carousel_layout_inline .dsm_card_wrapper {
  height: 100%;
}

.dsm_card_carousel_layout_inline .dsm_card_carousel_child_image_wrapper {
  order: 0;
  flex: 0 0 50%;
  overflow: hidden;
}

.dsm_card_carousel_child_image_wrapper .dsm_card_carousel_child_image_background {
  overflow: hidden;
  background-position: center;
  background-repeat: no-repeat;
}

/*pagination*/
.dsm_card_carousel .swiper-container-horizontal .swiper-pagination-bullets,
.dsm_card_carousel .swiper-pagination-custom,
.dsm_card_carousel .swiper-pagination-fraction {
  bottom: 10px;
  left: 0;
  width: 100%;
}

.dsm_card_carousel.dsm_card_carousel_slider_horizontal .swiper-pagination-bullets {
  bottom: -30px;
  left: 0;
  width: 100%;
  opacity: 1 !important;
}

.dsm_card_carousel .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
}

.dsm_card_carousel_pagination_outside .dsm_card_carousel_container {
  padding-bottom: 30px;
}

.dsm_card_carousel_pagination_outside .swiper-container-horizontal .swiper-pagination-bullets,
.dsm_card_carousel_pagination_outside .swiper-pagination-custom,
.dsm_card_carousel_pagination_outside .swiper-pagination-fraction {
  bottom: 0;
}

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

.dsm_card_carousel_slider_vertical.dsm_pagi_placement_left .dsm_card_carousel_pagination {
  display: flex;
  flex-direction: column;
  gap: 8px;
  right: auto;
  width: auto !important;
}

.dsm_card_carousel_slider_vertical.dsm_pagi_placement_right .dsm_card_carousel_pagination {
  display: flex;
  flex-direction: column;
  gap: 8px;
  left: auto;
  width: auto !important;
}

/*lightbox*/
.dsm-image-lightbox,
.dsm-video-lightbox,
.dsm-card-image-lightbox,
.dsm-card-video-lightbox {
  cursor: pointer;
}

/*Badge*/
.dsm_card_carousel_badge_hover .dsm_card_carousel_child .dsm_card_carousel_child_badge_text {
  opacity: 0;
  transition: opacity 300ms;
}

.dsm_card_carousel_badge_hover .dsm_card_carousel_child:hover .dsm_card_carousel_child_badge_text {
  opacity: 1;
}

@media only screen and (max-width: 980px) {
  .dsm_card_carousel_layout_tablet_stacked .dsm_card_carousel_child > div:first-of-type {
    display: initial;
  }
  .dsm_card_carousel_layout_tablet_inline .dsm_card_carousel_child > div:first-of-type {
    display: flex;
  }
  .dsm_card_carousel_layout_tablet_inline .dsm_card_carousel_child_image_wrapper {
    order: 0;
    flex: 0 0 50%;
  }
}
@media only screen and (max-width: 767px) {
  .dsm_card_carousel_layout_phone_stacked .dsm_card_carousel_child > div:first-of-type {
    display: initial;
  }
  .dsm_card_carousel_layout_phone_inline .dsm_card_carousel_child > div:first-of-type {
    display: flex;
  }
  .dsm_card_carousel_layout_phone_inline .dsm_card_carousel_child_image_wrapper {
    order: 0;
    flex: 0 0 50%;
  }
  .dsm_card_carousel.dsm_card_carousel_slider_horizontal.dsm_card_carousel_arrow_outside.dsm_card_carousel_arrow_mobile_inside {
    --swiper-navigation-sides-offset: 0px;
  }
  .dsm_card_carousel .swiper-button-prev,
  .dsm_card_carousel .swiper-button-next {
    font-size: 36px;
  }
}
.dsm_card_carousel .dsm_card_carousel_pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: rgba(0, 0, 0, 0.75);
}

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

.dsm_card_carousel.dsm_card_carousel_slider_vertical.dsm_pagi_placement_right .swiper-pagination-bullets {
  right: -30px;
}

.dsm_card_carousel.dsm_card_carousel_slider_vertical.dsm_pagi_placement_left .swiper-pagination-bullets {
  left: -30px;
}

.dsm_card_carousel.dsm_card_carousel_slider_horizontal .dsm_card_carousel_pagination.swiper-pagination-bullets {
  bottom: -30px;
}

.dsm_card_carousel.dsm_card_carousel_slider_vertical .swiper-pagination-bullets {
  top: 50%;
}

.dsm_card_carousel .dsm_card_carousel_child_img,
.dsm_card_carousel .dsm_card_carousel_child_image_wrapper img {
  max-width: 100%;
}

.dsm_card_carousel .dsm_card_carousel_child_image_wrapper {
  display: flex;
  justify-content: center;
}

/******** Arrow Style CSS (ETmodules on ::before; ::after hidden above) *************/
.dsm_card_carousel .swiper-button-prev::before {
  font-family: ETmodules !important;
  font-weight: 400;
  content: "4";
}

.dsm_card_carousel .swiper-button-next::before {
  font-family: ETmodules !important;
  font-weight: 400;
  content: "5";
}

.swiper-container.dsm_card_carousel_wrapper {
  overflow: hidden;
}