.cms-slider {
    .swiper-wrapper {
        align-items: stretch;

        .swiper-slide {
            height: unset;
        }
    }

    .swiper-pagination-bullet {
        width: 6px;
        height: 6px;
        margin: 0 !important;
        position: relative;
        overflow: hidden;
    }
}

.cms-slider-slider-container {
    position:  relative !important;
}

.cms-slider-autoplay-progress {
     .swiper-pagination-bullet-active {
        width: 40px;
        height: 6px;
        background: $dark-40;
        border-radius: 3px;
    }
}

.cms-slider-pagination {
    position: relative;
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    padding-top: 16px;
    top: unset !important;
    bottom: unset !important;
}

.cms-slider-pagination-progress {
    position: absolute;
    inset: 0;
    background: #1b1b1b;
    transform: scaleX(0);
    transform-origin: left;
    height: 6px;
}

.cms-slider-slider-container {
    .swiper-button-prev {
        left: -20px;
    }

    .swiper-button-next {
        right: -20px;
    }

    .swiper-button-prev, .swiper-button-next {
        display: flex;
        width: 40px;
        height: 40px;
        border: 0;
        background: rgba(255,255,255,0.6);   
        border: 1px solid #929292;    
        opacity: 0;
        z-index: 2;
        @extend %motion;
        &:after {
            content: '';
        }
        &:hover {
            background: #fff;
        }
    }   

    &:hover {
        .swiper-button-prev, .swiper-button-next {
            opacity: 1;
            cursor: pointer;
        }
    }
}