I have an Angular app using a legacy version of Material that I need to upgrade to be a more modern non-legacy version (version 16,17,or 18). Overall this works, but now the default text is a much lighter shade of grey which is a lot more difficult to read. Here is what it looks like before and after

Material Legacy – Before

Material Current – After

This is all I am doing to create a theme.

@use '@angular/material' as mat;
@import '@angular/material/theming';

$my-theme-primary: mat.define-palette(mat.$green-palette, 700, 800, 900);
$my-theme-accent: mat.define-palette(mat.$orange-palette, A200, 300, A400);
$my-theme-warn: mat.define-palette(mat.$red-palette);

$my-theme: mat.define-light-theme(
  (
    color: (
      primary: $my-theme-primary,
      accent: $my-theme-accent,
      warn: $my-theme-warn,
    ),
  )
);

@include mat.core();
@include mat.all-component-typographies();
@include mat.all-component-themes($my-theme);

I just want to define that I want text to not be transparent. I have tried adding

text: black,
secondary-text: black,

but that did nothing. I am unable to find any examples for a current version of Material anywhere about what exact variables need to be changed to either set a color or set a specific opacity value.