/*
 * Frontend overrides for JetEngine Divi Views.
 *
 * Put small manual CSS fixes here when you need them on the frontend
 * without touching bundled module styles.
 */

.jet-listing-dynamic-link .jet-listing-dynamic-link__icon.is-svg-icon svg {
  height: auto !important;
}

/*
 * JetEngine's legacy slider trigger uses a Font Awesome glyph. If icon
 * rendering returns an empty string, draw a font-independent fallback.
 */
.jet-listing-dynamic-field__content .jet-engine-gallery-slider__item-wrap.is-lightbox:not(:has(> .jet-engine-lightbox-icon))::before,
.jet-listing-dynamic-field__inline-wrap .jet-engine-gallery-slider__item-wrap.is-lightbox:not(:has(> .jet-engine-lightbox-icon))::before {
  display: block !important;
  box-sizing: border-box;
  content: "+" !important;
  width: 36px;
  height: 36px;
  margin: -18px 0 0 -18px;
  border: 3px solid currentColor;
  border-radius: 50%;
  font-family: Arial, sans-serif !important;
  font-size: 25px !important;
  font-weight: 700;
  line-height: 28px !important;
}

.jet-listing-dynamic-field__content .jet-engine-gallery-slider__item-wrap.is-lightbox:has(> .jet-engine-lightbox-icon)::before,
.jet-listing-dynamic-field__inline-wrap .jet-engine-gallery-slider__item-wrap.is-lightbox:has(> .jet-engine-lightbox-icon)::before {
  display: none !important;
  content: none !important;
}

.jet-listing-dynamic-field__content .jet-engine-gallery-slider__item-wrap .jet-engine-lightbox-icon,
.jet-listing-dynamic-field__inline-wrap .jet-engine-gallery-slider__item-wrap .jet-engine-lightbox-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(36px, calc(100% - 16px));
  height: min(36px, calc(100% - 16px));
  max-width: calc(100% - 16px);
  max-height: calc(100% - 16px);
  font-size: min(36px, calc(100% - 16px));
  line-height: 1;
  pointer-events: none;
  z-index: 100;
}

.jet-listing-dynamic-field__content .jet-engine-gallery-slider__item-wrap .jet-engine-lightbox-icon svg,
.jet-listing-dynamic-field__content .jet-engine-gallery-slider__item-wrap .jet-engine-lightbox-icon i,
.jet-listing-dynamic-field__inline-wrap .jet-engine-gallery-slider__item-wrap .jet-engine-lightbox-icon svg,
.jet-listing-dynamic-field__inline-wrap .jet-engine-gallery-slider__item-wrap .jet-engine-lightbox-icon i {
  width: 100% !important;
  height: 100% !important;
  font-size: 1em !important;
  line-height: 1 !important;
}
