FlyTeam/SkyTeam/SettingsPage.xaml

<Page x:Class="SkyTeam.SettingsPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:iconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"
      xmlns:properties="clr-namespace:SkyTeam"
      Title="SettingsPage"
      Background="{DynamicResource PageBackground}">

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="180"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <Border Grid.Row="0" Grid.ColumnSpan="2" Background="#FF1E88E5" Padding="15">
            <StackPanel Orientation="Horizontal">
                <Ellipse Width="36" Height="36" Fill="White" Margin="0,0,10,0"/>
                <StackPanel>
                    <TextBlock Text="{x:Static properties:Resources.HeaderTitle}" FontSize="20" FontWeight="Bold" Foreground="White"/>
                    <TextBlock Text="{x:Static properties:Resources.HeaderSubtitle}" FontSize="12" Foreground="White"/>
                </StackPanel>
            </StackPanel>
        </Border>

        <StackPanel Grid.Row="1" Grid.Column="0" Background="{DynamicResource SidebarBackground}">

            <Button Height="50" Margin="5" Click="HomeButton_Click" Background="Transparent" BorderThickness="0">
                <StackPanel Orientation="Horizontal">
                    <iconPacks:PackIconMaterial Kind="Home" Width="20" Margin="0,0,10,0" Foreground="{DynamicResource PrimaryText}"/>
                    <TextBlock Text="{x:Static properties:Resources.SidebarHome}" Foreground="{DynamicResource PrimaryText}"/>
                </StackPanel>
            </Button>

            <Button Height="50" Margin="5" Click="BookingsButton_Click" Background="Transparent" BorderThickness="0">
                <StackPanel Orientation="Horizontal">
                    <iconPacks:PackIconMaterial Kind="Airplane" Width="20" Margin="0,0,10,0" Foreground="{DynamicResource PrimaryText}"/>
                    <TextBlock Text="{x:Static properties:Resources.SidebarBookings}" Foreground="{DynamicResource PrimaryText}"/>
                </StackPanel>
            </Button>

            <Button Height="50" Margin="5" Background="{DynamicResource CardBackground}" BorderThickness="0">
                <StackPanel Orientation="Horizontal">
                    <iconPacks:PackIconMaterial Kind="Cog" Width="20" Margin="0,0,10,0" Foreground="{DynamicResource PrimaryText}"/>
                    <TextBlock Text="{x:Static properties:Resources.SidebarSettings}" FontWeight="Bold" Foreground="{DynamicResource PrimaryText}"/>
                </StackPanel>
            </Button>

            <Button Height="50" Margin="5" Background="#FFEBEB" BorderBrush="#FFB71C1C" Foreground="#D32F2F" FontWeight="Bold" Click="LogoutButton_Click">
                <StackPanel Orientation="Horizontal">
                    <iconPacks:PackIconMaterial Kind="Logout" Width="20" Margin="0,0,10,0"/>
                    <TextBlock Text="{x:Static properties:Resources.SidebarLogout}"/>
                </StackPanel>
            </Button>
        </StackPanel>

        <Grid Grid.Row="1" Grid.Column="1" Margin="30">
            <StackPanel>
                <TextBlock Text="{x:Static properties:Resources.SidebarSettings}" FontSize="28" FontWeight="Bold" Foreground="{DynamicResource PrimaryText}"/>
                <TextBlock Text="{x:Static properties:Resources.CustomizeExperience}" FontSize="16" Foreground="{DynamicResource SecondaryText}" Margin="0,0,0,25"/>

                <Border Background="{DynamicResource CardBackground}" CornerRadius="12" Padding="25" Margin="0,0,0,25">
                    <StackPanel Orientation="Horizontal" VerticalAlignment="Center">
                        <iconPacks:PackIconMaterial Kind="ThemeLightDark" Width="32" Height="32" Foreground="{DynamicResource PrimaryText}" Margin="0,0,15,0"/>

                        <StackPanel VerticalAlignment="Center" Width="300">
                            <TextBlock Text="{x:Static properties:Resources.DarkMode}" FontSize="18" FontWeight="Bold" Foreground="{DynamicResource PrimaryText}"/>
                            <TextBlock Text="{x:Static properties:Resources.EnableDarkMode}" FontSize="14" Foreground="{DynamicResource SecondaryText}"/>
                        </StackPanel>

                        <ToggleButton x:Name="DarkModeToggle" Width="60" Height="30" Checked="DarkModeToggle_Checked" Unchecked="DarkModeToggle_Unchecked">
                            <ToggleButton.Style>
                                <Style TargetType="ToggleButton">
                                    <Setter Property="Template">
                                        <Setter.Value>
                                            <ControlTemplate TargetType="ToggleButton">
                                                <Border x:Name="Border" CornerRadius="15" Background="#E0E0E0" BorderBrush="#999" BorderThickness="1">
                                                    <Grid>
                                                        <Ellipse x:Name="Dot" Width="24" Height="24" HorizontalAlignment="Left" Margin="2,0,0,0" Fill="White">
                                                            <Ellipse.Effect>
                                                                <DropShadowEffect BlurRadius="4" ShadowDepth="1" Opacity="0.3"/>
                                                            </Ellipse.Effect>
                                                        </Ellipse>
                                                    </Grid>
                                                </Border>
                                                <ControlTemplate.Triggers>
                                                    <Trigger Property="IsChecked" Value="True">
                                                        <Setter TargetName="Border" Property="Background" Value="#1E88E5"/>
                                                        <Setter TargetName="Dot" Property="HorizontalAlignment" Value="Right"/>
                                                        <Setter TargetName="Dot" Property="Margin" Value="0,0,2,0"/>
                                                    </Trigger>
                                                </ControlTemplate.Triggers>
                                            </ControlTemplate>
                                        </Setter.Value>
                                    </Setter>
                                </Style>
                            </ToggleButton.Style>
                        </ToggleButton>
                    </StackPanel>
                </Border>

                <Border Background="{DynamicResource CardBackground}" CornerRadius="12" Padding="25" Margin="0,0,0,25">
                    <StackPanel Orientation="Horizontal" VerticalAlignment="Center">

                        <iconPacks:PackIconMaterial Kind="Translate"
                                    Width="32"
                                    Height="32"
                                    Foreground="{DynamicResource PrimaryText}"
                                    Margin="0,0,15,0"/>

                        <StackPanel Width="300">
                            <TextBlock Text="{x:Static properties:Resources.Language}"
                       FontSize="18"
                       FontWeight="Bold"
                       Foreground="{DynamicResource PrimaryText}"/>

                            <TextBlock Text="{x:Static properties:Resources.ChooseLanguage}"
                       FontSize="14"
                       Foreground="{DynamicResource SecondaryText}"/>
                        </StackPanel>

                        <ComboBox x:Name="LanguageComboBox"
                  Width="150"
                  SelectionChanged="LanguageComboBox_SelectionChanged">
                            <ComboBoxItem Content="Deutsch" Tag="de"/>
                            <ComboBoxItem Content="English" Tag="en"/>
                            <ComboBoxItem Content="Українська" Tag="uk"/>
                            <ComboBoxItem Content="العربية" Tag="ar"/>
                        </ComboBox>

                    </StackPanel>
                </Border>

                <Border Background="#FEF2F2" CornerRadius="12" Padding="25" BorderBrush="#EF5350" BorderThickness="1">
                    <StackPanel>
                        <StackPanel Orientation="Horizontal" Margin="0,0,0,15">
                            <iconPacks:PackIconMaterial Kind="Alert" Width="24" Height="24" Foreground="#D32F2F" Margin="0,0,10,0"/>
                            <TextBlock Text="{x:Static properties:Resources.DangerZone}" FontSize="20" FontWeight="Bold" Foreground="#D32F2F"/>
                        </StackPanel>

                        <TextBlock Text="{x:Static properties:Resources.DeleteAccountWarning}" FontSize="14" Foreground="#B71C1C" Margin="0,0,0,15"/>

                        <Button x:Name="DeleteAccountButton" Width="220" Height="45" Background="#D32F2F" Foreground="White" FontWeight="Bold" HorizontalAlignment="Left" Click="DeleteAccountButton_Click">
                            <StackPanel Orientation="Horizontal">
                                <iconPacks:PackIconMaterial Kind="AccountRemove" Width="20" Margin="0,0,10,0"/>
                                <TextBlock Text="{x:Static properties:Resources.DeleteAccount}"/>
                            </StackPanel>
                        </Button>
                    </StackPanel>
                </Border>
            </StackPanel>
        </Grid>
    </Grid>
</Page>