Control Template to modify background colour based on IsChecked - wpf

Question

In order to change the visual behaviour of a control, it's necessary to extract the entire ControlTemplate into the xaml and modify the appropriate section. This is not a problem (form the properties view of the control, click on the little square to the right of the Template property and select Convert to New Resource), then edit like...
<ControlTemplate x:Key="ToggleButtonControlTemplate1" TargetType="{x:Type ToggleButton}">
<Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True">
<ContentPresenter x:Name="contentPresenter"
ContentTemplate="{TemplateBinding ContentTemplate}"
Content="{TemplateBinding Content}"
ContentStringFormat="{TemplateBinding ContentStringFormat}" Focusable="False"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
Margin="{TemplateBinding Padding}" RecognizesAccessKey="True"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="Button.IsDefaulted" Value="True">
<Setter Property="BorderBrush" TargetName="border"
Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Background" TargetName="border" Value="#FFBEE6FD"/>
<Setter Property="BorderBrush" TargetName="border" Value="#FF3C7FB1"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Background" TargetName="border" Value="#FFC4E5F6"/>
<Setter Property="BorderBrush" TargetName="border" Value="#FF2C628B"/>
</Trigger>
<Trigger Property="IsChecked" Value="True">
<Setter Property="Background" TargetName="border" Value="#FFBCDDEE"/>
<Setter Property="BorderBrush" TargetName="border" Value="#FF245A83"/>
<Setter Property="Background" TargetName="border" Value="Red"/> <!-- mod -->
</Trigger>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Background" TargetName="border" Value="#FFF4F4F4"/>
<Setter Property="BorderBrush" TargetName="border" Value="#FFADB2B5"/>
<Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="#FF838383"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
I can see that the Border element has been used as the root node in this case and that the ContentPresenter is in the Border Content property,
but, what is the logic behind using the Border element as the visual root and why is the background color of the button managed by setting the BackGround property of the Border?
Also, what elements are available to be used as root nodes and what are the inheritance rules? What is the visual structure of the standard controls and Where can I find some reasonable documentation about this?
I have some vague understanding about the VisualTreeRootNode and the need for a single root node for a template but... only vague.
References
There is some background here but no definitive reference.
The basic concept is documented here and you can drill down to individual controls to find examples. The link to Visual Tree looks promising but its broken. The button section gives some examples but does not give any definitive reference about the topic. I could not answer my questions based on what I read here.

Answer 1

The Border is like a box around your button. It has the Border and the Background properties of a control. So most Controls have Border in their Template, but you can template any Control like you want. You could even use an Ellipse to make a round Button or put every thing into a Grid. For the Functionality the important part is the ContentPresenter. It defines where the Content you set is shown.
The Microsoft documentation delivers good exsamples for every control you want to use. It contains every named Part of the Control and every VisualState it can take.
e.g. https://msdn.microsoft.com/de-de/library/ms753328(v=vs.110).aspx for a Button
For a detailed answer how Templating works in WPF see also:
https://msdn.microsoft.com/en-us/en-en/library/ee230084(v=vs.110).aspx
The Link shows how a Template is built, with the button example and how to set Visual States of a Button.