Next button on Carousel not working on Desktop, only works on mobile

Store Design
1

Hello, so I have a carousel in the cart looping through upsell products. I cannot get the next button to function on desktop, but it works as intended on mobile. Please advise, thanks in advance.

The logic

const gap = 350;

            const carousel = document.getElementById("upsell_carousel");
            const content = document.getElementById("upsell_content");
            const next = document.getElementById("upsell_next");
            const prev = document.getElementById("upsell_prev");

            next.addEventListener("click", e => {
              carousel.scroll(width + gap, 0);
                prev.style.display = "flex";
            });

            prev.addEventListener("click", e => {
              carousel.scrollBy(-(width + gap), 0);
              if (carousel.scrollLeft - width - gap <= 0) {
                prev.style.display = "none";
              }
              if (!content.scrollWidth - width - gap <= carousel.scrollLeft + width) {
                next.style.display = "flex";
              }
            });

            let width = carousel.offsetWidth;
            window.addEventListener("resize", e => (width = carousel.offsetWidth));

Styling

.upsell_container {
              height: 140px;
              background: #F9F9F9;
              border-top: 5px black solid;
              margin: 0 14px;
              padding: 5px 0;
              display: flex;
              flex-wrap: nowrap;
              flex-direction: row;
              justify-content: space-between;
              align-items: center;
              overflow: hidden;
            }

            img.upsell_product_img {
              width: 75px;
              height: 75px;
            }

            h3.upsell_product_title {
              font-size: 9px !important;
              width: 100px;
              margin: -5px auto -9px auto;
              padding: 0;
              line-height: 1.25em;
            }

            span.upsell_product_price {
              font-size: 10px !important;
              width: 100px;
              font-weight: 700;
              margin: auto;
              padding: 0 5px;
            }
            .upsell_button {
              width: 90% !important;
              min-height: 24px !important;
              padding: 0 !important;
              z-index: -1;
            }

            .upsell_button span.text {
              font-size: 20px !important;
              line-height: 22px;
              font-weight: 600;
            }
            .upsell_details_button {
              margin: 0;
            }
            .upsell_details {
              position: absolute;
              bottom: 46px;
              width: 26px;
              left: 4px;
            }
            .upsell_link {
            	display: block !important;
            }
            
            /* Carousel Styling */
            
            #upsell_carousel {
              overflow: hidden;
              scroll-behavior: smooth;
            }

            #upsell_carousel::-webkit-scrollbar {
              height: 0;
            }

            #upsell_prev,
            #upsell_next {
display: flex;
    justify-content: center;
    align-content: center;
    background: #eaeaea;
    border: none;
    border-radius: 50px !important;
    padding: 1px;
    border-radius: 2px;
    outline: 0;
    cursor: pointer;
    position: absolute;
    height: 40px;
    width: 40px;
            }

            #upsell_prev {
              top: 20%;
              left: 10px;
              transform: rotate(180deg);
              display: none;
            }

            #upsell_next {
              top: 20%;
              right: 10px;
            }
            svg#Layer_2,
            svg#Layer_1{
              fill: #969696;
            }
2

Welcome to the shopify community.

Please share your store URL and if your store is password protected then provide password also.

Thank you.