how to hide unselected variant images in this code

Question

i want to hide unselected variant images as thumbnail to hide in Shopify code.

I am using atlantic theme and this is the code of product gallery part.

please tell me solution for this if can.

 {% comment %}
 @param product {Product}
    The product object in question

  @param selected_media {Media}
    The current selected media in the gallery

  @param gallery_layout {String}
    The viewport layout and the relative position of the thumbnails

  @param show_media_borders {bool}
    Whether to show borders around media

  @param enable_image_zoom {bool}
    Whether to use image zoom
{% endcomment %}

<div
  class="
    product-gallery
    {% if show_media_borders %}product-gallery--media-borders{% endif %}
  "
  data-product-gallery
  data-product-gallery-layout="{{ gallery_layout }}"
  {% if enable_image_zoom %}data-product-gallery-image-zoom{% endif %}
>
  <div class="product-gallery--viewport
      {% if product.media.size > 1 %}product-gallery--viewport--has-navigation{% endif %}
    "
    data-product-gallery-viewport
  >
    {% assign models = product.media | where: 'media_type', 'model' %}
    {%- if models.size > 0 -%}
      <script>
        window.ShopifyXR=window.ShopifyXR||function(){(ShopifyXR.q=ShopifyXR.q||[]).push(arguments)}
        ShopifyXR('addModels', {{ models | json }});
      </script>
    {%- endif -%}
    {% assign first_model = models | first %}
    {% for media in product.media %}
      <figure
        class="product-gallery--viewport--figure"
        tabindex="-1"
        {% if selected_media.id != media.id %}
          aria-hidden="true"
        {% else %}
          aria-hidden="false"
        {% endif %}
        data-product-gallery-figure="{{ forloop.index0 }}"
        data-product-gallery-selected="{%- if selected_media.id == media.id -%}true{%- else -%}false{%- endif -%}"
        data-media="{{ media.id }}"
        data-media-type="{{ media.media_type }}"
      >
        <div class="product-gallery--media-wrapper">
          {% case media.media_type %}
          {% when 'image' %}
            {%- capture data_attr -%}
              {% if enable_image_zoom %}data-image-zoom="{{ media.id }}"{% endif %}
            {%- endcapture -%}
            {%
              render 'rimg'
              img: media.preview_image,
              size: '1024x1024',
              attr: data_attr,
            %}
          {% when 'model' %}
            {{ media | model_viewer_tag: image_size: '1024x', reveal: 'interaction' , toggleable: true, interaction-prompt-threshold: 0 }}
          {% when 'video' %}
            {{ media | media_tag: image_size: '1024x' }}
          {% when 'external_video' %}
            {{ media | media_tag: image_size: '1024x' }}
          {% else %}
            {{ media | media_tag }}
          {% endcase %}
          {% if show_media_borders %}
            <div class="product-gallery--border-overlay"></div>
          {% endif %}
        </div>
      {% if media.media_type == 'model' %}
        {% assign model = media %}
      {% else %}
        {% assign model = first_model %}
      {% endif %}
      {% if model %}
        <button
          class="product-gallery--viewinyourspace"
          data-shopify-xr
          data-shopify-model3d-id="{{ model.id }}"
          data-shopify-title="{{ product.title }}"
          data-shopify-xr-hidden
        >
          {% render 'icon' with 'ar' %}
          {{ 'products.media.view_in_your_space' | t }}
        </button>
      {% endif %}
      </figure>
    {% else %}
      <figure
        class="product-gallery--viewport--figure"
        data-product-gallery-selected="true"
      >
        {{ 'product-1' | placeholder_svg_tag: 'placeholder-svg' }}
      </figure>
    {% endfor %}

    {% if enable_image_zoom %}
      {% assign ps_images = product.media | where: "media_type", "image"  %}
      {% render 'photoswipe', ps_images: ps_images %}
    {% endif %}
  </div>

  {% if product.media.size > 1 %}
    <div
      class="product-gallery--navigation"
      data-product-gallery-navigation
    >
      {% for media in product.media %}
        <button
          class="
            product-gallery--media-thumbnail
            product-gallery--{{ media.media_type }}-thumbnail
          "
          type="button"
          tab-index="0"
          aria-label="{{ media.alt }} {{ 'general.accessibility.nav_product_thumbnail' | t }}"
          data-product-gallery-thumbnail="{{ forloop.index0 }}"
          data-product-gallery-selected="{%- if selected_media.id == media.id -%}true{%- else -%}false{%- endif -%}"
          data-media="{{ media.id }}"
          data-media-type="{{ media.media_type }}"
        >
          {%
            render 'rimg'
            img: media.preview_image,
            size: '100x100',
          %}

          {% case media.media_type %}
          {% when 'model' %}
            {% render 'icon' with 'model-thumb' %}
          {% when 'video' %}
            {% render 'icon' with 'play-thumb' %}
          {% when 'external_video' %}
            {% render 'icon' with 'play-thumb' %}
          {% endcase %}
        </button>
      {% endfor %}
    </div>
  {% endif %}
</div>

i want to hide unselected variant images as thumbnail to hide in Shopify code.

I am using atlantic theme and this is the code of product gallery part.