.boladito-carrusel {
    position: relative;
    width: 100%;
    height: auto;
    overflow: hidden; /* Ensure slides stay within container */
}

.boladito-carrusel-media {
    position: absolute;
    top: 0;
    left: 0;
    width: 19em;
    height: 100%;
    opacity: 0; /* Initially hide all slides */
    display: grid;
}

.boladito-carrusel-media.active {
    opacity: 1; /* Show active slide */
    transition: opacity 0.5s ease-in-out; /* Add smooth transition */
}