diff --git a/src/material-experimental/mdc-radio/radio.scss b/src/material-experimental/mdc-radio/radio.scss index 3ed29fe6d0ff..401ab3f856bb 100644 --- a/src/material-experimental/mdc-radio/radio.scss +++ b/src/material-experimental/mdc-radio/radio.scss @@ -25,7 +25,12 @@ // how IE/Edge treat native radio buttons in high contrast mode. We can't turn the border // into a dotted one, because it's too thick which causes the circles to look off. @include a11y.high-contrast { - .mat-mdc-radio-button.cdk-keyboard-focused .mat-radio-ripple { - outline: dotted 1px; + .mat-mdc-radio-button:not(.mat-radio-disabled) { + &.cdk-keyboard-focused, + &.cdk-program-focused { + .mat-radio-ripple { + outline: solid 3px; + } + } } } diff --git a/src/material/radio/radio.scss b/src/material/radio/radio.scss index 1b816c850763..97a05dd9d758 100644 --- a/src/material/radio/radio.scss +++ b/src/material/radio/radio.scss @@ -186,6 +186,15 @@ $ripple-radius: 20px; } @include a11y.high-contrast(active, off) { + .mat-radio-button:not(.mat-radio-disabled) { + &.cdk-keyboard-focused, + &.cdk-program-focused { + .mat-radio-ripple { + outline: solid 3px; + } + } + } + .mat-radio-disabled { opacity: 0.5; }