/* 
 * Componentes Customizados
 */

/* Carrossel Nativo (Scroll Snap) - Substitui Owl Carousel */
.native-carousel {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    padding-bottom: 20px;
    position: relative;
    width: 100%;
    cursor: grab;
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

/* Hide scrollbar for Chrome, Safari and Opera */
.native-carousel::-webkit-scrollbar {
    display: none;
}

.native-carousel:active {
    cursor: grabbing;
}

.native-carousel-track {
    display: flex;
    gap: 15px;
    width: max-content;
}

.native-carousel .carousel-img {
    flex: 0 0 auto;
    width: 220px;
    height: 220px;
    object-fit: cover;
    border-radius: 6px;
    cursor: pointer;
    transition: transform 0.3s ease, filter 0.3s ease;
    -webkit-user-drag: none;
    user-drag: none;
    -webkit-user-select: none;
    user-select: none;
}

.native-carousel .carousel-img:hover {
    transform: scale(1.02);
    filter: brightness(1.05);
}

@media screen and (max-width: 768px) {
    .native-carousel .carousel-img {
        width: 220px;
        height: 220px;
    }
}