feat: introduce customizable background options with new gradient and solid color styles; integrate BackgroundProvider and BackgroundCard components for enhanced user experience in settings and layout

components/layout/page-layout.tsx

@@ -15,7 +15,7 @@ export function PageLayout({ children }: PageLayoutProps) {
     <SidebarContext.Provider
       value={{ open: sidebarOpen, setOpen: setSidebarOpen }}
     >
-      <div className="flex h-screen bg-background overflow-hidden page-background">
+      <div className="flex h-screen bg-background overflow-hidden page-background bg-default">
         <Sidebar open={sidebarOpen} onOpenChange={setSidebarOpen} />
         <main className="flex-1 overflow-auto overflow-x-hidden page-content">
           <div className="p-3 md:p-8 lg:p-10 space-y-4 md:space-y-8 max-w-full">