Styling of ToggleButton Background and Foreground property not working

[anose001]

Describe the bug

I am trying to use a style on ToggleButton while FluentTheme is being used.

In its unchecked state the background and foreground are styled accordingly.

In its checked state the FluentTheme design takes over. Interestingly, the F12 tool shows that the proper colors as defined in the style are applied over hover or when ischecked but they are not being rendered.

To Reproduce

<UserControl.Styles>

    <Style Selector="ToggleButton.test2:unchecked">
        <Setter Property="Background" Value="Red"/>
        <Setter Property="Foreground" Value="Blue"/>
        <Setter Property="FontSize" Value="16"/>
        <Setter Property="Padding" Value="10"/>

        <!-- Nested style for the checked state -->
        <Style Selector="^:checked">
            <Setter Property="Background" Value="Green"/>
            <Setter Property="Foreground" Value="Yellow"/>
        </Style>

        <!-- Nested style for the pointer over state -->
        <Style Selector="^:pointerover">
            <Setter Property="BorderBrush" Value="Purple"/>
            <Setter Property="BorderThickness" Value="2"/>
        </Style>
    </Style>

    <Style Selector="ToggleButton.test2:unchecked:focus-within:focus:pointerover">
        <Setter Property="Background" Value="Green"/>
        <Setter Property="Foreground" Value="Yellow"/>
        <Setter Property="FontSize" Value="10"/>
        <Setter Property="Padding" Value="10"/>
    </Style>

</UserControl.Styles>

        <ToggleButton Classes="test2">
            <materialIcons:MaterialIcon Kind="Car" Width="24" Height="24"/>
        </ToggleButton>

Expected behavior

See above

Avalonia version

11.0.10

OS

Windows

Additional context

No response

[anose001]

This may or may not be related to #12857 and #12930.

[maxkatz6]

See https://docs.avaloniaui.net/docs/guides/styles-and-resources/troubleshooting#selector-with-a-pseudoclass-doesnt-override-the-default

[anose001]

This helped, thanks