.nm-banner-slider .slick-prev,
.nm-banner-slider .slick-next {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.nm-banner-slider .slick-prev .fas,
.nm-banner-slider .slick-next .fas {
    font-size: 18px;
    line-height: 1;
    pointer-events: none;
}

.nm-banner-slider.nm-has-dot-progress .slick-dots li {
    width: 24px;
    height: 24px;
    margin: 0 3px;
}

.nm-banner-slider.nm-has-dot-progress .slick-dots li.slick-active {
    margin: 0 3px;
}

.nm-banner-slider.nm-has-dot-progress .slick-dots li button {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    transform: translate(-50%, -50%);
}

.nm-banner-slider .nm-slick-dot-progress {
    display: none;
}

.nm-banner-slider.nm-has-dot-progress .nm-slick-dot-progress {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: block;
    width: 24px;
    height: 24px;
    pointer-events: none;
    transform: rotate(-90deg);
}

.nm-banner-slider.nm-has-dot-progress .nm-slick-dot-progress circle {
    fill: none;
    stroke: var(--main);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-dasharray: 56.55;
    stroke-dashoffset: 56.55;
}

.nm-banner-slider.nm-has-dot-progress .slick-dots li.nm-progress-running .nm-slick-dot-progress circle {
    animation: nm-slick-dot-progress var(--nm-dot-progress-duration, 5000ms) linear forwards;
}

@keyframes nm-slick-dot-progress {
    from { stroke-dashoffset: 56.55; }
    to { stroke-dashoffset: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .nm-banner-slider.nm-has-dot-progress .slick-dots li.nm-progress-running .nm-slick-dot-progress circle {
        animation: none;
        stroke-dashoffset: 0;
    }
}