.x-slider .swiper-pagination {
        padding-bottom: 1.25rem;
    }

.x-slider .swiper-pagination .swiper-pagination-bullet {
            width: 0.8125rem;
            height: 0.25rem;
            background-color: rgba(255, 255, 255, 0.4);
            border-radius: 1.8125rem;
        }

.x-slider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
                background-color: #fff;
                width: 4.375rem;
            }

.x-slider .swiper-controls-wrapper {
        display: none;
    }

@media screen and (min-width: 64rem) {
        .x-slider .swiper-pagination {
            padding-bottom: 2.1875rem;
            bottom: 0;
        }
        .x-slider .swiper-controls-wrapper {
            position: absolute;
            right: 4.375rem;
            bottom: 2rem;
            z-index: 100;
            display: flex;
            align-items: center;
            gap: 0.625rem;
        }
            .x-slider .swiper-controls-wrapper .swiper-button {
                position: static;
                width: 2.5rem;
                height: 2.5rem;
                background-color: #fff;
                border-radius: 50%;
            }
                .x-slider .swiper-controls-wrapper .swiper-button svg {
                    height: auto;
                    width: 1.125rem;
                    color: var(--color-primary);
                }
            .x-slider .swiper-controls-wrapper .swiper-button-prev {
                transform: rotate(-180deg);
            }
        [dir="rtl"] .swiper-controls-wrapper {
            right: auto;
            left: 4.375rem;
        }

    [dir="rtl"] .swiper-button-prev .swiper-navigation-icon {
        transform: none;
    }

    [dir="rtl"] .swiper-button-next .swiper-navigation-icon {
        transform: rotate(180deg);
    }
}

@media screen and (min-width: 96rem) {
        .x-slider .swiper-controls-wrapper {
            right: 7.8125rem;
            bottom: 2.375rem;
        }
            .x-slider .swiper-controls-wrapper .swiper-button {
                width: 3.125rem;
                height: 3.125rem;
            }
        .x-slider .swiper-pagination {
            bottom: 0;
        }
        [dir="rtl"] .swiper-controls-wrapper {
            right: auto;
            left: 7.8125rem;
        }
}