From d5c34b097b5006b7115b927711214ef4587cc366 Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Fri, 10 Apr 2026 20:23:02 +0200
Subject: [PATCH 01/13] refactor: establish fluent ux foundation styles

---
 BusLane.Tests/Views/AppThemeResourceTests.cs | 66 ++++++++++++++++++++
 BusLane/App.axaml                            |  4 ++
 BusLane/Styles/AppStyles.axaml               | 59 ++++++++++++++---
 3 files changed, 122 insertions(+), 7 deletions(-)
 create mode 100644 BusLane.Tests/Views/AppThemeResourceTests.cs

diff --git a/BusLane.Tests/Views/AppThemeResourceTests.cs b/BusLane.Tests/Views/AppThemeResourceTests.cs
new file mode 100644
index 0000000..3b4b77c
--- /dev/null
+++ b/BusLane.Tests/Views/AppThemeResourceTests.cs
@@ -0,0 +1,66 @@
+namespace BusLane.Tests.Views;
+
+using FluentAssertions;
+
+public class AppThemeResourceTests
+{
+    [Fact]
+    public void AppResources_DefineSharedDashboardSurfaceTokens()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetAppPath());
+
+        // Assert
+        xaml.Should().Contain("x:Key=\"LayerBackground\"");
+        xaml.Should().Contain("x:Key=\"AccentBrandSubtle\"");
+    }
+
+    [Fact]
+    public void AppStyles_DefineSharedToggleAndMenuStyles()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetStylesPath());
+
+        // Assert
+        xaml.Should().Contain("<Style Selector=\"ToggleSwitch\">");
+        xaml.Should().Contain("<Style Selector=\"CheckBox\">");
+        xaml.Should().Contain("<Style Selector=\"ContextMenu\">");
+        xaml.Should().Contain("<Style Selector=\"MenuItem\">");
+    }
+
+    [Fact]
+    public void AppStyles_PanelToggleUsesMinimumAccessibleHitTarget()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetStylesPath());
+
+        // Assert
+        xaml.Should().Contain("<Setter Property=\"MinWidth\" Value=\"36\"/>");
+        xaml.Should().Contain("<Setter Property=\"MinHeight\" Value=\"36\"/>");
+    }
+
+    private static string GetAppPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "App.axaml"));
+    }
+
+    private static string GetStylesPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Styles",
+            "AppStyles.axaml"));
+    }
+}
diff --git a/BusLane/App.axaml b/BusLane/App.axaml
index a2daf93..8a1af9a 100644
--- a/BusLane/App.axaml
+++ b/BusLane/App.axaml
@@ -48,6 +48,7 @@
                     <SolidColorBrush x:Key="CardBackground" Color="#FFFFFF"/>
                     <SolidColorBrush x:Key="SidebarBackground" Color="#FAFAFA"/>
                     <SolidColorBrush x:Key="SurfaceSubtle" Color="#F9F9F9"/>
+                    <SolidColorBrush x:Key="LayerBackground" Color="#EFEFEF"/>
 
                     <!-- Border colors - Fluent 2 stroke tokens -->
                     <SolidColorBrush x:Key="BorderDefault" Color="#E0E0E0"/>
@@ -58,6 +59,7 @@
                     <SolidColorBrush x:Key="AccentBrand" Color="#0F6CBD"/>
                     <SolidColorBrush x:Key="AccentBrandHover" Color="#115EA3"/>
                     <SolidColorBrush x:Key="AccentBrandPressed" Color="#0C4A7E"/>
+                    <SolidColorBrush x:Key="AccentBrandSubtle" Color="#D9EDFC"/>
                     <SolidColorBrush x:Key="TextOnBrand" Color="#FFFFFF"/>
 
                     <!-- Surface backgrounds with brand tint -->
@@ -126,6 +128,7 @@
                     <SolidColorBrush x:Key="CardBackground" Color="#292929"/>
                     <SolidColorBrush x:Key="SidebarBackground" Color="#1C1C1C"/>
                     <SolidColorBrush x:Key="SurfaceSubtle" Color="#242424"/>
+                    <SolidColorBrush x:Key="LayerBackground" Color="#202020"/>
 
                     <!-- Border colors - Fluent 2 stroke tokens for dark -->
                     <SolidColorBrush x:Key="BorderDefault" Color="#424242"/>
@@ -136,6 +139,7 @@
                     <SolidColorBrush x:Key="AccentBrand" Color="#60CDFF"/>
                     <SolidColorBrush x:Key="AccentBrandHover" Color="#8CD9FF"/>
                     <SolidColorBrush x:Key="AccentBrandPressed" Color="#3AA0F3"/>
+                    <SolidColorBrush x:Key="AccentBrandSubtle" Color="#0F2D40"/>
                     <SolidColorBrush x:Key="TextOnBrand" Color="#000000"/>
 
                     <!-- Surface backgrounds with brand tint -->
diff --git a/BusLane/Styles/AppStyles.axaml b/BusLane/Styles/AppStyles.axaml
index eb49aed..206f5f9 100644
--- a/BusLane/Styles/AppStyles.axaml
+++ b/BusLane/Styles/AppStyles.axaml
@@ -393,6 +393,28 @@
         <Setter Property="BorderBrush" Value="{DynamicResource AccentBrand}"/>
     </Style>
 
+    <Style Selector="ToggleSwitch">
+        <Setter Property="MinWidth" Value="52"/>
+        <Setter Property="MinHeight" Value="36"/>
+    </Style>
+
+    <Style Selector="CheckBox">
+        <Setter Property="MinHeight" Value="36"/>
+        <Setter Property="Foreground" Value="{DynamicResource AppForeground}"/>
+    </Style>
+
+    <Style Selector="ContextMenu">
+        <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderDefault}"/>
+        <Setter Property="BorderThickness" Value="1"/>
+    </Style>
+
+    <Style Selector="MenuItem">
+        <Setter Property="MinHeight" Value="36"/>
+        <Setter Property="Padding" Value="12,8"/>
+        <Setter Property="Foreground" Value="{DynamicResource AppForeground}"/>
+    </Style>
+
     <!-- Toggle/Pill Button - Fluent 2 style -->
     <Style Selector="ToggleButton.pill">
         <Setter Property="Background" Value="Transparent"/>
@@ -945,6 +967,28 @@
         <Setter Property="Padding" Value="24,32"/>
     </Style>
 
+    <Style Selector="Border.page-header-surface">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
+        <Setter Property="CornerRadius" Value="12"/>
+        <Setter Property="Padding" Value="20,18"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="Border.pane-search-surface">
+        <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
+        <Setter Property="CornerRadius" Value="10"/>
+        <Setter Property="Padding" Value="12,10"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderDefault}"/>
+    </Style>
+
+    <Style Selector="StackPanel.dialog-footer-actions">
+        <Setter Property="Orientation" Value="Horizontal"/>
+        <Setter Property="Spacing" Value="8"/>
+        <Setter Property="HorizontalAlignment" Value="Right"/>
+    </Style>
+
     <!-- Fluent 2 Segmented Control / Tab Navigation for dialogs -->
     <Style Selector="Border.tab-nav">
         <Setter Property="Background" Value="{DynamicResource TabNavBackground}"/>
@@ -1294,8 +1338,8 @@
         <Setter Property="BorderThickness" Value="0"/>
         <Setter Property="CornerRadius" Value="4"/>
         <Setter Property="Cursor" Value="Hand"/>
-        <Setter Property="MinWidth" Value="32"/>
-        <Setter Property="MinHeight" Value="32"/>
+        <Setter Property="MinWidth" Value="36"/>
+        <Setter Property="MinHeight" Value="36"/>
     </Style>
 
     <Style Selector="Button.icon-button:pointerover /template/ ContentPresenter">
@@ -1319,8 +1363,8 @@
         <Setter Property="BorderBrush" Value="Transparent"/>
         <Setter Property="CornerRadius" Value="6"/>
         <Setter Property="Cursor" Value="Hand"/>
-        <Setter Property="MinWidth" Value="30"/>
-        <Setter Property="MinHeight" Value="30"/>
+        <Setter Property="MinWidth" Value="36"/>
+        <Setter Property="MinHeight" Value="36"/>
     </Style>
 
     <Style Selector="Button.panel-toggle:pointerover /template/ ContentPresenter">
@@ -1345,8 +1389,8 @@
         <Setter Property="BorderThickness" Value="0"/>
         <Setter Property="CornerRadius" Value="4"/>
         <Setter Property="Cursor" Value="Hand"/>
-        <Setter Property="MinWidth" Value="32"/>
-        <Setter Property="MinHeight" Value="32"/>
+        <Setter Property="MinWidth" Value="36"/>
+        <Setter Property="MinHeight" Value="36"/>
     </Style>
 
     <Style Selector="ToggleButton.icon-button:pointerover /template/ ContentPresenter">
@@ -1371,7 +1415,8 @@
         <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
         <Setter Property="CornerRadius" Value="10"/>
         <Setter Property="Cursor" Value="Hand"/>
-        <Setter Property="MinWidth" Value="30"/>
+        <Setter Property="MinWidth" Value="36"/>
+        <Setter Property="MinHeight" Value="36"/>
         <Setter Property="HorizontalAlignment" Value="Stretch"/>
         <Setter Property="VerticalAlignment" Value="Stretch"/>
     </Style>

From 1fc2b4c7b534408c139c776ecd2f0f03ee90a99f Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Fri, 10 Apr 2026 20:27:07 +0200
Subject: [PATCH 02/13] refactor: make workspace tabs accessible

---
 BusLane.Tests/Views/TabBarViewTests.cs     | 42 ++++++++++
 BusLane/Styles/AppStyles.axaml             | 96 ++++++++++++++++++++++
 BusLane/Views/Controls/TabBarView.axaml    | 56 +++----------
 BusLane/Views/Controls/TabBarView.axaml.cs | 19 ++---
 4 files changed, 156 insertions(+), 57 deletions(-)
 create mode 100644 BusLane.Tests/Views/TabBarViewTests.cs

diff --git a/BusLane.Tests/Views/TabBarViewTests.cs b/BusLane.Tests/Views/TabBarViewTests.cs
new file mode 100644
index 0000000..3cd6c92
--- /dev/null
+++ b/BusLane.Tests/Views/TabBarViewTests.cs
@@ -0,0 +1,42 @@
+namespace BusLane.Tests.Views;
+
+using FluentAssertions;
+
+public class TabBarViewTests
+{
+    [Fact]
+    public void TabBarView_DoesNotUsePointerPressedBorderTabs()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetTabBarPath());
+
+        // Assert
+        xaml.Should().NotContain("PointerPressed=\"TabBorder_PointerPressed\"");
+        xaml.Should().NotContain("Classes=\"tab-border\"");
+    }
+
+    [Fact]
+    public void TabBarView_UsesAccessibleTabButtons()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetTabBarPath());
+
+        // Assert
+        xaml.Should().Contain("RadioButton");
+        xaml.Should().Contain("GroupName=\"ConnectionTabs\"");
+    }
+
+    private static string GetTabBarPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Views",
+            "Controls",
+            "TabBarView.axaml"));
+    }
+}
diff --git a/BusLane/Styles/AppStyles.axaml b/BusLane/Styles/AppStyles.axaml
index 206f5f9..b0c4a17 100644
--- a/BusLane/Styles/AppStyles.axaml
+++ b/BusLane/Styles/AppStyles.axaml
@@ -1056,6 +1056,81 @@
         <Setter Property="Background" Value="{DynamicResource TabItemHover}"/>
     </Style>
 
+    <Style Selector="RadioButton.workspace-tab">
+        <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
+        <Setter Property="Foreground" Value="{DynamicResource AppForeground}"/>
+        <Setter Property="Padding" Value="14,10"/>
+        <Setter Property="MinHeight" Value="44"/>
+        <Setter Property="Cursor" Value="Hand"/>
+        <Setter Property="Template">
+            <ControlTemplate>
+                <Border x:Name="PART_Border"
+                        Background="{TemplateBinding Background}"
+                        BorderBrush="{DynamicResource BorderDefault}"
+                        BorderThickness="1"
+                        CornerRadius="10"
+                        Padding="{TemplateBinding Padding}">
+                    <ContentPresenter x:Name="PART_ContentPresenter"
+                                      Content="{TemplateBinding Content}"
+                                      ContentTemplate="{TemplateBinding ContentTemplate}"
+                                      HorizontalAlignment="Stretch"
+                                      VerticalAlignment="Center"/>
+                </Border>
+            </ControlTemplate>
+        </Setter>
+    </Style>
+
+    <Style Selector="RadioButton.workspace-tab:pointerover /template/ Border#PART_Border">
+        <Setter Property="Background" Value="{DynamicResource HoverBackground}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderStrong}"/>
+    </Style>
+
+    <Style Selector="RadioButton.workspace-tab:checked /template/ Border#PART_Border">
+        <Setter Property="Background" Value="{DynamicResource SelectedBackground}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource SelectedBorder}"/>
+        <Setter Property="BoxShadow" Value="0 2 4 0 #20000000"/>
+    </Style>
+
+    <Style Selector="RadioButton.workspace-tab:focus-visible /template/ Border#PART_Border">
+        <Setter Property="BoxShadow" Value="{DynamicResource FocusRingAccent}"/>
+    </Style>
+
+    <Style Selector="TextBlock.workspace-tab-title">
+        <Setter Property="FontSize" Value="13"/>
+        <Setter Property="FontWeight" Value="SemiBold"/>
+        <Setter Property="Foreground" Value="{DynamicResource AppForeground}"/>
+    </Style>
+
+    <Style Selector="TextBlock.workspace-tab-title.active">
+        <Setter Property="Foreground" Value="{DynamicResource AccentBrand}"/>
+    </Style>
+
+    <Style Selector="TextBlock.workspace-tab-subtitle">
+        <Setter Property="FontSize" Value="11"/>
+        <Setter Property="Foreground" Value="{DynamicResource SubtleForeground}"/>
+        <Setter Property="Opacity" Value="0.65"/>
+    </Style>
+
+    <Style Selector="Button.workspace-tab-close">
+        <Setter Property="Background" Value="Transparent"/>
+        <Setter Property="Foreground" Value="{DynamicResource SubtleForeground}"/>
+        <Setter Property="Padding" Value="4"/>
+        <Setter Property="BorderThickness" Value="0"/>
+        <Setter Property="CornerRadius" Value="6"/>
+        <Setter Property="Cursor" Value="Hand"/>
+        <Setter Property="MinWidth" Value="24"/>
+        <Setter Property="MinHeight" Value="24"/>
+    </Style>
+
+    <Style Selector="Button.workspace-tab-close:pointerover /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource HoverBackground}"/>
+        <Setter Property="Foreground" Value="{DynamicResource AppForeground}"/>
+    </Style>
+
+    <Style Selector="Button.workspace-tab-close:focus-visible /template/ ContentPresenter">
+        <Setter Property="BoxShadow" Value="{DynamicResource FocusRingAccent}"/>
+    </Style>
+
     <!-- Field group header -->
     <Style Selector="TextBlock.field-group-header">
         <Setter Property="FontSize" Value="11"/>
@@ -1330,6 +1405,27 @@
         <Setter Property="Padding" Value="12,10"/>
     </Style>
 
+    <Style Selector="Button.workspace-new-tab">
+        <Setter Property="Background" Value="{DynamicResource SurfaceSubtle}"/>
+        <Setter Property="Foreground" Value="{DynamicResource SubtleForeground}"/>
+        <Setter Property="Padding" Value="8,6"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+        <Setter Property="CornerRadius" Value="8"/>
+        <Setter Property="Cursor" Value="Hand"/>
+        <Setter Property="MinHeight" Value="36"/>
+    </Style>
+
+    <Style Selector="Button.workspace-new-tab:pointerover /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
+        <Setter Property="Foreground" Value="{DynamicResource AppForeground}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderStrong}"/>
+    </Style>
+
+    <Style Selector="Button.workspace-new-tab:focus-visible /template/ ContentPresenter">
+        <Setter Property="BoxShadow" Value="{DynamicResource FocusRingAccent}"/>
+    </Style>
+
     <!-- Compact icon button for toolbar area -->
     <Style Selector="Button.icon-button">
         <Setter Property="Background" Value="Transparent"/>
diff --git a/BusLane/Views/Controls/TabBarView.axaml b/BusLane/Views/Controls/TabBarView.axaml
index 3379d6d..f56f962 100644
--- a/BusLane/Views/Controls/TabBarView.axaml
+++ b/BusLane/Views/Controls/TabBarView.axaml
@@ -25,41 +25,12 @@
                     </ItemsControl.ItemsPanel>
                     <ItemsControl.ItemTemplate>
                         <DataTemplate x:DataType="core:ConnectionTabViewModel">
-                            <Border Classes="tab-border"
-                                    Classes.active="{Binding IsActive}"
-                                    Padding="14,10"
-                                    MinWidth="140"
-                                    MaxWidth="220"
-                                    Background="{DynamicResource CardBackground}"
-                                    BorderBrush="{DynamicResource BorderDefault}"
-                                    PointerPressed="TabBorder_PointerPressed"
-                                    Cursor="Hand">
-                                <Border.Styles>
-                                    <Style Selector="Border.tab-border">
-                                        <Setter Property="BorderThickness" Value="1"/>
-                                        <Setter Property="CornerRadius" Value="8"/>
-                                    </Style>
-                                    <Style Selector="Border.tab-border:pointerover">
-                                        <Setter Property="Background" Value="{DynamicResource HoverBackground}"/>
-                                    </Style>
-                                    <Style Selector="Border.tab-border.active">
-                                        <Setter Property="Background" Value="{DynamicResource SelectedBackground}"/>
-                                        <Setter Property="BorderBrush" Value="{DynamicResource SelectedBorder}"/>
-                                        <Setter Property="BoxShadow" Value="0 2 4 0 #20000000"/>
-                                    </Style>
-                                    <Style Selector="Border.tab-border.active:pointerover">
-                                        <Setter Property="Background" Value="{DynamicResource SelectedBackground}"/>
-                                    </Style>
-                                    <Style Selector="TextBlock.tab-title">
-                                        <Setter Property="FontWeight" Value="SemiBold"/>
-                                        <Setter Property="Foreground" Value="{DynamicResource AppForeground}"/>
-                                    </Style>
-                                    <Style Selector="TextBlock.tab-title.active">
-                                        <Setter Property="FontWeight" Value="Bold"/>
-                                        <Setter Property="Foreground" Value="{DynamicResource AccentBrand}"/>
-                                    </Style>
-                                </Border.Styles>
-
+                            <RadioButton Classes="workspace-tab"
+                                         GroupName="ConnectionTabs"
+                                         IsChecked="{Binding IsActive, Mode=OneWay}"
+                                         Checked="TabRadioButton_Checked"
+                                         MinWidth="140"
+                                         MaxWidth="220">
                                 <Grid ColumnDefinitions="Auto,*,Auto">
                                     <!-- Loading Indicator (shown while connecting) -->
                                     <Border Grid.Column="0"
@@ -114,30 +85,26 @@
                                     <!-- Tab Title & Subtitle -->
                                     <StackPanel Grid.Column="1" Spacing="2" VerticalAlignment="Center">
                                         <TextBlock Text="{Binding TabTitle}"
-                                                   Classes="tab-title"
+                                                   Classes="workspace-tab-title"
                                                    Classes.active="{Binding IsActive}"
-                                                   FontSize="13"
                                                    TextTrimming="CharacterEllipsis"/>
                                         <TextBlock Text="{Binding TabSubtitle}"
-                                                   FontSize="11"
-                                                   Foreground="{DynamicResource SubtleForeground}"
-                                                   Opacity="0.65"
+                                                   Classes="workspace-tab-subtitle"
                                                    TextTrimming="CharacterEllipsis"/>
                                     </StackPanel>
 
                                     <!-- Close Button -->
                                     <Button Grid.Column="2"
-                                            Classes="subtle"
+                                            Classes="workspace-tab-close"
                                             Command="{Binding $parent[UserControl].((vm:MainWindowViewModel)DataContext).CloseTabCommand}"
                                             CommandParameter="{Binding TabId}"
-                                            Padding="4"
                                             Margin="8,0,0,0"
                                             VerticalAlignment="Center"
                                             ToolTip.Tip="Close tab">
                                         <LucideIcon Kind="X" Size="12"/>
                                     </Button>
                                 </Grid>
-                            </Border>
+                            </RadioButton>
                         </DataTemplate>
                     </ItemsControl.ItemTemplate>
                 </ItemsControl>
@@ -146,9 +113,8 @@
             <!-- Action Buttons -->
             <StackPanel Grid.Column="1" Orientation="Horizontal" Spacing="4" VerticalAlignment="Center">
                 <!-- New Tab Button -->
-                <Button Classes="subtle icon-button"
+                <Button Classes="workspace-new-tab"
                         Command="{Binding OpenConnectionLibraryCommand}"
-                        Padding="6"
                         ToolTip.Tip="Open new connection tab">
                     <StackPanel Orientation="Horizontal" Spacing="4" VerticalAlignment="Center">
                         <LucideIcon Kind="Plus" Size="14"/>
diff --git a/BusLane/Views/Controls/TabBarView.axaml.cs b/BusLane/Views/Controls/TabBarView.axaml.cs
index ae0048f..b61f8aa 100644
--- a/BusLane/Views/Controls/TabBarView.axaml.cs
+++ b/BusLane/Views/Controls/TabBarView.axaml.cs
@@ -1,6 +1,6 @@
 // BusLane/Views/Controls/TabBarView.axaml.cs
 using Avalonia.Controls;
-using Avalonia.Input;
+using Avalonia.Interactivity;
 using BusLane.ViewModels;
 
 namespace BusLane.Views.Controls;
@@ -12,19 +12,14 @@ public TabBarView()
         InitializeComponent();
     }
 
-    private void TabBorder_PointerPressed(object? sender, PointerPressedEventArgs e)
+    private void TabRadioButton_Checked(object? sender, RoutedEventArgs e)
     {
-        // Only handle left mouse button clicks
-        if (!e.GetCurrentPoint(this).Properties.IsLeftButtonPressed)
-            return;
-
-        if (sender is Border border && border.DataContext is ViewModels.Core.ConnectionTabViewModel tabVm)
+        if (sender is RadioButton radioButton &&
+            radioButton.DataContext is ViewModels.Core.ConnectionTabViewModel tabVm &&
+            radioButton.IsChecked == true &&
+            DataContext is MainWindowViewModel vm)
         {
-            if (DataContext is MainWindowViewModel vm)
-            {
-                vm.SwitchToTab(tabVm.TabId);
-                // Note: Do NOT set e.Handled = true here as it interferes with cursor state updates
-            }
+            vm.SwitchToTab(tabVm.TabId);
         }
     }
 }

From 56a5742f21a9b29b6776538e67b52c9be821642c Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Fri, 10 Apr 2026 20:30:22 +0200
Subject: [PATCH 03/13] refactor: improve entity browser accessibility

---
 BusLane.Tests/Views/EntityTreeViewTests.cs    |  65 ++++++++
 BusLane/Styles/AppStyles.axaml                |  25 ++-
 .../Views/Controls/AzureEntityTreeView.axaml  | 157 +++++++++---------
 BusLane/Views/Controls/EntityTreeView.axaml   | 157 +++++++++---------
 4 files changed, 243 insertions(+), 161 deletions(-)
 create mode 100644 BusLane.Tests/Views/EntityTreeViewTests.cs

diff --git a/BusLane.Tests/Views/EntityTreeViewTests.cs b/BusLane.Tests/Views/EntityTreeViewTests.cs
new file mode 100644
index 0000000..86b3408
--- /dev/null
+++ b/BusLane.Tests/Views/EntityTreeViewTests.cs
@@ -0,0 +1,65 @@
+namespace BusLane.Tests.Views;
+
+using FluentAssertions;
+
+public class EntityTreeViewTests
+{
+    [Fact]
+    public void AppStyles_EntityListItemsRemainFocusable()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetStylesPath());
+
+        // Assert
+        xaml.Should().NotContain("<Setter Property=\"Focusable\" Value=\"False\"/>");
+    }
+
+    [Fact]
+    public void EntityTreeViews_UseSharedSearchSurfaceClass()
+    {
+        // Assert
+        File.ReadAllText(GetConnectionTreePath()).Should().Contain("Classes=\"pane-search-surface\"");
+        File.ReadAllText(GetAzureTreePath()).Should().Contain("Classes=\"pane-search-surface\"");
+    }
+
+    private static string GetStylesPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Styles",
+            "AppStyles.axaml"));
+    }
+
+    private static string GetConnectionTreePath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Views",
+            "Controls",
+            "EntityTreeView.axaml"));
+    }
+
+    private static string GetAzureTreePath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Views",
+            "Controls",
+            "AzureEntityTreeView.axaml"));
+    }
+}
diff --git a/BusLane/Styles/AppStyles.axaml b/BusLane/Styles/AppStyles.axaml
index b0c4a17..bbc3854 100644
--- a/BusLane/Styles/AppStyles.axaml
+++ b/BusLane/Styles/AppStyles.axaml
@@ -287,7 +287,6 @@
         <Setter Property="Padding" Value="0"/>
         <Setter Property="Margin" Value="0"/>
         <Setter Property="Background" Value="Transparent"/>
-        <Setter Property="Focusable" Value="False"/>
     </Style>
 
     <Style Selector="ListBox.entity-list ListBoxItem:pointerover /template/ ContentPresenter">
@@ -824,17 +823,27 @@
     </Style>
 
     <Style Selector="Border.entity-tree-section-count">
-        <Setter Property="Background" Value="{DynamicResource SurfaceSubtle}"/>
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
         <Setter Property="CornerRadius" Value="9"/>
         <Setter Property="Padding" Value="6,1"/>
         <Setter Property="BorderThickness" Value="1"/>
         <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
     </Style>
 
+    <Style Selector="Border.entity-group-header">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
+        <Setter Property="CornerRadius" Value="8"/>
+        <Setter Property="Padding" Value="8,6"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
     <Style Selector="Border.entity-tree-row-surface">
-        <Setter Property="CornerRadius" Value="5"/>
-        <Setter Property="Padding" Value="6,4"/>
+        <Setter Property="CornerRadius" Value="8"/>
+        <Setter Property="Padding" Value="8,6"/>
         <Setter Property="Margin" Value="4,0,0,0"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
     </Style>
 
     <Style Selector="Border.entity-tree-loading">
@@ -850,12 +859,14 @@
     </Style>
 
     <Style Selector="Border.entity-tree-badge">
-        <Setter Property="CornerRadius" Value="3"/>
-        <Setter Property="Padding" Value="4,1"/>
+        <Setter Property="CornerRadius" Value="8"/>
+        <Setter Property="Padding" Value="6,2"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
     </Style>
 
     <Style Selector="Border.entity-tree-badge TextBlock">
-        <Setter Property="FontSize" Value="9"/>
+        <Setter Property="FontSize" Value="10"/>
         <Setter Property="FontWeight" Value="SemiBold"/>
     </Style>
 
diff --git a/BusLane/Views/Controls/AzureEntityTreeView.axaml b/BusLane/Views/Controls/AzureEntityTreeView.axaml
index d2ead32..62462bc 100644
--- a/BusLane/Views/Controls/AzureEntityTreeView.axaml
+++ b/BusLane/Views/Controls/AzureEntityTreeView.axaml
@@ -15,36 +15,35 @@
     <Border Classes="card" Padding="0">
         <DockPanel>
             <Border DockPanel.Dock="Top"
-                    Padding="8,8,8,6"
-                    Background="{DynamicResource SurfaceSubtle}"
-                    BorderBrush="{DynamicResource BorderMuted}"
-                    BorderThickness="0,0,0,1">
-                <Grid ColumnDefinitions="*,Auto" ColumnSpacing="8">
-                    <TextBox Grid.Column="0"
-                             Text="{Binding CurrentNavigation.EntityFilter, Mode=TwoWay}"
-                             Watermark="Filter entities..."
-                             FontSize="12"
-                             Padding="4,4,4,4"
-                             CornerRadius="6"
-                             BorderBrush="{DynamicResource BorderMuted}">
-                        <TextBox.InnerLeftContent>
-                            <LucideIcon Kind="Search"
-                                        Size="13"
-                                        Foreground="{DynamicResource SubtleForeground}"
-                                        Margin="5,0,0,0"/>
-                        </TextBox.InnerLeftContent>
-                    </TextBox>
+                    Classes="pane-search-surface">
+                <StackPanel Spacing="8">
+                    <TextBlock Text="Browse entities"
+                               Classes="caption"/>
+                    <Grid ColumnDefinitions="*,Auto" ColumnSpacing="8">
+                        <TextBox Grid.Column="0"
+                                 Text="{Binding CurrentNavigation.EntityFilter, Mode=TwoWay}"
+                                 Watermark="Search queues, topics, or subscriptions"
+                                 FontSize="12"
+                                 Padding="4,4,4,4"
+                                 CornerRadius="6"
+                                 BorderBrush="{DynamicResource BorderMuted}">
+                            <TextBox.InnerLeftContent>
+                                <LucideIcon Kind="Search"
+                                            Size="13"
+                                            Foreground="{DynamicResource SubtleForeground}"
+                                            Margin="5,0,0,0"/>
+                            </TextBox.InnerLeftContent>
+                        </TextBox>
 
-                    <Button Grid.Column="1"
-                            Classes="icon-button"
-                            Command="{Binding HideEntityPaneCommand}"
-                            ToolTip.Tip="Hide entity pane"
-                            MinWidth="30"
-                            MinHeight="30"
-                            VerticalAlignment="Center">
-                        <LucideIcon Kind="ChevronLeft" Size="14"/>
-                    </Button>
-                </Grid>
+                        <Button Grid.Column="1"
+                                Classes="icon-button"
+                                Command="{Binding HideEntityPaneCommand}"
+                                ToolTip.Tip="Hide entity pane"
+                                VerticalAlignment="Center">
+                            <LucideIcon Kind="ChevronLeft" Size="14"/>
+                        </Button>
+                    </Grid>
+                </StackPanel>
             </Border>
 
             <ScrollViewer>
@@ -53,31 +52,33 @@
                               IsExpanded="{Binding CurrentNavigation.IsQueuesSectionExpanded}"
                               Margin="4,2,4,0">
                         <Expander.Header>
-                            <Grid ColumnDefinitions="Auto,*,Auto">
-                                <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="6">
-                                    <Border Classes="entity-tree-section-icon"
-                                            Background="{DynamicResource SurfaceBrand}">
-                                        <LucideIcon Kind="ListOrdered"
-                                                    Size="10"
-                                                    Foreground="{DynamicResource AccentBrand}"
-                                                    HorizontalAlignment="Center"
-                                                    VerticalAlignment="Center"/>
+                            <Border Classes="entity-group-header">
+                                <Grid ColumnDefinitions="Auto,*,Auto">
+                                    <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="6">
+                                        <Border Classes="entity-tree-section-icon"
+                                                Background="{DynamicResource SurfaceBrand}">
+                                            <LucideIcon Kind="ListOrdered"
+                                                        Size="10"
+                                                        Foreground="{DynamicResource AccentBrand}"
+                                                        HorizontalAlignment="Center"
+                                                        VerticalAlignment="Center"/>
+                                        </Border>
+                                        <TextBlock Text="Queues"
+                                                   FontSize="11"
+                                                   FontWeight="SemiBold"
+                                                   VerticalAlignment="Center"
+                                                   Foreground="{DynamicResource AppForeground}"/>
+                                    </StackPanel>
+                                    <Border Grid.Column="2"
+                                            Classes="entity-tree-section-count"
+                                            VerticalAlignment="Center">
+                                        <TextBlock Text="{Binding CurrentNavigation.Queues.Count}"
+                                                   FontSize="10"
+                                                   FontWeight="SemiBold"
+                                                   Foreground="{DynamicResource SubtleForeground}"/>
                                     </Border>
-                                    <TextBlock Text="Queues"
-                                               FontSize="11"
-                                               FontWeight="SemiBold"
-                                               VerticalAlignment="Center"
-                                               Foreground="{DynamicResource AppForeground}"/>
-                                </StackPanel>
-                                <Border Grid.Column="2"
-                                        Classes="entity-tree-section-count"
-                                        VerticalAlignment="Center">
-                                    <TextBlock Text="{Binding CurrentNavigation.Queues.Count}"
-                                               FontSize="10"
-                                               FontWeight="SemiBold"
-                                               Foreground="{DynamicResource SubtleForeground}"/>
-                                </Border>
-                            </Grid>
+                                </Grid>
+                            </Border>
                         </Expander.Header>
 
                         <StackPanel Spacing="0">
@@ -193,31 +194,33 @@
                               IsExpanded="{Binding CurrentNavigation.IsTopicsSectionExpanded}"
                               Margin="4,0,4,0">
                         <Expander.Header>
-                            <Grid ColumnDefinitions="Auto,*,Auto">
-                                <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="6">
-                                    <Border Classes="entity-tree-section-icon"
-                                            Background="{DynamicResource SurfaceSuccess}">
-                                        <LucideIcon Kind="Megaphone"
-                                                    Size="10"
-                                                    Foreground="{DynamicResource TextSuccess}"
-                                                    HorizontalAlignment="Center"
-                                                    VerticalAlignment="Center"/>
+                            <Border Classes="entity-group-header">
+                                <Grid ColumnDefinitions="Auto,*,Auto">
+                                    <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="6">
+                                        <Border Classes="entity-tree-section-icon"
+                                                Background="{DynamicResource SurfaceSuccess}">
+                                            <LucideIcon Kind="Megaphone"
+                                                        Size="10"
+                                                        Foreground="{DynamicResource TextSuccess}"
+                                                        HorizontalAlignment="Center"
+                                                        VerticalAlignment="Center"/>
+                                        </Border>
+                                        <TextBlock Text="Topics"
+                                                   FontSize="11"
+                                                   FontWeight="SemiBold"
+                                                   VerticalAlignment="Center"
+                                                   Foreground="{DynamicResource AppForeground}"/>
+                                    </StackPanel>
+                                    <Border Grid.Column="2"
+                                            Classes="entity-tree-section-count"
+                                            VerticalAlignment="Center">
+                                        <TextBlock Text="{Binding CurrentNavigation.Topics.Count}"
+                                                   FontSize="10"
+                                                   FontWeight="SemiBold"
+                                                   Foreground="{DynamicResource SubtleForeground}"/>
                                     </Border>
-                                    <TextBlock Text="Topics"
-                                               FontSize="11"
-                                               FontWeight="SemiBold"
-                                               VerticalAlignment="Center"
-                                               Foreground="{DynamicResource AppForeground}"/>
-                                </StackPanel>
-                                <Border Grid.Column="2"
-                                        Classes="entity-tree-section-count"
-                                        VerticalAlignment="Center">
-                                    <TextBlock Text="{Binding CurrentNavigation.Topics.Count}"
-                                               FontSize="10"
-                                               FontWeight="SemiBold"
-                                               Foreground="{DynamicResource SubtleForeground}"/>
-                                </Border>
-                            </Grid>
+                                </Grid>
+                            </Border>
                         </Expander.Header>
 
                         <StackPanel Spacing="0">
diff --git a/BusLane/Views/Controls/EntityTreeView.axaml b/BusLane/Views/Controls/EntityTreeView.axaml
index 8615ac4..27df978 100644
--- a/BusLane/Views/Controls/EntityTreeView.axaml
+++ b/BusLane/Views/Controls/EntityTreeView.axaml
@@ -15,36 +15,35 @@
     <Border Classes="card" Padding="0">
         <DockPanel>
             <Border DockPanel.Dock="Top"
-                    Padding="8,8,8,6"
-                    Background="{DynamicResource SurfaceSubtle}"
-                    BorderBrush="{DynamicResource BorderMuted}"
-                    BorderThickness="0,0,0,1">
-                <Grid ColumnDefinitions="*,Auto" ColumnSpacing="8">
-                    <TextBox Grid.Column="0"
-                             Text="{Binding CurrentNavigation.EntityFilter, Mode=TwoWay}"
-                             Watermark="Filter entities..."
-                             FontSize="12"
-                             Padding="4,4,4,4"
-                             CornerRadius="6"
-                             BorderBrush="{DynamicResource BorderMuted}">
-                        <TextBox.InnerLeftContent>
-                            <LucideIcon Kind="Search"
-                                        Size="13"
-                                        Foreground="{DynamicResource SubtleForeground}"
-                                        Margin="5,0,0,0"/>
-                        </TextBox.InnerLeftContent>
-                    </TextBox>
+                    Classes="pane-search-surface">
+                <StackPanel Spacing="8">
+                    <TextBlock Text="Browse entities"
+                               Classes="caption"/>
+                    <Grid ColumnDefinitions="*,Auto" ColumnSpacing="8">
+                        <TextBox Grid.Column="0"
+                                 Text="{Binding CurrentNavigation.EntityFilter, Mode=TwoWay}"
+                                 Watermark="Search queues, topics, or subscriptions"
+                                 FontSize="12"
+                                 Padding="4,4,4,4"
+                                 CornerRadius="6"
+                                 BorderBrush="{DynamicResource BorderMuted}">
+                            <TextBox.InnerLeftContent>
+                                <LucideIcon Kind="Search"
+                                            Size="13"
+                                            Foreground="{DynamicResource SubtleForeground}"
+                                            Margin="5,0,0,0"/>
+                            </TextBox.InnerLeftContent>
+                        </TextBox>
 
-                    <Button Grid.Column="1"
-                            Classes="icon-button"
-                            Command="{Binding HideEntityPaneCommand}"
-                            ToolTip.Tip="Hide entity pane"
-                            MinWidth="30"
-                            MinHeight="30"
-                            VerticalAlignment="Center">
-                        <LucideIcon Kind="ChevronLeft" Size="14"/>
-                    </Button>
-                </Grid>
+                        <Button Grid.Column="1"
+                                Classes="icon-button"
+                                Command="{Binding HideEntityPaneCommand}"
+                                ToolTip.Tip="Hide entity pane"
+                                VerticalAlignment="Center">
+                            <LucideIcon Kind="ChevronLeft" Size="14"/>
+                        </Button>
+                    </Grid>
+                </StackPanel>
             </Border>
 
             <ScrollViewer>
@@ -54,31 +53,33 @@
                               IsExpanded="{Binding CurrentNavigation.IsQueuesSectionExpanded}"
                               Margin="4,2,4,0">
                         <Expander.Header>
-                            <Grid ColumnDefinitions="Auto,*,Auto">
-                                <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="6">
-                                    <Border Classes="entity-tree-section-icon"
-                                            Background="{DynamicResource SurfaceBrand}">
-                                        <LucideIcon Kind="ListOrdered"
-                                                    Size="10"
-                                                    Foreground="{DynamicResource AccentBrand}"
-                                                    HorizontalAlignment="Center"
-                                                    VerticalAlignment="Center"/>
+                            <Border Classes="entity-group-header">
+                                <Grid ColumnDefinitions="Auto,*,Auto">
+                                    <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="6">
+                                        <Border Classes="entity-tree-section-icon"
+                                                Background="{DynamicResource SurfaceBrand}">
+                                            <LucideIcon Kind="ListOrdered"
+                                                        Size="10"
+                                                        Foreground="{DynamicResource AccentBrand}"
+                                                        HorizontalAlignment="Center"
+                                                        VerticalAlignment="Center"/>
+                                        </Border>
+                                        <TextBlock Text="Queues"
+                                                   FontSize="11"
+                                                   FontWeight="SemiBold"
+                                                   VerticalAlignment="Center"
+                                                   Foreground="{DynamicResource AppForeground}"/>
+                                    </StackPanel>
+                                    <Border Grid.Column="2"
+                                            Classes="entity-tree-section-count"
+                                            VerticalAlignment="Center">
+                                        <TextBlock Text="{Binding CurrentNavigation.Queues.Count}"
+                                                   FontSize="10"
+                                                   FontWeight="SemiBold"
+                                                   Foreground="{DynamicResource SubtleForeground}"/>
                                     </Border>
-                                    <TextBlock Text="Queues"
-                                               FontSize="11"
-                                               FontWeight="SemiBold"
-                                               VerticalAlignment="Center"
-                                               Foreground="{DynamicResource AppForeground}"/>
-                                </StackPanel>
-                                <Border Grid.Column="2"
-                                        Classes="entity-tree-section-count"
-                                        VerticalAlignment="Center">
-                                    <TextBlock Text="{Binding CurrentNavigation.Queues.Count}"
-                                               FontSize="10"
-                                               FontWeight="SemiBold"
-                                               Foreground="{DynamicResource SubtleForeground}"/>
-                                </Border>
-                            </Grid>
+                                </Grid>
+                            </Border>
                         </Expander.Header>
 
                         <StackPanel Spacing="0">
@@ -196,31 +197,33 @@
                               IsExpanded="{Binding CurrentNavigation.IsTopicsSectionExpanded}"
                               Margin="4,0,4,0">
                         <Expander.Header>
-                            <Grid ColumnDefinitions="Auto,*,Auto">
-                                <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="6">
-                                    <Border Classes="entity-tree-section-icon"
-                                            Background="{DynamicResource SurfaceSuccess}">
-                                        <LucideIcon Kind="Megaphone"
-                                                    Size="10"
-                                                    Foreground="{DynamicResource TextSuccess}"
-                                                    HorizontalAlignment="Center"
-                                                    VerticalAlignment="Center"/>
+                            <Border Classes="entity-group-header">
+                                <Grid ColumnDefinitions="Auto,*,Auto">
+                                    <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="6">
+                                        <Border Classes="entity-tree-section-icon"
+                                                Background="{DynamicResource SurfaceSuccess}">
+                                            <LucideIcon Kind="Megaphone"
+                                                        Size="10"
+                                                        Foreground="{DynamicResource TextSuccess}"
+                                                        HorizontalAlignment="Center"
+                                                        VerticalAlignment="Center"/>
+                                        </Border>
+                                        <TextBlock Text="Topics"
+                                                   FontSize="11"
+                                                   FontWeight="SemiBold"
+                                                   VerticalAlignment="Center"
+                                                   Foreground="{DynamicResource AppForeground}"/>
+                                    </StackPanel>
+                                    <Border Grid.Column="2"
+                                            Classes="entity-tree-section-count"
+                                            VerticalAlignment="Center">
+                                        <TextBlock Text="{Binding CurrentNavigation.Topics.Count}"
+                                                   FontSize="10"
+                                                   FontWeight="SemiBold"
+                                                   Foreground="{DynamicResource SubtleForeground}"/>
                                     </Border>
-                                    <TextBlock Text="Topics"
-                                               FontSize="11"
-                                               FontWeight="SemiBold"
-                                               VerticalAlignment="Center"
-                                               Foreground="{DynamicResource AppForeground}"/>
-                                </StackPanel>
-                                <Border Grid.Column="2"
-                                        Classes="entity-tree-section-count"
-                                        VerticalAlignment="Center">
-                                    <TextBlock Text="{Binding CurrentNavigation.Topics.Count}"
-                                               FontSize="10"
-                                               FontWeight="SemiBold"
-                                               Foreground="{DynamicResource SubtleForeground}"/>
-                                </Border>
-                            </Grid>
+                                </Grid>
+                            </Border>
                         </Expander.Header>
 
                         <StackPanel Spacing="0">

From 29275a8c411cfe917e76cde5dbff754c97e3a5f8 Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Fri, 10 Apr 2026 20:39:37 +0200
Subject: [PATCH 04/13] refactor: simplify fluent shell hierarchy

---
 BusLane.Tests/Views/NavigationSidebarTests.cs | 19 +---
 BusLane.Tests/Views/WelcomeViewTests.cs       | 16 +++-
 BusLane/Styles/AppStyles.axaml                | 30 ++++--
 .../Views/Controls/NavigationSidebar.axaml    | 51 +++++------
 BusLane/Views/Controls/WelcomeView.axaml      | 91 ++++++++++++-------
 BusLane/Views/MainWindow.axaml                | 85 +++++++++--------
 6 files changed, 172 insertions(+), 120 deletions(-)

diff --git a/BusLane.Tests/Views/NavigationSidebarTests.cs b/BusLane.Tests/Views/NavigationSidebarTests.cs
index 7ce1504..29da50f 100644
--- a/BusLane.Tests/Views/NavigationSidebarTests.cs
+++ b/BusLane.Tests/Views/NavigationSidebarTests.cs
@@ -44,33 +44,24 @@ public void NavigationSidebar_HasSingleMyConnectionsButton()
     }
 
     [Fact]
-    public void NavigationSidebar_UsesStructuredWorkspaceCardRegions()
+    public void NavigationSidebar_UsesCompactWorkspaceSummary()
     {
         // Arrange
         var xaml = File.ReadAllText(GetSidebarPath());
 
-        // Act
-        var hasWorkspaceHeader = xaml.Contains("Classes=\"sidebar-workspace-header\"", StringComparison.Ordinal);
-        var hasWorkspaceMeta = xaml.Contains("Classes=\"sidebar-workspace-meta\"", StringComparison.Ordinal);
-        var hasWorkspaceActions = xaml.Contains("Classes=\"sidebar-workspace-actions\"", StringComparison.Ordinal);
-
         // Assert
-        hasWorkspaceHeader.Should().BeTrue();
-        hasWorkspaceMeta.Should().BeTrue();
-        hasWorkspaceActions.Should().BeTrue();
+        xaml.Should().Contain("Classes=\"sidebar-workspace-summary\"");
+        xaml.Should().NotContain("Classes=\"sidebar-workspace-card\"");
     }
 
     [Fact]
-    public void NavigationSidebar_UsesStackedWorkspaceActions()
+    public void NavigationSidebar_DoesNotRenderDisconnectAsStandalonePrimaryBlock()
     {
         // Arrange
         var xaml = File.ReadAllText(GetSidebarPath());
 
-        // Act
-        var usesStackedActions = xaml.Contains("<StackPanel Classes=\"sidebar-workspace-actions\"", StringComparison.Ordinal);
-
         // Assert
-        usesStackedActions.Should().BeTrue();
+        xaml.Should().NotContain("Classes=\"danger-outline\"");
     }
 
     [Fact]
diff --git a/BusLane.Tests/Views/WelcomeViewTests.cs b/BusLane.Tests/Views/WelcomeViewTests.cs
index 1f2dc8c..e955c27 100644
--- a/BusLane.Tests/Views/WelcomeViewTests.cs
+++ b/BusLane.Tests/Views/WelcomeViewTests.cs
@@ -5,16 +5,24 @@ namespace BusLane.Tests.Views;
 public class WelcomeViewTests
 {
     [Fact]
-    public void WelcomeView_DoesNotRenderMyConnectionsButton()
+    public void WelcomeView_UsesPrimaryStartSurface()
     {
         // Arrange
         var xaml = File.ReadAllText(GetWelcomeViewPath());
 
-        // Act
-        var hasConnectionLibraryButton = xaml.Contains("Command=\"{Binding OpenConnectionLibraryCommand}\"", StringComparison.Ordinal);
+        // Assert
+        xaml.Should().Contain("Classes=\"welcome-primary-surface\"");
+        xaml.Should().Contain("Command=\"{Binding OpenConnectionLibraryCommand}\"");
+    }
+
+    [Fact]
+    public void WelcomeView_RendersRecentConnectionsInSecondarySurface()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetWelcomeViewPath());
 
         // Assert
-        hasConnectionLibraryButton.Should().BeFalse();
+        xaml.Should().Contain("Classes=\"welcome-recent-surface\"");
     }
 
     private static string GetWelcomeViewPath()
diff --git a/BusLane/Styles/AppStyles.axaml b/BusLane/Styles/AppStyles.axaml
index bbc3854..585870d 100644
--- a/BusLane/Styles/AppStyles.axaml
+++ b/BusLane/Styles/AppStyles.axaml
@@ -1346,13 +1346,12 @@
         <Setter Property="Foreground" Value="{DynamicResource SubtleForeground}"/>
     </Style>
 
-    <Style Selector="Border.sidebar-workspace-card">
-        <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
+    <Style Selector="Border.sidebar-workspace-summary">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
         <Setter Property="CornerRadius" Value="12"/>
-        <Setter Property="Padding" Value="16"/>
+        <Setter Property="Padding" Value="14"/>
         <Setter Property="BorderThickness" Value="1"/>
-        <Setter Property="BorderBrush" Value="{DynamicResource BorderDefault}"/>
-        <Setter Property="BoxShadow" Value="0 8 24 0 #18000000"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
     </Style>
 
     <Style Selector="Grid.sidebar-workspace-header">
@@ -1363,8 +1362,9 @@
         <Setter Property="Margin" Value="0,-2,0,0"/>
     </Style>
 
-    <Style Selector="Grid.sidebar-workspace-actions">
-        <Setter Property="Margin" Value="0,2,0,0"/>
+    <Style Selector="WrapPanel.sidebar-workspace-actions">
+        <Setter Property="Margin" Value="0,4,0,0"/>
+        <Setter Property="ItemHeight" Value="32"/>
     </Style>
 
     <Style Selector="Border.sidebar-context-pill">
@@ -1383,6 +1383,22 @@
         <Setter Property="BorderBrush" Value="{DynamicResource BorderDefault}"/>
     </Style>
 
+    <Style Selector="Border.welcome-primary-surface">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
+        <Setter Property="CornerRadius" Value="16"/>
+        <Setter Property="Padding" Value="28"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="Border.welcome-recent-surface">
+        <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
+        <Setter Property="CornerRadius" Value="14"/>
+        <Setter Property="Padding" Value="20"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderDefault}"/>
+    </Style>
+
     <Style Selector="ListBox.quick-switch-list">
         <Setter Property="Margin" Value="0"/>
     </Style>
diff --git a/BusLane/Views/Controls/NavigationSidebar.axaml b/BusLane/Views/Controls/NavigationSidebar.axaml
index 1b1ac07..84dea7b 100644
--- a/BusLane/Views/Controls/NavigationSidebar.axaml
+++ b/BusLane/Views/Controls/NavigationSidebar.axaml
@@ -16,7 +16,7 @@
             <Border Grid.Row="0" Classes="sidebar-header">
                 <Grid ColumnDefinitions="*,Auto">
                     <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="10">
-                        <Viewbox Width="32" Height="32">
+                        <Viewbox Width="28" Height="28">
                             <Canvas Width="512" Height="512">
                                 <Rectangle Canvas.Left="0" Canvas.Top="0" Width="512" Height="512" RadiusX="108" RadiusY="108" Fill="#18181b"/>
                                 <Rectangle Canvas.Left="96" Canvas.Top="152" Width="128" Height="56" RadiusX="28" RadiusY="28" Fill="#27272a"/>
@@ -27,8 +27,8 @@
                             </Canvas>
                         </Viewbox>
                         <StackPanel VerticalAlignment="Center">
-                            <TextBlock Text="BusLane" Classes="heading-large"/>
-                            <TextBlock Text="Workspace control rail" Classes="caption" FontSize="11"/>
+                            <TextBlock Text="BusLane" Classes="heading"/>
+                            <TextBlock Text="Control rail" Classes="caption" FontSize="11"/>
                         </StackPanel>
                     </StackPanel>
 
@@ -52,13 +52,13 @@
                     <StackPanel Spacing="10">
                         <TextBlock Text="Workspace" Classes="sidebar-section-label"/>
 
-                        <Border Classes="sidebar-workspace-card"
+                        <Border Classes="sidebar-workspace-summary"
                                 IsVisible="{Binding HasActiveConnectionTab}">
-                            <StackPanel Spacing="14">
+                            <StackPanel Spacing="10">
                                 <Grid Classes="sidebar-workspace-header"
                                       ColumnDefinitions="*,Auto"
                                       ColumnSpacing="12">
-                                    <StackPanel Grid.Column="0" Spacing="10">
+                                    <StackPanel Grid.Column="0" Spacing="8">
                                         <StackPanel Orientation="Horizontal" Spacing="8">
                                             <Border Classes="badge-success">
                                                 <TextBlock Text="Connected"/>
@@ -80,13 +80,13 @@
                                     </StackPanel>
 
                                     <Border Grid.Column="1"
-                                            Width="44"
-                                            Height="44"
-                                            CornerRadius="12"
+                                            Width="36"
+                                            Height="36"
+                                            CornerRadius="10"
                                             Background="{DynamicResource SurfaceBrand}"
                                             HorizontalAlignment="Right">
                                         <LucideIcon Kind="Waypoints"
-                                                    Size="20"
+                                                    Size="18"
                                                     Foreground="{DynamicResource AccentBrand}"
                                                     HorizontalAlignment="Center"
                                                     VerticalAlignment="Center"/>
@@ -114,10 +114,10 @@
                                     </Border>
                                 </WrapPanel>
 
-                                <StackPanel Classes="sidebar-workspace-actions"
-                                            Spacing="8">
-                                    <Button
-                                            Classes="secondary small"
+                                <WrapPanel Classes="sidebar-workspace-actions"
+                                           Orientation="Horizontal"
+                                           ItemWidth="120">
+                                    <Button Classes="secondary small"
                                             Command="{Binding RefreshConnectionCommand}"
                                             HorizontalAlignment="Stretch"
                                             HorizontalContentAlignment="Center">
@@ -127,8 +127,7 @@
                                         </StackPanel>
                                     </Button>
 
-                                    <Button
-                                            Classes="secondary small"
+                                    <Button Classes="secondary small"
                                             Command="{Binding OpenNamespacePanelCommand}"
                                             HorizontalAlignment="Stretch"
                                             HorizontalContentAlignment="Center"
@@ -138,17 +137,17 @@
                                             <TextBlock Text="Namespace"/>
                                         </StackPanel>
                                     </Button>
-                                </StackPanel>
 
-                                <Button Classes="danger-outline"
-                                        Command="{Binding DisconnectConnectionCommand}"
-                                        HorizontalAlignment="Stretch"
-                                        HorizontalContentAlignment="Center">
-                                    <StackPanel Orientation="Horizontal" Spacing="6">
-                                        <LucideIcon Kind="PlugZap" Size="14"/>
-                                        <TextBlock Text="Disconnect"/>
-                                    </StackPanel>
-                                </Button>
+                                    <Button Classes="danger-subtle small"
+                                            Command="{Binding DisconnectConnectionCommand}"
+                                            HorizontalAlignment="Stretch"
+                                            HorizontalContentAlignment="Center">
+                                        <StackPanel Orientation="Horizontal" Spacing="6">
+                                            <LucideIcon Kind="PlugZap" Size="14"/>
+                                            <TextBlock Text="Disconnect"/>
+                                        </StackPanel>
+                                    </Button>
+                                </WrapPanel>
                             </StackPanel>
                         </Border>
 
diff --git a/BusLane/Views/Controls/WelcomeView.axaml b/BusLane/Views/Controls/WelcomeView.axaml
index 190b5ec..9d857c4 100644
--- a/BusLane/Views/Controls/WelcomeView.axaml
+++ b/BusLane/Views/Controls/WelcomeView.axaml
@@ -5,39 +5,68 @@
              x:Class="BusLane.Views.Controls.WelcomeView"
              x:DataType="vm:MainWindowViewModel">
     
-    <StackPanel VerticalAlignment="Center" 
+    <StackPanel VerticalAlignment="Center"
                 HorizontalAlignment="Center"
-                MaxWidth="480"
+                MaxWidth="560"
+                Spacing="20"
                 IsVisible="{Binding ShowWelcome}">
-        <TextBlock Text="Welcome to BusLane" Classes="title-large" HorizontalAlignment="Center"/>
-        <TextBlock Text="Connect using a connection string or sign in with your Azure account to manage your Service Bus resources." 
-                   Classes="subtitle" HorizontalAlignment="Center" Margin="0,12,0,24" TextWrapping="Wrap" TextAlignment="Center"/>
-        
-        <!-- Saved Connections Preview -->
-        <StackPanel Margin="0,32,0,0" IsVisible="{Binding Connection.SavedConnections.Count}">
-            <TextBlock Text="Recent Connections" Classes="body-strong" HorizontalAlignment="Center" Margin="0,0,0,12"/>
-            <ItemsControl ItemsSource="{Binding Connection.SavedConnections}" MaxHeight="200">
-                <ItemsControl.ItemTemplate>
-                    <DataTemplate x:DataType="models:SavedConnection">
-                        <Button Classes="secondary" 
-                                HorizontalAlignment="Stretch"
-                                HorizontalContentAlignment="Left"
-                                Margin="0,0,0,8"
-                                Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).ConnectToSavedConnectionCommand}"
-                                CommandParameter="{Binding}">
-                            <StackPanel Orientation="Horizontal" Spacing="12">
-                                <Border Classes="surface-brand" Padding="8" CornerRadius="4">
-                                    <LucideIcon Kind="Cable" Size="16" Foreground="{DynamicResource AccentBrand}" VerticalAlignment="Center"/>
-                                </Border>
-                                <StackPanel VerticalAlignment="Center">
-                                    <TextBlock Text="{Binding Name}" FontWeight="SemiBold" FontSize="13"/>
-                                    <TextBlock Text="{Binding EntityName}" Classes="caption" FontSize="11"/>
+        <Border Classes="welcome-primary-surface">
+            <StackPanel Spacing="20">
+                <StackPanel Spacing="10">
+                    <TextBlock Text="Welcome to BusLane" Classes="title-large"/>
+                    <TextBlock Text="Start with a saved connection or sign in to Azure when you need a namespace workspace."
+                               Classes="subtitle"
+                               TextWrapping="Wrap"/>
+                </StackPanel>
+
+                <StackPanel Orientation="Horizontal" Spacing="10">
+                    <Button Classes="primary"
+                            Command="{Binding OpenConnectionLibraryCommand}">
+                        <StackPanel Orientation="Horizontal" Spacing="8">
+                            <LucideIcon Kind="Library" Size="16"/>
+                            <TextBlock Text="Open My Connections" FontWeight="SemiBold"/>
+                        </StackPanel>
+                    </Button>
+
+                    <Button Classes="secondary"
+                            Command="{Binding LoginCommand}"
+                            IsVisible="{Binding !Connection.IsAuthenticated}">
+                        <StackPanel Orientation="Horizontal" Spacing="8">
+                            <LucideIcon Kind="Cloud" Size="16"/>
+                            <TextBlock Text="Sign in with Azure"/>
+                        </StackPanel>
+                    </Button>
+                </StackPanel>
+            </StackPanel>
+        </Border>
+
+        <Border Classes="welcome-recent-surface"
+                IsVisible="{Binding Connection.SavedConnections.Count}">
+            <StackPanel Spacing="14">
+                <TextBlock Text="Recent Connections" Classes="body-strong"/>
+                <ItemsControl ItemsSource="{Binding Connection.SavedConnections}" MaxHeight="220">
+                    <ItemsControl.ItemTemplate>
+                        <DataTemplate x:DataType="models:SavedConnection">
+                            <Button Classes="secondary"
+                                    HorizontalAlignment="Stretch"
+                                    HorizontalContentAlignment="Left"
+                                    Margin="0,0,0,8"
+                                    Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).ConnectToSavedConnectionCommand}"
+                                    CommandParameter="{Binding}">
+                                <StackPanel Orientation="Horizontal" Spacing="12">
+                                    <Border Classes="surface-brand" Padding="8" CornerRadius="4">
+                                        <LucideIcon Kind="Cable" Size="16" Foreground="{DynamicResource AccentBrand}" VerticalAlignment="Center"/>
+                                    </Border>
+                                    <StackPanel VerticalAlignment="Center">
+                                        <TextBlock Text="{Binding Name}" FontWeight="SemiBold" FontSize="13"/>
+                                        <TextBlock Text="{Binding EntityName}" Classes="caption" FontSize="11"/>
+                                    </StackPanel>
                                 </StackPanel>
-                            </StackPanel>
-                        </Button>
-                    </DataTemplate>
-                </ItemsControl.ItemTemplate>
-            </ItemsControl>
-        </StackPanel>
+                            </Button>
+                        </DataTemplate>
+                    </ItemsControl.ItemTemplate>
+                </ItemsControl>
+            </StackPanel>
+        </Border>
     </StackPanel>
 </UserControl>
diff --git a/BusLane/Views/MainWindow.axaml b/BusLane/Views/MainWindow.axaml
index a8fe954..cfcece0 100644
--- a/BusLane/Views/MainWindow.axaml
+++ b/BusLane/Views/MainWindow.axaml
@@ -34,7 +34,7 @@
                 <Border Grid.Column="0"
                         Background="{DynamicResource TabNavBackground}"
                         BorderBrush="{DynamicResource BorderDefault}"
-                        BorderThickness="0,0,1,1"
+                        BorderThickness="0,0,0,1"
                         Padding="12,8"
                         IsVisible="{Binding !IsNavigationPanelVisible}">
                     <Button Classes="subtle icon-button"
@@ -63,26 +63,31 @@
                                   HorizontalAlignment="Center"/>
 
             <!-- Content when namespace selected (Azure mode) -->
-            <Grid Grid.Row="0" Grid.RowSpan="2"
+                <Grid Grid.Row="0" Grid.RowSpan="2"
                   IsVisible="{Binding IsActiveTabAzureMode}"
                   RowDefinitions="Auto,*">
 
                 <!-- Header -->
-                <Grid Grid.Row="0" Margin="0,0,0,16">
-                    <StackPanel>
-                        <TextBlock Text="{Binding ActiveTab.Namespace.Name}" Classes="title"/>
-                        <TextBlock Text="{Binding ActiveTab.Namespace.ResourceGroup}" Classes="caption" Margin="0,4,0,0"/>
-                    </StackPanel>
-                    <Button Classes="secondary small"
-                            Command="{Binding RefreshCommand}"
-                            HorizontalAlignment="Right"
-                            VerticalAlignment="Center">
-                        <StackPanel Orientation="Horizontal" Spacing="4">
-                            <LucideIcon Kind="RefreshCw" Size="12"/>
-                            <TextBlock Text="Refresh"/>
+                <Border Grid.Row="0" Classes="page-header-surface" Margin="0,0,0,16">
+                    <Grid ColumnDefinitions="*,Auto" ColumnSpacing="16">
+                        <StackPanel Spacing="6">
+                            <TextBlock Text="{Binding ActiveTab.Namespace.Name}" Classes="title"/>
+                            <StackPanel Orientation="Horizontal" Spacing="10">
+                                <TextBlock Text="Azure namespace" Classes="caption"/>
+                                <TextBlock Text="{Binding ActiveTab.Namespace.ResourceGroup}" Classes="caption"/>
+                            </StackPanel>
                         </StackPanel>
-                    </Button>
-                </Grid>
+                        <Button Classes="secondary small"
+                                Command="{Binding RefreshCommand}"
+                                HorizontalAlignment="Right"
+                                VerticalAlignment="Center">
+                            <StackPanel Orientation="Horizontal" Spacing="4">
+                                <LucideIcon Kind="RefreshCw" Size="12"/>
+                                <TextBlock Text="Refresh"/>
+                            </StackPanel>
+                        </Button>
+                    </Grid>
+                </Border>
 
                 <!-- Main content grid -->
                 <Grid x:Name="AzureWorkspaceGrid"
@@ -112,29 +117,33 @@
                   RowDefinitions="Auto,*">
 
                 <!-- Header -->
-                <Grid Grid.Row="0" Margin="0,0,0,16">
-                    <StackPanel>
-                        <TextBlock Text="{Binding ActiveTab.SavedConnection.Name}" Classes="title"/>
-                        <StackPanel Orientation="Horizontal" Spacing="8" Margin="0,6,0,0">
-                            <Border Classes="badge-info" Padding="8,4">
-                                <TextBlock Text="{Binding ActiveTab.SavedConnection.TypeDisplayName}" FontSize="12" Foreground="{DynamicResource AccentBrand}"/>
-                            </Border>
-                            <TextBlock Text="{Binding ActiveTab.SavedConnection.EntityName}" Classes="caption" VerticalAlignment="Center"
-                                       IsVisible="{Binding ActiveTab.SavedConnection.EntityName, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"/>
-                            <TextBlock Text="{Binding ActiveTab.SavedConnection.Endpoint}" Classes="caption" VerticalAlignment="Center"
-                                       IsVisible="{Binding ActiveTab.SavedConnection.IsNamespaceLevel}"/>
-                        </StackPanel>
-                    </StackPanel>
-                    <Button Classes="secondary small"
-                            Command="{Binding RefreshConnectionCommand}"
-                            HorizontalAlignment="Right"
-                            VerticalAlignment="Center">
-                        <StackPanel Orientation="Horizontal" Spacing="4">
-                            <LucideIcon Kind="RefreshCw" Size="12"/>
-                            <TextBlock Text="Refresh"/>
+                <Border Grid.Row="0" Classes="page-header-surface" Margin="0,0,0,16">
+                    <Grid ColumnDefinitions="*,Auto" ColumnSpacing="16">
+                        <StackPanel Spacing="6">
+                            <TextBlock Text="{Binding ActiveTab.SavedConnection.Name}" Classes="title"/>
+                            <StackPanel Orientation="Horizontal" Spacing="10">
+                                <TextBlock Text="{Binding ActiveTab.SavedConnection.TypeDisplayName}" Classes="caption"/>
+                                <TextBlock Text="{Binding ActiveTab.SavedConnection.EntityName}"
+                                           Classes="caption"
+                                           VerticalAlignment="Center"
+                                           IsVisible="{Binding ActiveTab.SavedConnection.EntityName, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"/>
+                                <TextBlock Text="{Binding ActiveTab.SavedConnection.Endpoint}"
+                                           Classes="caption"
+                                           VerticalAlignment="Center"
+                                           IsVisible="{Binding ActiveTab.SavedConnection.IsNamespaceLevel}"/>
+                            </StackPanel>
                         </StackPanel>
-                    </Button>
-                </Grid>
+                        <Button Classes="secondary small"
+                                Command="{Binding RefreshConnectionCommand}"
+                                HorizontalAlignment="Right"
+                                VerticalAlignment="Center">
+                            <StackPanel Orientation="Horizontal" Spacing="4">
+                                <LucideIcon Kind="RefreshCw" Size="12"/>
+                                <TextBlock Text="Refresh"/>
+                            </StackPanel>
+                        </Button>
+                    </Grid>
+                </Border>
 
                 <!-- Main content for connection string mode -->
                 <Grid x:Name="ConnectionWorkspaceGrid"

From 2516e0fd507cfcbe6d60bc7354e8bb954c2bb038 Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Fri, 10 Apr 2026 20:43:02 +0200
Subject: [PATCH 05/13] refactor: simplify messages workspace layout

---
 BusLane.Tests/Views/MessagesPanelViewTests.cs |  42 ++++++
 BusLane/Styles/AppStyles.axaml                |  48 +++++++
 .../MessagePaginationFooterView.axaml         |  12 +-
 .../Views/Controls/MessagesPanelView.axaml    | 126 ++++++------------
 4 files changed, 137 insertions(+), 91 deletions(-)
 create mode 100644 BusLane.Tests/Views/MessagesPanelViewTests.cs

diff --git a/BusLane.Tests/Views/MessagesPanelViewTests.cs b/BusLane.Tests/Views/MessagesPanelViewTests.cs
new file mode 100644
index 0000000..b765f9a
--- /dev/null
+++ b/BusLane.Tests/Views/MessagesPanelViewTests.cs
@@ -0,0 +1,42 @@
+namespace BusLane.Tests.Views;
+
+using FluentAssertions;
+
+public class MessagesPanelViewTests
+{
+    [Fact]
+    public void MessagesPanel_UsesInlineCommandBarSurface()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetMessagesPanelPath());
+
+        // Assert
+        xaml.Should().Contain("Classes=\"message-command-bar\"");
+        xaml.Should().Contain("Classes=\"message-search-surface\"");
+    }
+
+    [Fact]
+    public void MessagesPanel_DoesNotUseCenteredLoadingCardCopy()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetMessagesPanelPath());
+
+        // Assert
+        xaml.Should().NotContain("Please wait while we fetch the messages...");
+        xaml.Should().Contain("Classes=\"inline-loading-surface\"");
+    }
+
+    private static string GetMessagesPanelPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Views",
+            "Controls",
+            "MessagesPanelView.axaml"));
+    }
+}
diff --git a/BusLane/Styles/AppStyles.axaml b/BusLane/Styles/AppStyles.axaml
index 585870d..0a422c7 100644
--- a/BusLane/Styles/AppStyles.axaml
+++ b/BusLane/Styles/AppStyles.axaml
@@ -870,6 +870,54 @@
         <Setter Property="FontWeight" Value="SemiBold"/>
     </Style>
 
+    <Style Selector="Border.message-command-bar">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+        <Setter Property="BorderThickness" Value="0,0,0,1"/>
+        <Setter Property="Padding" Value="16,16,16,12"/>
+    </Style>
+
+    <Style Selector="Border.message-search-surface">
+        <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
+        <Setter Property="CornerRadius" Value="10"/>
+        <Setter Property="Padding" Value="10,8"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="Button.message-row">
+        <Setter Property="Background" Value="Transparent"/>
+        <Setter Property="Foreground" Value="{DynamicResource AppForeground}"/>
+        <Setter Property="Padding" Value="12,10"/>
+        <Setter Property="BorderThickness" Value="0"/>
+        <Setter Property="CornerRadius" Value="10"/>
+        <Setter Property="Cursor" Value="Hand"/>
+    </Style>
+
+    <Style Selector="Button.message-row:pointerover /template/ ContentPresenter">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
+    </Style>
+
+    <Style Selector="Button.message-row:focus-visible /template/ ContentPresenter">
+        <Setter Property="BoxShadow" Value="{DynamicResource FocusRingAccent}"/>
+    </Style>
+
+    <Style Selector="Border.inline-loading-surface">
+        <Setter Property="Background" Value="{DynamicResource SurfaceSubtle}"/>
+        <Setter Property="CornerRadius" Value="10"/>
+        <Setter Property="Padding" Value="14,12"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="Border.message-empty-state">
+        <Setter Property="Background" Value="{DynamicResource SurfaceSubtle}"/>
+        <Setter Property="CornerRadius" Value="12"/>
+        <Setter Property="Padding" Value="20"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
     <Style Selector="Border.entity-tree-divider">
         <Setter Property="Height" Value="1"/>
         <Setter Property="Background" Value="{DynamicResource BorderDefault}"/>
diff --git a/BusLane/Views/Controls/MessagePaginationFooterView.axaml b/BusLane/Views/Controls/MessagePaginationFooterView.axaml
index 0cf6fc8..5484895 100644
--- a/BusLane/Views/Controls/MessagePaginationFooterView.axaml
+++ b/BusLane/Views/Controls/MessagePaginationFooterView.axaml
@@ -6,9 +6,9 @@
 
     <UserControl.Styles>
         <Style Selector="Border.pager-surface">
-            <Setter Property="Background" Value="{DynamicResource SurfaceSubtle}"/>
+            <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
             <Setter Property="CornerRadius" Value="10"/>
-            <Setter Property="Padding" Value="14,12"/>
+            <Setter Property="Padding" Value="12,10"/>
             <Setter Property="BorderThickness" Value="1"/>
             <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
         </Style>
@@ -28,18 +28,18 @@
         </Style>
 
         <Style Selector="Border.pager-actions">
-            <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
+            <Setter Property="Background" Value="{DynamicResource SurfaceSubtle}"/>
             <Setter Property="CornerRadius" Value="8"/>
             <Setter Property="BorderThickness" Value="1"/>
-            <Setter Property="BorderBrush" Value="{DynamicResource BorderDefault}"/>
+            <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
         </Style>
 
         <Style Selector="Button.pager-nav">
             <Setter Property="Background" Value="Transparent"/>
             <Setter Property="BorderThickness" Value="0"/>
             <Setter Property="CornerRadius" Value="6"/>
-            <Setter Property="Padding" Value="12,10"/>
-            <Setter Property="MinWidth" Value="96"/>
+            <Setter Property="Padding" Value="10,8"/>
+            <Setter Property="MinWidth" Value="88"/>
             <Setter Property="FontWeight" Value="Medium"/>
         </Style>
     </UserControl.Styles>
diff --git a/BusLane/Views/Controls/MessagesPanelView.axaml b/BusLane/Views/Controls/MessagesPanelView.axaml
index d0af194..96ab031 100644
--- a/BusLane/Views/Controls/MessagesPanelView.axaml
+++ b/BusLane/Views/Controls/MessagesPanelView.axaml
@@ -14,7 +14,7 @@
     <Border Classes="card" Padding="0">
         <Grid RowDefinitions="Auto,*">
             <!-- Header Bar with Tabs and Actions -->
-            <Border Grid.Row="0" BorderBrush="{DynamicResource BorderDefault}" BorderThickness="0,0,0,1" Padding="16,16,16,12">
+            <Border Grid.Row="0" Classes="message-command-bar">
                 <Grid RowDefinitions="Auto,Auto,Auto" RowSpacing="12">
                     <!-- Title and Actions Row -->
                     <Grid Grid.Row="0" ColumnDefinitions="*,Auto">
@@ -94,11 +94,7 @@
 
                     <!-- Bulk Actions Bar (visible when multi-select mode is active) -->
                     <Border Grid.Row="1"
-                            Background="{DynamicResource SurfaceSubtle}"
-                            CornerRadius="6"
-                            Padding="12,8"
-                            BorderThickness="1"
-                            BorderBrush="{DynamicResource BorderMuted}">
+                            Classes="message-search-surface">
                         <Border.IsVisible>
                             <MultiBinding Converter="{x:Static BoolConverters.And}">
                                 <Binding Path="CurrentMessageOps.IsMultiSelectMode"/>
@@ -159,9 +155,7 @@
 
                     <!-- Search Row -->
                     <Border Grid.Row="2"
-                            Background="{DynamicResource SurfaceSubtle}"
-                            CornerRadius="6"
-                            Padding="8,8"
+                            Classes="message-search-surface"
                             IsVisible="{Binding CurrentNavigation.IsSessionInspectorTabSelected, Converter={x:Static BoolConverters.Not}}">
                         <Grid ColumnDefinitions="Auto,*,Auto">
                             <LucideIcon Grid.Column="0"
@@ -199,8 +193,23 @@
 
                 <TabItem Header="Active Messages">
                     <TabItem.Content>
-                        <Grid RowDefinitions="*,Auto">
-                            <ListBox Grid.Row="0"
+                        <Grid RowDefinitions="Auto,*,Auto">
+                            <Border Grid.Row="0"
+                                    Classes="inline-loading-surface"
+                                    Margin="8,8,8,0"
+                                    IsVisible="{Binding CurrentMessageOps.IsLoadingMessages}">
+                                <StackPanel Orientation="Horizontal" Spacing="10">
+                                    <ProgressBar IsIndeterminate="True"
+                                                 Width="120"
+                                                 Height="3"
+                                                 VerticalAlignment="Center"/>
+                                    <TextBlock Text="Loading messages"
+                                               Classes="caption"
+                                               VerticalAlignment="Center"/>
+                                </StackPanel>
+                            </Border>
+
+                            <ListBox Grid.Row="1"
                                      ItemsSource="{Binding CurrentMessageOps.FilteredMessages}"
                                      SelectedItem="{Binding CurrentMessageOps.SelectedMessage}"
                                      Background="Transparent"
@@ -235,12 +244,11 @@
                                             </CheckBox.IsChecked>
                                         </CheckBox>
                                     <Button Grid.Column="1"
-                                            Classes="subtle"
+                                            Classes="message-row"
                                             Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).SelectMessageCommand}"
                                             CommandParameter="{Binding}"
                                             HorizontalAlignment="Stretch"
                                             HorizontalContentAlignment="Stretch"
-                                            Padding="12,12"
                                             Margin="0,2">
                                         <Button.ContextMenu>
                                             <ContextMenu>
@@ -298,42 +306,9 @@
                             </ListBox.ItemTemplate>
                         </ListBox>
 
-                            <controls:MessagePaginationFooterView Grid.Row="1"
+                            <controls:MessagePaginationFooterView Grid.Row="2"
                                                                   Margin="8,8,8,0"
                                                                   DataContext="{Binding CurrentMessageOps}"/>
-
-                            <!-- Beautiful centered loading overlay -->
-                            <Border Grid.RowSpan="2" IsVisible="{Binding CurrentMessageOps.IsLoadingMessages}"
-                                    Background="{DynamicResource LoadingOverlay}"
-                                    IsHitTestVisible="True">
-                                <Border Background="{DynamicResource CardBackground}"
-                                        Padding="32,24"
-                                        CornerRadius="12"
-                                        BorderThickness="1"
-                                        BorderBrush="{DynamicResource BorderDefault}"
-                                        BoxShadow="0 8 24 0 #32000000"
-                                        HorizontalAlignment="Center"
-                                        VerticalAlignment="Center"
-                                        MinWidth="280">
-                                    <StackPanel Spacing="16" HorizontalAlignment="Center">
-                                        <ProgressBar IsIndeterminate="True" Width="200" Height="4"
-                                                     Foreground="{DynamicResource AccentBrand}"
-                                                     Background="{DynamicResource BorderDefault}"/>
-                                        <StackPanel Spacing="8" HorizontalAlignment="Center">
-                                            <TextBlock Text="Loading Messages"
-                                                       FontSize="16"
-                                                       FontWeight="SemiBold"
-                                                       Foreground="{DynamicResource AppForeground}"
-                                                       HorizontalAlignment="Center"/>
-                                            <TextBlock Text="Please wait while we fetch the messages..."
-                                                       FontSize="13"
-                                                       Foreground="{DynamicResource SubtleForeground}"
-                                                       HorizontalAlignment="Center"
-                                                       TextAlignment="Center"/>
-                                        </StackPanel>
-                                    </StackPanel>
-                                </Border>
-                            </Border>
                         </Grid>
                     </TabItem.Content>
                 </TabItem>
@@ -341,8 +316,23 @@
                 <TabItem Header="Dead Letter">
                     <!-- Loading indicator for dead letter messages -->
                     <TabItem.Content>
-                        <Grid RowDefinitions="*,Auto">
-                            <ListBox Grid.Row="0"
+                        <Grid RowDefinitions="Auto,*,Auto">
+                            <Border Grid.Row="0"
+                                    Classes="inline-loading-surface"
+                                    Margin="8,8,8,0"
+                                    IsVisible="{Binding CurrentMessageOps.IsLoadingMessages}">
+                                <StackPanel Orientation="Horizontal" Spacing="10">
+                                    <ProgressBar IsIndeterminate="True"
+                                                 Width="120"
+                                                 Height="3"
+                                                 VerticalAlignment="Center"/>
+                                    <TextBlock Text="Loading dead letter messages"
+                                               Classes="caption"
+                                               VerticalAlignment="Center"/>
+                                </StackPanel>
+                            </Border>
+
+                            <ListBox Grid.Row="1"
                                      ItemsSource="{Binding CurrentMessageOps.FilteredMessages}"
                              SelectedItem="{Binding CurrentMessageOps.SelectedMessage}"
                              Background="Transparent"
@@ -377,12 +367,11 @@
                                             </CheckBox.IsChecked>
                                         </CheckBox>
                                     <Button Grid.Column="1"
-                                            Classes="subtle"
+                                            Classes="message-row"
                                             Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).SelectMessageCommand}"
                                             CommandParameter="{Binding}"
                                             HorizontalAlignment="Stretch"
                                             HorizontalContentAlignment="Stretch"
-                                            Padding="12,12"
                                             Margin="0,2">
                                         <Button.ContextMenu>
                                             <ContextMenu>
@@ -448,42 +437,9 @@
                             </ListBox.ItemTemplate>
                         </ListBox>
 
-                            <controls:MessagePaginationFooterView Grid.Row="1"
+                            <controls:MessagePaginationFooterView Grid.Row="2"
                                                                   Margin="8,8,8,0"
                                                                   DataContext="{Binding CurrentMessageOps}"/>
-
-                            <!-- Beautiful centered loading overlay -->
-                            <Border Grid.RowSpan="2" IsVisible="{Binding CurrentMessageOps.IsLoadingMessages}"
-                                    Background="{DynamicResource LoadingOverlay}"
-                                    IsHitTestVisible="True">
-                                <Border Background="{DynamicResource CardBackground}"
-                                        Padding="32,24"
-                                        CornerRadius="12"
-                                        BorderThickness="1"
-                                        BorderBrush="{DynamicResource BorderDefault}"
-                                        BoxShadow="0 8 24 0 #32000000"
-                                        HorizontalAlignment="Center"
-                                        VerticalAlignment="Center"
-                                        MinWidth="280">
-                                    <StackPanel Spacing="16" HorizontalAlignment="Center">
-                                        <ProgressBar IsIndeterminate="True" Width="200" Height="4"
-                                                     Foreground="{DynamicResource AccentBrand}"
-                                                     Background="{DynamicResource BorderDefault}"/>
-                                        <StackPanel Spacing="8" HorizontalAlignment="Center">
-                                            <TextBlock Text="Loading Dead Letter Messages"
-                                                       FontSize="16"
-                                                       FontWeight="SemiBold"
-                                                       Foreground="{DynamicResource AppForeground}"
-                                                       HorizontalAlignment="Center"/>
-                                            <TextBlock Text="Please wait while we fetch the dead letter messages..."
-                                                       FontSize="13"
-                                                       Foreground="{DynamicResource SubtleForeground}"
-                                                       HorizontalAlignment="Center"
-                                                       TextAlignment="Center"/>
-                                        </StackPanel>
-                                    </StackPanel>
-                                </Border>
-                            </Border>
                         </Grid>
                     </TabItem.Content>
                 </TabItem>

From 9609adb3bb46bc829b812a52d4160c5dc36d2b94 Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Fri, 10 Apr 2026 20:45:44 +0200
Subject: [PATCH 06/13] refactor: standardize dialog scaffold

---
 BusLane.Tests/Views/DialogScaffoldTests.cs | 57 ++++++++++++++++++++++
 BusLane/Styles/AppStyles.axaml             | 30 ++++++++++++
 BusLane/Views/Dialogs/SettingsDialog.axaml | 54 ++++++++++----------
 3 files changed, 116 insertions(+), 25 deletions(-)
 create mode 100644 BusLane.Tests/Views/DialogScaffoldTests.cs

diff --git a/BusLane.Tests/Views/DialogScaffoldTests.cs b/BusLane.Tests/Views/DialogScaffoldTests.cs
new file mode 100644
index 0000000..43cde29
--- /dev/null
+++ b/BusLane.Tests/Views/DialogScaffoldTests.cs
@@ -0,0 +1,57 @@
+namespace BusLane.Tests.Views;
+
+using FluentAssertions;
+
+public class DialogScaffoldTests
+{
+    [Fact]
+    public void AppStyles_DefineDialogHeaderBodyFooterStyles()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetStylesPath());
+
+        // Assert
+        xaml.Should().Contain("Border.dialog-header");
+        xaml.Should().Contain("Border.dialog-body");
+        xaml.Should().Contain("Border.dialog-footer");
+    }
+
+    [Fact]
+    public void SettingsDialog_UsesSharedDialogRegions()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetSettingsDialogPath());
+
+        // Assert
+        xaml.Should().Contain("Classes=\"dialog-header\"");
+        xaml.Should().Contain("Classes=\"dialog-body\"");
+        xaml.Should().Contain("Classes=\"dialog-footer\"");
+    }
+
+    private static string GetStylesPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Styles",
+            "AppStyles.axaml"));
+    }
+
+    private static string GetSettingsDialogPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Views",
+            "Dialogs",
+            "SettingsDialog.axaml"));
+    }
+}
diff --git a/BusLane/Styles/AppStyles.axaml b/BusLane/Styles/AppStyles.axaml
index 0a422c7..858c43a 100644
--- a/BusLane/Styles/AppStyles.axaml
+++ b/BusLane/Styles/AppStyles.axaml
@@ -692,6 +692,36 @@
         <Setter Property="MaxHeight" Value="720"/>
     </Style>
 
+    <Style Selector="Border.dialog-header">
+        <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderDefault}"/>
+        <Setter Property="BorderThickness" Value="0,0,0,1"/>
+        <Setter Property="Padding" Value="24,20"/>
+    </Style>
+
+    <Style Selector="Border.dialog-body">
+        <Setter Property="Padding" Value="24,20"/>
+    </Style>
+
+    <Style Selector="Border.dialog-footer">
+        <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderDefault}"/>
+        <Setter Property="BorderThickness" Value="0,1,0,0"/>
+        <Setter Property="Padding" Value="24,16"/>
+    </Style>
+
+    <Style Selector="Border.settings-section">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
+        <Setter Property="CornerRadius" Value="12"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="Grid.settings-row">
+        <Setter Property="ColumnSpacing" Value="16"/>
+        <Setter Property="Margin" Value="0,0,0,2"/>
+    </Style>
+
     <!-- Progress - Fluent 2 accent color -->
     <Style Selector="ProgressBar">
         <Setter Property="Foreground" Value="{DynamicResource AccentBrand}"/>
diff --git a/BusLane/Views/Dialogs/SettingsDialog.axaml b/BusLane/Views/Dialogs/SettingsDialog.axaml
index 7da92f8..5f24340 100644
--- a/BusLane/Views/Dialogs/SettingsDialog.axaml
+++ b/BusLane/Views/Dialogs/SettingsDialog.axaml
@@ -16,6 +16,7 @@
             <Grid RowDefinitions="Auto,*,Auto">
                 <!-- Header -->
                 <Border Grid.Row="0"
+                        Classes="dialog-header"
                         BorderBrush="{DynamicResource BorderDefault}"
                         BorderThickness="0,0,0,1"
                         Padding="24,20">
@@ -44,11 +45,12 @@
 
                 <!-- Content -->
                 <ScrollViewer Grid.Row="1">
-                    <Border Padding="24,20">
+                    <Border Classes="dialog-body"
+                            Padding="24,20">
                         <StackPanel Spacing="16">
 
                             <!-- Appearance Section -->
-                        <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                        <Border Classes="settings-section" Padding="0">
                             <StackPanel>
                                 <!-- Section Header -->
                                 <Border Padding="16,16"
@@ -67,7 +69,7 @@
                                 <Border Padding="16">
                                     <StackPanel Spacing="12">
                                         <!-- Theme -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Theme" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Choose your preferred color scheme"
@@ -83,7 +85,7 @@
                                         <Border Height="1" Background="{DynamicResource BorderDefault}" Margin="0,4"/>
 
                                         <!-- Dead Letter Badges -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Dead letter badges" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Show message counts on dead letter queues"
@@ -100,7 +102,7 @@
                         </Border>
 
                         <!-- Messages Section -->
-                        <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                        <Border Classes="settings-section" Padding="0">
                             <StackPanel>
                                 <!-- Section Header -->
                                 <Border Padding="16,16"
@@ -119,7 +121,7 @@
                                 <Border Padding="16">
                                     <StackPanel Spacing="12">
                                         <!-- Messages Per Page -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Messages per page" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Number of messages to show per page"
@@ -135,7 +137,7 @@
                                         <Border Height="1" Background="{DynamicResource BorderDefault}" Margin="0,4"/>
 
                                         <!-- Max Total Messages -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Maximum total messages" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Maximum messages to load across all pages"
@@ -151,7 +153,7 @@
                                         <Border Height="1" Background="{DynamicResource BorderDefault}" Margin="0,4"/>
 
                                         <!-- Message Preview -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Message preview" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Show message body preview in the list"
@@ -168,7 +170,7 @@
                         </Border>
 
                         <!-- Auto Refresh Section -->
-                        <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                        <Border Classes="settings-section" Padding="0">
                             <StackPanel>
                                 <!-- Section Header -->
                                 <Border Padding="16,16"
@@ -187,7 +189,7 @@
                                 <Border Padding="16">
                                     <StackPanel Spacing="12">
                                         <!-- Auto Refresh Toggle -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Enable auto-refresh" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Automatically refresh the message list"
@@ -222,7 +224,7 @@
                         </Border>
 
                         <!-- Confirmations Section -->
-                        <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                        <Border Classes="settings-section" Padding="0">
                             <StackPanel>
                                 <!-- Section Header -->
                                 <Border Padding="16,16"
@@ -241,7 +243,7 @@
                                 <Border Padding="16">
                                     <StackPanel Spacing="12">
                                         <!-- Confirm Delete -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Confirm before delete" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Ask for confirmation when deleting messages"
@@ -256,7 +258,7 @@
                                         <Border Height="1" Background="{DynamicResource BorderDefault}" Margin="0,4"/>
 
                                         <!-- Confirm Purge -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Confirm before purge" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Ask for confirmation when purging queues"
@@ -273,7 +275,7 @@
                         </Border>
 
                         <!-- Session Section -->
-                        <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                        <Border Classes="settings-section" Padding="0">
                             <StackPanel>
                                 <!-- Section Header -->
                                 <Border Padding="16,16"
@@ -292,7 +294,7 @@
                                 <Border Padding="16">
                                     <StackPanel Spacing="12">
                                         <!-- Restore Tabs -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Restore tabs on startup" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Remember open connections between sessions"
@@ -309,7 +311,7 @@
                         </Border>
 
                         <!-- Privacy Section -->
-                        <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                        <Border Classes="settings-section" Padding="0">
                             <StackPanel>
                                 <!-- Section Header -->
                                 <Border Padding="16,16"
@@ -328,7 +330,7 @@
                                 <Border Padding="16">
                                     <StackPanel Spacing="12">
                                         <!-- Telemetry Toggle -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Send error reports" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Help improve BusLane by sending anonymous crash reports (requires restart)"
@@ -345,7 +347,7 @@
                         </Border>
 
                         <!-- Security Section -->
-                        <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                        <Border Classes="settings-section" Padding="0">
                             <StackPanel>
                                 <Border Padding="16,16"
                                         BorderBrush="{DynamicResource BorderDefault}"
@@ -523,7 +525,7 @@
                         </Border>
 
                         <!-- Updates Section -->
-                        <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                        <Border Classes="settings-section" Padding="0">
                             <StackPanel>
                                 <!-- Section Header -->
                                 <Border Padding="16,16"
@@ -542,7 +544,7 @@
                                 <Border Padding="16">
                                     <StackPanel Spacing="12">
                                         <!-- Auto Check for Updates -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Automatically check for updates" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Check for new versions on startup"
@@ -554,7 +556,7 @@
                                                           VerticalAlignment="Center"/>
                                         </Grid>
 
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Manual check" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Check now for the latest version"
@@ -571,7 +573,7 @@
                                         <Border Height="1" Background="{DynamicResource BorderDefault}" Margin="0,4"/>
 
                                         <!-- Current Version -->
-                                        <Grid ColumnDefinitions="*,Auto">
+                                        <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Current version" FontWeight="Medium" FontSize="13"/>
                                                 <TextBlock Text="Installed application version"
@@ -588,7 +590,7 @@
                         </Border>
 
                         <!-- Keyboard Shortcuts Section -->
-                        <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                        <Border Classes="settings-section" Padding="0">
                             <StackPanel>
                                 <!-- Section Header -->
                                 <Border Padding="16,16"
@@ -605,7 +607,7 @@
 
                                 <!-- Settings Items -->
                                 <Border Padding="16">
-                                    <Grid ColumnDefinitions="*,Auto">
+                                    <Grid Classes="settings-row" ColumnDefinitions="*,Auto">
                                         <StackPanel Grid.Column="0" Spacing="2">
                                             <TextBlock Text="View all shortcuts" FontWeight="Medium" FontSize="13"/>
                                             <TextBlock Text="See available keyboard shortcuts for quick navigation"
@@ -622,7 +624,7 @@
                         </Border>
 
                         <!-- Support Section -->
-                        <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                        <Border Classes="settings-section" Padding="0">
                             <StackPanel>
                                 <Border Padding="16,16"
                                         BorderBrush="{DynamicResource BorderDefault}"
@@ -666,6 +668,7 @@
 
                 <!-- Footer -->
                 <Border Grid.Row="2"
+                        Classes="dialog-footer"
                         BorderBrush="{DynamicResource BorderDefault}"
                         BorderThickness="0,1,0,0"
                         Padding="24,16"
@@ -676,6 +679,7 @@
                                 Content="Reset to Defaults"
                                 Command="{Binding SettingsViewModel.ResetToDefaultsCommand}"/>
                         <StackPanel Grid.Column="2"
+                                    Classes="dialog-footer-actions"
                                     Orientation="Horizontal"
                                     Spacing="8">
                             <Button Classes="secondary small"

From 737d8738ef09342f1fa9b154868a8ff853454e1e Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Sat, 11 Apr 2026 10:22:01 +0200
Subject: [PATCH 07/13] refactor: simplify connection library dialog

---
 .../Views/ConnectionLibraryDialogTests.cs     |  42 ++
 BusLane/Styles/AppStyles.axaml                |  22 +
 .../Dialogs/ConnectionLibraryDialog.axaml     | 648 +++++++++---------
 3 files changed, 397 insertions(+), 315 deletions(-)
 create mode 100644 BusLane.Tests/Views/ConnectionLibraryDialogTests.cs

diff --git a/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs b/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs
new file mode 100644
index 0000000..853fafb
--- /dev/null
+++ b/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs
@@ -0,0 +1,42 @@
+namespace BusLane.Tests.Views;
+
+using FluentAssertions;
+
+public class ConnectionLibraryDialogTests
+{
+    [Fact]
+    public void ConnectionLibraryDialog_UsesSharedDialogRegions()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetDialogPath());
+
+        // Assert
+        xaml.Should().Contain("Classes=\"dialog-header\"");
+        xaml.Should().Contain("Classes=\"dialog-body\"");
+    }
+
+    [Fact]
+    public void ConnectionLibraryDialog_SeparatesQuickActionsFromFormSurface()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetDialogPath());
+
+        // Assert
+        xaml.Should().Contain("Classes=\"connection-library-command-bar\"");
+        xaml.Should().NotContain("Background=\"{DynamicResource SurfaceSubtle}\"");
+    }
+
+    private static string GetDialogPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Views",
+            "Dialogs",
+            "ConnectionLibraryDialog.axaml"));
+    }
+}
diff --git a/BusLane/Styles/AppStyles.axaml b/BusLane/Styles/AppStyles.axaml
index 858c43a..2273c5f 100644
--- a/BusLane/Styles/AppStyles.axaml
+++ b/BusLane/Styles/AppStyles.axaml
@@ -710,6 +710,28 @@
         <Setter Property="Padding" Value="24,16"/>
     </Style>
 
+    <Style Selector="Border.connection-library-command-bar">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
+        <Setter Property="CornerRadius" Value="12"/>
+        <Setter Property="Padding" Value="16"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="Border.form-section">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
+        <Setter Property="CornerRadius" Value="12"/>
+        <Setter Property="Padding" Value="16"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="TextBlock.form-section-title">
+        <Setter Property="FontSize" Value="14"/>
+        <Setter Property="FontWeight" Value="SemiBold"/>
+        <Setter Property="Foreground" Value="{DynamicResource AppForeground}"/>
+    </Style>
+
     <Style Selector="Border.settings-section">
         <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
         <Setter Property="CornerRadius" Value="12"/>
diff --git a/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml b/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml
index 4265cd1..db2eda4 100644
--- a/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml
+++ b/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml
@@ -16,24 +16,27 @@
                 VerticalAlignment="Center"
                 HorizontalAlignment="Center"
                 Padding="0">
-            <Grid RowDefinitions="Auto,Auto,*">
-                <!-- Header -->
+            <Grid RowDefinitions="Auto,*">
                 <Border Grid.Row="0"
-                        BorderBrush="{DynamicResource BorderDefault}"
-                        BorderThickness="0,0,0,1"
-                        Padding="24,20">
+                        Classes="dialog-header">
                     <Grid ColumnDefinitions="Auto,*,Auto">
                         <Border Grid.Column="0"
-                                Width="44" Height="44"
-                                CornerRadius="12"
+                                Width="40"
+                                Height="40"
+                                CornerRadius="10"
                                 Background="{DynamicResource SurfaceBrand}"
                                 Margin="0,0,16,0">
-                            <LucideIcon Kind="Cable" Size="20"
-                                      Foreground="{DynamicResource AccentBrand}"/>
+                            <LucideIcon Kind="Cable"
+                                        Size="20"
+                                        Foreground="{DynamicResource AccentBrand}"/>
                         </Border>
-                        <StackPanel Grid.Column="1" VerticalAlignment="Center" Spacing="2">
-                            <TextBlock Text="My Connections" Classes="title-small"/>
-                            <TextBlock Text="Manage your saved Service Bus connections" Classes="caption"/>
+                        <StackPanel Grid.Column="1"
+                                    VerticalAlignment="Center"
+                                    Spacing="2">
+                            <TextBlock Text="My Connections"
+                                       Classes="title-small"/>
+                            <TextBlock Text="Manage your saved Service Bus connections"
+                                       Classes="caption"/>
                         </StackPanel>
                         <Button Grid.Column="2"
                                 Classes="subtle"
@@ -45,322 +48,325 @@
                     </Grid>
                 </Border>
 
-                <!-- Tab Navigation -->
-                <Border Grid.Row="1" Padding="24,16,24,0"
-                        IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsAddingConnection, Converter={x:Static BoolConverters.Not}, FallbackValue=True}">
-                    <Border Classes="tab-nav">
-                        <StackPanel Orientation="Horizontal" Spacing="4">
-                            <RadioButton Classes="tab-item"
-                                         Content="All"
-                                         GroupName="EnvironmentTabs"
-                                         IsChecked="{Binding Connection.ConnectionLibraryViewModel.SelectedEnvironmentTab,
-                                             Converter={StaticResource EnvironmentTabConverter},
-                                             ConverterParameter={x:Static models:ConnectionEnvironment.None}}"/>
-                            <RadioButton Classes="tab-item"
-                                         Content="Development"
-                                         GroupName="EnvironmentTabs"
-                                         IsChecked="{Binding Connection.ConnectionLibraryViewModel.SelectedEnvironmentTab,
-                                             Converter={StaticResource EnvironmentTabConverter},
-                                             ConverterParameter={x:Static models:ConnectionEnvironment.Development}}"/>
-                            <RadioButton Classes="tab-item"
-                                         Content="Test"
-                                         GroupName="EnvironmentTabs"
-                                         IsChecked="{Binding Connection.ConnectionLibraryViewModel.SelectedEnvironmentTab,
-                                             Converter={StaticResource EnvironmentTabConverter},
-                                             ConverterParameter={x:Static models:ConnectionEnvironment.Test}}"/>
-                            <RadioButton Classes="tab-item"
-                                         Content="Production"
-                                         GroupName="EnvironmentTabs"
-                                         IsChecked="{Binding Connection.ConnectionLibraryViewModel.SelectedEnvironmentTab,
-                                             Converter={StaticResource EnvironmentTabConverter},
-                                             ConverterParameter={x:Static models:ConnectionEnvironment.Production}}"/>
-                        </StackPanel>
-                    </Border>
-                </Border>
-
-                <!-- Content -->
-                <ScrollViewer Grid.Row="2">
-                    <Border Padding="24,16">
+                <ScrollViewer Grid.Row="1">
+                    <Border Classes="dialog-body">
                         <StackPanel Spacing="16">
+                            <StackPanel Spacing="8"
+                                        IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsAddingConnection, Converter={x:Static BoolConverters.Not}, FallbackValue=True}">
+                                <TextBlock Text="Environment filter"
+                                           Classes="caption"/>
+                                <Border Classes="tab-nav">
+                                    <StackPanel Orientation="Horizontal" Spacing="4">
+                                        <RadioButton Classes="tab-item"
+                                                     Content="All"
+                                                     GroupName="EnvironmentTabs"
+                                                     IsChecked="{Binding Connection.ConnectionLibraryViewModel.SelectedEnvironmentTab,
+                                                         Converter={StaticResource EnvironmentTabConverter},
+                                                         ConverterParameter={x:Static models:ConnectionEnvironment.None}}"/>
+                                        <RadioButton Classes="tab-item"
+                                                     Content="Development"
+                                                     GroupName="EnvironmentTabs"
+                                                     IsChecked="{Binding Connection.ConnectionLibraryViewModel.SelectedEnvironmentTab,
+                                                         Converter={StaticResource EnvironmentTabConverter},
+                                                         ConverterParameter={x:Static models:ConnectionEnvironment.Development}}"/>
+                                        <RadioButton Classes="tab-item"
+                                                     Content="Test"
+                                                     GroupName="EnvironmentTabs"
+                                                     IsChecked="{Binding Connection.ConnectionLibraryViewModel.SelectedEnvironmentTab,
+                                                         Converter={StaticResource EnvironmentTabConverter},
+                                                         ConverterParameter={x:Static models:ConnectionEnvironment.Test}}"/>
+                                        <RadioButton Classes="tab-item"
+                                                     Content="Production"
+                                                     GroupName="EnvironmentTabs"
+                                                     IsChecked="{Binding Connection.ConnectionLibraryViewModel.SelectedEnvironmentTab,
+                                                         Converter={StaticResource EnvironmentTabConverter},
+                                                         ConverterParameter={x:Static models:ConnectionEnvironment.Production}}"/>
+                                    </StackPanel>
+                                </Border>
+                            </StackPanel>
 
-                            <!-- Quick Actions (when not adding) -->
-                            <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}"
+                            <Border Classes="connection-library-command-bar"
                                     IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsAddingConnection, Converter={x:Static BoolConverters.Not}, FallbackValue=True}">
-                                <Border Padding="16">
-                                    <StackPanel Spacing="12">
-                                        <StackPanel Orientation="Horizontal" Spacing="8">
-                                            <Button Classes="primary"
-                                                    Command="{Binding Connection.ConnectionLibraryViewModel.StartAddConnectionCommand}">
-                                                <StackPanel Orientation="Horizontal" Spacing="8">
-                                                    <LucideIcon Kind="Plus" Size="16"/>
-                                                    <TextBlock Text="Add Connection"/>
-                                                </StackPanel>
-                                            </Button>
-                                            <Button Classes="secondary"
-                                                    Command="{Binding Connection.ConnectionLibraryViewModel.ExportConnectionsBackupCommand}"
-                                                    IsVisible="{Binding Connection.ConnectionLibraryViewModel.SavedConnections.Count}">
-                                                <StackPanel Orientation="Horizontal" Spacing="6">
-                                                    <LucideIcon Kind="Download" Size="16"/>
-                                                    <TextBlock Text="Export Backup"/>
-                                                </StackPanel>
-                                            </Button>
-                                            <Button Classes="secondary"
-                                                    Command="{Binding Connection.ConnectionLibraryViewModel.ImportConnectionsBackupCommand}">
-                                                <StackPanel Orientation="Horizontal" Spacing="6">
-                                                    <LucideIcon Kind="Upload" Size="16"/>
-                                                    <TextBlock Text="Import Backup"/>
-                                                </StackPanel>
-                                            </Button>
-                                            <Button Classes="subtle"
-                                                    Command="{Binding Connection.ConnectionLibraryViewModel.ClearAllConnectionsCommand}"
-                                                    IsVisible="{Binding Connection.ConnectionLibraryViewModel.FilteredConnections.Count}">
-                                                <StackPanel Orientation="Horizontal" Spacing="6">
-                                                    <LucideIcon Kind="Trash2" Size="16"/>
-                                                    <TextBlock Text="Clear All"/>
-                                                </StackPanel>
-                                            </Button>
-                                        </StackPanel>
+                                <StackPanel Spacing="12">
+                                    <StackPanel Orientation="Horizontal" Spacing="8">
+                                        <Button Classes="primary"
+                                                Command="{Binding Connection.ConnectionLibraryViewModel.StartAddConnectionCommand}">
+                                            <StackPanel Orientation="Horizontal" Spacing="8">
+                                                <LucideIcon Kind="Plus" Size="16"/>
+                                                <TextBlock Text="Add Connection"/>
+                                            </StackPanel>
+                                        </Button>
+                                        <Button Classes="secondary"
+                                                Command="{Binding Connection.ConnectionLibraryViewModel.ExportConnectionsBackupCommand}"
+                                                IsVisible="{Binding Connection.ConnectionLibraryViewModel.SavedConnections.Count}">
+                                            <StackPanel Orientation="Horizontal" Spacing="6">
+                                                <LucideIcon Kind="Download" Size="16"/>
+                                                <TextBlock Text="Export Backup"/>
+                                            </StackPanel>
+                                        </Button>
+                                        <Button Classes="secondary"
+                                                Command="{Binding Connection.ConnectionLibraryViewModel.ImportConnectionsBackupCommand}">
+                                            <StackPanel Orientation="Horizontal" Spacing="6">
+                                                <LucideIcon Kind="Upload" Size="16"/>
+                                                <TextBlock Text="Import Backup"/>
+                                            </StackPanel>
+                                        </Button>
+                                        <Button Classes="danger-subtle"
+                                                Command="{Binding Connection.ConnectionLibraryViewModel.ClearAllConnectionsCommand}"
+                                                IsVisible="{Binding Connection.ConnectionLibraryViewModel.FilteredConnections.Count}">
+                                            <StackPanel Orientation="Horizontal" Spacing="6">
+                                                <LucideIcon Kind="Trash2" Size="16"/>
+                                                <TextBlock Text="Clear All"/>
+                                            </StackPanel>
+                                        </Button>
+                                    </StackPanel>
 
-                                        <StackPanel Spacing="6">
-                                            <TextBlock Text="Backup passphrase" FontWeight="Medium" FontSize="13"/>
-                                            <TextBox Text="{Binding Connection.ConnectionLibraryViewModel.BackupPassphrase}"
-                                                     PasswordChar="●"
-                                                     Watermark="Required for encrypted export/import"
-                                                     MaxWidth="400"/>
-                                            <TextBlock Text="Use the same passphrase when importing this backup later."
-                                                       Classes="caption"
-                                                       FontSize="11"/>
-                                            <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.BackupErrorMessage}"
-                                                       Foreground="{DynamicResource TextDanger}"
-                                                       IsVisible="{Binding Connection.ConnectionLibraryViewModel.BackupErrorMessage, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
-                                                       TextWrapping="Wrap"/>
-                                        </StackPanel>
+                                    <StackPanel Spacing="6"
+                                                MaxWidth="420">
+                                        <TextBlock Text="Backup passphrase"
+                                                   Classes="form-section-title"/>
+                                        <TextBox Text="{Binding Connection.ConnectionLibraryViewModel.BackupPassphrase}"
+                                                 PasswordChar="●"
+                                                 Watermark="Required for encrypted export/import"/>
+                                        <TextBlock Text="Use the same passphrase when importing this backup later."
+                                                   Classes="caption"/>
+                                        <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.BackupErrorMessage}"
+                                                   Foreground="{DynamicResource TextDanger}"
+                                                   IsVisible="{Binding Connection.ConnectionLibraryViewModel.BackupErrorMessage, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
+                                                   TextWrapping="Wrap"/>
                                     </StackPanel>
-                                </Border>
+                                </StackPanel>
                             </Border>
 
-                            <!-- Add/Edit Connection Form -->
-                            <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}"
+                            <Border Classes="form-section"
                                     IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsAddingConnection, FallbackValue=False}">
-                                <StackPanel>
-                                    <!-- Form Header -->
-                                    <Border Padding="16,16"
-                                            BorderBrush="{DynamicResource BorderDefault}"
-                                            BorderThickness="0,0,0,1"
-                                            Background="{DynamicResource CardBackground}"
-                                            CornerRadius="8,8,0,0">
-                                        <StackPanel Orientation="Horizontal" Spacing="12">
-                                            <Border Width="28" Height="28"
-                                                    CornerRadius="6"
-                                                    Background="{DynamicResource SurfaceBrand}">
-                                                <Panel>
-                                                    <LucideIcon Kind="Pencil" Size="16"
-                                                              Foreground="{DynamicResource AccentBrand}"
-                                                              IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection}"/>
-                                                    <LucideIcon Kind="Plus" Size="16"
-                                                              Foreground="{DynamicResource AccentBrand}"
-                                                              IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection, Converter={x:Static BoolConverters.Not}, FallbackValue=True}"/>
-                                                </Panel>
-                                            </Border>
+                                <StackPanel Spacing="16">
+                                    <StackPanel Orientation="Horizontal"
+                                                Spacing="12">
+                                        <Border Width="28"
+                                                Height="28"
+                                                CornerRadius="6"
+                                                Background="{DynamicResource SurfaceBrand}">
                                             <Panel>
-                                                <TextBlock Text="Add New Connection"
-                                                           FontWeight="SemiBold" FontSize="16" VerticalAlignment="Center"
-                                                           IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection, Converter={x:Static BoolConverters.Not}, FallbackValue=True}"/>
-                                                <TextBlock Text="Edit Connection"
-                                                           FontWeight="SemiBold" FontSize="16" VerticalAlignment="Center"
-                                                           IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection, FallbackValue=False}"/>
+                                                <LucideIcon Kind="Pencil"
+                                                            Size="16"
+                                                            Foreground="{DynamicResource AccentBrand}"
+                                                            IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection}"/>
+                                                <LucideIcon Kind="Plus"
+                                                            Size="16"
+                                                            Foreground="{DynamicResource AccentBrand}"
+                                                            IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection, Converter={x:Static BoolConverters.Not}, FallbackValue=True}"/>
                                             </Panel>
+                                        </Border>
+                                        <StackPanel VerticalAlignment="Center"
+                                                    Spacing="2">
+                                            <TextBlock Text="Add New Connection"
+                                                       Classes="form-section-title"
+                                                       IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection, Converter={x:Static BoolConverters.Not}, FallbackValue=True}"/>
+                                            <TextBlock Text="Edit Connection"
+                                                       Classes="form-section-title"
+                                                       IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection, FallbackValue=False}"/>
+                                            <TextBlock Text="Connection details and secure credentials"
+                                                       Classes="caption"/>
                                         </StackPanel>
-                                    </Border>
-
-                                    <!-- Form Content -->
-                                    <Border Padding="16">
-                                        <StackPanel Spacing="16">
-                                            <!-- Name and Environment Row -->
-                                            <Grid ColumnDefinitions="*,160" ColumnSpacing="16">
-                                                <StackPanel Grid.Column="0" Spacing="6">
-                                                    <TextBlock Text="Connection name" FontWeight="Medium" FontSize="13"/>
-                                                    <TextBox Text="{Binding Connection.ConnectionLibraryViewModel.NewConnectionName}"
-                                                             Watermark="e.g., Production Service Bus"/>
-                                                </StackPanel>
-                                                <StackPanel Grid.Column="1" Spacing="6">
-                                                    <TextBlock Text="Environment" FontWeight="Medium" FontSize="13"/>
-                                                    <ComboBox SelectedItem="{Binding Connection.ConnectionLibraryViewModel.NewConnectionEnvironment}"
-                                                              ItemsSource="{Binding Connection.ConnectionLibraryViewModel.AvailableEnvironments}"
-                                                              HorizontalAlignment="Stretch">
-                                                        <ComboBox.ItemTemplate>
-                                                            <DataTemplate>
-                                                                <TextBlock Text="{Binding}"/>
-                                                            </DataTemplate>
-                                                        </ComboBox.ItemTemplate>
-                                                    </ComboBox>
-                                                </StackPanel>
-                                            </Grid>
+                                    </StackPanel>
 
-                                            <Border Height="1" Background="{DynamicResource BorderDefault}"/>
+                                    <Grid ColumnDefinitions="*,160"
+                                          ColumnSpacing="16">
+                                        <StackPanel Grid.Column="0" Spacing="6">
+                                            <TextBlock Text="Connection name"
+                                                       Classes="form-section-title"/>
+                                            <TextBox Text="{Binding Connection.ConnectionLibraryViewModel.NewConnectionName}"
+                                                     Watermark="e.g., Production Service Bus"/>
+                                        </StackPanel>
+                                        <StackPanel Grid.Column="1" Spacing="6">
+                                            <TextBlock Text="Environment"
+                                                       Classes="form-section-title"/>
+                                            <ComboBox SelectedItem="{Binding Connection.ConnectionLibraryViewModel.NewConnectionEnvironment}"
+                                                      ItemsSource="{Binding Connection.ConnectionLibraryViewModel.AvailableEnvironments}"
+                                                      HorizontalAlignment="Stretch">
+                                                <ComboBox.ItemTemplate>
+                                                    <DataTemplate>
+                                                        <TextBlock Text="{Binding}"/>
+                                                    </DataTemplate>
+                                                </ComboBox.ItemTemplate>
+                                            </ComboBox>
+                                        </StackPanel>
+                                    </Grid>
 
-                                            <!-- Connection String -->
-                                            <StackPanel Spacing="6">
-                                                <TextBlock Text="Connection string" FontWeight="Medium" FontSize="13"/>
-                                                <Grid ColumnDefinitions="*,Auto" ColumnSpacing="8">
-                                                    <TextBox Grid.Column="0"
-                                                             Text="{Binding Connection.ConnectionLibraryViewModel.NewConnectionString}"
-                                                             Watermark="Endpoint=sb://...;SharedAccessKeyName=...;SharedAccessKey=..."
-                                                             PasswordChar="●"
-                                                             TextWrapping="Wrap"
-                                                             AcceptsReturn="False"
-                                                             MaxHeight="80"/>
-                                                    <Button Grid.Column="1"
-                                                            Classes="secondary"
-                                                            ToolTip.Tip="Test connection"
-                                                            Command="{Binding Connection.ConnectionLibraryViewModel.CheckConnectionCommand}"
-                                                            IsEnabled="{Binding Connection.ConnectionLibraryViewModel.IsCheckingConnection, Converter={x:Static BoolConverters.Not}}"
-                                                            VerticalAlignment="Top">
-                                                        <StackPanel Orientation="Horizontal" Spacing="6">
-                                                            <LucideIcon Kind="PlugZap" Size="16"/>
-                                                            <TextBlock Text="Test" IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsCheckingConnection, Converter={x:Static BoolConverters.Not}}"/>
-                                                            <TextBlock Text="Testing..." IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsCheckingConnection}"/>
-                                                        </StackPanel>
-                                                    </Button>
-                                                </Grid>
-                                                <TextBlock Text="Your connection string is encrypted and stored securely"
-                                                           Classes="caption" FontSize="11"/>
-                                            </StackPanel>
+                                    <Border Height="1"
+                                            Background="{DynamicResource BorderDefault}"/>
 
-                                            <!-- Success Result -->
-                                            <Border Classes="infobar-success"
-                                                    IsVisible="{Binding Connection.ConnectionLibraryViewModel.CheckConnectionSuccess, FallbackValue=False}">
-                                                <StackPanel Orientation="Horizontal" Spacing="12">
-                                                    <Border Width="28" Height="28"
-                                                            CornerRadius="14"
-                                                            Background="{DynamicResource TextSuccess}">
-                                                        <LucideIcon Kind="Check" Size="16"
-                                                                  Foreground="{DynamicResource TextOnBrand}"/>
-                                                    </Border>
-                                                    <StackPanel VerticalAlignment="Center" Spacing="2">
-                                                        <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.CheckConnectionResult}"
-                                                                   FontWeight="Medium"/>
-                                                        <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.DetectedInfo}"
-                                                                   Classes="caption"
-                                                                   IsVisible="{Binding Connection.ConnectionLibraryViewModel.DetectedInfo, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"/>
-                                                    </StackPanel>
+                                    <StackPanel Spacing="6">
+                                        <TextBlock Text="Connection string"
+                                                   Classes="form-section-title"/>
+                                        <Grid ColumnDefinitions="*,Auto"
+                                              ColumnSpacing="8">
+                                            <TextBox Grid.Column="0"
+                                                     Text="{Binding Connection.ConnectionLibraryViewModel.NewConnectionString}"
+                                                     Watermark="Endpoint=sb://...;SharedAccessKeyName=...;SharedAccessKey=..."
+                                                     PasswordChar="●"
+                                                     TextWrapping="Wrap"
+                                                     AcceptsReturn="False"
+                                                     MaxHeight="80"/>
+                                            <Button Grid.Column="1"
+                                                    Classes="secondary"
+                                                    ToolTip.Tip="Test connection"
+                                                    Command="{Binding Connection.ConnectionLibraryViewModel.CheckConnectionCommand}"
+                                                    IsEnabled="{Binding Connection.ConnectionLibraryViewModel.IsCheckingConnection, Converter={x:Static BoolConverters.Not}}"
+                                                    VerticalAlignment="Top">
+                                                <StackPanel Orientation="Horizontal" Spacing="6">
+                                                    <LucideIcon Kind="PlugZap" Size="16"/>
+                                                    <TextBlock Text="Test"
+                                                               IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsCheckingConnection, Converter={x:Static BoolConverters.Not}}"/>
+                                                    <TextBlock Text="Testing..."
+                                                               IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsCheckingConnection}"/>
                                                 </StackPanel>
+                                            </Button>
+                                        </Grid>
+                                        <TextBlock Text="Your connection string is encrypted and stored securely"
+                                                   Classes="caption"/>
+                                    </StackPanel>
+
+                                    <Border Classes="infobar-success"
+                                            IsVisible="{Binding Connection.ConnectionLibraryViewModel.CheckConnectionSuccess, FallbackValue=False}">
+                                        <StackPanel Orientation="Horizontal" Spacing="12">
+                                            <Border Width="28"
+                                                    Height="28"
+                                                    CornerRadius="14"
+                                                    Background="{DynamicResource TextSuccess}">
+                                                <LucideIcon Kind="Check"
+                                                            Size="16"
+                                                            Foreground="{DynamicResource TextOnBrand}"/>
                                             </Border>
+                                            <StackPanel VerticalAlignment="Center" Spacing="2">
+                                                <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.CheckConnectionResult}"
+                                                           FontWeight="Medium"/>
+                                                <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.DetectedInfo}"
+                                                           Classes="caption"
+                                                           IsVisible="{Binding Connection.ConnectionLibraryViewModel.DetectedInfo, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"/>
+                                            </StackPanel>
+                                        </StackPanel>
+                                    </Border>
 
-                                            <!-- Error Result -->
-                                            <Border Classes="infobar-error">
-                                                <Border.IsVisible>
-                                                    <MultiBinding Converter="{x:Static BoolConverters.And}">
-                                                        <Binding Path="Connection.ConnectionLibraryViewModel.CheckConnectionResult" Converter="{x:Static StringConverters.IsNotNullOrEmpty}"/>
-                                                        <Binding Path="Connection.ConnectionLibraryViewModel.CheckConnectionSuccess" Converter="{x:Static BoolConverters.Not}"/>
-                                                    </MultiBinding>
-                                                </Border.IsVisible>
-                                                <StackPanel Orientation="Horizontal" Spacing="12">
-                                                    <Border Width="28" Height="28"
-                                                            CornerRadius="14"
-                                                            Background="{DynamicResource TextDanger}">
-                                                        <LucideIcon Kind="TriangleAlert" Size="16"
-                                                                  Foreground="{DynamicResource TextOnBrand}"/>
-                                                    </Border>
-                                                    <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.CheckConnectionResult}"
-                                                               TextWrapping="Wrap"
-                                                               VerticalAlignment="Center"/>
-                                                </StackPanel>
+                                    <Border Classes="infobar-error">
+                                        <Border.IsVisible>
+                                            <MultiBinding Converter="{x:Static BoolConverters.And}">
+                                                <Binding Path="Connection.ConnectionLibraryViewModel.CheckConnectionResult"
+                                                         Converter="{x:Static StringConverters.IsNotNullOrEmpty}"/>
+                                                <Binding Path="Connection.ConnectionLibraryViewModel.CheckConnectionSuccess"
+                                                         Converter="{x:Static BoolConverters.Not}"/>
+                                            </MultiBinding>
+                                        </Border.IsVisible>
+                                        <StackPanel Orientation="Horizontal" Spacing="12">
+                                            <Border Width="28"
+                                                    Height="28"
+                                                    CornerRadius="14"
+                                                    Background="{DynamicResource TextDanger}">
+                                                <LucideIcon Kind="TriangleAlert"
+                                                            Size="16"
+                                                            Foreground="{DynamicResource TextOnBrand}"/>
                                             </Border>
+                                            <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.CheckConnectionResult}"
+                                                       TextWrapping="Wrap"
+                                                       VerticalAlignment="Center"/>
+                                        </StackPanel>
+                                    </Border>
 
-                                            <!-- Validation Error -->
-                                            <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.ValidationMessage}"
-                                                       Foreground="{DynamicResource TextDanger}"
-                                                       IsVisible="{Binding Connection.ConnectionLibraryViewModel.ValidationMessage, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
-                                                       TextWrapping="Wrap"/>
+                                    <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.ValidationMessage}"
+                                               Foreground="{DynamicResource TextDanger}"
+                                               IsVisible="{Binding Connection.ConnectionLibraryViewModel.ValidationMessage, Converter={x:Static StringConverters.IsNotNullOrEmpty}}"
+                                               TextWrapping="Wrap"/>
 
-                                            <Border Height="1" Background="{DynamicResource BorderDefault}"/>
+                                    <Border Height="1"
+                                            Background="{DynamicResource BorderDefault}"/>
 
-                                            <!-- Form Actions -->
-                                            <StackPanel Orientation="Horizontal" Spacing="8" HorizontalAlignment="Right">
-                                                <Button Classes="secondary"
-                                                        Command="{Binding Connection.ConnectionLibraryViewModel.CancelAddConnectionCommand}">
-                                                    <StackPanel Orientation="Horizontal" Spacing="6">
-                                                        <LucideIcon Kind="X" Size="16"/>
-                                                        <TextBlock Text="Cancel"/>
-                                                    </StackPanel>
-                                                </Button>
-                                                <Button Classes="primary"
-                                                        Command="{Binding Connection.ConnectionLibraryViewModel.ValidateAndAddConnectionCommand}"
-                                                        IsEnabled="{Binding Connection.ConnectionLibraryViewModel.IsValidating, Converter={x:Static BoolConverters.Not}}">
-                                                    <StackPanel Orientation="Horizontal" Spacing="6">
-                                                        <LucideIcon Kind="Save" Size="16"/>
-                                                        <Panel>
-                                                            <TextBlock Text="Save Connection"
-                                                                       IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection, Converter={x:Static BoolConverters.Not}, FallbackValue=True}"/>
-                                                            <TextBlock Text="Update Connection"
-                                                                       IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection, FallbackValue=False}"/>
-                                                        </Panel>
-                                                    </StackPanel>
-                                                </Button>
+                                    <StackPanel Classes="dialog-footer-actions">
+                                        <Button Classes="secondary"
+                                                Command="{Binding Connection.ConnectionLibraryViewModel.CancelAddConnectionCommand}">
+                                            <StackPanel Orientation="Horizontal" Spacing="6">
+                                                <LucideIcon Kind="X" Size="16"/>
+                                                <TextBlock Text="Cancel"/>
                                             </StackPanel>
-                                        </StackPanel>
-                                    </Border>
+                                        </Button>
+                                        <Button Classes="primary"
+                                                Command="{Binding Connection.ConnectionLibraryViewModel.ValidateAndAddConnectionCommand}"
+                                                IsEnabled="{Binding Connection.ConnectionLibraryViewModel.IsValidating, Converter={x:Static BoolConverters.Not}}">
+                                            <StackPanel Orientation="Horizontal" Spacing="6">
+                                                <LucideIcon Kind="Save" Size="16"/>
+                                                <Panel>
+                                                    <TextBlock Text="Save Connection"
+                                                               IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection, Converter={x:Static BoolConverters.Not}, FallbackValue=True}"/>
+                                                    <TextBlock Text="Update Connection"
+                                                               IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsEditingConnection, FallbackValue=False}"/>
+                                                </Panel>
+                                            </StackPanel>
+                                        </Button>
+                                    </StackPanel>
                                 </StackPanel>
                             </Border>
 
-                            <!-- Saved Connections List -->
-                            <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}"
+                            <Border Classes="form-section"
                                     IsVisible="{Binding Connection.ConnectionLibraryViewModel.IsAddingConnection, Converter={x:Static BoolConverters.Not}, FallbackValue=True}">
-                                <StackPanel>
-                                    <!-- Section Header -->
-                                    <Border Padding="16,16"
-                                            BorderBrush="{DynamicResource BorderDefault}"
-                                            BorderThickness="0,0,0,1"
-                                            Background="{DynamicResource CardBackground}"
-                                            CornerRadius="8,8,0,0">
-                                        <StackPanel Orientation="Horizontal" Spacing="12">
-                                            <Border Width="28" Height="28"
-                                                    CornerRadius="6"
-                                                    Background="{DynamicResource SurfaceBrand}">
-                                                <LucideIcon Kind="Cable" Size="16"
-                                                          Foreground="{DynamicResource AccentBrand}"/>
+                                <StackPanel Spacing="12">
+                                    <Grid ColumnDefinitions="Auto,*,Auto"
+                                          ColumnSpacing="12">
+                                        <Border Grid.Column="0"
+                                                Width="28"
+                                                Height="28"
+                                                CornerRadius="6"
+                                                Background="{DynamicResource SurfaceBrand}">
+                                            <LucideIcon Kind="Cable"
+                                                        Size="16"
+                                                        Foreground="{DynamicResource AccentBrand}"/>
+                                        </Border>
+                                        <StackPanel Grid.Column="1"
+                                                    Orientation="Horizontal"
+                                                    Spacing="10"
+                                                    VerticalAlignment="Center">
+                                            <TextBlock Text="Saved Connections"
+                                                       Classes="form-section-title"/>
+                                            <Border Classes="badge-info"
+                                                    CornerRadius="10"
+                                                    Padding="8,3"
+                                                    IsVisible="{Binding Connection.ConnectionLibraryViewModel.FilteredConnections.Count}">
+                                                <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.FilteredConnections.Count}"
+                                                           FontSize="12"/>
                                             </Border>
-                                            <StackPanel Orientation="Horizontal" Spacing="10" VerticalAlignment="Center">
-                                                <TextBlock Text="Saved Connections" FontWeight="SemiBold" FontSize="16"/>
-                                                <Border Classes="badge-info" CornerRadius="10" Padding="8,3"
-                                                        IsVisible="{Binding Connection.ConnectionLibraryViewModel.FilteredConnections.Count}">
-                                                    <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.FilteredConnections.Count}" FontSize="12"/>
-                                                </Border>
-                                            </StackPanel>
                                         </StackPanel>
-                                    </Border>
+                                    </Grid>
 
-                                    <!-- Empty State -->
-                                    <Border Padding="16">
-                                        <StackPanel IsVisible="{Binding !Connection.ConnectionLibraryViewModel.FilteredConnections.Count, FallbackValue=True}"
-                                                    VerticalAlignment="Center"
-                                                    HorizontalAlignment="Center"
-                                                    Spacing="12"
-                                                    Margin="0,24">
-                                            <Border Width="64" Height="64"
-                                                    CornerRadius="32"
-                                                    Background="{DynamicResource SurfaceSubtle}"
-                                                    HorizontalAlignment="Center"
-                                                    BorderThickness="2"
-                                                    BorderBrush="{DynamicResource BorderDefault}">
-                                                <LucideIcon Kind="Cable" Size="32"
-                                                          Foreground="{DynamicResource SubtleForeground}"/>
-                                            </Border>
-                                            <TextBlock Text="No connections saved"
-                                                       FontSize="16"
-                                                       FontWeight="SemiBold"
-                                                       HorizontalAlignment="Center"/>
-                                            <TextBlock Text="Add a connection to get started"
-                                                       FontSize="13"
-                                                       Foreground="{DynamicResource SubtleForeground}"
-                                                       HorizontalAlignment="Center"/>
-                                        </StackPanel>
-                                    </Border>
+                                    <Border Height="1"
+                                            Background="{DynamicResource BorderDefault}"/>
+
+                                    <StackPanel IsVisible="{Binding !Connection.ConnectionLibraryViewModel.FilteredConnections.Count, FallbackValue=True}"
+                                                VerticalAlignment="Center"
+                                                HorizontalAlignment="Center"
+                                                Spacing="12"
+                                                Margin="0,12">
+                                        <Border Width="64"
+                                                Height="64"
+                                                CornerRadius="32"
+                                                Background="{DynamicResource LayerBackground}"
+                                                HorizontalAlignment="Center"
+                                                BorderThickness="2"
+                                                BorderBrush="{DynamicResource BorderDefault}">
+                                            <LucideIcon Kind="Cable"
+                                                        Size="32"
+                                                        Foreground="{DynamicResource SubtleForeground}"/>
+                                        </Border>
+                                        <TextBlock Text="No connections saved"
+                                                   FontSize="16"
+                                                   FontWeight="SemiBold"
+                                                   HorizontalAlignment="Center"/>
+                                        <TextBlock Text="Add a connection to get started"
+                                                   FontSize="13"
+                                                   Foreground="{DynamicResource SubtleForeground}"
+                                                   HorizontalAlignment="Center"/>
+                                    </StackPanel>
 
-                                    <!-- Connections List -->
                                     <ItemsControl ItemsSource="{Binding Connection.ConnectionLibraryViewModel.FilteredConnections}"
-                                                  Margin="8,0,8,8">
+                                                  Margin="0,4,0,0">
                                         <ItemsControl.ItemTemplate>
                                             <DataTemplate x:DataType="models:SavedConnection">
                                                 <Border Padding="16"
@@ -370,34 +376,43 @@
                                                         BorderThickness="1"
                                                         BorderBrush="{DynamicResource BorderDefault}">
                                                     <Grid ColumnDefinitions="Auto,*,Auto">
-                                                        <!-- Connection Icon -->
                                                         <Border Grid.Column="0"
-                                                                Width="40" Height="40"
+                                                                Width="40"
+                                                                Height="40"
                                                                 CornerRadius="10"
                                                                 Background="{DynamicResource SurfaceBrand}"
                                                                 Margin="0,0,16,0"
                                                                 VerticalAlignment="Center">
-                                                            <LucideIcon Kind="Cable" Size="20"
-                                                                      Foreground="{DynamicResource AccentBrand}"/>
+                                                            <LucideIcon Kind="Cable"
+                                                                        Size="20"
+                                                                        Foreground="{DynamicResource AccentBrand}"/>
                                                         </Border>
 
-                                                        <!-- Connection Info -->
-                                                        <StackPanel Grid.Column="1" VerticalAlignment="Center" Spacing="6">
+                                                        <StackPanel Grid.Column="1"
+                                                                    VerticalAlignment="Center"
+                                                                    Spacing="6">
                                                             <StackPanel Orientation="Horizontal" Spacing="8">
                                                                 <TextBlock Text="{Binding Name}"
                                                                            FontWeight="SemiBold"
                                                                            FontSize="16"/>
-                                                                <LucideIcon Kind="Star" Size="16"
-                                                                          Foreground="{DynamicResource TextWarning}"
-                                                                          IsVisible="{Binding IsFavorite}"
-                                                                          VerticalAlignment="Center"/>
+                                                                <LucideIcon Kind="Star"
+                                                                            Size="16"
+                                                                            Foreground="{DynamicResource TextWarning}"
+                                                                            IsVisible="{Binding IsFavorite}"
+                                                                            VerticalAlignment="Center"/>
                                                             </StackPanel>
                                                             <StackPanel Orientation="Horizontal" Spacing="8">
-                                                                <Border Classes="badge-info" Padding="8,3">
-                                                                    <TextBlock Text="{Binding TypeDisplayName}" FontSize="11"/>
+                                                                <Border Classes="badge-info"
+                                                                        Padding="8,3">
+                                                                    <TextBlock Text="{Binding TypeDisplayName}"
+                                                                               FontSize="11"/>
                                                                 </Border>
-                                                                <Border Classes="badge-env" Padding="8,3" IsVisible="{Binding HasEnvironment}">
-                                                                    <TextBlock Text="{Binding EnvironmentDisplayName}" FontSize="11" FontWeight="SemiBold"/>
+                                                                <Border Classes="badge-env"
+                                                                        Padding="8,3"
+                                                                        IsVisible="{Binding HasEnvironment}">
+                                                                    <TextBlock Text="{Binding EnvironmentDisplayName}"
+                                                                               FontSize="11"
+                                                                               FontWeight="SemiBold"/>
                                                                 </Border>
                                                                 <TextBlock Text="{Binding EntityName}"
                                                                            Classes="caption"
@@ -415,7 +430,6 @@
                                                                        Foreground="{DynamicResource MutedForeground}"/>
                                                         </StackPanel>
 
-                                                        <!-- Actions -->
                                                         <StackPanel Grid.Column="2"
                                                                     Orientation="Horizontal"
                                                                     Spacing="4"
@@ -426,8 +440,13 @@
                                                                     CommandParameter="{Binding}"
                                                                     Padding="8">
                                                                 <Panel>
-                                                                    <LucideIcon Kind="Star" Size="16" IsVisible="{Binding !IsFavorite}"/>
-                                                                    <LucideIcon Kind="Star" Size="16" Foreground="{DynamicResource TextWarning}" IsVisible="{Binding IsFavorite}"/>
+                                                                    <LucideIcon Kind="Star"
+                                                                                Size="16"
+                                                                                IsVisible="{Binding !IsFavorite}"/>
+                                                                    <LucideIcon Kind="Star"
+                                                                                Size="16"
+                                                                                Foreground="{DynamicResource TextWarning}"
+                                                                                IsVisible="{Binding IsFavorite}"/>
                                                                 </Panel>
                                                             </Button>
                                                             <Button Classes="subtle small"
@@ -460,7 +479,6 @@
                                     </ItemsControl>
                                 </StackPanel>
                             </Border>
-
                         </StackPanel>
                     </Border>
                 </ScrollViewer>

From 1698237e7e23b8a3c61ac89e44d7b417c6fc0174 Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Sat, 11 Apr 2026 10:27:32 +0200
Subject: [PATCH 08/13] refactor: modernize modal workflows

---
 BusLane.Tests/Views/AlertsDialogTests.cs      |  31 ++
 BusLane.Tests/Views/CodeEditorStyleTests.cs   |  25 ++
 BusLane.Tests/Views/SendMessageDialogTests.cs |  32 ++
 BusLane/Styles/AppStyles.axaml                |  28 ++
 BusLane/Views/Dialogs/AlertsDialog.axaml      |  67 ++--
 BusLane/Views/Dialogs/SendMessageDialog.axaml | 302 +++++++++---------
 6 files changed, 296 insertions(+), 189 deletions(-)
 create mode 100644 BusLane.Tests/Views/AlertsDialogTests.cs
 create mode 100644 BusLane.Tests/Views/SendMessageDialogTests.cs

diff --git a/BusLane.Tests/Views/AlertsDialogTests.cs b/BusLane.Tests/Views/AlertsDialogTests.cs
new file mode 100644
index 0000000..99dc552
--- /dev/null
+++ b/BusLane.Tests/Views/AlertsDialogTests.cs
@@ -0,0 +1,31 @@
+namespace BusLane.Tests.Views;
+
+using FluentAssertions;
+
+public class AlertsDialogTests
+{
+    [Fact]
+    public void AlertsDialog_UsesSharedDialogScaffold()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetDialogPath());
+
+        // Assert
+        xaml.Should().Contain("Classes=\"dialog-header\"");
+        xaml.Should().Contain("Classes=\"dialog-body\"");
+    }
+
+    private static string GetDialogPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Views",
+            "Dialogs",
+            "AlertsDialog.axaml"));
+    }
+}
diff --git a/BusLane.Tests/Views/CodeEditorStyleTests.cs b/BusLane.Tests/Views/CodeEditorStyleTests.cs
index 75b3a52..6fc3993 100644
--- a/BusLane.Tests/Views/CodeEditorStyleTests.cs
+++ b/BusLane.Tests/Views/CodeEditorStyleTests.cs
@@ -55,6 +55,17 @@ public void AppStyles_CodeEditorTemplateOverrides_DoNotTargetAllBorders()
         xaml.Should().NotContain("<Style Selector=\"TextBox.code-editor:pointerover /template/ Border\">");
     }
 
+    [Fact]
+    public void SendMessageDialog_CodeEditorRemainsInsideSharedDialogBody()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetSendMessageDialogPath());
+
+        // Assert
+        xaml.Should().Contain("Classes=\"code-editor\"");
+        xaml.Should().Contain("Classes=\"dialog-body\"");
+    }
+
     private static string GetAppStylesPath()
     {
         return Path.GetFullPath(Path.Combine(
@@ -68,6 +79,20 @@ private static string GetAppStylesPath()
             "AppStyles.axaml"));
     }
 
+    private static string GetSendMessageDialogPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Views",
+            "Dialogs",
+            "SendMessageDialog.axaml"));
+    }
+
     private static string GetStyleBlock(string xaml, string selector)
     {
         var styleTag = $"<Style Selector=\"{selector}\">";
diff --git a/BusLane.Tests/Views/SendMessageDialogTests.cs b/BusLane.Tests/Views/SendMessageDialogTests.cs
new file mode 100644
index 0000000..3723bfb
--- /dev/null
+++ b/BusLane.Tests/Views/SendMessageDialogTests.cs
@@ -0,0 +1,32 @@
+namespace BusLane.Tests.Views;
+
+using FluentAssertions;
+
+public class SendMessageDialogTests
+{
+    [Fact]
+    public void SendMessageDialog_UsesSharedDialogScaffold()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetDialogPath());
+
+        // Assert
+        xaml.Should().Contain("Classes=\"dialog-header\"");
+        xaml.Should().Contain("Classes=\"dialog-body\"");
+        xaml.Should().Contain("Classes=\"dialog-footer\"");
+    }
+
+    private static string GetDialogPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Views",
+            "Dialogs",
+            "SendMessageDialog.axaml"));
+    }
+}
diff --git a/BusLane/Styles/AppStyles.axaml b/BusLane/Styles/AppStyles.axaml
index 2273c5f..7c6f135 100644
--- a/BusLane/Styles/AppStyles.axaml
+++ b/BusLane/Styles/AppStyles.axaml
@@ -718,6 +718,22 @@
         <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
     </Style>
 
+    <Style Selector="Border.dialog-command-bar">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
+        <Setter Property="CornerRadius" Value="12"/>
+        <Setter Property="Padding" Value="12"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="Border.dialog-section-surface">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
+        <Setter Property="CornerRadius" Value="12"/>
+        <Setter Property="Padding" Value="16"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
     <Style Selector="Border.form-section">
         <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
         <Setter Property="CornerRadius" Value="12"/>
@@ -732,6 +748,18 @@
         <Setter Property="Foreground" Value="{DynamicResource AppForeground}"/>
     </Style>
 
+    <Style Selector="Border.severity-pill">
+        <Setter Property="CornerRadius" Value="999"/>
+        <Setter Property="Padding" Value="8,3"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="Border.severity-pill TextBlock">
+        <Setter Property="FontSize" Value="11"/>
+        <Setter Property="FontWeight" Value="Medium"/>
+    </Style>
+
     <Style Selector="Border.settings-section">
         <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
         <Setter Property="CornerRadius" Value="12"/>
diff --git a/BusLane/Views/Dialogs/AlertsDialog.axaml b/BusLane/Views/Dialogs/AlertsDialog.axaml
index c9490f9..22ec85a 100644
--- a/BusLane/Views/Dialogs/AlertsDialog.axaml
+++ b/BusLane/Views/Dialogs/AlertsDialog.axaml
@@ -15,9 +15,7 @@
             <Grid RowDefinitions="Auto,Auto,*,Auto">
                 <!-- Header -->
                 <Border Grid.Row="0"
-                        BorderBrush="{DynamicResource BorderDefault}"
-                        BorderThickness="0,0,0,1"
-                        Padding="24,20">
+                        Classes="dialog-header">
                     <Grid ColumnDefinitions="Auto,*,Auto">
                         <Border Grid.Column="0"
                                 Width="44" Height="44"
@@ -48,7 +46,9 @@
                 </Border>
 
                 <!-- Tab Navigation -->
-                <Border Grid.Row="1" Padding="24,16,24,0">
+                <Border Grid.Row="1"
+                        Classes="dialog-command-bar"
+                        Margin="24,16,24,0">
                     <Border Classes="tab-nav">
                         <StackPanel Orientation="Horizontal" Spacing="4">
                             <RadioButton Classes="tab-item"
@@ -69,36 +69,34 @@
 
                 <!-- Content -->
                 <ScrollViewer Grid.Row="2">
-                    <Border Padding="24,16">
+                    <Border Classes="dialog-body">
                         <Grid>
                             <!-- Active Alerts Tab Content -->
                             <StackPanel Spacing="16" IsVisible="{Binding IsActiveAlertsTabSelected}">
 
                                 <!-- Quick Actions -->
-                                <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}"
+                                <Border Classes="dialog-command-bar"
                                         IsVisible="{Binding HasAlerts}">
-                                    <Border Padding="16">
-                                        <StackPanel Orientation="Horizontal" Spacing="8">
-                                            <Button Classes="primary small"
-                                                    Command="{Binding AcknowledgeAllAlertsCommand}">
-                                                <StackPanel Orientation="Horizontal" Spacing="6">
-                                                    <LucideIcon Kind="Check" Size="16"/>
-                                                    <TextBlock Text="Acknowledge All"/>
-                                                </StackPanel>
-                                            </Button>
-                                            <Button Classes="subtle small"
-                                                    Command="{Binding ClearAcknowledgedAlertsCommand}">
-                                                <StackPanel Orientation="Horizontal" Spacing="6">
-                                                    <LucideIcon Kind="Trash2" Size="16"/>
-                                                    <TextBlock Text="Clear Acknowledged"/>
-                                                </StackPanel>
-                                            </Button>
-                                        </StackPanel>
-                                    </Border>
+                                    <StackPanel Orientation="Horizontal" Spacing="8">
+                                        <Button Classes="primary small"
+                                                Command="{Binding AcknowledgeAllAlertsCommand}">
+                                            <StackPanel Orientation="Horizontal" Spacing="6">
+                                                <LucideIcon Kind="Check" Size="16"/>
+                                                <TextBlock Text="Acknowledge All"/>
+                                            </StackPanel>
+                                        </Button>
+                                        <Button Classes="subtle small"
+                                                Command="{Binding ClearAcknowledgedAlertsCommand}">
+                                            <StackPanel Orientation="Horizontal" Spacing="6">
+                                                <LucideIcon Kind="Trash2" Size="16"/>
+                                                <TextBlock Text="Clear Acknowledged"/>
+                                            </StackPanel>
+                                        </Button>
+                                    </StackPanel>
                                 </Border>
 
                                 <!-- Alerts List -->
-                                <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                                <Border Classes="dialog-section-surface" Padding="0">
                                     <StackPanel>
                                         <!-- Section Header -->
                                         <Border Padding="16,16"
@@ -175,11 +173,9 @@
                                                                 <TextBlock Text="{Binding Rule.Name}"
                                                                            FontWeight="SemiBold"
                                                                            FontSize="16"/>
-                                                                <Border CornerRadius="4" Padding="8,3"
+                                                                <Border Classes="severity-pill"
                                                                         Background="{Binding Rule.Severity, Converter={StaticResource SeverityToBackgroundConverter}}">
                                                                     <TextBlock Text="{Binding Rule.Severity}"
-                                                                               FontSize="11"
-                                                                               FontWeight="Medium"
                                                                                Foreground="{Binding Rule.Severity, Converter={StaticResource SeverityToColorConverter}}"/>
                                                                 </Border>
                                                             </StackPanel>
@@ -245,7 +241,7 @@
                             <StackPanel Spacing="16" IsVisible="{Binding IsRulesTabSelected}">
 
                                 <!-- Add/Edit Rule Form -->
-                                <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}"
+                                <Border Classes="dialog-section-surface" Padding="0"
                                         IsVisible="{Binding IsAddingRule}">
                                     <StackPanel>
                                         <!-- Form Header -->
@@ -393,7 +389,7 @@
                                 </Border>
 
                                 <!-- Rules List -->
-                                <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}"
+                                <Border Classes="dialog-section-surface" Padding="0"
                                         IsVisible="{Binding !IsAddingRule}">
                                     <StackPanel>
                                         <!-- Section Header with Add Button -->
@@ -476,11 +472,9 @@
                                                                     <TextBlock Text="{Binding Name}"
                                                                                FontWeight="SemiBold"
                                                                                FontSize="16"/>
-                                                                    <Border CornerRadius="4" Padding="8,3"
+                                                                    <Border Classes="severity-pill"
                                                                             Background="{Binding Severity, Converter={StaticResource SeverityToBackgroundConverter}}">
                                                                         <TextBlock Text="{Binding Severity}"
-                                                                                   FontSize="11"
-                                                                                   FontWeight="Medium"
                                                                                    Foreground="{Binding Severity, Converter={StaticResource SeverityToColorConverter}}"/>
                                                                     </Border>
                                                                 </StackPanel>
@@ -537,7 +531,7 @@
 
                             <!-- Alert History Tab Content -->
                             <StackPanel Spacing="16" IsVisible="{Binding IsHistoryTabSelected}">
-                                <Border Classes="card" Padding="0" Background="{DynamicResource SurfaceSubtle}">
+                                <Border Classes="dialog-section-surface" Padding="0">
                                     <StackPanel>
                                         <Border Padding="16,16"
                                                 BorderBrush="{DynamicResource BorderDefault}"
@@ -622,10 +616,7 @@
 
                 <!-- Footer -->
                 <Border Grid.Row="3"
-                        BorderBrush="{DynamicResource BorderDefault}"
-                        BorderThickness="0,1,0,0"
-                        Padding="24,16"
-                        Background="{DynamicResource CardBackground}">
+                        Classes="dialog-footer">
                     <StackPanel Orientation="Horizontal" Spacing="12" VerticalAlignment="Center">
                         <ToggleSwitch IsChecked="{Binding SystemNotificationsEnabled}"
                                       OnContent="" OffContent=""/>
diff --git a/BusLane/Views/Dialogs/SendMessageDialog.axaml b/BusLane/Views/Dialogs/SendMessageDialog.axaml
index a473b6a..f3173bb 100644
--- a/BusLane/Views/Dialogs/SendMessageDialog.axaml
+++ b/BusLane/Views/Dialogs/SendMessageDialog.axaml
@@ -12,130 +12,131 @@
                 HorizontalAlignment="Center"
                 Width="900"
                 MaxHeight="760">
-            <Grid RowDefinitions="Auto,Auto,520,Auto">
+            <Grid RowDefinitions="Auto,Auto,*,Auto">
                 <!-- Header -->
                 <Border Grid.Row="0"
-                        Background="{DynamicResource SurfaceSubtle}"
-                        Padding="24,20"
-                        CornerRadius="12,12,0,0"
-                        BorderBrush="{DynamicResource BorderMuted}"
-                        BorderThickness="0,0,0,1">
-                    <Grid ColumnDefinitions="*,Auto">
-                        <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="12" VerticalAlignment="Center">
-                            <Border Background="{DynamicResource SurfaceBrand}"
-                                    CornerRadius="8"
-                                    Width="40"
-                                    Height="40"
-                                    VerticalAlignment="Center">
-                                <LucideIcon Kind="Mail"
-                                            Size="20"
-                                            HorizontalAlignment="Center"
-                                            VerticalAlignment="Center"
-                                            Foreground="{DynamicResource AccentBrand}"/>
-                            </Border>
-                            <StackPanel VerticalAlignment="Center" Spacing="2">
-                                <TextBlock Text="Send Message" Classes="heading"/>
-                                <StackPanel Orientation="Horizontal" Spacing="4">
-                                    <TextBlock Text="to" Classes="caption"/>
-                                    <TextBlock Text="{Binding SendMessageViewModel.EntityName}"
-                                               Classes="caption"
-                                               FontWeight="SemiBold"
-                                               Foreground="{DynamicResource AccentBrand}"/>
+                        Classes="dialog-header">
+                    <Grid RowDefinitions="Auto,Auto"
+                          RowSpacing="16">
+                        <Grid ColumnDefinitions="*,Auto">
+                            <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="12" VerticalAlignment="Center">
+                                <Border Background="{DynamicResource SurfaceBrand}"
+                                        CornerRadius="8"
+                                        Width="40"
+                                        Height="40"
+                                        VerticalAlignment="Center">
+                                    <LucideIcon Kind="Mail"
+                                                Size="20"
+                                                HorizontalAlignment="Center"
+                                                VerticalAlignment="Center"
+                                                Foreground="{DynamicResource AccentBrand}"/>
+                                </Border>
+                                <StackPanel VerticalAlignment="Center" Spacing="2">
+                                    <TextBlock Text="Send Message" Classes="heading"/>
+                                    <StackPanel Orientation="Horizontal" Spacing="4">
+                                        <TextBlock Text="to" Classes="caption"/>
+                                        <TextBlock Text="{Binding SendMessageViewModel.EntityName}"
+                                                   Classes="caption"
+                                                   FontWeight="SemiBold"
+                                                   Foreground="{DynamicResource AccentBrand}"/>
+                                    </StackPanel>
                                 </StackPanel>
                             </StackPanel>
-                        </StackPanel>
 
-                        <StackPanel Grid.Column="1"
-                                    Orientation="Horizontal"
-                                    HorizontalAlignment="Right"
-                                    VerticalAlignment="Center"
-                                    Spacing="4">
-                            <Button Classes="toolbar"
-                                    ToolTip.Tip="Import message from JSON file"
-                                    Command="{Binding SendMessageViewModel.ImportMessagesCommand}">
-                                <StackPanel Orientation="Horizontal" Spacing="6">
-                                    <LucideIcon Kind="Download" Size="16"/>
-                                    <TextBlock Text="Import" VerticalAlignment="Center"/>
-                                </StackPanel>
+                            <Button Grid.Column="1"
+                                    Classes="icon"
+                                    ToolTip.Tip="Close"
+                                    Command="{Binding CancelSendMessageCommand}">
+                                <LucideIcon Kind="X" Size="16"/>
                             </Button>
+                        </Grid>
 
-                            <Button Classes="toolbar" ToolTip.Tip="Load saved template">
-                                <StackPanel Orientation="Horizontal" Spacing="6">
-                                    <LucideIcon Kind="FolderOpen" Size="16"/>
-                                    <TextBlock Text="Load" VerticalAlignment="Center"/>
-                                </StackPanel>
-                                <Button.Flyout>
-                                    <Flyout Placement="BottomEdgeAlignedRight">
-                                        <Border MinWidth="300" MaxHeight="360" Padding="12">
-                                            <StackPanel Spacing="8">
-                                                <TextBlock Text="Saved Templates" Classes="body-strong"/>
-                                                <ScrollViewer MaxHeight="280">
-                                                    <StackPanel Spacing="4">
-                                                        <ItemsControl ItemsSource="{Binding SendMessageViewModel.SavedMessages}">
-                                                            <ItemsControl.ItemTemplate>
-                                                                <DataTemplate x:DataType="models:SavedMessage">
-                                                                    <Border Classes="property-row" Padding="12,8">
-                                                                        <Grid ColumnDefinitions="*,Auto">
-                                                                            <StackPanel Grid.Column="0" VerticalAlignment="Center">
-                                                                                <TextBlock Text="{Binding Name}" FontWeight="SemiBold" FontSize="13"/>
-                                                                                <TextBlock Text="{Binding CreatedAt, StringFormat='{}{0:MMM d, yyyy}'}"
-                                                                                           Classes="caption"
-                                                                                           FontSize="11"/>
-                                                                            </StackPanel>
-                                                                            <StackPanel Grid.Column="1" Orientation="Horizontal" Spacing="4">
-                                                                                <Button Classes="primary small"
-                                                                                        Content="Use"
-                                                                                        Padding="12,4"
-                                                                                        Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).SendMessageViewModel.LoadMessageCommand}"
-                                                                                        CommandParameter="{Binding}"/>
-                                                                                <Button Classes="icon"
-                                                                                        ToolTip.Tip="Delete template"
-                                                                                        Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).SendMessageViewModel.DeleteSavedMessageCommand}"
-                                                                                        CommandParameter="{Binding}">
-                                                                                    <LucideIcon Kind="Trash2" Size="12"/>
-                                                                                </Button>
-                                                                            </StackPanel>
-                                                                        </Grid>
-                                                                    </Border>
-                                                                </DataTemplate>
-                                                            </ItemsControl.ItemTemplate>
-                                                        </ItemsControl>
-                                                        <TextBlock Text="No saved templates yet"
-                                                                   Classes="caption"
-                                                                   HorizontalAlignment="Center"
-                                                                   Margin="0,12"
-                                                                   IsVisible="{Binding !SendMessageViewModel.SavedMessages.Count}"/>
-                                                    </StackPanel>
-                                                </ScrollViewer>
-                                            </StackPanel>
-                                        </Border>
-                                    </Flyout>
-                                </Button.Flyout>
-                            </Button>
+                        <Border Grid.Row="1"
+                                Classes="dialog-command-bar">
+                            <StackPanel Orientation="Horizontal"
+                                        HorizontalAlignment="Right"
+                                        Spacing="4">
+                                <Button Classes="toolbar"
+                                        ToolTip.Tip="Import message from JSON file"
+                                        Command="{Binding SendMessageViewModel.ImportMessagesCommand}">
+                                    <StackPanel Orientation="Horizontal" Spacing="6">
+                                        <LucideIcon Kind="Download" Size="16"/>
+                                        <TextBlock Text="Import" VerticalAlignment="Center"/>
+                                    </StackPanel>
+                                </Button>
 
-                            <Button Classes="toolbar"
-                                    ToolTip.Tip="Save as template"
-                                    Command="{Binding SendMessageViewModel.ShowSaveCommand}">
-                                <StackPanel Orientation="Horizontal" Spacing="6">
-                                    <LucideIcon Kind="Save" Size="16"/>
-                                    <TextBlock Text="Save" VerticalAlignment="Center"/>
-                                </StackPanel>
-                            </Button>
+                                <Button Classes="toolbar" ToolTip.Tip="Load saved template">
+                                    <StackPanel Orientation="Horizontal" Spacing="6">
+                                        <LucideIcon Kind="FolderOpen" Size="16"/>
+                                        <TextBlock Text="Load" VerticalAlignment="Center"/>
+                                    </StackPanel>
+                                    <Button.Flyout>
+                                        <Flyout Placement="BottomEdgeAlignedRight">
+                                            <Border MinWidth="300" MaxHeight="360" Padding="12">
+                                                <StackPanel Spacing="8">
+                                                    <TextBlock Text="Saved Templates" Classes="body-strong"/>
+                                                    <ScrollViewer MaxHeight="280">
+                                                        <StackPanel Spacing="4">
+                                                            <ItemsControl ItemsSource="{Binding SendMessageViewModel.SavedMessages}">
+                                                                <ItemsControl.ItemTemplate>
+                                                                    <DataTemplate x:DataType="models:SavedMessage">
+                                                                        <Border Classes="property-row" Padding="12,8">
+                                                                            <Grid ColumnDefinitions="*,Auto">
+                                                                                <StackPanel Grid.Column="0" VerticalAlignment="Center">
+                                                                                    <TextBlock Text="{Binding Name}" FontWeight="SemiBold" FontSize="13"/>
+                                                                                    <TextBlock Text="{Binding CreatedAt, StringFormat='{}{0:MMM d, yyyy}'}"
+                                                                                               Classes="caption"
+                                                                                               FontSize="11"/>
+                                                                                </StackPanel>
+                                                                                <StackPanel Grid.Column="1" Orientation="Horizontal" Spacing="4">
+                                                                                    <Button Classes="primary small"
+                                                                                            Content="Use"
+                                                                                            Padding="12,4"
+                                                                                            Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).SendMessageViewModel.LoadMessageCommand}"
+                                                                                            CommandParameter="{Binding}"/>
+                                                                                    <Button Classes="icon"
+                                                                                            ToolTip.Tip="Delete template"
+                                                                                            Command="{Binding $parent[Window].((vm:MainWindowViewModel)DataContext).SendMessageViewModel.DeleteSavedMessageCommand}"
+                                                                                            CommandParameter="{Binding}">
+                                                                                        <LucideIcon Kind="Trash2" Size="12"/>
+                                                                                    </Button>
+                                                                                </StackPanel>
+                                                                            </Grid>
+                                                                        </Border>
+                                                                    </DataTemplate>
+                                                                </ItemsControl.ItemTemplate>
+                                                            </ItemsControl>
+                                                            <TextBlock Text="No saved templates yet"
+                                                                       Classes="caption"
+                                                                       HorizontalAlignment="Center"
+                                                                       Margin="0,12"
+                                                                       IsVisible="{Binding !SendMessageViewModel.SavedMessages.Count}"/>
+                                                        </StackPanel>
+                                                    </ScrollViewer>
+                                                </StackPanel>
+                                            </Border>
+                                        </Flyout>
+                                    </Button.Flyout>
+                                </Button>
 
-                            <Border Width="1" Height="20" Background="{DynamicResource BorderDefault}" Margin="8,0"/>
+                                <Button Classes="toolbar"
+                                        ToolTip.Tip="Save as template"
+                                        Command="{Binding SendMessageViewModel.ShowSaveCommand}">
+                                    <StackPanel Orientation="Horizontal" Spacing="6">
+                                        <LucideIcon Kind="Save" Size="16"/>
+                                        <TextBlock Text="Save" VerticalAlignment="Center"/>
+                                    </StackPanel>
+                                </Button>
 
-                            <Button Classes="toolbar"
-                                    ToolTip.Tip="Clear all fields"
-                                    Command="{Binding SendMessageViewModel.ClearFormCommand}">
-                                <LucideIcon Kind="RefreshCw" Size="16"/>
-                            </Button>
+                                <Border Width="1" Height="20" Background="{DynamicResource BorderDefault}" Margin="8,0"/>
 
-                            <Button Classes="icon"
-                                    ToolTip.Tip="Close"
-                                    Command="{Binding CancelSendMessageCommand}">
-                                <LucideIcon Kind="X" Size="16"/>
-                            </Button>
-                        </StackPanel>
+                                <Button Classes="toolbar"
+                                        ToolTip.Tip="Clear all fields"
+                                        Command="{Binding SendMessageViewModel.ClearFormCommand}">
+                                    <LucideIcon Kind="RefreshCw" Size="16"/>
+                                </Button>
+                            </StackPanel>
+                        </Border>
                     </Grid>
                 </Border>
 
@@ -158,27 +159,29 @@
                 </Border>
 
                 <!-- Content -->
-                <Grid Grid.Row="2" Margin="24,16,24,16" RowDefinitions="Auto,*">
-                    <Border Grid.Row="0" Classes="tab-nav">
-                        <StackPanel Orientation="Horizontal" Spacing="4">
-                            <RadioButton Classes="tab-item"
-                                         Content="Compose"
-                                         GroupName="SendMessageTabs"
-                                         IsChecked="{Binding SendMessageViewModel.IsComposeTabSelected}"/>
-                            <RadioButton Classes="tab-item"
-                                         Content="Properties"
-                                         GroupName="SendMessageTabs"
-                                         IsChecked="{Binding SendMessageViewModel.IsPropertiesTabSelected}"/>
-                            <RadioButton Classes="tab-item"
-                                         Content="Custom"
-                                         GroupName="SendMessageTabs"
-                                         IsChecked="{Binding SendMessageViewModel.IsCustomTabSelected}"/>
-                        </StackPanel>
-                    </Border>
+                <Border Grid.Row="2"
+                        Classes="dialog-body">
+                    <Grid RowDefinitions="Auto,*">
+                        <Border Grid.Row="0" Classes="tab-nav">
+                            <StackPanel Orientation="Horizontal" Spacing="4">
+                                <RadioButton Classes="tab-item"
+                                             Content="Compose"
+                                             GroupName="SendMessageTabs"
+                                             IsChecked="{Binding SendMessageViewModel.IsComposeTabSelected}"/>
+                                <RadioButton Classes="tab-item"
+                                             Content="Properties"
+                                             GroupName="SendMessageTabs"
+                                             IsChecked="{Binding SendMessageViewModel.IsPropertiesTabSelected}"/>
+                                <RadioButton Classes="tab-item"
+                                             Content="Custom"
+                                             GroupName="SendMessageTabs"
+                                             IsChecked="{Binding SendMessageViewModel.IsCustomTabSelected}"/>
+                            </StackPanel>
+                        </Border>
 
-                    <!-- Compose Tab -->
-                    <ScrollViewer Grid.Row="1" Margin="0,12,0,0" IsVisible="{Binding SendMessageViewModel.IsComposeTabSelected}">
-                        <Border Classes="surface-subtle" Padding="16" CornerRadius="8">
+                        <!-- Compose Tab -->
+                        <ScrollViewer Grid.Row="1" Margin="0,12,0,0" IsVisible="{Binding SendMessageViewModel.IsComposeTabSelected}">
+                            <Border Classes="dialog-section-surface">
                             <StackPanel Spacing="12">
                                 <Border Background="{DynamicResource CardBackground}"
                                         CornerRadius="8"
@@ -217,12 +220,12 @@
                                     </StackPanel>
                                 </Border>
                             </StackPanel>
-                        </Border>
-                    </ScrollViewer>
+                            </Border>
+                        </ScrollViewer>
 
-                    <!-- Properties Tab -->
-                    <ScrollViewer Grid.Row="1" Margin="0,12,0,0" IsVisible="{Binding SendMessageViewModel.IsPropertiesTabSelected}">
-                        <Border Classes="surface-subtle" Padding="16" CornerRadius="8">
+                        <!-- Properties Tab -->
+                        <ScrollViewer Grid.Row="1" Margin="0,12,0,0" IsVisible="{Binding SendMessageViewModel.IsPropertiesTabSelected}">
+                            <Border Classes="dialog-section-surface">
                             <StackPanel Spacing="12">
                                 <Border Classes="property-row" Padding="16">
                                     <StackPanel Spacing="12">
@@ -339,12 +342,12 @@
                                     </StackPanel>
                                 </Border>
                             </StackPanel>
-                        </Border>
-                    </ScrollViewer>
+                            </Border>
+                        </ScrollViewer>
 
-                    <!-- Custom Tab -->
-                    <ScrollViewer Grid.Row="1" Margin="0,12,0,0" IsVisible="{Binding SendMessageViewModel.IsCustomTabSelected}">
-                        <Border Classes="surface-subtle" Padding="16" CornerRadius="8">
+                        <!-- Custom Tab -->
+                        <ScrollViewer Grid.Row="1" Margin="0,12,0,0" IsVisible="{Binding SendMessageViewModel.IsCustomTabSelected}">
+                            <Border Classes="dialog-section-surface">
                             <StackPanel Spacing="12">
                                 <Border Classes="property-row" Padding="16">
                                     <StackPanel Spacing="12">
@@ -409,17 +412,14 @@
                                     </StackPanel>
                                 </Border>
                             </StackPanel>
-                        </Border>
-                    </ScrollViewer>
-                </Grid>
+                            </Border>
+                        </ScrollViewer>
+                    </Grid>
+                </Border>
 
                 <!-- Footer -->
                 <Border Grid.Row="3"
-                        Padding="24,16"
-                        Background="{DynamicResource SurfaceSubtle}"
-                        CornerRadius="0,0,12,12"
-                        BorderBrush="{DynamicResource BorderMuted}"
-                        BorderThickness="0,1,0,0">
+                        Classes="dialog-footer">
                     <Grid>
                         <StackPanel Orientation="Horizontal" Spacing="8">
                             <LucideIcon Kind="Lightbulb"

From a1a063169e649a6ff6760b34ebe3a8442174bd44 Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Sat, 11 Apr 2026 10:32:16 +0200
Subject: [PATCH 09/13] refactor: rebalance dashboard hierarchy

---
 .../Views/NamespaceDashboardViewTests.cs      |  86 +++++++++++++++
 BusLane/App.axaml                             |   2 +
 BusLane/Styles/AppStyles.axaml                |  40 +++++++
 BusLane/Views/Controls/MetricCard.axaml       |   8 +-
 .../Controls/NamespaceDashboardView.axaml     | 104 ++++++++----------
 .../Views/Controls/NamespaceInboxView.axaml   |  36 ++----
 6 files changed, 190 insertions(+), 86 deletions(-)
 create mode 100644 BusLane.Tests/Views/NamespaceDashboardViewTests.cs

diff --git a/BusLane.Tests/Views/NamespaceDashboardViewTests.cs b/BusLane.Tests/Views/NamespaceDashboardViewTests.cs
new file mode 100644
index 0000000..b568f45
--- /dev/null
+++ b/BusLane.Tests/Views/NamespaceDashboardViewTests.cs
@@ -0,0 +1,86 @@
+namespace BusLane.Tests.Views;
+
+using FluentAssertions;
+
+public class NamespaceDashboardViewTests
+{
+    [Fact]
+    public void Dashboard_UsesDefinedSurfaceTokens()
+    {
+        // Arrange
+        var appXaml = File.ReadAllText(GetAppPath());
+        var inboxXaml = File.ReadAllText(GetInboxPath());
+
+        // Assert
+        inboxXaml.Should().Contain("LayerBackground");
+        appXaml.Should().Contain("x:Key=\"LayerBackground\"");
+    }
+
+    [Fact]
+    public void Dashboard_PlacesPriorityInboxBeforeSecondaryWidgets()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetDashboardPath());
+
+        // Act
+        var inboxIndex = xaml.IndexOf("NamespaceInboxView", StringComparison.Ordinal);
+        var chartsIndex = xaml.IndexOf("ItemsControl Grid.Row=\"4\"", StringComparison.Ordinal);
+
+        // Assert
+        inboxIndex.Should().BeGreaterThanOrEqualTo(0);
+        chartsIndex.Should().BeGreaterThan(inboxIndex);
+    }
+
+    [Fact]
+    public void Dashboard_UsesCalmerPrimarySurfaces()
+    {
+        // Arrange
+        var dashboardXaml = File.ReadAllText(GetDashboardPath());
+        var inboxXaml = File.ReadAllText(GetInboxPath());
+
+        // Assert
+        dashboardXaml.Should().Contain("Classes=\"page-header-surface\"");
+        dashboardXaml.Should().NotContain("Classes=\"card\"");
+        inboxXaml.Should().NotContain("Classes=\"card\"");
+    }
+
+    private static string GetAppPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "App.axaml"));
+    }
+
+    private static string GetDashboardPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Views",
+            "Controls",
+            "NamespaceDashboardView.axaml"));
+    }
+
+    private static string GetInboxPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Views",
+            "Controls",
+            "NamespaceInboxView.axaml"));
+    }
+}
diff --git a/BusLane/App.axaml b/BusLane/App.axaml
index 8a1af9a..aa3975b 100644
--- a/BusLane/App.axaml
+++ b/BusLane/App.axaml
@@ -49,6 +49,7 @@
                     <SolidColorBrush x:Key="SidebarBackground" Color="#FAFAFA"/>
                     <SolidColorBrush x:Key="SurfaceSubtle" Color="#F9F9F9"/>
                     <SolidColorBrush x:Key="LayerBackground" Color="#EFEFEF"/>
+                    <SolidColorBrush x:Key="DashboardTileBackground" Color="#F7F7F7"/>
 
                     <!-- Border colors - Fluent 2 stroke tokens -->
                     <SolidColorBrush x:Key="BorderDefault" Color="#E0E0E0"/>
@@ -129,6 +130,7 @@
                     <SolidColorBrush x:Key="SidebarBackground" Color="#1C1C1C"/>
                     <SolidColorBrush x:Key="SurfaceSubtle" Color="#242424"/>
                     <SolidColorBrush x:Key="LayerBackground" Color="#202020"/>
+                    <SolidColorBrush x:Key="DashboardTileBackground" Color="#171717"/>
 
                     <!-- Border colors - Fluent 2 stroke tokens for dark -->
                     <SolidColorBrush x:Key="BorderDefault" Color="#424242"/>
diff --git a/BusLane/Styles/AppStyles.axaml b/BusLane/Styles/AppStyles.axaml
index 7c6f135..00fcb67 100644
--- a/BusLane/Styles/AppStyles.axaml
+++ b/BusLane/Styles/AppStyles.axaml
@@ -1114,6 +1114,46 @@
         <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
     </Style>
 
+    <Style Selector="Border.dashboard-summary-surface">
+        <Setter Property="Background" Value="{DynamicResource DashboardTileBackground}"/>
+        <Setter Property="CornerRadius" Value="12"/>
+        <Setter Property="Padding" Value="18,16"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="Border.metric-icon-surface">
+        <Setter Property="Background" Value="{DynamicResource DashboardTileBackground}"/>
+        <Setter Property="CornerRadius" Value="10"/>
+        <Setter Property="Padding" Value="8"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="Border.dashboard-inbox-surface">
+        <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
+        <Setter Property="CornerRadius" Value="14"/>
+        <Setter Property="Padding" Value="20"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderDefault}"/>
+    </Style>
+
+    <Style Selector="Border.inbox-item-surface">
+        <Setter Property="Background" Value="{DynamicResource LayerBackground}"/>
+        <Setter Property="CornerRadius" Value="12"/>
+        <Setter Property="Padding" Value="16"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
+    <Style Selector="Border.inbox-stat-block">
+        <Setter Property="Background" Value="{DynamicResource DashboardTileBackground}"/>
+        <Setter Property="CornerRadius" Value="10"/>
+        <Setter Property="Padding" Value="10"/>
+        <Setter Property="BorderThickness" Value="1"/>
+        <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
+    </Style>
+
     <Style Selector="Border.pane-search-surface">
         <Setter Property="Background" Value="{DynamicResource CardBackground}"/>
         <Setter Property="CornerRadius" Value="10"/>
diff --git a/BusLane/Views/Controls/MetricCard.axaml b/BusLane/Views/Controls/MetricCard.axaml
index 3665c5d..9dfc0bd 100644
--- a/BusLane/Views/Controls/MetricCard.axaml
+++ b/BusLane/Views/Controls/MetricCard.axaml
@@ -8,12 +8,12 @@
              x:Class="BusLane.Views.Controls.MetricCard"
              x:DataType="vm:MetricCardViewModel">
 
-    <StackPanel Spacing="8">
+    <StackPanel Spacing="6">
         <!-- Value and Trend -->
         <StackPanel Orientation="Horizontal" Spacing="12">
             <TextBlock Text="{Binding Value, StringFormat='{}{0:N0}'}"
-                       FontSize="32"
-                       FontWeight="Bold"
+                       FontSize="28"
+                       FontWeight="SemiBold"
                        Foreground="{DynamicResource TextPrimary}"/>
             
             <StackPanel Orientation="Horizontal"
@@ -40,7 +40,7 @@
 
         <!-- Sparkline -->
         <lvc:CartesianChart 
-            Height="40"
+            Height="32"
             Series="{Binding SparklineSeries}"
             XAxes="{Binding XAxes}"
             YAxes="{Binding YAxes}"
diff --git a/BusLane/Views/Controls/NamespaceDashboardView.axaml b/BusLane/Views/Controls/NamespaceDashboardView.axaml
index da16b87..89c0695 100644
--- a/BusLane/Views/Controls/NamespaceDashboardView.axaml
+++ b/BusLane/Views/Controls/NamespaceDashboardView.axaml
@@ -11,24 +11,25 @@
     <ScrollViewer VerticalScrollBarVisibility="Auto">
         <Grid RowDefinitions="Auto,Auto,Auto,Auto,Auto"
               Margin="24">
-            
+
             <!-- Header -->
-            <Border Grid.Row="0" 
-                    Classes="card" 
-                    Padding="20"
+            <Border Grid.Row="0"
+                    Classes="page-header-surface"
                     Margin="0,0,0,20">
                 <Grid ColumnDefinitions="*,Auto">
-                    <StackPanel Grid.Column="0" Orientation="Horizontal" Spacing="16" VerticalAlignment="Center">
-                        <TextBlock Text="Namespace Overview" 
-                                   Classes="heading"
-                                   VerticalAlignment="Center"/>
+                    <StackPanel Grid.Column="0"
+                                Spacing="4"
+                                VerticalAlignment="Center">
+                        <TextBlock Text="Namespace Overview"
+                                   Classes="heading"/>
+                        <TextBlock Text="Use the inbox first, then skim the summary and supporting trends."
+                                   Classes="caption"/>
                     </StackPanel>
 
-                    <StackPanel Grid.Column="1" 
+                    <StackPanel Grid.Column="1"
                                 Orientation="Horizontal"
                                 Spacing="12"
                                 VerticalAlignment="Center">
-                        <!-- Auto Refresh -->
                         <StackPanel Orientation="Horizontal" Spacing="8">
                             <ToggleSwitch IsChecked="{Binding AutoRefreshEnabled}"
                                          OnContent="Auto"
@@ -46,8 +47,7 @@
                             </StackPanel>
                         </StackPanel>
 
-                        <!-- Refresh Button -->
-                        <Button Classes="primary small"
+                        <Button Classes="secondary small"
                                 Command="{Binding RefreshCommand}"
                                 IsEnabled="{Binding !IsRefreshing}">
                             <StackPanel Orientation="Horizontal" Spacing="6">
@@ -59,70 +59,63 @@
                 </Grid>
             </Border>
 
+            <!-- Priority Inbox -->
+            <controls:NamespaceInboxView Grid.Row="1"
+                                         DataContext="{Binding Inbox}"
+                                         Margin="0,0,0,20"/>
+
             <!-- Metric Cards Row -->
-            <Grid Grid.Row="1" ColumnDefinitions="*,*,*,*" Margin="0,0,0,20">
-                <!-- Active Messages Card -->
-                <Border Grid.Column="0" Classes="card" Padding="20" Margin="0,0,10,0">
-                    <StackPanel Spacing="12">
+            <Grid Grid.Row="2" ColumnDefinitions="*,*,*,*" Margin="0,0,0,20">
+                <Border Grid.Column="0" Classes="dashboard-summary-surface" Margin="0,0,10,0">
+                    <StackPanel Spacing="10">
                         <StackPanel Orientation="Horizontal" Spacing="8">
-                            <Border Background="{DynamicResource AccentBrand}" 
-                                    CornerRadius="6" 
-                                    Padding="8">
-                                <LucideIcon Kind="Inbox" Size="18" Foreground="White"/>
+                            <Border Classes="metric-icon-surface">
+                                <LucideIcon Kind="Inbox" Size="18" Foreground="{DynamicResource AccentBrand}"/>
                             </Border>
-                            <TextBlock Text="Active Messages" 
-                                       Classes="caption" 
+                            <TextBlock Text="Active Messages"
+                                       Classes="caption"
                                        VerticalAlignment="Center"/>
                         </StackPanel>
                         <controls:MetricCard DataContext="{Binding ActiveMessagesCard}"/>
                     </StackPanel>
                 </Border>
 
-                <!-- Dead Letter Card -->
-                <Border Grid.Column="1" Classes="card" Padding="20" Margin="5,0,5,0">
-                    <StackPanel Spacing="12">
+                <Border Grid.Column="1" Classes="dashboard-summary-surface" Margin="5,0,5,0">
+                    <StackPanel Spacing="10">
                         <StackPanel Orientation="Horizontal" Spacing="8">
-                            <Border Background="{DynamicResource TextDanger}" 
-                                    CornerRadius="6" 
-                                    Padding="8">
-                                <LucideIcon Kind="TriangleAlert" Size="18" Foreground="White"/>
+                            <Border Classes="metric-icon-surface">
+                                <LucideIcon Kind="TriangleAlert" Size="18" Foreground="{DynamicResource TextDanger}"/>
                             </Border>
-                            <TextBlock Text="Dead Letters" 
-                                       Classes="caption" 
+                            <TextBlock Text="Dead Letters"
+                                       Classes="caption"
                                        VerticalAlignment="Center"/>
                         </StackPanel>
                         <controls:MetricCard DataContext="{Binding DeadLetterCard}"/>
                     </StackPanel>
                 </Border>
 
-                <!-- Scheduled Card -->
-                <Border Grid.Column="2" Classes="card" Padding="20" Margin="5,0,5,0">
-                    <StackPanel Spacing="12">
+                <Border Grid.Column="2" Classes="dashboard-summary-surface" Margin="5,0,5,0">
+                    <StackPanel Spacing="10">
                         <StackPanel Orientation="Horizontal" Spacing="8">
-                            <Border Background="{DynamicResource TextWarning}" 
-                                    CornerRadius="6" 
-                                    Padding="8">
-                                <LucideIcon Kind="Clock" Size="18" Foreground="White"/>
+                            <Border Classes="metric-icon-surface">
+                                <LucideIcon Kind="Clock" Size="18" Foreground="{DynamicResource TextWarning}"/>
                             </Border>
-                            <TextBlock Text="Scheduled" 
-                                       Classes="caption" 
+                            <TextBlock Text="Scheduled"
+                                       Classes="caption"
                                        VerticalAlignment="Center"/>
                         </StackPanel>
                         <controls:MetricCard DataContext="{Binding ScheduledCard}"/>
                     </StackPanel>
                 </Border>
 
-                <!-- Size Card -->
-                <Border Grid.Column="3" Classes="card" Padding="20" Margin="10,0,0,0">
-                    <StackPanel Spacing="12">
+                <Border Grid.Column="3" Classes="dashboard-summary-surface" Margin="10,0,0,0">
+                    <StackPanel Spacing="10">
                         <StackPanel Orientation="Horizontal" Spacing="8">
-                            <Border Background="{DynamicResource TextSuccess}" 
-                                    CornerRadius="6" 
-                                    Padding="8">
-                                <LucideIcon Kind="HardDrive" Size="18" Foreground="White"/>
+                            <Border Classes="metric-icon-surface">
+                                <LucideIcon Kind="HardDrive" Size="18" Foreground="{DynamicResource TextSuccess}"/>
                             </Border>
-                            <TextBlock Text="Total Size" 
-                                       Classes="caption" 
+                            <TextBlock Text="Total Size"
+                                       Classes="caption"
                                        VerticalAlignment="Center"/>
                         </StackPanel>
                         <controls:MetricCard DataContext="{Binding SizeCard}"/>
@@ -130,19 +123,14 @@
                 </Border>
             </Grid>
 
-            <!-- Priority Inbox -->
-            <controls:NamespaceInboxView Grid.Row="2"
-                                         DataContext="{Binding Inbox}"
-                                         Margin="0,0,0,20"/>
-
             <!-- Top Entities Lists -->
             <Grid Grid.Row="3" ColumnDefinitions="*,*" Margin="0,0,0,20">
                 <controls:TopEntitiesList Grid.Column="0"
-                                         DataContext="{Binding TopQueues}"
-                                         Margin="0,0,10,0"/>
+                                          DataContext="{Binding TopQueues}"
+                                          Margin="0,0,10,0"/>
                 <controls:TopEntitiesList Grid.Column="1"
-                                         DataContext="{Binding TopTopics}"
-                                         Margin="10,0,0,0"/>
+                                          DataContext="{Binding TopTopics}"
+                                          Margin="10,0,0,0"/>
             </Grid>
 
             <!-- Charts Grid -->
diff --git a/BusLane/Views/Controls/NamespaceInboxView.axaml b/BusLane/Views/Controls/NamespaceInboxView.axaml
index 7ccf691..9cde146 100644
--- a/BusLane/Views/Controls/NamespaceInboxView.axaml
+++ b/BusLane/Views/Controls/NamespaceInboxView.axaml
@@ -7,7 +7,7 @@
              x:Class="BusLane.Views.Controls.NamespaceInboxView"
              x:DataType="vm:NamespaceInboxViewModel">
 
-    <Border Classes="card"
+    <Border Classes="dashboard-inbox-surface"
             Padding="20">
         <StackPanel Spacing="16">
             <Grid ColumnDefinitions="*,Auto" ColumnSpacing="12">
@@ -33,8 +33,7 @@
 
             <StackPanel Spacing="16"
                         IsVisible="{Binding IsExpanded}">
-                <Border Classes="card"
-                        Padding="16"
+                <Border Classes="dialog-section-surface"
                         IsVisible="{Binding IsEmpty}">
                     <StackPanel Spacing="6">
                         <TextBlock Text="Nothing needs attention right now."
@@ -48,12 +47,9 @@
                 <ItemsControl ItemsSource="{Binding Items}">
                     <ItemsControl.ItemTemplate>
                         <DataTemplate x:DataType="vm:NamespaceInboxItemViewModel">
-                            <Border Margin="0,0,0,12"
-                                    Padding="16"
-                                    CornerRadius="12"
-                                    BorderThickness="1"
-                                    BorderBrush="{DynamicResource BorderDefault}"
-                                    Background="{DynamicResource LayerBackground}">
+                            <Border Classes="inbox-item-surface"
+                                    Background="{DynamicResource LayerBackground}"
+                                    Margin="0,0,0,12">
                                 <StackPanel Spacing="12">
                                     <Grid ColumnDefinitions="*,Auto" ColumnSpacing="12">
                                         <StackPanel Grid.Column="0" Spacing="4">
@@ -88,9 +84,7 @@
                                     <Grid ColumnDefinitions="*,*,*,*"
                                           ColumnSpacing="12">
                                         <Border Grid.Column="0"
-                                                Padding="10"
-                                                CornerRadius="10"
-                                                Background="{DynamicResource AppBackground}">
+                                                Classes="inbox-stat-block">
                                             <StackPanel Spacing="2">
                                                 <TextBlock Text="Active"
                                                            Classes="caption"/>
@@ -101,9 +95,7 @@
                                         </Border>
 
                                         <Border Grid.Column="1"
-                                                Padding="10"
-                                                CornerRadius="10"
-                                                Background="{DynamicResource AppBackground}">
+                                                Classes="inbox-stat-block">
                                             <StackPanel Spacing="2">
                                                 <TextBlock Text="DLQ"
                                                            Classes="caption"/>
@@ -114,9 +106,7 @@
                                         </Border>
 
                                         <Border Grid.Column="2"
-                                                Padding="10"
-                                                CornerRadius="10"
-                                                Background="{DynamicResource AppBackground}">
+                                                Classes="inbox-stat-block">
                                             <StackPanel Spacing="2">
                                                 <TextBlock Text="Scheduled"
                                                            Classes="caption"/>
@@ -127,9 +117,7 @@
                                         </Border>
 
                                         <Border Grid.Column="3"
-                                                Padding="10"
-                                                CornerRadius="10"
-                                                Background="{DynamicResource AppBackground}">
+                                                Classes="inbox-stat-block">
                                             <StackPanel Spacing="2">
                                                 <TextBlock Text="Alert Delta"
                                                            Classes="caption"/>
@@ -142,15 +130,15 @@
 
                                     <StackPanel Orientation="Horizontal"
                                                 Spacing="8">
-                                        <Button Classes="small"
+                                        <Button Classes="secondary small"
                                                 Command="{Binding OpenMessagesCommand}">
                                             <TextBlock Text="Open Messages"/>
                                         </Button>
-                                        <Button Classes="small"
+                                        <Button Classes="secondary small"
                                                 Command="{Binding OpenDeadLetterCommand}">
                                             <TextBlock Text="Open DLQ"/>
                                         </Button>
-                                        <Button Classes="small"
+                                        <Button Classes="secondary small"
                                                 Command="{Binding OpenSessionInspectorCommand}"
                                                 IsVisible="{Binding CanOpenSessionInspector}">
                                             <TextBlock Text="Open Sessions"/>

From 9a0b7a187dd1c86c86dc5b445a9f7ac067ac268d Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Sat, 11 Apr 2026 10:59:17 +0200
Subject: [PATCH 10/13] refactor: align backup actions with passphrase field

Group the export and import buttons inline with the backup passphrase input to clarify their relationship and improve the visual hierarchy of the connection library dialog.
---
 .../Views/ConnectionLibraryDialogTests.cs     | 38 ++++++++++++++++
 .../Dialogs/ConnectionLibraryDialog.axaml     | 45 +++++++++++--------
 2 files changed, 64 insertions(+), 19 deletions(-)

diff --git a/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs b/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs
index 853fafb..99ce23e 100644
--- a/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs
+++ b/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs
@@ -26,6 +26,44 @@ public void ConnectionLibraryDialog_SeparatesQuickActionsFromFormSurface()
         xaml.Should().NotContain("Background=\"{DynamicResource SurfaceSubtle}\"");
     }
 
+    [Fact]
+    public void ConnectionLibraryDialog_LeftAlignsBackupPassphraseSection()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetDialogPath());
+
+        // Assert
+        xaml.Should().Contain("HorizontalAlignment=\"Left\"");
+    }
+
+    [Fact]
+    public void ConnectionLibraryDialog_PlacesBackupActionsInlineWithPassphraseField()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetDialogPath());
+
+        // Act
+        var passphraseIndex = xaml.IndexOf("Text=\"Backup passphrase\"", StringComparison.Ordinal);
+        var exportIndex = xaml.IndexOf("Text=\"Export Backup\"", StringComparison.Ordinal);
+        var importIndex = xaml.IndexOf("Text=\"Import Backup\"", StringComparison.Ordinal);
+
+        // Assert
+        passphraseIndex.Should().BeGreaterThanOrEqualTo(0);
+        exportIndex.Should().BeGreaterThan(passphraseIndex);
+        importIndex.Should().BeGreaterThan(passphraseIndex);
+        xaml.Should().Contain("ColumnDefinitions=\"*,Auto,Auto\"");
+    }
+
+    [Fact]
+    public void ConnectionLibraryDialog_UsesWiderBackupPassphraseLayout()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetDialogPath());
+
+        // Assert
+        xaml.Should().Contain("MaxWidth=\"520\"");
+    }
+
     private static string GetDialogPath()
     {
         return Path.GetFullPath(Path.Combine(
diff --git a/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml b/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml
index db2eda4..6a44704 100644
--- a/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml
+++ b/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml
@@ -96,21 +96,6 @@
                                                 <TextBlock Text="Add Connection"/>
                                             </StackPanel>
                                         </Button>
-                                        <Button Classes="secondary"
-                                                Command="{Binding Connection.ConnectionLibraryViewModel.ExportConnectionsBackupCommand}"
-                                                IsVisible="{Binding Connection.ConnectionLibraryViewModel.SavedConnections.Count}">
-                                            <StackPanel Orientation="Horizontal" Spacing="6">
-                                                <LucideIcon Kind="Download" Size="16"/>
-                                                <TextBlock Text="Export Backup"/>
-                                            </StackPanel>
-                                        </Button>
-                                        <Button Classes="secondary"
-                                                Command="{Binding Connection.ConnectionLibraryViewModel.ImportConnectionsBackupCommand}">
-                                            <StackPanel Orientation="Horizontal" Spacing="6">
-                                                <LucideIcon Kind="Upload" Size="16"/>
-                                                <TextBlock Text="Import Backup"/>
-                                            </StackPanel>
-                                        </Button>
                                         <Button Classes="danger-subtle"
                                                 Command="{Binding Connection.ConnectionLibraryViewModel.ClearAllConnectionsCommand}"
                                                 IsVisible="{Binding Connection.ConnectionLibraryViewModel.FilteredConnections.Count}">
@@ -122,12 +107,34 @@
                                     </StackPanel>
 
                                     <StackPanel Spacing="6"
-                                                MaxWidth="420">
+                                                HorizontalAlignment="Left"
+                                                MaxWidth="520">
                                         <TextBlock Text="Backup passphrase"
                                                    Classes="form-section-title"/>
-                                        <TextBox Text="{Binding Connection.ConnectionLibraryViewModel.BackupPassphrase}"
-                                                 PasswordChar="●"
-                                                 Watermark="Required for encrypted export/import"/>
+                                        <Grid ColumnDefinitions="*,Auto,Auto"
+                                              ColumnSpacing="8">
+                                            <TextBox Grid.Column="0"
+                                                     Text="{Binding Connection.ConnectionLibraryViewModel.BackupPassphrase}"
+                                                     PasswordChar="●"
+                                                     Watermark="Required for encrypted export/import"/>
+                                            <Button Grid.Column="1"
+                                                    Classes="secondary"
+                                                    Command="{Binding Connection.ConnectionLibraryViewModel.ExportConnectionsBackupCommand}"
+                                                    IsVisible="{Binding Connection.ConnectionLibraryViewModel.SavedConnections.Count}">
+                                                <StackPanel Orientation="Horizontal" Spacing="6">
+                                                    <LucideIcon Kind="Download" Size="16"/>
+                                                    <TextBlock Text="Export Backup"/>
+                                                </StackPanel>
+                                            </Button>
+                                            <Button Grid.Column="2"
+                                                    Classes="secondary"
+                                                    Command="{Binding Connection.ConnectionLibraryViewModel.ImportConnectionsBackupCommand}">
+                                                <StackPanel Orientation="Horizontal" Spacing="6">
+                                                    <LucideIcon Kind="Upload" Size="16"/>
+                                                    <TextBlock Text="Import Backup"/>
+                                                </StackPanel>
+                                            </Button>
+                                        </Grid>
                                         <TextBlock Text="Use the same passphrase when importing this backup later."
                                                    Classes="caption"/>
                                         <TextBlock Text="{Binding Connection.ConnectionLibraryViewModel.BackupErrorMessage}"

From af5100a7ea219f63f94ac1734aca1008e31a1cd0 Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Sat, 11 Apr 2026 11:04:25 +0200
Subject: [PATCH 11/13] refactor: define fixed size for connection library
 dialog

Set explicit width and height constraints on the connection library modal to ensure a consistent and predictable layout as part of the UX remediation.
---
 BusLane.Tests/Views/ConnectionLibraryDialogTests.cs | 11 +++++++++++
 BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml |  2 ++
 2 files changed, 13 insertions(+)

diff --git a/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs b/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs
index 99ce23e..74f8c53 100644
--- a/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs
+++ b/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs
@@ -64,6 +64,17 @@ public void ConnectionLibraryDialog_UsesWiderBackupPassphraseLayout()
         xaml.Should().Contain("MaxWidth=\"520\"");
     }
 
+    [Fact]
+    public void ConnectionLibraryDialog_UsesFixedDialogSize()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetDialogPath());
+
+        // Assert
+        xaml.Should().Contain("Width=\"900\"");
+        xaml.Should().Contain("Height=\"720\"");
+    }
+
     private static string GetDialogPath()
     {
         return Path.GetFullPath(Path.Combine(
diff --git a/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml b/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml
index 6a44704..39b92a0 100644
--- a/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml
+++ b/BusLane/Views/Dialogs/ConnectionLibraryDialog.axaml
@@ -13,6 +13,8 @@
     <Border Classes="modal-overlay"
             IsVisible="{Binding Connection.ShowConnectionLibrary}">
         <Border Classes="modal modal-large"
+                Width="900"
+                Height="720"
                 VerticalAlignment="Center"
                 HorizontalAlignment="Center"
                 Padding="0">

From 174d10e3e65ca053217dff0b9f4cc332414d8a36 Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Sat, 11 Apr 2026 11:13:41 +0200
Subject: [PATCH 12/13] refactor: simplify sidebar workspace actions

Convert the workspace action buttons to a full-width vertical stack and remove the redundant refresh button to streamline the sidebar interface.
---
 BusLane.Tests/Views/NavigationSidebarTests.cs | 23 +++++++++++++++++++
 BusLane/Styles/AppStyles.axaml                |  3 +--
 .../Views/Controls/NavigationSidebar.axaml    | 17 +++-----------
 3 files changed, 27 insertions(+), 16 deletions(-)

diff --git a/BusLane.Tests/Views/NavigationSidebarTests.cs b/BusLane.Tests/Views/NavigationSidebarTests.cs
index 29da50f..b7ea482 100644
--- a/BusLane.Tests/Views/NavigationSidebarTests.cs
+++ b/BusLane.Tests/Views/NavigationSidebarTests.cs
@@ -90,6 +90,29 @@ public void NavigationSidebar_DoesNotRenderConnectionTypeBadge()
         hasConnectionTypeBadge.Should().BeFalse();
     }
 
+    [Fact]
+    public void NavigationSidebar_UsesFullWidthWorkspaceActions()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetSidebarPath());
+
+        // Assert
+        xaml.Should().Contain("<StackPanel Classes=\"sidebar-workspace-actions\"");
+        xaml.Should().NotContain("<WrapPanel Classes=\"sidebar-workspace-actions\"");
+        xaml.Should().NotContain("ItemWidth=\"120\"");
+    }
+
+    [Fact]
+    public void NavigationSidebar_DoesNotRenderRefreshWorkspaceAction()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetSidebarPath());
+
+        // Assert
+        xaml.Should().NotContain("Command=\"{Binding RefreshConnectionCommand}\"");
+        xaml.Should().NotContain("Text=\"Refresh\"");
+    }
+
     private static string GetSidebarPath()
     {
         return Path.GetFullPath(Path.Combine(
diff --git a/BusLane/Styles/AppStyles.axaml b/BusLane/Styles/AppStyles.axaml
index 00fcb67..58b21df 100644
--- a/BusLane/Styles/AppStyles.axaml
+++ b/BusLane/Styles/AppStyles.axaml
@@ -1530,9 +1530,8 @@
         <Setter Property="Margin" Value="0,-2,0,0"/>
     </Style>
 
-    <Style Selector="WrapPanel.sidebar-workspace-actions">
+    <Style Selector="StackPanel.sidebar-workspace-actions">
         <Setter Property="Margin" Value="0,4,0,0"/>
-        <Setter Property="ItemHeight" Value="32"/>
     </Style>
 
     <Style Selector="Border.sidebar-context-pill">
diff --git a/BusLane/Views/Controls/NavigationSidebar.axaml b/BusLane/Views/Controls/NavigationSidebar.axaml
index 84dea7b..a99a1f2 100644
--- a/BusLane/Views/Controls/NavigationSidebar.axaml
+++ b/BusLane/Views/Controls/NavigationSidebar.axaml
@@ -114,19 +114,8 @@
                                     </Border>
                                 </WrapPanel>
 
-                                <WrapPanel Classes="sidebar-workspace-actions"
-                                           Orientation="Horizontal"
-                                           ItemWidth="120">
-                                    <Button Classes="secondary small"
-                                            Command="{Binding RefreshConnectionCommand}"
-                                            HorizontalAlignment="Stretch"
-                                            HorizontalContentAlignment="Center">
-                                        <StackPanel Orientation="Horizontal" Spacing="6">
-                                            <LucideIcon Kind="RefreshCw" Size="14"/>
-                                            <TextBlock Text="Refresh"/>
-                                        </StackPanel>
-                                    </Button>
-
+                                <StackPanel Classes="sidebar-workspace-actions"
+                                            Spacing="8">
                                     <Button Classes="secondary small"
                                             Command="{Binding OpenNamespacePanelCommand}"
                                             HorizontalAlignment="Stretch"
@@ -147,7 +136,7 @@
                                             <TextBlock Text="Disconnect"/>
                                         </StackPanel>
                                     </Button>
-                                </WrapPanel>
+                                </StackPanel>
                             </StackPanel>
                         </Border>
 

From 8f14848a81a2353e0b5b55ff18022e382d3dbda2 Mon Sep 17 00:00:00 2001
From: Tomasz Solik <tomek.solik@gmail.com>
Date: Sat, 11 Apr 2026 12:03:08 +0200
Subject: [PATCH 13/13] refactor: apply fluent design system ux remediations

Standardize component sizing and grid spacing, improve accessibility with automation properties, and implement loading state protections. This update also refines UI terminology and moves inline styling to shared classes to ensure visual consistency.
---
 BusLane.Tests/Views/AlertsDialogTests.cs      |  1 +
 BusLane.Tests/Views/AppThemeResourceTests.cs  |  1 +
 BusLane.Tests/Views/CodeEditorStyleTests.cs   | 22 ++++++++++--
 .../Views/ConnectionLibraryDialogTests.cs     | 10 +++++-
 BusLane.Tests/Views/DialogScaffoldTests.cs    | 18 ++++++++++
 BusLane.Tests/Views/MessagesPanelViewTests.cs | 27 +++++++++++++++
 .../Views/NamespaceDashboardViewTests.cs      | 34 +++++++++++++++++--
 BusLane.Tests/Views/NavigationSidebarTests.cs |  1 +
 BusLane.Tests/Views/TabBarViewTests.cs        |  4 ++-
 BusLane/Styles/AppStyles.axaml                |  5 +--
 .../Views/Controls/MessagesPanelView.axaml    | 10 +++---
 .../Controls/NamespaceDashboardView.axaml     | 10 +++---
 .../Views/Controls/NamespaceInboxView.axaml   |  5 +--
 BusLane/Views/Controls/TabBarView.axaml       |  1 +
 BusLane/Views/Dialogs/SettingsDialog.axaml    |  3 +-
 BusLane/Views/MainWindow.axaml                |  2 +-
 16 files changed, 131 insertions(+), 23 deletions(-)

diff --git a/BusLane.Tests/Views/AlertsDialogTests.cs b/BusLane.Tests/Views/AlertsDialogTests.cs
index 99dc552..d60394b 100644
--- a/BusLane.Tests/Views/AlertsDialogTests.cs
+++ b/BusLane.Tests/Views/AlertsDialogTests.cs
@@ -13,6 +13,7 @@ public void AlertsDialog_UsesSharedDialogScaffold()
         // Assert
         xaml.Should().Contain("Classes=\"dialog-header\"");
         xaml.Should().Contain("Classes=\"dialog-body\"");
+        xaml.Should().Contain("Classes=\"dialog-footer\"");
     }
 
     private static string GetDialogPath()
diff --git a/BusLane.Tests/Views/AppThemeResourceTests.cs b/BusLane.Tests/Views/AppThemeResourceTests.cs
index 3b4b77c..b773715 100644
--- a/BusLane.Tests/Views/AppThemeResourceTests.cs
+++ b/BusLane.Tests/Views/AppThemeResourceTests.cs
@@ -12,6 +12,7 @@ public void AppResources_DefineSharedDashboardSurfaceTokens()
 
         // Assert
         xaml.Should().Contain("x:Key=\"LayerBackground\"");
+        xaml.Should().Contain("x:Key=\"DashboardTileBackground\"");
         xaml.Should().Contain("x:Key=\"AccentBrandSubtle\"");
     }
 
diff --git a/BusLane.Tests/Views/CodeEditorStyleTests.cs b/BusLane.Tests/Views/CodeEditorStyleTests.cs
index 6fc3993..ad3b579 100644
--- a/BusLane.Tests/Views/CodeEditorStyleTests.cs
+++ b/BusLane.Tests/Views/CodeEditorStyleTests.cs
@@ -1,5 +1,7 @@
 namespace BusLane.Tests.Views;
 
+using System.Linq;
+using System.Xml.Linq;
 using FluentAssertions;
 
 public class CodeEditorStyleTests
@@ -60,10 +62,18 @@ public void SendMessageDialog_CodeEditorRemainsInsideSharedDialogBody()
     {
         // Arrange
         var xaml = File.ReadAllText(GetSendMessageDialogPath());
+        var document = XDocument.Parse(xaml);
+        var codeEditor = document
+            .Descendants()
+            .FirstOrDefault(element => HasClass(element, "code-editor"));
 
         // Assert
-        xaml.Should().Contain("Classes=\"code-editor\"");
-        xaml.Should().Contain("Classes=\"dialog-body\"");
+        codeEditor.Should().NotBeNull("SendMessageDialog should include a code editor");
+        codeEditor!
+            .Ancestors()
+            .Any(element => HasClass(element, "dialog-body"))
+            .Should()
+            .BeTrue("the code editor should be nested inside the shared dialog body");
     }
 
     private static string GetAppStylesPath()
@@ -104,4 +114,12 @@ private static string GetStyleBlock(string xaml, string selector)
 
         return xaml[startIndex..(endIndex + "</Style>".Length)];
     }
+
+    private static bool HasClass(XElement element, string className)
+    {
+        var classes = element.Attribute("Classes")?.Value;
+        return classes?
+            .Split(' ', StringSplitOptions.RemoveEmptyEntries)
+            .Contains(className, StringComparer.Ordinal) == true;
+    }
 }
diff --git a/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs b/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs
index 74f8c53..d57339b 100644
--- a/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs
+++ b/BusLane.Tests/Views/ConnectionLibraryDialogTests.cs
@@ -31,9 +31,17 @@ public void ConnectionLibraryDialog_LeftAlignsBackupPassphraseSection()
     {
         // Arrange
         var xaml = File.ReadAllText(GetDialogPath());
+        var passphraseIndex = xaml.IndexOf("Text=\"Backup passphrase\"", StringComparison.Ordinal);
 
         // Assert
-        xaml.Should().Contain("HorizontalAlignment=\"Left\"");
+        passphraseIndex.Should().BeGreaterThanOrEqualTo(0);
+
+        // Act
+        var blockStart = xaml.LastIndexOf("<StackPanel", passphraseIndex, StringComparison.Ordinal);
+        blockStart.Should().BeGreaterThanOrEqualTo(0);
+
+        var passphraseSection = xaml[blockStart..passphraseIndex];
+        passphraseSection.Should().Contain("HorizontalAlignment=\"Left\"");
     }
 
     [Fact]
diff --git a/BusLane.Tests/Views/DialogScaffoldTests.cs b/BusLane.Tests/Views/DialogScaffoldTests.cs
index 43cde29..0fb5e8d 100644
--- a/BusLane.Tests/Views/DialogScaffoldTests.cs
+++ b/BusLane.Tests/Views/DialogScaffoldTests.cs
@@ -28,6 +28,24 @@ public void SettingsDialog_UsesSharedDialogRegions()
         xaml.Should().Contain("Classes=\"dialog-footer\"");
     }
 
+    [Fact]
+    public void SettingsDialog_UsesSharedSettingsRowForRefreshInterval()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetSettingsDialogPath());
+        var refreshIntervalIndex = xaml.IndexOf("Text=\"Refresh interval\"", StringComparison.Ordinal);
+
+        // Assert
+        refreshIntervalIndex.Should().BeGreaterThanOrEqualTo(0);
+
+        // Act
+        var rowStart = xaml.LastIndexOf("<Grid", refreshIntervalIndex, StringComparison.Ordinal);
+        rowStart.Should().BeGreaterThanOrEqualTo(0);
+
+        var refreshIntervalRow = xaml[rowStart..refreshIntervalIndex];
+        refreshIntervalRow.Should().Contain("Classes=\"settings-row\"");
+    }
+
     private static string GetStylesPath()
     {
         return Path.GetFullPath(Path.Combine(
diff --git a/BusLane.Tests/Views/MessagesPanelViewTests.cs b/BusLane.Tests/Views/MessagesPanelViewTests.cs
index b765f9a..f08d7e3 100644
--- a/BusLane.Tests/Views/MessagesPanelViewTests.cs
+++ b/BusLane.Tests/Views/MessagesPanelViewTests.cs
@@ -26,6 +26,19 @@ public void MessagesPanel_DoesNotUseCenteredLoadingCardCopy()
         xaml.Should().Contain("Classes=\"inline-loading-surface\"");
     }
 
+    [Fact]
+    public void MessagesPanel_DisablesMessageListsWhileLoading()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetMessagesPanelPath());
+
+        // Act
+        var disabledListCount = CountOccurrences(xaml, "IsEnabled=\"{Binding !CurrentMessageOps.IsLoadingMessages}\"");
+
+        // Assert
+        disabledListCount.Should().Be(2);
+    }
+
     private static string GetMessagesPanelPath()
     {
         return Path.GetFullPath(Path.Combine(
@@ -39,4 +52,18 @@ private static string GetMessagesPanelPath()
             "Controls",
             "MessagesPanelView.axaml"));
     }
+
+    private static int CountOccurrences(string text, string value)
+    {
+        var count = 0;
+        var index = 0;
+
+        while ((index = text.IndexOf(value, index, StringComparison.Ordinal)) >= 0)
+        {
+            count++;
+            index += value.Length;
+        }
+
+        return count;
+    }
 }
diff --git a/BusLane.Tests/Views/NamespaceDashboardViewTests.cs b/BusLane.Tests/Views/NamespaceDashboardViewTests.cs
index b568f45..cfb1874 100644
--- a/BusLane.Tests/Views/NamespaceDashboardViewTests.cs
+++ b/BusLane.Tests/Views/NamespaceDashboardViewTests.cs
@@ -9,11 +9,13 @@ public void Dashboard_UsesDefinedSurfaceTokens()
     {
         // Arrange
         var appXaml = File.ReadAllText(GetAppPath());
-        var inboxXaml = File.ReadAllText(GetInboxPath());
+        var stylesXaml = File.ReadAllText(GetStylesPath());
 
         // Assert
-        inboxXaml.Should().Contain("LayerBackground");
         appXaml.Should().Contain("x:Key=\"LayerBackground\"");
+        appXaml.Should().Contain("x:Key=\"DashboardTileBackground\"");
+        stylesXaml.Should().Contain("<Style Selector=\"Border.inbox-item-surface\">");
+        stylesXaml.Should().Contain("DashboardTileBackground");
     }
 
     [Fact]
@@ -41,7 +43,22 @@ public void Dashboard_UsesCalmerPrimarySurfaces()
         // Assert
         dashboardXaml.Should().Contain("Classes=\"page-header-surface\"");
         dashboardXaml.Should().NotContain("Classes=\"card\"");
+        inboxXaml.Should().Contain("Classes=\"dashboard-inbox-surface\"");
+        inboxXaml.Should().Contain("Classes=\"inbox-item-surface\"");
         inboxXaml.Should().NotContain("Classes=\"card\"");
+        inboxXaml.Should().NotContain("Padding=\"20\"");
+        inboxXaml.Should().NotContain("Background=\"{DynamicResource LayerBackground}\"");
+    }
+
+    [Fact]
+    public void Dashboard_UsesSharedMetricGridSpacing()
+    {
+        // Arrange
+        var xaml = File.ReadAllText(GetDashboardPath());
+
+        // Assert
+        xaml.Should().Contain("<Grid Grid.Row=\"2\" ColumnDefinitions=\"*,*,*,*\" ColumnSpacing=\"10\" Margin=\"0,0,0,20\">");
+        xaml.Should().NotContain("Classes=\"dashboard-summary-surface\" Margin=");
     }
 
     private static string GetAppPath()
@@ -70,6 +87,19 @@ private static string GetDashboardPath()
             "NamespaceDashboardView.axaml"));
     }
 
+    private static string GetStylesPath()
+    {
+        return Path.GetFullPath(Path.Combine(
+            AppContext.BaseDirectory,
+            "..",
+            "..",
+            "..",
+            "..",
+            "BusLane",
+            "Styles",
+            "AppStyles.axaml"));
+    }
+
     private static string GetInboxPath()
     {
         return Path.GetFullPath(Path.Combine(
diff --git a/BusLane.Tests/Views/NavigationSidebarTests.cs b/BusLane.Tests/Views/NavigationSidebarTests.cs
index b7ea482..53a6987 100644
--- a/BusLane.Tests/Views/NavigationSidebarTests.cs
+++ b/BusLane.Tests/Views/NavigationSidebarTests.cs
@@ -62,6 +62,7 @@ public void NavigationSidebar_DoesNotRenderDisconnectAsStandalonePrimaryBlock()
 
         // Assert
         xaml.Should().NotContain("Classes=\"danger-outline\"");
+        xaml.Should().Contain("Command=\"{Binding DisconnectConnectionCommand}\"");
     }
 
     [Fact]
diff --git a/BusLane.Tests/Views/TabBarViewTests.cs b/BusLane.Tests/Views/TabBarViewTests.cs
index 3cd6c92..720d95b 100644
--- a/BusLane.Tests/Views/TabBarViewTests.cs
+++ b/BusLane.Tests/Views/TabBarViewTests.cs
@@ -22,8 +22,10 @@ public void TabBarView_UsesAccessibleTabButtons()
         var xaml = File.ReadAllText(GetTabBarPath());
 
         // Assert
-        xaml.Should().Contain("RadioButton");
+        xaml.Should().Contain("<RadioButton");
         xaml.Should().Contain("GroupName=\"ConnectionTabs\"");
+        xaml.Should().Contain("Checked=\"TabRadioButton_Checked\"");
+        xaml.Should().Contain("AutomationProperties.Name=\"Close tab\"");
     }
 
     private static string GetTabBarPath()
diff --git a/BusLane/Styles/AppStyles.axaml b/BusLane/Styles/AppStyles.axaml
index 58b21df..ef0c6b0 100644
--- a/BusLane/Styles/AppStyles.axaml
+++ b/BusLane/Styles/AppStyles.axaml
@@ -1297,8 +1297,8 @@
         <Setter Property="BorderThickness" Value="0"/>
         <Setter Property="CornerRadius" Value="6"/>
         <Setter Property="Cursor" Value="Hand"/>
-        <Setter Property="MinWidth" Value="24"/>
-        <Setter Property="MinHeight" Value="24"/>
+        <Setter Property="MinWidth" Value="36"/>
+        <Setter Property="MinHeight" Value="36"/>
     </Style>
 
     <Style Selector="Button.workspace-tab-close:pointerover /template/ ContentPresenter">
@@ -1607,6 +1607,7 @@
         <Setter Property="BorderBrush" Value="{DynamicResource BorderMuted}"/>
         <Setter Property="CornerRadius" Value="8"/>
         <Setter Property="Cursor" Value="Hand"/>
+        <Setter Property="MinWidth" Value="36"/>
         <Setter Property="MinHeight" Value="36"/>
     </Style>
 
diff --git a/BusLane/Views/Controls/MessagesPanelView.axaml b/BusLane/Views/Controls/MessagesPanelView.axaml
index 96ab031..80f09a4 100644
--- a/BusLane/Views/Controls/MessagesPanelView.axaml
+++ b/BusLane/Views/Controls/MessagesPanelView.axaml
@@ -212,6 +212,7 @@
                             <ListBox Grid.Row="1"
                                      ItemsSource="{Binding CurrentMessageOps.FilteredMessages}"
                                      SelectedItem="{Binding CurrentMessageOps.SelectedMessage}"
+                                     IsEnabled="{Binding !CurrentMessageOps.IsLoadingMessages}"
                                      Background="Transparent"
                                      Padding="8"
                                      ScrollViewer.HorizontalScrollBarVisibility="Disabled">
@@ -334,10 +335,11 @@
 
                             <ListBox Grid.Row="1"
                                      ItemsSource="{Binding CurrentMessageOps.FilteredMessages}"
-                             SelectedItem="{Binding CurrentMessageOps.SelectedMessage}"
-                             Background="Transparent"
-                             Padding="8"
-                             ScrollViewer.HorizontalScrollBarVisibility="Disabled">
+                                     SelectedItem="{Binding CurrentMessageOps.SelectedMessage}"
+                                     IsEnabled="{Binding !CurrentMessageOps.IsLoadingMessages}"
+                                     Background="Transparent"
+                                     Padding="8"
+                                     ScrollViewer.HorizontalScrollBarVisibility="Disabled">
                         <ListBox.Styles>
                             <Style Selector="ListBoxItem">
                                 <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
diff --git a/BusLane/Views/Controls/NamespaceDashboardView.axaml b/BusLane/Views/Controls/NamespaceDashboardView.axaml
index 89c0695..cf3aff6 100644
--- a/BusLane/Views/Controls/NamespaceDashboardView.axaml
+++ b/BusLane/Views/Controls/NamespaceDashboardView.axaml
@@ -65,8 +65,8 @@
                                          Margin="0,0,0,20"/>
 
             <!-- Metric Cards Row -->
-            <Grid Grid.Row="2" ColumnDefinitions="*,*,*,*" Margin="0,0,0,20">
-                <Border Grid.Column="0" Classes="dashboard-summary-surface" Margin="0,0,10,0">
+            <Grid Grid.Row="2" ColumnDefinitions="*,*,*,*" ColumnSpacing="10" Margin="0,0,0,20">
+                <Border Grid.Column="0" Classes="dashboard-summary-surface">
                     <StackPanel Spacing="10">
                         <StackPanel Orientation="Horizontal" Spacing="8">
                             <Border Classes="metric-icon-surface">
@@ -80,7 +80,7 @@
                     </StackPanel>
                 </Border>
 
-                <Border Grid.Column="1" Classes="dashboard-summary-surface" Margin="5,0,5,0">
+                <Border Grid.Column="1" Classes="dashboard-summary-surface">
                     <StackPanel Spacing="10">
                         <StackPanel Orientation="Horizontal" Spacing="8">
                             <Border Classes="metric-icon-surface">
@@ -94,7 +94,7 @@
                     </StackPanel>
                 </Border>
 
-                <Border Grid.Column="2" Classes="dashboard-summary-surface" Margin="5,0,5,0">
+                <Border Grid.Column="2" Classes="dashboard-summary-surface">
                     <StackPanel Spacing="10">
                         <StackPanel Orientation="Horizontal" Spacing="8">
                             <Border Classes="metric-icon-surface">
@@ -108,7 +108,7 @@
                     </StackPanel>
                 </Border>
 
-                <Border Grid.Column="3" Classes="dashboard-summary-surface" Margin="10,0,0,0">
+                <Border Grid.Column="3" Classes="dashboard-summary-surface">
                     <StackPanel Spacing="10">
                         <StackPanel Orientation="Horizontal" Spacing="8">
                             <Border Classes="metric-icon-surface">
diff --git a/BusLane/Views/Controls/NamespaceInboxView.axaml b/BusLane/Views/Controls/NamespaceInboxView.axaml
index 9cde146..5ea2e20 100644
--- a/BusLane/Views/Controls/NamespaceInboxView.axaml
+++ b/BusLane/Views/Controls/NamespaceInboxView.axaml
@@ -6,9 +6,7 @@
              mc:Ignorable="d"
              x:Class="BusLane.Views.Controls.NamespaceInboxView"
              x:DataType="vm:NamespaceInboxViewModel">
-
-    <Border Classes="dashboard-inbox-surface"
-            Padding="20">
+    <Border Classes="dashboard-inbox-surface">
         <StackPanel Spacing="16">
             <Grid ColumnDefinitions="*,Auto" ColumnSpacing="12">
                 <StackPanel Grid.Column="0" Spacing="4">
@@ -48,7 +46,6 @@
                     <ItemsControl.ItemTemplate>
                         <DataTemplate x:DataType="vm:NamespaceInboxItemViewModel">
                             <Border Classes="inbox-item-surface"
-                                    Background="{DynamicResource LayerBackground}"
                                     Margin="0,0,0,12">
                                 <StackPanel Spacing="12">
                                     <Grid ColumnDefinitions="*,Auto" ColumnSpacing="12">
diff --git a/BusLane/Views/Controls/TabBarView.axaml b/BusLane/Views/Controls/TabBarView.axaml
index f56f962..0f0e2ca 100644
--- a/BusLane/Views/Controls/TabBarView.axaml
+++ b/BusLane/Views/Controls/TabBarView.axaml
@@ -100,6 +100,7 @@
                                             CommandParameter="{Binding TabId}"
                                             Margin="8,0,0,0"
                                             VerticalAlignment="Center"
+                                            AutomationProperties.Name="Close tab"
                                             ToolTip.Tip="Close tab">
                                         <LucideIcon Kind="X" Size="12"/>
                                     </Button>
diff --git a/BusLane/Views/Dialogs/SettingsDialog.axaml b/BusLane/Views/Dialogs/SettingsDialog.axaml
index 5f24340..3069509 100644
--- a/BusLane/Views/Dialogs/SettingsDialog.axaml
+++ b/BusLane/Views/Dialogs/SettingsDialog.axaml
@@ -205,7 +205,8 @@
                                                 IsVisible="{Binding SettingsViewModel.AutoRefreshMessages}"/>
 
                                         <!-- Refresh Interval -->
-                                        <Grid ColumnDefinitions="*,Auto"
+                                        <Grid Classes="settings-row"
+                                              ColumnDefinitions="*,Auto"
                                               IsVisible="{Binding SettingsViewModel.AutoRefreshMessages}">
                                             <StackPanel Grid.Column="0" Spacing="2">
                                                 <TextBlock Text="Refresh interval" FontWeight="Medium" FontSize="13"/>
diff --git a/BusLane/Views/MainWindow.axaml b/BusLane/Views/MainWindow.axaml
index cfcece0..824ecd2 100644
--- a/BusLane/Views/MainWindow.axaml
+++ b/BusLane/Views/MainWindow.axaml
@@ -73,7 +73,7 @@
                         <StackPanel Spacing="6">
                             <TextBlock Text="{Binding ActiveTab.Namespace.Name}" Classes="title"/>
                             <StackPanel Orientation="Horizontal" Spacing="10">
-                                <TextBlock Text="Azure namespace" Classes="caption"/>
+                                <TextBlock Text="Resource group" Classes="caption"/>
                                 <TextBlock Text="{Binding ActiveTab.Namespace.ResourceGroup}" Classes="caption"/>
                             </StackPanel>
                         </StackPanel>