Using Carousel inside Product template

Hi everyone, I’m kind of new to Shopify and i’m trying to add the carousel code inside the product template through a snippet. The problem is that the carousel doesn’t show the images even if the href is correct. I’m missing the cause of this behaviour. Can somebody help? I will attach the screen of the website and the code of the carousel. Thanks in advance.

{% liquid
  assign slides = product.media
  assign settings = section.settings

  if slides.size < 3
    assign slides = slides | concat: slides
  endif
%}

<section
  class="carousel"
  data-section-id="{{ section.id }}"
  data-section-type="carousel"
  style="
    --height-carousel: 600px;
    --height-carousel-mobile: {{ settings.height_mobile }}vh;
  "
>
  <div class="carousel__slides" data-js-slider>
    {% for media in slides %}
      <div class="carousel__slide" data-js-slide data-index="{{ forloop.index0 }}" {{ media.shopify_attributes }}>
        <div class="carousel__slide-content {% if forloop.first %}carousel__slide-content--first{% endif %} borders">
          {% render 'media' with
              media: media, 
              featured_media: featured_media, 
              loop_video: enable_video_looping, 
              setLoadingAttribute: true,
              prioritizeLoading: prioritizeLoading,
              sizes: sizes
             %}

            {% render 'block-overlay' with
              block: slide,

              meta: slide.settings.meta,
              heading: slide.settings.title,
              subheading: slide.settings.subheading,
              link: slide.settings.link,
              link_text: slide.settings.link_text,

              alignment: slide.settings.alignment,
              max_width_content: slide.settings.max_width_subheading,

              opacity: slide.settings.opacity_overlay,
              color_background: settings.color_overlay,
              color_background_button: settings.color_background_button,
              color_heading: settings.color_heading,
              color_subheading: settings.color_subheading,
              color_text_button: settings.color_text_button
            %}
        </div>
      </div>
    {% else %}
      {% for i in (1..4) %}
        <div class="carousel__slide" data-js-slide data-index="{{ forloop.index0 }}" {{ slide.shopify_attributes }}>
          <div class="carousel__slide-content carousel__slide-content--placeholder {% if forloop.first %}carousel__slide-content--first{% endif %} borders">
            <div class="placeholder-image">
              {{ 'image' | placeholder_svg_tag: 'placeholder-svg' }}
            </div>
          </div>
        </div>
      {% endfor %}
    {% endfor %}

    {% render 'carousel-pagination' %}
  </div>
</section>