/* ===== Elementor Lightbox — Adriana style (FINAL) ===== */
/* NOTE: background is set via the widget's Style → Lightbox → Color panel, NOT here */

/* Dark square tiles behind close + arrows */
.elementor-lightbox a.dialog-lightbox-close-button,
.elementor-lightbox .elementor-swiper-button {
    background-color: #111 !important;
    width: 56px !important;
    height: 56px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 1 !important;
}
.elementor-lightbox a.dialog-lightbox-close-button {
    top: 24px !important;
    right: 24px !important;
}
.elementor-lightbox .elementor-swiper-button-prev { left: 24px !important; right: auto !important; }
.elementor-lightbox .elementor-swiper-button-next { right: 24px !important; left: auto !important; }
.elementor-lightbox a.dialog-lightbox-close-button i,
.elementor-lightbox a.dialog-lightbox-close-button svg,
.elementor-lightbox .elementor-swiper-button i,
.elementor-lightbox .elementor-swiper-button svg {
    color: #fff !important;
    fill: #fff !important;
}

/* Hide zoom / share / fullscreen for the minimal look */
.elementor-lightbox .elementor-slideshow__header .elementor-slideshow__icon-zoom-in,
.elementor-lightbox .elementor-slideshow__header .elementor-slideshow__icon-share,
.elementor-lightbox .elementor-slideshow__header .elementor-slideshow__icon-expand {
    display: none !important;
}

/* Caption — pin to bottom-left of the whole screen */
.elementor-lightbox .elementor-slideshow__footer,
.elementor-lightbox .dialog-widget-content .elementor-slideshow__footer,
.elementor-lightbox footer.elementor-slideshow__footer {
    position: fixed !important;
    bottom: 40px !important;
    left: 40px !important;
    top: auto !important;
    right: auto !important;
    width: auto !important;
    max-width: 340px !important;
    display: block !important;
    text-align: left !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    z-index: 999999 !important;
    transform: none !important;
}
.elementor-lightbox .elementor-slideshow__title,
.elementor-lightbox .elementor-slideshow__description {
    color: #1a1a1a !important;
    font-size: 14px !important;
    text-align: left !important;
    line-height: 1.5 !important;
    display: block !important;
}
.elementor-lightbox .elementor-slideshow__title {
    font-weight: 600 !important;
    margin-bottom: 6px !important;
}
.elementor-lightbox .elementor-slideshow__description {
    color: #444 !important;
    font-weight: 400 !important;
}

/* Mobile */
@media (max-width: 767px) {
    .elementor-lightbox a.dialog-lightbox-close-button,
    .elementor-lightbox .elementor-swiper-button {
        width: 44px !important;
        height: 44px !important;
    }
    .elementor-lightbox .elementor-slideshow__footer {
        left: 20px !important;
        right: 20px !important;
        bottom: 20px !important;
        max-width: none !important;
    }
}
/* Keep caption visible even when Elementor auto-hides the UI */
.elementor-lightbox .elementor-slideshow--ui-hidden .elementor-slideshow__footer,
.elementor-lightbox .elementor-slideshow__footer {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}
/* Show 3 full slides + a peek of the 4th */
.elementor-widget-media-carousel .swiper-slide {
    width: 20% !important;   /* 3 slides ≈ 90%, leaving ~10% for the 4th to peek */
}
/* Gap between carousel slides */
.elementor-widget-media-carousel .swiper-slide {
    width: 31% !important;
    margin-right: 15px !important;
}

/* Make the track show the peek by not clipping tightly */
.elementor-widget-media-carousel .elementor-main-swiper,
.elementor-widget-media-carousel .swiper {
    overflow: visible !important;
}
.elementor-widget-media-carousel {
    overflow: hidden !important;
}
/* White lightbox background + kill the entrance animation that caused flashing */
.elementor-lightbox .dialog-message.animated {
    animation: none !important;
}
.elementor-lightbox,
.elementor-lightbox .dialog-widget-content,
.elementor-lightbox .dialog-message,
.elementor-lightbox .swiper,
.elementor-lightbox .swiper-slide,
.elementor-lightbox .swiper-zoom-container {
    background-color: #fff !important;
}