/* ============================================================
   CSL SLIDES - RESPONSIVE BANNER CAROUSEL
   ============================================================ */

.csl-slides-container {
    width: 100%;
    position: relative;
    overflow: hidden;
}

/* Swiper Base */
.csl-slides-swiper {
    width: 100%;
    position: relative;
}

/* Slide Item Wrapper */
.csl-slide-item {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    position: relative !important;
    width: 100% !important;
    overflow: hidden !important;
}

/* Inner Foreground/Main Image */
.csl-slide-main-img {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    position: relative !important;
    z-index: 2 !important;
    max-width: 100% !important;
}

.csl-slide-main-img.csl-img-absolute {
    position: absolute !important;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100% !important;
    height: 100% !important;
}

/* Link Overlay (Allows clicking anywhere on the slide) */
.csl-slide-link-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 5 !important;
    cursor: pointer !important;
    display: block !important;
}

/* ============================================================
   RESPONSIVENESS / DISPOSITIVES TOGGLE
   ============================================================ */

/* Mobile view by default */
.csl-slides-desktop {
    display: none !important;
}
.csl-slides-mobile {
    display: block !important;
}

/* Desktop view (wider screens) */
@media (min-width: 769px) {
    .csl-slides-desktop {
        display: block !important;
    }
    .csl-slides-mobile {
        display: none !important;
    }
}