Changes in lightmode and dark mode header

src/components/layout/app-shell.tsx

@@ -33,7 +33,7 @@ export function AppShell({ children }: AppShellProps) {
   }
 
   return (
-    <div className="min-h-screen bg-[#F8F8F8] dark:bg-[#0A0A0A] relative overflow-hidden"
+    <div className="min-h-screen bg-background dark:bg-[#0A0A0A] relative overflow-hidden"
       style={{
         backgroundImage: "radial-gradient(circle, #CC000010 1px, transparent 1px), radial-gradient(circle, #0033CC06 1px, transparent 1px)",
         backgroundSize: "28px 28px, 14px 14px",

src/components/layout/topbar.tsx

@@ -122,10 +122,10 @@ export function Topbar({ onMenuClick }: TopbarProps) {
 
       {/* Search */}
       <div className="relative hidden flex-1 sm:block md:w-80">
-        <Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-[#888888] dark:text-[#666666]" />
+        <Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground dark:text-[#666666]" />
         <Input
           placeholder="Search leads, companies..."
-          className="h-9 w-full max-w-sm pl-9 bg-[#F0F0F0] dark:bg-[#1E1E1E] border-[#E0E0E0] dark:border-[#222222] text-[#111111] dark:text-white"
+          className="h-9 w-full max-w-sm pl-9 bg-muted dark:bg-[#1E1E1E] border-border dark:border-[#222222] text-foreground dark:text-white"
         />
       </div>