Why is the label color not turning green when the radio is checked?-CodePudding

I'm having some problems with changing the color of the label when the radio input is checked.

When I use this:

input:checked   label {
color: green}

Then normally it works, but not on this little project.

Can someone please explain it to me why it is not working. I think it has something to do with the usage of SASS. It always works when I'm using plain CSS.

Github repository: https://github.com/Nova988/Tip-calculator-App

Netlify Site: https://priceless-hodgkin-c38abb.netlify.app/

CodePudding user response：

Take a look at the HTML.

The label comes before the input radio button - which you can also see just looking at the page - the circle (radio button) is after the % label.

Your CSS relies on the label coming after the input.