.mol-section-slider {
    h2.atm-heading {
        @apply text-secondary-col-1 mb-2;
    }

    .atm-paragraph {
        @apply mb-6;
    }

    .cards-grid {
        @apply grid gap-6;

        &:has(:nth-child(2)) {
            @apply grid-cols-2;
        }

        &:has(:nth-child(3)) {
            @apply grid-cols-3;
        }

        &:has(:nth-child(4)) {
            @apply grid-cols-4;
        }
        /* 
        &.has-2-items {
            @media (max-width: 767px) {
                &.swiper-container {
                    display: block !important;
                    grid-template-columns: none !important;
                }
            }
        }

        &.has-3-items,
        &.has-4-items {
            @media (max-width: 1279px) {
                &.swiper-container {
                    display: block !important;
                    grid-template-columns: none !important;
                }
            }
        } */

        .card-item {
            @apply w-full;
        }

        &.swiper-container {
            @apply block overflow-visible;

            .swiper-wrapper {
                @apply flex;
            }

            .swiper-slide {
                @apply h-auto w-full;

                @media (min-width: 1280px) {
                    @apply h-auto w-full !important;
                }
            }
        }
    }

    .pagination {
        @apply flex justify-center items-center mt-8;

        * {
            @apply transition;
        }
    }

    .swiper-pagination {
        @apply relative w-auto mx-8;

        &-bullet {
            @apply bg-secondary-col-2 bg-opacity-50 rounded-full transition-all duration-300 p-1 mx-1 cursor-pointer;

            &-active {
                @apply bg-opacity-100 w-4;
            }
        }
    }

    @media (min-width: 1280px) {
        .cards-grid.swiper-container {
            @apply grid;

            &.has-2-items {
                @apply grid-cols-2;
            }

            &.has-3-items {
                @apply grid-cols-3;
            }

            .swiper-wrapper {
                @apply contents;
            }
        }

        .pagination {
            @apply hidden;
        }
    }
}