From 84809753092e432e4031af0ef1f7aea6e826b8a7 Mon Sep 17 00:00:00 2001
From: Codex CLI <codex@example.com>
Date: Thu, 28 Aug 2025 05:00:20 -0500
Subject: [PATCH] theme: add centralized palette and apply across app\n\n- Add
 Colors.axaml with brand palette (primary/emphasis)\n- Wire into App.axaml;
 set default window/text styles\n- Theme buttons + variants
 (success/warning/danger)\n- Align browser splash colors to palette

---
 .../wwwroot/app.css                           | 30 ++-----
 src/AdvancedCalculator/App.axaml              |  1 +
 src/AdvancedCalculator/Styles/Colors.axaml    | 89 +++++++++++++++++++
 3 files changed, 97 insertions(+), 23 deletions(-)
 create mode 100644 src/AdvancedCalculator/Styles/Colors.axaml

diff --git a/src/AdvancedCalculator.Browser/wwwroot/app.css b/src/AdvancedCalculator.Browser/wwwroot/app.css
index 1d6f754..8b2a7e7 100644
--- a/src/AdvancedCalculator.Browser/wwwroot/app.css
+++ b/src/AdvancedCalculator.Browser/wwwroot/app.css
@@ -3,7 +3,7 @@
     position: absolute;
     height: 100%;
     width: 100%;
-    background: white;
+    background: white; /* light fallback */
     font-family: 'Outfit', sans-serif;
     justify-content: center;
     align-items: center;
@@ -13,31 +13,15 @@
 
 /* Light theme styles */
 @media (prefers-color-scheme: light) {
-    .avalonia-splash {
-        background: white;
-    }
-
-    .avalonia-splash h2 {
-        color: #1b2a4e;
-    }
-
-    .avalonia-splash a {
-        color: #0D6EFD;
-    }
+    .avalonia-splash { background: #FFFFFF; }
+    .avalonia-splash h2 { color: #223544; }     /* --c-primary-2 */
+    .avalonia-splash a { color: #5AC3D6; }      /* --c-primary-1 */
 }
 
 @media (prefers-color-scheme: dark) {
-    .avalonia-splash {
-        background: #1b2a4e;
-    }
-
-    .avalonia-splash h2 {
-        color: white;
-    }
-
-    .avalonia-splash a {
-        color: white;
-    }
+    .avalonia-splash { background: #223544; }   /* --c-primary-2 */
+    .avalonia-splash h2 { color: #FFFFFF; }
+    .avalonia-splash a { color: #5AC3D6; }      /* --c-primary-1 */
 }
 
 .avalonia-splash h2 {
diff --git a/src/AdvancedCalculator/App.axaml b/src/AdvancedCalculator/App.axaml
index e00805e..965ceb1 100644
--- a/src/AdvancedCalculator/App.axaml
+++ b/src/AdvancedCalculator/App.axaml
@@ -6,6 +6,7 @@
 
     <Application.Styles>
         <FluentTheme />
+        <StyleInclude Source="avares://AdvancedCalculator/Styles/Colors.axaml"/>
         <StyleInclude Source="avares://AdvancedCalculator/Styles/Buttons.axaml"/>
         <StyleInclude Source="avares://AdvancedCalculator/Styles/Typography.axaml"/>
         <StyleInclude Source="avares://AdvancedCalculator/Styles/Scroll.axaml"/>
diff --git a/src/AdvancedCalculator/Styles/Colors.axaml b/src/AdvancedCalculator/Styles/Colors.axaml
new file mode 100644
index 0000000..d1b561f
--- /dev/null
+++ b/src/AdvancedCalculator/Styles/Colors.axaml
@@ -0,0 +1,89 @@
+<Styles xmlns="https://github.com/avaloniaui"
+        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
+  <Styles.Resources>
+    <!-- Core palette -->
+    <Color x:Key="CPrimary1">#FF5AC3D6</Color>
+    <Color x:Key="CPrimary2">#FF223544</Color>
+    <Color x:Key="CPrimary3">#FF4E6D84</Color>
+    <Color x:Key="CEmph1">#FFF5A623</Color>
+    <Color x:Key="CEmph2">#FFD94E87</Color>
+    <Color x:Key="CEmph3">#FF49C46D</Color>
+
+    <!-- Brushes from palette -->
+    <SolidColorBrush x:Key="Brush.Primary1" Color="{DynamicResource CPrimary1}"/>
+    <SolidColorBrush x:Key="Brush.Primary2" Color="{DynamicResource CPrimary2}"/>
+    <SolidColorBrush x:Key="Brush.Primary3" Color="{DynamicResource CPrimary3}"/>
+    <SolidColorBrush x:Key="Brush.Emph1" Color="{DynamicResource CEmph1}"/>
+    <SolidColorBrush x:Key="Brush.Emph2" Color="{DynamicResource CEmph2}"/>
+    <SolidColorBrush x:Key="Brush.Emph3" Color="{DynamicResource CEmph3}"/>
+
+    <!-- Derived brushes for surfaces and text -->
+    <SolidColorBrush x:Key="Brush.Surface">#F0F4F7</SolidColorBrush>
+    <SolidColorBrush x:Key="Brush.SurfaceAlt" Color="{DynamicResource CPrimary3}" Opacity="0.10"/>
+    <SolidColorBrush x:Key="Brush.Foreground">#FF0F1A21</SolidColorBrush>
+    <SolidColorBrush x:Key="Brush.ForegroundOnPrimary">#FFFFFFFF</SolidColorBrush>
+
+    <!-- Accent + theme integration (FluentTheme consumes these) -->
+    <SolidColorBrush x:Key="ThemeAccentBrush" Color="{DynamicResource CPrimary1}"/>
+    <SolidColorBrush x:Key="ThemeBackgroundBrush" Color="{DynamicResource Brush.Surface.Color}"/>
+    <SolidColorBrush x:Key="ThemeForegroundBrush" Color="{DynamicResource Brush.Foreground.Color}"/>
+  </Styles.Resources>
+
+  <!-- Window background -->
+  <Style Selector="Window">
+    <Setter Property="Background" Value="{DynamicResource ThemeBackgroundBrush}"/>
+  </Style>
+
+  <!-- Default text color across the app -->
+  <Style Selector="TextBlock">
+    <Setter Property="Foreground" Value="{DynamicResource ThemeForegroundBrush}"/>
+  </Style>
+
+  <!-- Primary buttons themed with accent color -->
+  <Style Selector="Button">
+    <Setter Property="Background" Value="{DynamicResource ThemeAccentBrush}"/>
+    <Setter Property="Foreground" Value="{DynamicResource Brush.ForegroundOnPrimary}"/>
+    <Setter Property="BorderBrush" Value="{DynamicResource Brush.Primary3}"/>
+  </Style>
+  <Style Selector="Button:pointerover">
+    <Setter Property="Background" Value="{DynamicResource Brush.Primary1}"/>
+    <Setter Property="Opacity" Value="0.95"/>
+  </Style>
+  <Style Selector="Button:pressed">
+    <Setter Property="Opacity" Value="0.88"/>
+  </Style>
+
+  <!-- Emphasis button variants (opt-in via classes) -->
+  <Style Selector="Button.success">
+    <Setter Property="Background" Value="{DynamicResource Brush.Emph3}"/>
+    <Setter Property="Foreground" Value="{DynamicResource Brush.ForegroundOnPrimary}"/>
+    <Setter Property="BorderBrush" Value="{DynamicResource Brush.Primary3}"/>
+  </Style>
+  <Style Selector="Button.warning">
+    <Setter Property="Background" Value="{DynamicResource Brush.Emph1}"/>
+    <Setter Property="Foreground" Value="#FF222222"/>
+    <Setter Property="BorderBrush" Value="{DynamicResource Brush.Primary3}"/>
+  </Style>
+  <Style Selector="Button.danger">
+    <Setter Property="Background" Value="{DynamicResource Brush.Emph2}"/>
+    <Setter Property="Foreground" Value="{DynamicResource Brush.ForegroundOnPrimary}"/>
+    <Setter Property="BorderBrush" Value="{DynamicResource Brush.Primary3}"/>
+  </Style>
+
+  <!-- ToggleButton aligned with Button -->
+  <Style Selector="ToggleButton">
+    <Setter Property="Background" Value="{DynamicResource ThemeAccentBrush}"/>
+    <Setter Property="Foreground" Value="{DynamicResource Brush.ForegroundOnPrimary}"/>
+    <Setter Property="BorderBrush" Value="{DynamicResource Brush.Primary3}"/>
+  </Style>
+  <Style Selector="ToggleButton:checked">
+    <Setter Property="Background" Value="{DynamicResource Brush.Primary3}"/>
+  </Style>
+
+  <!-- Simple card-like border using surface alt -->
+  <Style Selector="Border.card">
+    <Setter Property="Background" Value="{DynamicResource Brush.SurfaceAlt}"/>
+    <Setter Property="CornerRadius" Value="8"/>
+    <Setter Property="Padding" Value="8"/>
+  </Style>
+</Styles>