bug(focus indicators): Turns out we can rely upon mat-core being before component styles.

Author: zelliott

src/material-experimental/mdc-slide-toggle/slide-toggle.scss

@@ -22,13 +22,6 @@
     // the host element.
     pointer-events: none;
   }
-
-  // The thumb underlay needs additional specificity to override the focus indicator's relative
-  // positioning.
-  .mdc-switch__thumb-underlay {
-    position: absolute;
-  }
-
   // The MDC switch styles related to the hover state are intertwined with the MDC ripple styles.
   // We currently don't use the MDC ripple due to size concerns, therefore we need to add some
   // additional styles to restore the hover state.

src/material/core/focus-indicators/_focus-indicators.scss

@@ -67,7 +67,8 @@
   // is present.
   .mat-focus-indicator.mat-option.mat-active::before,
 
-  // The focus indicator in the calendar is placed on an element inside the cell.
+  // For calendar cells, render the focus indicator when the parent cell is
+  // focused.
   .mat-calendar-body-cell:focus .mat-focus-indicator::before,
 
   // For all other components, render the focus indicator on focus.

src/material/datepicker/calendar-body.scss

@@ -153,6 +153,7 @@ $mat-calendar-range-end-body-cell-size:
 }
 
 .mat-calendar-body-cell-content {
+  position: absolute;
   top: $mat-calendar-body-cell-content-margin;
   left: $mat-calendar-body-cell-content-margin;
   z-index: 1;
@@ -174,12 +175,6 @@ $mat-calendar-range-end-body-cell-size:
   // Choosing a value clearly larger than the height ensures we get the correct capsule shape.
   border-radius: $mat-calendar-body-cell-radius;
 
-  // Apply this style with additional specificity to override the focus indicator's relative
-  // positioning.
-  .mat-calendar-body-cell & {
-    position: absolute;
-  }
-
   @include cdk-high-contrast(active, off) {
     border: none;
   }