fix(material-experimental/mdc-form-field): fill appearance blending i…

…n with the background in high contrast mode (#21446)

The outline of the `fill` appearance is done through a background color which will blend
in with the background in high contrast mode. These changes add an outline to replace it.

(cherry picked from commit 3aa5527)

src/material-experimental/mdc-form-field/_mdc-text-field-structure-overrides.scss

@@ -1,6 +1,7 @@
 @import '@material/notched-outline/variables.import';
 @import '@material/textfield/variables.import';
 @import 'form-field-sizing';
+@import '../../cdk/a11y/a11y';
 
 // Mixin that can be included to override the default MDC text-field
 // styles to fit our needs. See individual comments for context on why
@@ -85,4 +86,12 @@
   .mat-mdc-text-field-wrapper::before {
     content: none;
   }
+
+  // The outline of the `fill` appearance is achieved through a background color
+  // which won't be visible in high contrast mode. Add an outline to replace it.
+  .mat-form-field-appearance-fill .mat-mdc-text-field-wrapper {
+    @include cdk-high-contrast(active, off) {
+      outline: solid 1px;
+    }
+  }
 }