微信小程序 修改radio样式

案例：

页面代码
样式如下：
(前）
(后）

关键wxss：

/* 单选按钮样式*/
radio .wx-radio-input {
    
    
    width: 40rpx;
    height: 40rpx;
    border: 4rpx solid #8C8C8C;/* 外圈边框，默认灰色，即未选中状态*/
    border-radius: 50%;
    background: none;
  }
  /*单选按钮选中后内部样式*/
  radio .wx-radio-input.wx-radio-input-checked {
    
    
    border: 4rpx solid #8C8C8C !important;/* 外圈边框，选中状态颜色*/
    background-color: white !important;/* 外圈边框与内圈实心圆间的内容的颜色，不设置就默认是上面的绿色*/
  }
  /*单选按钮选中后内部中心*/
  radio .wx-radio-input.wx-radio-input-checked::before {
    
    
    width: 60%;
    height: 60%;
    background: red;/* 内圈实心圆选中状态颜色*/
    border-radius: 50%;
    content: '';/* 隐藏✔️*/
    transform: translate(-50%, -50%) scale(1);
    -webkit-transform: translate(-50%, -50%) scale(1);
  }