Swatches issue

[HamzaTaaj]

I have added different images but color swatches showing same image for all variants 

dashboard view.




Product demo: https://activeelites.com/products/agilita-leggings-28?variant=40877412450383
You can also find this from this page last product of this page : https://activeelites.com/collections/test

[HamzaTaaj]

As you can see I also shared the variants screen shoot that I have added at backend and they are added correctly.
Code That I'm using for this.
{% if option.name == 'Select Color' %}
<!-- Check if the option is 'Select Color' -->
{% if product.variants[forloop.index0].image != blank %}
<!-- If the option has an image, create an image label -->
<label class="image-label" for="{{ section.id }}-{{ option.position }}-{{ forloop.index0 }}">
<img class="variant-image" src="{{ product.variants[forloop.index0].image | img_url: "medium" }}" style="max-width="100%"; height="auto" " />
<span class="color-value">{{ value }}</span> <!-- Add class "color-value" here -->
<span class="visually-hidden">{{ 'products.product.variant_sold_out_or_unavailable' | t }}</span>
</label>
{% else %}
<!-- If the option doesn't have an image, create a standard label -->
<label for="{{ section.id }}-{{ option.position }}-{{ forloop.index0 }}">
{{ value -}}
<span class="visually-hidden">{{ 'products.product.variant_sold_out_or_unavailable' | t }}</span>
</label>
{% endif %}
{% else %}
<!-- For options other than 'Select Color' -->
<label for="{{ section.id }}-{{ option.position }}-{{ forloop.index0 }}">
{{ value -}}
<span class="visually-hidden">{{ 'products.product.variant_sold_out_or_unavailable' | t }}</span>
</label>
{% endif %}