feat(material/card): add title-text-color token

Fixes #31080

Author: pmpak

src/material/card/_m2-card.scss

@@ -25,6 +25,7 @@ $prefix: (mat, card);
     outlined-container-color: inspection.get-theme-color($theme, background, card),
     outlined-container-elevation: elevation.get-box-shadow(0),
     outlined-outline-color: rgba(inspection.get-theme-color($theme, foreground, base), 0.12),
+    title-text-color: inspection.get-theme-color($theme, foreground, text),
     subtitle-text-color: inspection.get-theme-color($theme, foreground, secondary-text),
     filled-container-color: inspection.get-theme-color($theme, background, card),
     filled-container-elevation: elevation.get-box-shadow(0)

src/material/card/_m3-card.scss

@@ -16,6 +16,7 @@ $prefix: (mat, card);
     m3-utils.generate-typography-tokens($systems, title-text, title-large),
     m3-utils.generate-typography-tokens($systems, subtitle-text, title-medium),
     (
+      title-text-color: map.get($systems, md-sys-color, on-surface),
       subtitle-text-color: map.get($systems, md-sys-color, on-surface),
       elevated-container-color: map.get($systems, md-sys-color, surface-container-low),
       elevated-container-elevation: map.get($systems, md-sys-elevation, level1),

src/material/card/card.scss

@@ -94,6 +94,7 @@ $mat-card-default-padding: 16px !default;
 // Add slots for custom Angular Material card tokens.
 @include token-utils.use-tokens(m2-card.$prefix, m2-card.get-token-slots()) {
   .mat-mdc-card-title {
+    color: token-utils.slot(title-text-color);
     font-family: token-utils.slot(title-text-font);
     line-height: token-utils.slot(title-text-line-height);
     font-size: token-utils.slot(title-text-size);