WordPress – CSS – Problems changing background color of label when checkbox is checked

I’m having a problem on a website. Several years ago I installed a plugin to add some extra options to a woocommerce product.
I had some work figuring out the css but finally everything worked.
Now, I did an update of the plugin and things changed…

I need to change the background color of a label, which contains a hidden checkbox. When the visitor clicks on the label, the checkbox is checked (hidden) and I want the label to change background color.

This is the code to change the color of the labels on Hover and Active:

.tm-extra-product-options .bloesems-div ul.tmcp-ul-wrap.tm-extra-product-options-checkbox li.tmcp-field-wrap .tc-label.tm-label:hover {
background:#9FC649;
}

.tm-extra-product-options .bloesems-div ul.tmcp-ul-wrap.tm-extra-product-options-checkbox li.tmcp-field-wrap .tc-label.tm-label:active {
background:#C6FA99;
}

This was the CSS before the update:

.tm-extra-product-options ul.tmcp-ul-wrap.tm-extra-product-options-checkbox li.tmcp-field-wrap label input[type="checkbox"]:checked ~ .tc-label { background: #9FC649; }

I don’t know why the "~" is there… but it was that in the original css…

This is how the labels are built.

<div class="tc-cell tc-col tc-element-container">
<ul class="tmcp-ul-wrap tmcp-elements tm-extra-product-options-checkbox tm-element-ul-checkbox element_0 bloesems-ul" data-rules="{"valueKBO_0":[""]}" data-original-rules="{"ValueKBO_0":[""]}" data-rulestype="{"ValueKBO_0":[""]}" data-tm-validation="[]">
        <li class="tmcp-field-wrap tc-active">
            <label class="tm-epo-field-label" for="tmcp_choice_0_0_1656df54326881">
                <input type="checkbox" id="tmcp_choice_0_0_1656df54326881" name="tmcp_checkbox_0_0" class="tmcp-field bloesems tm-epo-field tmcp-checkbox tcenabled" data-price="" data-rules="[""]" data-original-rules="[""]" data-rulestype="[""]" data-limit="" data-exactlimit="" data-minimumlimit="" data-image="" data-imagec="" data-imagep="" data-imagel="" data-image-variations="[]" value="valueKBO_0">
                <span class="tc-label-wrap">
                    <span class="tc-label tm-label">
                some text
                            </span>
                        </span>
                    </label>
            </li>
        </ul>
</div>

I tried all kinds of things but nothing seems to work. I hope someone can help me out.

I tried following code to help me figuring things out. When I unhide the checkboxes. This works

.tm-extra-product-options .bloesems-div ul.tmcp-ul-wrap.tm-extra-product-options-checkbox li.tmcp-field-wrap label input[type="checkbox"]:checked { accent-color: red; }

I also tried code:
`
.tm-extra-product-options .tm-epo-field-label:has(input[type:"checkbox"]:checked){
background:#C6FA99;

}`

To try and change the background color of the classes containing the checkbox…