/* Carousel container styling */
.clubland-shop-category-carousel {
    display: flex;
    justify-content: center;
    text-align: center;
    overflow: hidden; /* Prevents horizontal scrolling */
    width: 100%;
    padding: 5px 0;
}

html, body {
    overflow-x: hidden; /* Prevents horizontal scrolling on the page */
    max-width: 100%; /* Ensures the content does not extend beyond the viewport */
}

/* Individual category item styling */
.clubland-shop-category-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: var(--font-color);
    padding: 5px;
    transition: transform 0.3s ease-in-out;
    width: auto;
    height: auto;
    flex-shrink: 0;
    text-align: center;
}

/* Hover effect for category items */
.clubland-shop-category-item:hover {
    transform: scale(1.1);
}

/* Category image styling */
.clubland-shop-category-img {
    display: flex;
    justify-content: center;
    align-items: center;
    width: var(--circle-diameter);
    height: var(--circle-diameter);
    border-radius: 50%;
    background-size: cover; /* Ensures the image fills the entire circle */
    background-position: center;
    overflow: hidden;
    border: solid var(--border-size) var(--outline-color);
    background-repeat: no-repeat;
}

/* Reduce spacing between categories */
.swiper-slide.categories-swiper-slide {
    text-align: center;
    margin-right: 5px ; /* Ensure consistent spacing */
    scroll-snap-align: center;
}

/* Category title styling */
.clubland-shop-category-title {
    font-size: var(--font-size);
    font-weight: 700;
    margin-top: 10px;
    color: var(--font-color);
    text-align: center;
}


.clubland-shop-category-carousel .swiper-container.categories-swiper-container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;  
    margin: 0 auto; 
    width: fit-content; 
}


.clubland-shop-category-carousel .swiper-container {
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    width: fit-content;
    max-width: 100%; 
}

.clubland-shop-category-carousel .swiper-slide {
    flex-shrink: 0;
    width: auto !important; /* Allows natural sizing */
    max-width: 200px; /* Ensures a consistent size */
}


.clubland-shop-category-carousel .swiper-wrapper {
    display: flex;
    align-items: flex-start; /* Ensures slides align naturally */
    flex-direction: row;
    scroll-snap-align: start;
    touch-action: pan-y; /* Prevents horizontal scrolling but allows vertical scrolling */
    justify-content: flex-start !important; /* Ensures items align to the left */
}
