feat: implement personalized background image feature

- Added functionality for users to select and customize background images in settings, including predefined options and URL uploads.
- Updated `ViewPreferences` to store background image settings and modified `userPreferencesService` to handle updates.
- Enhanced global styles for improved readability with background images, including blur and transparency effects.
- Integrated `BackgroundImageSelector` component into settings for intuitive user experience.
- Refactored `Card` components across the app to use a new 'glass' variant for better aesthetics.

src/app/layout.tsx

@@ -2,6 +2,7 @@ import type { Metadata } from "next";
 import { Geist, Geist_Mono } from "next/font/google";
 import "./globals.css";
 import { ThemeProvider } from "@/contexts/ThemeContext";
+import { BackgroundProvider } from "@/contexts/BackgroundContext";
 import { JiraConfigProvider } from "@/contexts/JiraConfigContext";
 import { UserPreferencesProvider } from "@/contexts/UserPreferencesContext";
 import { KeyboardShortcutsProvider } from "@/contexts/KeyboardShortcutsContext";
@@ -54,7 +55,9 @@ export default async function RootLayout({
               <KeyboardShortcuts />
               <JiraConfigProvider config={initialPreferences?.jiraConfig || { enabled: false }}>
                 <UserPreferencesProvider initialPreferences={initialPreferences}>
-                  {children}
+                  <BackgroundProvider>
+                    {children}
+                  </BackgroundProvider>
                 </UserPreferencesProvider>
               </JiraConfigProvider>
             </KeyboardShortcutsProvider>