fix(material/core): Include mat.typography-hierarchy() before mat.all…

…-component-themes() in themes.

This will allow component specific typography styles take precedence over global typography styles, such in the case of material/toolbar which has specific style definition for typography.

Fixes angular#26261

src/dev-app/theme.scss

@@ -23,15 +23,15 @@ $candy-app-theme: mat.define-light-theme((
 // **Be sure that you only ever include this mixin once!**
 @include mat.core();
 
+@include mat.legacy-typography-hierarchy($candy-app-theme, '.mat-legacy-typography');
+@include mat.typography-hierarchy($candy-app-theme);
+
 // Include the default theme styles.
 @include mat.all-component-themes($candy-app-theme);
 @include mat.all-legacy-component-themes($candy-app-theme);
 @include experimental.column-resize-theme($candy-app-theme);
 @include experimental.popover-edit-theme($candy-app-theme);
 
-@include mat.legacy-typography-hierarchy($candy-app-theme, '.mat-legacy-typography');
-@include mat.typography-hierarchy($candy-app-theme);
-
 .demo-strong-focus {
   // Note: we can theme the indicators directly through `strong-focus-indicators` as well.
   // Use the theme so we have some coverage over the entire API surface.

src/material/core/theming/prebuilt/deeppurple-amber.scss

@@ -21,7 +21,7 @@ $theme: theming.define-light-theme((
   density: 0,
 ));
 
+@include typography.typography-hierarchy($theme);
+
 // Include all theme styles for the components.
 @include all-theme.all-component-themes($theme);
-
-@include typography.typography-hierarchy($theme);

src/material/core/theming/prebuilt/indigo-pink.scss

@@ -22,7 +22,7 @@ $theme: theming.define-light-theme((
   density: 0,
 ));
 
+@include typography.typography-hierarchy($theme);
+
 // Include all theme styles for the components.
 @include all-theme.all-component-themes($theme);
-
-@include typography.typography-hierarchy($theme);

src/material/core/theming/prebuilt/pink-bluegrey.scss

@@ -22,7 +22,7 @@ $theme: theming.define-dark-theme((
   density: 0,
 ));
 
+@include typography.typography-hierarchy($theme);
+
 // Include all theme styles for the components.
 @include all-theme.all-component-themes($theme);
-
-@include typography.typography-hierarchy($theme);

src/material/core/theming/prebuilt/purple-green.scss

@@ -22,7 +22,7 @@ $theme: theming.define-dark-theme((
   density: 0,
 ));
 
+@include typography.typography-hierarchy($theme);
+
 // Include all theme styles for the components.
 @include all-theme.all-component-themes($theme);
-
-@include typography.typography-hierarchy($theme);