xxxxxxxxxx
/* :has() - This selector simply checks the presence of some element using its class,
Id , tagName etc. */
<div class="parent">
<input type="checkbox" />
<p>Child</p>
</div>
<style>
.parent:has([type="checkbox"]:checked) p{
color:red
}
/* It will check whether the parent element has an input with type checkbox and it is
checked , if it is checked , the color of p tag will be red ,
else it will be default black. */
/* NOTE - In case of :has() you don't need to provide a space before it ,
you can see it in the example above */
</style>