Custom combo box control in WPF behaves differently on Windows 10 and 7

Question

I am currently working on a WPF application which is to be deployed on both Windows 7 and 10. In the app there is a custom Combo Box control:

<utils:FilteredComboBox
                        Height="28"
                        Background="#222222"
                        FontSize="14"
                        Foreground="White"
                        IsEditable="True"
                        IsEnabled="{Binding ElementsEnabled}"
                        IsTextSearchEnabled="False"
                        ItemsSource="{Binding Path=FlatItemSource, Mode=OneWay}"
                        SelectedItem="{Binding SelectedFlatItem}"
                        StaysOpenOnEdit="True">

                        <utils:FilteredComboBox.Style>
                            <Style>
                                <Setter Property="FrameworkElement.OverridesDefaultStyle" Value="False" />
                            </Style>
                        </utils:FilteredComboBox.Style>

                        <utils:FilteredComboBox.ItemsPanel>
                            <ItemsPanelTemplate>
                                <VirtualizingStackPanel VirtualizationMode="Recycling" />
                            </ItemsPanelTemplate>
                        </utils:FilteredComboBox.ItemsPanel>

                        <utils:FilteredComboBox.ItemTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Vertical">
                                    <TextBlock Style="{StaticResource CardValue}" Text="{Binding Name}" />

                                    <TextBlock
                                        FontSize="10"
                                        Foreground="White"
                                        Text="{Binding Comments}" />
                                </StackPanel>
                            </DataTemplate>
                        </utils:FilteredComboBox.ItemTemplate>
                    </utils:FilteredComboBox>

On Windows 7 it appears normally having the dark gray background both in the TextBox part and in the Dropdown list, as can be seen on screen below.

Custom Combo Box

But on Windows 10 the TextBox part becomes White while the dropdown list remains dark gray. Making any changes to the background property doesn't affect the control, but for example changing the Foreground makes text a different color. There are other combo boxes on the same screen which keep the proper coloring (they are normal combo boxes, not custom one like this one).

How can I fix this? I've tried creating a custom template for the control, but upon trying to Edit a copy of the template, VS (2015) returns an error that copying the template has failed.

Code for the Card Value style that's used in dropdown:

   <Style x:Key="CardValue"
    TargetType="TextBlock">
    <Setter
        Property="FontSize"
        Value="14" />
    <Setter
        Property="FontFamily"
        Value="Segoe UI" />
    <Setter
        Property="Foreground"
        Value="White" />
    </Style>

Answer 1

Seems like problem is in the control template. It uses different default colors on Windows 7 and Windows 10. So you should do next:

1. Open Visual Studio editor
2. Add your combobox somewhere
3. Right click on visual element in Editor: Edit Template=> Edit a copy
4. VS generates new template
5. Create your Resources with colors
6. Change them in your template

Answer 2

I ended up figuring out how to do this myself in just a few hours.

1. Create a separate resource dictionary to put the edited template in. There is no option to create one of these in Visual Studio, but I am pretty sure this is just a renamed XML file with some syntactic sugar. I made a copy of one I already had. It should look like this:

   <ResourceDictionary
       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       xmlns:local="clr-namespace:YourNamespace">
       <!-- nothing here yet -->
   </ResourceDictionary>
   

Let's assume that this file is named CompatibleComboBox.xaml.

2. Add the resource dictionary to your xaml file.

   <Window.Resources>
     <ResourceDictionary>
       <ResourceDictionary.MergedDictionaries>
         <ResourceDictionary Source="..\path\to\CompatibleComboBox.xaml" />
       </ResourceDictionary.MergedDictionaries>
   

This will make it avilable for the next step.

3. Do everything in @WinterMute's answer, placing it in the resource dictionary you just created. This will add a Style reference from your ComboBox to the copied template.
4. In the resource dictionary, find the Border that has a TextBox inside it. Mine is at line 240.
5. Change the Background property to Background="{TemplateBinding Background}". This is the most important part.

But now you have a problem because this won't run on Windows 7. To fix this we need to not use Aero2, which was included when we created a copy of the ComboBox template.

6. Go remove the project reference to PresentationFramework.Aero2
7. Add PresentationFramework.Aero instead.
8. Change the reference at the start of CompatibleComboBox.xaml from Aero2 to Aero.

You now have a ComboBox with a functioning Background property that works in Windows 7, 8, and 10.