Need help styling radio Button

Hey Community,
I have created a contact form on my site that includes 3 radio buttons that I want the user to choose one of. I am having trouble with two things in particular:

  1. in order to make it so that only one option is selectable I need to (as far as I understand this) have all radio buttons be part of the same group. If that is the case, how do I make the selection of only one radio button mandatory?

  2. I would like for the background color to change upon selection of a radio button instead of (or in addition to) the little circle getting filled. I can easily hide the circle by choosing display settings: none. How do I change the BG color of the radio button upon selection

Thanks so much for helping me out. Oh, I should probably mention that I am not very versed in CSS or any other form of coding. So a solution not requiring that would beb preferred; however, as long as it works I’d be happy.

Here is my site Read-Only: https://preview.webflow.com/preview/owl-bar?preview=5c0c3d981574152d7062da8375024ec2

I know this question has been up almost a year, but I am also having the same issue with needing to make a selection of one button mandatory. Hopefully someone has a custom code solution as Webflow Help has told me this is something that cannot be done natively.

As for your second question, this can be resolved in the interactions. You can select the item you want to trigger the action (either the checkbox or the checkbox label, or the whole checkbox field), and then create an interaction. You would have your trigger selected and then choose start an animation on click. Then you can select the object you want to change and set the initial state as no bg color, and then add a step so when you click the trigger the background color changes.

Hey, @Machi @PeterBear

You can add the attribute checked=checked for the button that you want to be selected by load, and to keep that from getting unselected when other radio buttons are clicked on, just give the default one a different group name :raising_hand_woman:t4:

and for the background color change, let me know if you still need it, will share a loom