.dialog-backdrop [role=dialog] {
  box-sizing: border-box;
  /* padding: 15px; */
  padding-left: 0px !important;
  padding-right: 0px !important;
  padding-top: 24px;
  border: none;
  background-color: transparent;
  min-height: 100vh;
  position: relative;
  height: 100%;
}

.swiper-button-next, .swiper-button-prev {
  align-items: center;
  color: var(--swiper-navigation-color, var(--swiper-theme-color));
  cursor: pointer;
  display: flex;
  height: var(--swiper-navigation-size);
  justify-content: center;
  margin-top: calc(0px - var(--swiper-navigation-size) / 2);
  position: absolute;
  top: 50%;
  width: calc(var(--swiper-navigation-size) / 44 * 27);
  z-index: 10;
}

.swiper-button-prev {
  background-color: var(--waterbowl);
  bottom: 0;
  color: transparent !important;
  -webkit-mask-image: url(/assets/icons/icon-chevron-left.svg);
  mask-image: url(/assets/icon-chevron-left.svg);
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  mask-size: cover;
  right: auto;
  top: auto !important;
}

.swiper {
  width: 90%;
  height: 90%;
}
.swiper-slide {
  flex-shrink: 0;
  width: 100%;
  height: 90%;
  position: relative;
  transition-property: transform;
  display: flex !important;
  justify-content: center !important;
  align-items: center;
  opacity: 0 !important;
}
.swiper-slide-visible {
  opacity: 1 !important;
}
.swiper-slide .asset-modal-image {
  width: fit-content;
  height: auto;
  object-fit: contain;
  max-height: 100%;
}
.swiper-button-next {
  right: 32%;
  color: transparent !important;
  top: auto !important;
  /* right: 44%; */
  left: auto;
  bottom: 0px;
  /* color: var(--waterbowl); */
  mask-image: url("../assets/icons/icon-chevron-right.svg");
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: cover;
  background-color: var(--waterbowl);
}
@media screen and (min-width: 768px) {
  .swiper-button-next {
    right: 42%;
  }
}
@media screen and (min-width: 1200px) {
  .swiper-button-next {
    right: 44%;
  }
}
.swiper-button-next.disabled {
  display: none;
}
.swiper-button-prev {
  left: 32%;
  color: transparent !important;
  top: auto !important;
  right: auto;
  bottom: 0px;
  mask-image: url("../assets/icons/icon-chevron-left.svg");
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: cover;
  background-color: var(--waterbowl);
}
@media screen and (min-width: 768px) {
  .swiper-button-prev {
    left: 42%;
  }
}
@media screen and (min-width: 1200px) {
  .swiper-button-prev {
    left: 44%;
  }
}
.swiper-button-prev.disabled {
  display: none;
}
.swiper-pagination {
  font-familty: var(--font-serif);
  color: var(--waterbowl);
}
.swiper-pagination.disabled {
  display: none;
}
.swiper-pagination-current {
  color: white !important;
}
.swiper-pagination-total {
  color: white !important;
}

.dialog {
  max-width: 100%;
}
.dialog-backdrop {
  background: rgba(0, 0, 0, 0.8);
  overflow-y: hidden;
  bottom: 0;
  display: none;
  left: 0;
  overflow-y: auto;
  position: fixed;
  right: 0;
  top: 0;
}
@media (max-width: 1999px) {
  .dialog-backdrop {
    background: rgba(0, 0, 0, 0.95);
  }
}
.dialog-backdrop.active {
  z-index: 90;
  display: block;
}
.dialog_form_actions {
  width: fit-content;
  height: auto;
  position: absolute;
  top: 12px;
  right: 8px;
  padding: 0 20px 20px;
}

.close-modal {
  width: 18px;
  height: 23px;
  mask-image: url("../assets/icons/icon-close-x.svg");
  mask-repeat: no-repeat;
  mask-position: left;
  background-color: var(--waterbowl) !important;
}
@media screen and (min-width: 1200px) {
  .close-modal {
    height: 33px;
    width: 28px;
  }
}

@media (max-width: 767px) {
  [role=dialog] {
    top: 0px !important;
  }
}

/*# sourceMappingURL=modal.css.map */