Shopify Dawn Size Swatches (disable if sold out)

I’m trying to create a store in Shopify Dawn theme and would like if you are on a product page, the sizing options under the color options be disabled or crossed out if sold out. Below is code for the radios.

{%- unless product.has_only_default_variant -%}
{%- if picker_type == 'button' -%}
<variant-radios class="no-js-hidden" data-section="{{ section.id }}" data-url="{{ product.url }}" {{ block.shopify_attributes }}>
  {%- for option in product.options_with_values -%}
  <fieldset {% if option.name == option_name %} class="swatchComponent" style=" padding: 0;" {% else %} class="js product-form__input" style="border:none" {% endif %}>
    {% if option.name == option_name %}
    <legend class="form__label">{{ option.name }}:</legend>
    <div class="swatchContainer">
      {% assign values = option.values %}
      {%- for value in option.values -%}
      <input class="inputColor"
             name="{{ option.name }}"
             value="{{ value | escape }}"
             form="product-form-{{ section.id }}"
             type="radio"
             id="{{ section.id }}-{{ option.name }}-{{ forloop.index0 }}"
             {% if option.selected_value == value %}checked{% endif %}>

      <label class="labelColor"
             for="{{ section.id }}-{{ option.name }}-{{ forloop.index0 }}"
             data-color="{{value | downcase | replace: ' ', '-' }}"
             style="
                    {% case swatch_shape %}
                    {% when 'round' %} border-radius: 50%; aspect-ratio: 1;
                    {% when 'square' %} aspect-ratio: 1;
                    {% when 'rectangle' %} height: calc({{swatch_size}} / 2);
                    {% when 'round-edge' %} border-radius: 15%; aspect-ratio: 1;
                    {% if product.type contains 'Gift Cards' %}width: 65px; border-radius: 10%;{% endif %}
                    {% endcase %}">
      </label>
      <div class="infoColor" >
{{value | escape}}
      </div>
      {% endfor %}
    </div>
    {% else %}
    <legend class="form__label">{{ option.name }}</legend>
    {%- for value in option.values -%}
    <input type="radio" id="{{ section.id }}-{{ option.name }}-{{ forloop.index0 }}"
           name="{{ option.name }}"
           value="{{ value | escape }}"
           form="product-form-{{ section.id }}"
           {% if option.selected_value == value %}checked{% endif %}>
    <label for="{{ section.id }}-{{ option.name }}-{{ forloop.index0 }}" {% if product.type contains 'Gift Cards' %}style="width: 75px; border-radius: 10%;"{% endif %}>
    {{ value }}
    </label>
    {%- endfor -%}
    {% endif %}
  </fieldset>
  {% endfor -%}
  <script type="application/json">
{{ product.variants | json }}
  </script>
</variant-radios>

Attached is what it looks like, Blue is displaying L but if you click L it’s sold out. So we want to cross out L and disable it. Please advise.

Thank you!
(https://i.stack.imgur.com/iBWvT.png)
(https://i.stack.imgur.com/LvMd3.png)

I have tried what chatGPT suggested.

{% for variant in product.variants %}
  {% if variant.available == false and variant.option1 == option.values[0] %}
    {% assign sold_out = true %}
  {% endif %}
{% endfor %}
{% if sold_out %}
  {% assign option_disabled = true %}
{% else %}
  {% assign option_disabled = false %}
{% endif %}

<select name="id">
{% for value in option.values %}
  {% if value == 'Default Title' %}
    <option value="{{ product.selected_or_first_available_variant.id }}" {% if option.selected == 'Default Title' %}selected{% endif %}>{{ value }}</option>
  {% else %}
    {% assign variant_id = '' %}
    {% for variant in product.variants %}
      {% if variant.option1 == value %}
        {% assign variant_id = variant.id %}
        {% break %}
      {% endif %}
    {% endfor %}
    {% if option_disabled and variant_id == '' %}
      {% continue %}
    {% endif %}
    <option value="{{ variant_id }}" {% if option.selected == value %}selected{% endif %} {% if variant_id == '' %}disabled{% endif %}>{{ value }}{% if variant_id == '' %} (Sold Out){% endif %}</option>
  {% endif %}
{% endfor %}
</select>