Improve visual structure and navigation on various pages

Refactors page titles/descriptions into reusable PageHeader component in AIPage, AnalyticsPage, ChatPage, FinancesPage, FocusPage, SettingsPage, ThemePage, and VoicePage.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: d7e7c4e8-20cb-41c4-9d0e-79f48938fede
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/9777c70b-fc38-4831-8d6b-78dfffe041b0/259ea43b-b9fd-4bd0-b9f3-f4898fd6e25c.jpg

client/src/pages/SettingsPage.tsx

@@ -11,6 +11,7 @@ import { Separator } from "@/components/ui/separator";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { LanguageSwitcher } from "@/components/LanguageSwitcher";
+import { PageHeader } from "@/components/ui/page-header";
 import { useToast } from "@/hooks/use-toast";
 import Sidebar from "@/components/layout/Sidebar";
 import { User, Bell, Shield, Palette, Moon, Sun, Globe, Download, Trash2 } from "lucide-react";
@@ -58,12 +59,10 @@ export default function SettingsPage() {
       <Sidebar className="w-64 border-r" />
       <div className="flex-1 overflow-auto">
         <div className="p-6">
-          <div className="mb-6">
-            <h1 className="text-2xl font-bold text-gray-900 dark:text-white">Settings</h1>
-            <p className="text-gray-600 dark:text-gray-300">
-              Manage your account settings and preferences
-            </p>
-          </div>
+          <PageHeader
+            title="Settings"
+            description="Manage your account settings and preferences"
+          />
 
           <Tabs defaultValue="profile" className="space-y-6">
             <TabsList>