Allow styling of radio button backgrounds (#5791)

components/radio/style/index.less

@@ -64,7 +64,7 @@
     border-style: solid;
     border-radius: 14px;
     border-color: @border-color-base;
-    background-color: @component-background;
+    background-color: @radio-button-bg;
     transition: all @radio-duration;
   }
 
@@ -116,17 +116,17 @@ span.@{radio-prefix-cls} + * {
   margin: 0;
   height: @input-height-base;
   line-height: @input-height-base - 2;
-  color: @btn-default-color;
+  color: @radio-button-color;
   display: inline-block;
   transition: all 0.3s ease;
   cursor: pointer;
   border: @border-width-base @border-style-base @border-color-base;
   border-left: 0;
-  background: @component-background;
+  background: @radio-button-bg;
   padding: 0 16px;
 
   a {
-    color: @btn-default-color;
+    color: @radio-button-color;
   }
 
   > .@{radio-prefix-cls}-button {
@@ -181,7 +181,7 @@ span.@{radio-prefix-cls} + * {
   }
 
   &-checked {
-    background: @component-background;
+    background: @radio-button-bg;
     border-color: @primary-color;
     color: @primary-color;
     box-shadow: -1px 0 0 0 @primary-color;

components/style/themes/default.less

@@ -131,6 +131,10 @@
 
 @btn-group-border       : @primary-7;
 
+// Radio buttons
+@radio-button-bg           : @btn-default-bg;
+@radio-button-color        : @btn-default-color;
+
 // Media queries breakpoints
 // Extra small screen / phone
 @screen-xs              : 480px;