feat(bar): separate workspace appearance for unfocused displays (#2687)

* feat(bar): separate workspace appearance for unfocused displays

Add a toggle in the Workspace Appearance card to style workspace
indicators independently on displays that aren't currently focused.

The card is split into Focused Display and Unfocused Display(s) tabs.
When the new master toggle is off (default), unfocused displays inherit
the focused settings, preserving existing behavior. When on, unfocused
displays use their own colors (focused/occupied/unfocused/urgent) and
focused border (enable, color, thickness).

WorkspaceSwitcher resolves the focused monitor per compositor and routes
color/border resolution through isFocusedMonitor/useUnfocusedAppearance.

* refactor(bar): address review feedback for unfocused workspace appearance

- Consolidate focused-monitor lookup into BarWidgetService.getFocusedScreenName(),
  adding Mango support, and drop the duplicate compositor switches in
  WorkspaceSwitcher (effectiveScreenName + isFocusedMonitor now use the helper).
- Extract the shared color and border options into reusable
  WorkspaceAppearanceColorOptions and WorkspaceAppearanceBorderFields components
  so the focused and unfocused tabs no longer duplicate the layout.
- Gate the unfocused-display options on BarWidgetService.focusedScreenDetectionSupported
  and show an explanatory note on compositors without focus detection (e.g. labwc),
  instead of silently no-opping.

quickshell/Common/settings/SettingsSpec.js

@@ -163,6 +163,19 @@ var SPEC = {
     workspaceFocusedBorderColor: { def: "primary" },
     workspaceFocusedBorderCustomColor: { def: "#6750A4" },
     workspaceFocusedBorderThickness: { def: 2 },
+    workspaceUnfocusedMonitorSeparateAppearance: { def: false },
+    workspaceUnfocusedMonitorColorMode: { def: "default" },
+    workspaceUnfocusedMonitorFocusedCustomColor: { def: "#6750A4" },
+    workspaceUnfocusedMonitorOccupiedColorMode: { def: "none" },
+    workspaceUnfocusedMonitorOccupiedCustomColor: { def: "#625B71" },
+    workspaceUnfocusedMonitorUnfocusedColorMode: { def: "default" },
+    workspaceUnfocusedMonitorUnfocusedCustomColor: { def: "#49454E" },
+    workspaceUnfocusedMonitorUrgentColorMode: { def: "default" },
+    workspaceUnfocusedMonitorUrgentCustomColor: { def: "#B3261E" },
+    workspaceUnfocusedMonitorBorderEnabled: { def: false },
+    workspaceUnfocusedMonitorBorderColor: { def: "primary" },
+    workspaceUnfocusedMonitorBorderCustomColor: { def: "#6750A4" },
+    workspaceUnfocusedMonitorBorderThickness: { def: 2 },
     workspaceNameIcons: { def: {} },
     waveProgressEnabled: { def: true },
     scrollTitleEnabled: { def: true },