:root{--color1:#f4f4f4;--color2:#3197ee}.radio{margin:.5rem}.radio input[type=radio]{opacity:0;position:absolute}.radio input[type=radio]+.radio-label:before{background:var(--color1);border:1px solid #bdbdbd;border-radius:100%;content:"";cursor:pointer;display:inline-block;height:1.2em;margin-right:1em;position:relative;text-align:center;top:.1em;transition:all .25s ease;vertical-align:top;width:1.2em}.radio input[type=radio]:checked+.radio-label:before{background-color:var(--color2);box-shadow:inset 0 0 0 4px var(--color1)}.radio input[type=radio]:focus+.radio-label:before{border-color:var(--color2);outline:none}.radio input[type=radio]:disabled+.radio-label:before{background:darken(var(--color1),25%);border-color:darken(var(--color1),50%);box-shadow:inset 0 0 0 4px var(--color1)}.radio input[type=radio]+.radio-label:empty:before{border-color:darken(var(--color1),50%);margin-right:0}