WPF Metro controls with Material Design XAML Toolkit

Question

I am creating a basic template project with Template Studio for WinUI which has a navigation bar using MahApps.Metro controls.

The problem is that I should get the Material Design theme style in Metro controls as I do with normal controls, using MaterialDesignThemes.MahApps 0.3.0, but I am not seeing it. How should I set it instead of Metro?

Here is my App.xaml code:

<Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Styles/_FontSizes.xaml" />
                <ResourceDictionary Source="/Styles/_Thickness.xaml" />
                <ResourceDictionary Source="/Styles/MetroWindow.xaml" />
                <ResourceDictionary Source="/Styles/TextBlock.xaml" />
                <ResourceDictionary Source="/Styles/UserControl.xaml" />
                <!--
                MahApps.Metro resource dictionaries.
                Learn more about using MahApps.Metro at https://mahapps.com/
                -->
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
                <!-- Accent and AppTheme setting -->
                <ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Themes/Light.Blue.xaml" />

                <!-- Material Design -->
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Light.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Primary/MaterialDesignColor.LightGreen.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Accent/MaterialDesignColor.LightGreen.xaml" />

                <!-- Material Design: MahApps Compatibility -->
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.MahApps;component/Themes/MaterialDesignTheme.MahApps.Defaults.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.MahApps;component/Themes/MaterialDesignTheme.MahApps.Fonts.xaml" />
                <ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.MahApps;component/Themes/MaterialDesignTheme.MahApps.Flyout.xaml" />


            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>

    </Application.Resources>

And my ShellWindow.xaml looks like this:

    <controls:MetroWindow
    x:Class="App1.Views.ShellWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:controls="http://metro.mahapps.com/winfx/xaml/controls"
    xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
    xmlns:properties="clr-namespace:App1.Properties"
    xmlns:templateSelectors="clr-namespace:App1.TemplateSelectors"
    Style="{StaticResource CustomMetroWindow}"
    mc:Ignorable="d"
    MinWidth="500"
    MinHeight="350"
    Title="{x:Static properties:Resources.AppDisplayName}">
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="Loaded">
            <i:InvokeCommandAction Command="{Binding LoadedCommand}" />
        </i:EventTrigger>
        <i:EventTrigger EventName="Unloaded">
            <i:InvokeCommandAction Command="{Binding UnloadedCommand}" />
        </i:EventTrigger>
    </i:Interaction.Triggers>
    <controls:MetroWindow.LeftWindowCommands>
        <controls:WindowCommands>
            <Button
                Width="{Binding ElementName=hamburgerMenu, Path=CompactPaneLength}"
                AutomationProperties.Name="{x:Static properties:Resources.ShellGoBackButton}"
                ToolTip="{x:Static properties:Resources.ShellGoBackButton}"
                Command="{Binding GoBackCommand}">
                <TextBlock
                    Text="&#xE72B;"
                    FontSize="14"
                    FontFamily="Segoe MDL2 Assets"
                    AutomationProperties.Name="{x:Static properties:Resources.ShellGoBackButton}" />
            </Button>
        </controls:WindowCommands>
    </controls:MetroWindow.LeftWindowCommands>
    <controls:MetroWindow.Resources>
        <templateSelectors:MenuItemTemplateSelector
            x:Key="MenuItemTemplateSelector">
            <templateSelectors:MenuItemTemplateSelector.GlyphDataTemplate>
                <DataTemplate DataType="{x:Type controls:HamburgerMenuGlyphItem}">
                    <Grid Height="48">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="48" />
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>
                        <TextBlock
                            Grid.Column="0"
                            FontSize="16"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            FontFamily="Segoe MDL2 Assets"
                            Text="{Binding Glyph}"
                            ToolTip="{Binding Label}" />
                        <TextBlock
                            Grid.Column="1"
                            VerticalAlignment="Center"
                            FontSize="16"
                            Text="{Binding Label}" />
                    </Grid>
                </DataTemplate>
            </templateSelectors:MenuItemTemplateSelector.GlyphDataTemplate>
            <templateSelectors:MenuItemTemplateSelector.ImageDataTemplate>
                <DataTemplate DataType="{x:Type controls:HamburgerMenuImageItem}">
                    <Grid Height="48">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="48" />
                            <ColumnDefinition />
                        </Grid.ColumnDefinitions>
                        <Ellipse
                            Grid.Column="0"
                            Width="24"
                            Height="24"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Center"
                            ToolTip="{Binding Label}">
                            <Ellipse.Fill>
                                <ImageBrush ImageSource="{Binding Thumbnail}" />
                            </Ellipse.Fill>
                        </Ellipse>
                        <TextBlock
                            Grid.Column="1"
                            VerticalAlignment="Center"
                            FontSize="16"
                            Text="{Binding Label}" />
                    </Grid>
                </DataTemplate>
            </templateSelectors:MenuItemTemplateSelector.ImageDataTemplate>
        </templateSelectors:MenuItemTemplateSelector>
    </controls:MetroWindow.Resources>
    <controls:MetroWindow.Content>
        <controls:HamburgerMenu
            x:Name="hamburgerMenu"
            HamburgerButtonName="{x:Static properties:Resources.ShellHamburgerButtonName}"
            IsPaneOpen="False"
            DisplayMode="CompactInline"
            ItemsSource="{Binding MenuItems}"
            SelectedItem="{Binding SelectedMenuItem}"
            ItemCommand="{Binding MenuItemInvokedCommand}"
            ItemTemplateSelector="{StaticResource MenuItemTemplateSelector}">
            <controls:HamburgerMenu.Content>
                <ContentControl x:Name="hamburgerMenuContentControl" />
            </controls:HamburgerMenu.Content>
        </controls:HamburgerMenu>
    </controls:MetroWindow.Content>
</controls:MetroWindow>

Anyone know what I am missing?