Change ant design radio input on focus

Question

Does anybody know how I can change the radio input of ant design when i focus on it? I want to change the border color but I can't seem to find an answer anywhere.

https://codesandbox.io/s/zen-ride-cxvne?file=/index.js

I have the exact same radios on my code and I just need to change the border color when I select it. Tried doing what was on this page How to change radio button color in ant design? but it did not work.

Answer 1

Try adding something like this to your css:

.ant-radio-button-wrapper-checked {
  color: red !important;
}

Answer 2

Not related to the code example given but for me this worked (antd 4.16.13) to remove the outline on the radio on focus

   .ant-radio-input:focus + .ant-radio-inner {
        box-shadow: none;
    }