whenever i load the slider i made, the styling of var is only implemented on one slider & not others

function setupOurPacksAccomodationSingleSlider(singleSlider){

    let singleSliderWidth=singleSlider.clientWidth;
    
    const debounceResize=TrailedDebounce(()=>{
        singleSliderWidth=singleSlider.clientWidth
    },250)

    window.addEventListener('resize',debounceResize)
    
    const singleSliderItemsCountBeforePopulating=singleSlider.childElementCount;
    
    let cssItemToScroll=0;

    
    const singleSliderItemsCountAfterPopulating=populatingSingleSlideToWrapped(singleSlider)
    singleSlider.scrollTo({left:singleSliderWidth})

    cssRoot.style.setProperty('--animation-time',`${ANIMATION_TIME}ms`);
    cssRoot.style.setProperty('--animation-delay',`${ANIMATION_DELAY}ms`);

    let maxHeight=0;

    for(let i=0; i < singleSliderItemsCountAfterPopulating; i++){
        if(i===0 || singleSlider.children[i].firstElementChild.height < maxHeight){
            maxHeight=singleSlider.children[i].firstElementChild.height;
        }
    }
    
    singleSlider.style.setProperty('--item-slider-max-height',`${maxHeight}px`) // this