.cdb-banners-wrapper {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.cdbSwiperBanners img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}


/* Evitar clics en el editor */
.is-positioned-editor .cdb-banners-wrapper a {
    pointer-events: none;
}



.is-positioned-editor .cdb-banners-wrapper,
.is-positioned-editor .cdb-banners-wrapper,
.wp-block-cdb-banners-wrapper .swiper-slide * {
    pointer-events: none;
    cursor: default;
}

/* --- Personalización de Swiper a Verde --- */

/* Flechas de Navegación */
.cdb-banners-wrapper .swiper-button-next,
.cdb-banners-wrapper .swiper-button-prev {
    color: #46b450 !important; /* El verde de WordPress o el que prefieras */
    transition: transform 0.2s ease;
}

/* Reducimos el tamaño del icono interno de Swiper */
.cdb-banners-wrapper .swiper-button-next::after,
.cdb-banners-wrapper .swiper-button-prev::after {
    font-size: 18px !important; /* Flechas mucho más pequeñas */
    font-weight: bold;
}

.cdb-banners-wrapper .swiper-button-next:hover,
.cdb-banners-wrapper .swiper-button-prev:hover {
    transform: scale(1.15);
}

/* Puntos de Pagina (Bullets) */
.cdb-banners-wrapper .swiper-pagination-bullet {
    background: #46b450 !important;
    opacity: 0.4;
}

.cdb-banners-wrapper .swiper-pagination-bullet-active {
    background: #46b450 !important;
    opacity: 1;
    width: 20px; /* Opcional: hace el punto activo más largo para que destaque */
    border-radius: 5px;
    transition: width 0.3s ease;
}

/* Ajuste del Ratio 11:1 (aprox) para que no se deformen los banners */
.cdbSwiperBanners .swiper-slide img {
    width: 100%;
    height: auto;
    aspect-ratio: 1388 / 126; 
    object-fit: cover;
}

@media (max-width:768px){
    .cdbSwiperBanners .swiper-pagination{
        display:none;
    }
}