fix(material/form-field): ensure same stacking context as container

When `will-change` was removed in #27251, the form field lost its implicit stacking context which means that some of its descendants may be stacked on top of the container.

These changes add an explicit `z-index` on the container to resolve the issue.

Fixes #28708.

Author: crisbeto

src/material/form-field/form-field.scss

@@ -84,6 +84,10 @@ $_icon-prefix-infix-padding: 4px;
   min-width: 0;
   // To avoid problems with text-align.
   text-align: left;
+  // Avoids stacking issues due to the absolutely-positioned
+  // descendants of the form field (see #28708)
+  position: relative;
+  z-index: 0;
 
   [dir='rtl'] & {
     text-align: right;
@@ -139,7 +143,7 @@ $_icon-prefix-infix-padding: 4px;
   // MDC applies `pointer-events: none` to the `.mdc-text-field--disabled`. This breaks clicking on
   // prefix and suffix buttons, so we override `pointer-events` to always allow clicking.
   pointer-events: auto;
-  // Needs a z-index to ensure it's on top of other content clickable. See #27043.
+  // Needs a z-index to ensure it's on top of other clickable content. See #27043.
   position: relative;
   z-index: 1;