fix(button): focus indication hard to see in high contrast mode (#13259)

* When we switched to the new design, we also switched our approach to how the focus overlay is shown (using `opacity` vs `display`), however we never switched the focus indicator's background to a solid color, which means that it's opacity when displayed is close to zero (0.5 * 0.012 = 0.006). These changes switch it to a solid color.
* Fixes the focus indicator being white on a white background, when the user has high contrast set to black-on-white.

Author: crisbeto

src/lib/button/button.scss

@@ -109,7 +109,6 @@
 // Element that overlays the button to show focus and hover effects.
 .mat-button-focus-overlay {
   opacity: 0;
-
   transition: $mat-button-focus-transition;
 
   ._mat-animation-noopable & {
@@ -120,7 +119,14 @@
     // Note that IE will render this in the same way, no
     // matter whether the theme is light or dark. This helps
     // with the readability of focused buttons.
-    background-color: rgba(white, 0.5);
+    background-color: #fff;
+  }
+
+  @include cdk-high-contrast(black-on-white) {
+    // For the black-on-white high contrast mode, the browser will set this element
+    // to white, making it blend in with the background, hence why we need to set
+    // it explicitly to black.
+    background-color: #000;
   }
 }