fix(radio-group): style focused but unchecked radio buttons (#11564)

better align with the MD spec

Fixes #11563. Fixes #8339. Fixes #3643.

Author: Splaktar

src/components/radioButton/radio-button-theme.scss

@@ -89,6 +89,12 @@ md-radio-group.md-THEME_NAME-theme {
   }
 }
 
+md-radio-group.md-THEME_NAME-theme.md-focused.ng-empty>md-radio-button:first-child {
+  .md-container:before {
+    background-color: '{{foreground-3-0.26}}';
+  }
+}
+
 md-radio-group.md-THEME_NAME-theme.md-focused:not(:empty) {
   .md-checked .md-container:before {
     background-color: '{{accent-color-0.26}}';

src/components/radioButton/radio-button.scss

@@ -149,14 +149,22 @@ md-radio-group {
     outline: none;
   }
 
-  &.md-focused {
+  &.md-focused.ng-not-empty {
     .md-checked .md-container:before {
       left: -8px;
       top: -8px;
       right: -8px;
       bottom: -8px;
     }
   }
+  &.md-focused.ng-empty>md-radio-button:first-child {
+    .md-container:before {
+      left: -8px;
+      top: -8px;
+      right: -8px;
+      bottom: -8px;
+    }
+  }
 
   &[disabled] md-radio-button {
     @include md-radio-button-disabled();