Select2 is-valid class is not apply to <span>

Question

I'am trying to made working the is-valid class of bootstrap in my select2. The class is nicely apply to the but not in the created by select2 in the same level.

My code is simple :

<select
   class="domain-select form-select form-select-solid is-valid"
   data-placeholder="Select a domain"
>
  <option></option>
  <option value="1">test1.com</option>
  <option value="2">test2.com</option>
</select>

$(".domain-select").select2({
   theme: "bootstrap-5"
});

And the result of this in my HTML code is :

<select data-placeholder="Select a domain" name="domain_id" class="domain-select form-select form-select-solid was-validated is-valid" data-select2-id="select2-data-1-y7wp" tabindex="-1" aria-hidden="true">
    <option data-select2-id="select2-data-3-at55"></option>
    <option value="1">test1.com</option>
    <option value="2">test2.com</option>
</select>
<span class="select2 select2-container select2-container--bootstrap-5 select2-container--focus" dir="ltr" data-select2-id="select2-data-2-4hls" style="width: 646.156px;">
    <span class="selection">
        <span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-disabled="false" aria-labelledby="select2-domain_id-t4-container" aria-controls="select2-domain_id-t4-container">
            <span class="select2-selection__rendered" id="select2-domain_id-t4-container" role="textbox" aria-readonly="true" title="Select a domain"><span class="select2-selection__placeholder">Select a domain</span></span>
            <span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span>
        </span>
    </span>
    <span class="dropdown-wrapper" aria-hidden="true"></span>
</span>

If I copy style of is-valid class and apply it to the '<span class="select2...' it is working, but not if it is just apply to the select.

Do you know why ? And how can i made it works ?

Thanks