:root {
    --swiper-navigation-size: 20px !important;
}
[x-cloak] {
    display: none !important;
}

/* Agrega estilos personalizados a la paginación */
.swiper-pagination-bullet {
    width: 8px;
    margin-right: 12.5px !important;
    margin-left: 12.5px !important;
}

.swiper-pagination {
    justify-content: center;
    position: static;
}

.gradient-azul-rosa {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, rgba(177, 218, 246, 0.5) 50%, rgba(237, 191, 197, 0.5) 100%);
    padding-right: 15px;
    padding-left: 15px;
}

.gradient-azul-amarillo {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, rgba(177, 218, 246, 0.5) 50%, rgba(253, 244, 177, 0.5) 100%);
    padding-right: 15px;
    padding-left: 15px;
}

.gradient-azul-azul {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, rgba(177, 218, 246, 0.5) 50%, rgba(60, 180, 229, 0.5) 100%);
    padding-right: 15px;
    padding-left: 15px;
}

.gradient-azul-verde {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.5) 0%, rgba(177, 218, 246, 0.5) 50%, rgba(174, 206, 193, 0.5) 100%);
    padding-right: 15px;
    padding-left: 15px;
}

.gradient-azul-naranja {
    background: rgb(255,255,255);
    background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(177,218,246,0.5) 50%, rgba(245,215,175,0.5) 100%);
    padding-right: 15px;
    padding-left: 15px;
}