label color change when radio input checked

<label
className="relative bg-very-dark-cyan text-white text-2xl py-1.5 px-4 text-center rounded-md hover:bg-cyan/40 hover:text-very-dark-cyan [&:has(input:checked)]:bg-cyan [&:has(input:checked)]:text-very-dark-cyan"
>
  <input className="group absolute w-full h-full top-0 left-0 cursor-pointer opacity-0" />
  {label}
</label>

<label
className="relative bg-very-dark-cyan text-white text-2xl py-1.5 px-4 text-center rounded-md hover:bg-cyan/40 hover:text-very-dark-cyan [&:has(input:checked)]:bg-cyan [&:has(input:checked)]:text-very-dark-cyan"
>
  <input className="group absolute w-full h-full top-0 left-0 cursor-pointer opacity-0" />
  {label}
</label>