fix: Add sidebar background color for mobile overlay

- Add missing --color-sidebar CSS variable to generate bg-sidebar utility
- Update SheetContent to allow background class override
- Fixes missing background on mobile navigation overlay at small breakpoints

ui/desktop/src/components/ui/sheet.tsx

@@ -52,7 +52,7 @@ function SheetContent({
       <SheetPrimitive.Content
         data-slot="sheet-content"
         className={cn(
-          'bg-background-primary data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 shadow-lg',
+          'data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 shadow-lg',
           side === 'right' &&
             'data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm',
           side === 'left' &&
@@ -61,6 +61,8 @@ function SheetContent({
             'data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b',
           side === 'bottom' &&
             'data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t',
+          // Apply bg-background-primary as default, but allow override via className
+          !className?.includes('bg-') && 'bg-background-primary',
           className
         )}
         {...props}

ui/desktop/src/styles/main.css

@@ -198,6 +198,7 @@
 
   --color-ring: var(--color-ring-primary);
 
+  --color-sidebar: var(--sidebar);
   --color-sidebar-foreground: var(--sidebar-foreground);
   --color-sidebar-accent: var(--sidebar-accent);
   --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);