Как в слайдере CR30N сделать полоски с автозаполнением вместо точек Tilda

<style>

.uc-slider-line .t-slds__bullet_active button.t-slds__bullet_body.fill-mode:after {
    transition: all var(--timing-slider) ease-in-out; 
    width: 100%;
}

.uc-slider-line .t-slds__bullet_wrapper {
    display: flex !important;
    box-sizing: border-box;
}
.uc-slider-line .t-slds__bullet {
    width: 100%;
    margin-left: 0px !important;
    margin-right: 0px !important;
}
.uc-slider-line .t-slds__bullet_body {
    height: 6px !important;
    width: inherit !important;
    border-radius: 0;
}  


.uc-slider-line .t-slds__bullet {
    position: relative;
}

.uc-slider-line button.t-slds__bullet_body:after {
    content: "";
    width: 0%;
    height: 100%;
    background: #fff;
    display: block;
}

.uc-slider-line  .t-slds__bullet_wrapper {
    bottom: 30px;
}

.uc-slider-line button.t-slds__bullet_body {
    border: none !important;
    background-color: rgb(255 255 255 / 15%) !important;
}

#allrecords .uc-slider-line  .t-slds__bullet_active .t-slds__bullet_body {
 background-color: rgb(255 255 255 / 15%) !important;
}

#allrecords .uc-slider-line  ul.t-slds__bullet_wrapper {
 padding-left: 30px !important;
 padding-right: 30px !important;
}

.uc-slider-line li.t-slds__bullet {
    padding: 10px 5px;
}    

.uc-slider-line ul.t-slds__bullet_wrapper {
    opacity: 1;
}

.uc-slider-line ul.t-slds__bullet_wrapper.show-mode {
    opacity: 1;
}

</style>


<script>
document.addEventListener("DOMContentLoaded", function() {
    //Добавляем класс к слайдеру
    document.querySelectorAll('.uc-slider-line button.t-slds__bullet_body').forEach((element) => element.classList.add('fill-mode'));
    //Получаем тайминг автослайдинга
    let timing = document.querySelector('.uc-slider-line .t-slds__items-wrapper').getAttribute('data-slider-timeout');
    //Добавляем тайминг в полоски
    document.body.style.setProperty("--timing-slider", timing+"ms");
    //Разрешаем автослайдинг при наведении
    document.querySelector('.t-slds__items-wrapper').addEventListener('mouseover', function() {
        setTimeout(function(){
            document.querySelector('.t-slds__items-wrapper').setAttribute('data-slider-stopped', '');
        }, 100); 
    });
});
</script>