Customizing mat-tab with predefined themes in Angular

Question

I need to modify the styling of a mat-tab-group, specifically that it inherits the colors of the custom theme (color: primary) and changes the background color for each of the selected tabs as follows:

---

---

The styles assigned to the theme in the app-theme.scss file:

// Generate Fuse color classes for custom palettes
$custom_palettes: (
    fuse-white: $fuse-white,
    fuse-black: $fuse-black,
    // fuse-navy: $fuse-navy
);

@include fuse-color-classes($custom_palettes);

// --------------------------------------------------------------------
// @ Define the default theme
// --------------------------------------------------------------------

// Define the primary, accent and warn palettes
$default-primary-palette: mat-palette($dynamic-theme-primary);
$default-accent-palette: mat-palette($dynamic-theme-accent);
$default-warn-palette: mat-palette($mat-red);

// Create the Material theme object
$theme: mat-light-theme($default-primary-palette, $default-accent-palette, $default-warn-palette);

// Add ".theme-default" class to the body to activate this theme.
// Class name must start with "theme-" !!!
body.theme-default {

    // Create an Angular Material theme from the $theme map
    @include angular-material-theme($theme);

    // Apply the theme to the Fuse Core
    @include fuse-core-theme($theme);

    // Apply the theme to the user components
    @include components-theme($theme);

    // Generate Fuse color classes for primary, accent and warn colors
    $palettes: (
        primary: $default-primary-palette,
        accent: $default-accent-palette,
        warn: $default-warn-palette
    );

    @include fuse-color-classes($palettes);
}

SCSS file with styles to change the background of a selected tab that I taken from other answers:

.customTab {

    .mat-tab-list, .mat-tab-labels, .mat-tab-labels-active {
        background-color: rgb(255, 131, 62) !important;
        color: #fff !important;
    }

    .mat-tab-labels, mat-tab-link {
        color: rgb(3, 3, 75) !important;
        background-color: rgb(231, 229, 229) !important;
    }
}

HTML file:

<mat-tab-group>
    <mat-tab label="First"> Content 1 </mat-tab>
    <mat-tab label="Second"> Content 2 </mat-tab>
    <mat-tab label="Third"> Content 3 </mat-tab>
</mat-tab-group>

---

I want to change the style of a mat-tab-group or mat-tab using the styles assigned to the theme through a separate scss file that receives those variables?