fix(material/stepper): ensure sufficient contrast of step icon

Author: json-derulo

src/material/core/m2/_palette.scss

@@ -688,6 +688,7 @@ $light-theme-background-palette: (
   unselected-chip: map.get($grey-palette, 300),
   disabled-list-option: map.get($grey-palette, 200),
   tooltip: map.get($grey-palette, 700),
+  stepper-icon: $dark-secondary-text,
 );
 
 // Background palette for dark themes.
@@ -707,6 +708,7 @@ $dark-theme-background-palette: (
   unselected-chip: map.get($grey-palette, 700),
   disabled-list-option: rgba(white, 0.12),
   tooltip: map.get($grey-palette, 700),
+  stepper-icon: $light-secondary-text,
 );
 
 // Foreground palette for light themes.
@@ -726,6 +728,7 @@ $light-theme-foreground-palette: (
   slider-min:        rgba(black, 0.87),
   slider-off:        rgba(black, 0.26),
   slider-off-active: rgba(black, 0.38),
+  stepper-icon:      white,
 );
 
 // Foreground palette for dark themes.
@@ -745,4 +748,5 @@ $dark-theme-foreground-palette: (
   slider-min:        white,
   slider-off:        rgba(white, 0.3),
   slider-off-active: rgba(white, 0.3),
+  stepper-icon:      black,
 );

src/material/core/tokens/m2/mat/_stepper.scss

@@ -38,8 +38,10 @@ $prefix: (mat, stepper);
     header-selected-state-label-text-color: inspection.get-theme-color($theme, foreground, text),
     // Color of the header text when a step is in an error state.
     header-error-state-label-text-color: inspection.get-theme-color($theme, warn, text),
+    // Foreground color of the header icon.
+    header-icon-foreground-color: inspection.get-theme-color($theme, foreground, stepper-icon),
     // Background color of the header icon.
-    header-icon-background-color: inspection.get-theme-color($theme, foreground, secondary-text),
+    header-icon-background-color: inspection.get-theme-color($theme, background, stepper-icon),
     // Foreground color of the header icon in the error state.
     header-error-state-icon-foreground-color: inspection.get-theme-color($theme, warn, text),
     // Background color of the header icon in the error state.
@@ -91,8 +93,6 @@ $prefix: (mat, stepper);
   $active-state-background: inspection.get-theme-color($theme, $palette-name);
 
   @return (
-    // Foreground color of the header icon.
-    header-icon-foreground-color: $active-state-foreground,
     // Background color of the header icon in the selected state.
     header-selected-state-icon-background-color: $active-state-background,
     // Foreground color of the header icon in the selected state.