ラジオボタンをデフォルトのものではなく独自でデザインしたものにしたいときは、before,afterで疑似的にラジオボタンを作成します。
（参考：https://shu-sait.com/input-label-id-for/#outline__1）
その際もとのラジオボタンの代わりになるlabelにしっかりとradioのinputタグを紐づけなければボタンとしては機能しません。
example.html
<input id="radio_button" type="radio">
<label for="radio_button">ラベルテキスト</label>
inputタグをlabelタグで囲むやり方でも良いようです。
example2.html
<label>ラベルテキスト
<input type="radio">
</label>
なぜこのような基本的なことに詰まったかというと、あるコードを改修する形でこの問題に面したのですが、その元のコードではこの紐づけをしなくても動いていたのです。
調べたところ読み込んでいるjsファイルにこれらを紐づけている記述がありました。
html+cssでできることは極力jsではやらないようにしよう（私の上司より）。