diff --git a/app/ClientLayout.js b/app/ClientLayout.js
index 9e84d46..d33bf30 100644
--- a/app/ClientLayout.js
+++ b/app/ClientLayout.js
@@ -724,24 +724,37 @@ export default function ClientLayout({ children }) {
         </nav>
       )}
 
+      {isHomePage && (
+        <div className="fixed inset-0 -z-10">
+          <motion.div
+            className="absolute inset-0 bg-cover bg-center bg-no-repeat"
+            style={{ backgroundImage: 'url(/hero.jpg)' }}
+            initial={{ scale: 1.1 }}
+            animate={{ scale: 1 }}
+            transition={{ duration: 1.5, ease: "easeOut" }}
+          />
+          <div className="absolute inset-0 bg-gradient-to-r from-black/70 via-black/60 to-black/50" />
+        </div>
+      )}
+
       <main
-            className={`${!isAuthPage && !isProfilePage && !isAuthenticated ? "pt-20" : ""} flex-1 flex flex-col bg-gray-50 ${currentLanguage === "ar" ? "text-right" : "text-left"} ${isHomePage ? "relative" : ""} ${isAuthenticated && !isAuthPage ? "pb-20" : ""}`}
+            className={`${!isAuthPage && !isProfilePage && !isAuthenticated ? "pt-20" : ""} flex-1 flex flex-col ${isHomePage ? "bg-transparent" : "bg-gray-50"} ${currentLanguage === "ar" ? "text-right" : "text-left"} ${isHomePage ? "relative" : ""} ${isAuthenticated && !isAuthPage ? "pb-20" : ""}`}
           >
             {!isAuthPage && (
-              <div className={`flex items-center justify-between px-4 py-2 sticky top-0 z-20 ${isHomePage ? "bg-transparent backdrop-blur-3xl" : "border-b border-gray-200/20 bg-white/10 backdrop-blur-lg"}`}>
+              <div className={`flex items-center justify-between px-4 py-2 sticky top-0 z-20 bg-transparent backdrop-blur-3xl ${isHomePage ? "" : "border-b border-gray-200/20"}`}>
                 <div className="flex items-center gap-2">
                   <span className={`text-sm font-semibold px-3 py-1 rounded-lg ${!isAuthenticated ? (isHomePage ? 'bg-white/20 text-white' : 'bg-gray-200 text-gray-600') : isOwner ? (isHomePage ? 'bg-amber-500/30 text-amber-200' : 'bg-amber-100 text-amber-700') : (isHomePage ? 'bg-blue-500/30 text-blue-200' : 'bg-blue-100 text-blue-700')}`}>
                     {!isAuthenticated ? 'زائر' : isOwner ? 'مالك' : 'عميل'}
                   </span>
                 </div>
                 <div className="flex items-center gap-3">
-                  <Link href="/favorites" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors ${isHomePage ? "text-white/80 hover:text-amber-300 hover:bg-white/10" : "text-gray-600 hover:text-amber-600 hover:bg-gray-100"}`}>
+                  <Link href="/favorites" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors hover:bg-white/10 ${pathname === '/favorites' ? 'text-amber-400' : 'nav-icon'}`}>
                     <Heart className="w-5 h-5" />
                     <div className="absolute -bottom-8 left-1/2 -translate-x-1/2 bg-gray-800 text-white text-xs rounded-lg px-2 py-1 opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap pointer-events-none shadow-lg">
                       المفضلة
                     </div>
                   </Link>
-                  <Link href="/notifications" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors ${isHomePage ? "text-white/80 hover:text-amber-300 hover:bg-white/10" : "text-gray-600 hover:text-amber-600 hover:bg-gray-100"}`}>
+                  <Link href="/notifications" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors hover:bg-white/10 ${pathname === '/notifications' ? 'text-amber-400' : 'nav-icon'}`}>
                     <Bell className="w-5 h-5" />
                     {isMounted && unreadCount > 0 && (
                       <div className="absolute -top-1 -right-1 bg-red-500 text-white text-xs font-bold rounded-full w-5 h-5 flex items-center justify-center">
@@ -752,13 +765,13 @@ export default function ClientLayout({ children }) {
                       الإشعارات
                     </div>
                   </Link>
-                  <Link href="/settings" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors ${isHomePage ? "text-white/80 hover:text-amber-300 hover:bg-white/10" : "text-gray-600 hover:text-amber-600 hover:bg-gray-100"}`}>
+                  <Link href="/settings" className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors hover:bg-white/10 ${pathname === '/settings' ? 'text-amber-400' : 'nav-icon'}`}>
                     <Settings className="w-5 h-5" />
                     <div className="absolute -bottom-8 left-1/2 -translate-x-1/2 bg-gray-800 text-white text-xs rounded-lg px-2 py-1 opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap pointer-events-none shadow-lg">
                       الإعدادات
                     </div>
                   </Link>
-                  <button onClick={toggleTheme} className={`relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors ${isHomePage ? "text-white/80 hover:text-amber-300 hover:bg-white/10" : "text-gray-600 hover:text-amber-600 hover:bg-gray-100"}`}>
+                  <button onClick={toggleTheme} className="relative group flex items-center justify-center w-9 h-9 rounded-full transition-colors hover:bg-white/10 nav-icon">
                     {theme === 'dark' ? <Sun className="w-5 h-5" /> : <Moon className="w-5 h-5" />}
                     <div className="absolute -bottom-8 left-1/2 -translate-x-1/2 bg-gray-800 text-white text-xs rounded-lg px-2 py-1 opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap pointer-events-none shadow-lg">
                       {theme === 'dark' ? 'وضع نهاري' : 'وضع ليلي'}
diff --git a/app/globals.css b/app/globals.css
index 2540be9..d3ce7e9 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -96,7 +96,7 @@
 
 .dark {
   --background: #0f172a;
-  --foreground: #e2e8f0;
+  --foreground: #f5e6d3;
   color-scheme: dark;
 }
 
@@ -106,12 +106,12 @@
   --color-gray-100: #1e293b;
   --color-gray-200: #334155;
   --color-gray-300: #475569;
-  --color-gray-400: #94a3b8;
-  --color-gray-500: #64748b;
-  --color-gray-600: #475569;
-  --color-gray-700: #cbd5e1;
-  --color-gray-800: #e2e8f0;
-  --color-gray-900: #f1f5f9;
+  --color-gray-400: #64748b;
+  --color-gray-500: #94a3b8;
+  --color-gray-600: #cbd5e1;
+  --color-gray-700: #e2e8f0;
+  --color-gray-800: #f1f5f9;
+  --color-gray-900: #f8fafc;
 }
 
 html, body {
@@ -157,6 +157,13 @@ body {
   transform: scale(1.1);
 }
 
+.nav-icon {
+  color: #1e293b;
+}
+.dark .nav-icon {
+  color: #ffffff;
+}
+
 .property-tooltip {
   background: white !important;
   color: #1f2937 !important;
diff --git a/app/page.js b/app/page.js
index ae1dc24..213b57d 100644
--- a/app/page.js
+++ b/app/page.js
@@ -276,18 +276,6 @@ export default function HomePage() {
   return (
     <div className="min-h-screen">
       <section className="relative min-h-screen flex items-center justify-center overflow-hidden">
-        <div className="absolute inset-0 z-0">
-          <motion.div
-            className="absolute inset-0 bg-cover bg-center bg-no-repeat"
-            style={{
-              backgroundImage: 'url(/hero.jpg)',
-            }}
-            initial={{ scale: 1.1 }}
-            animate={{ scale: 1 }}
-            transition={{ duration: 1.5, ease: "easeOut" }}
-          />
-          <div className="absolute inset-0 bg-gradient-to-r from-black/70 via-black/60 to-black/50" />
-        </div>
         <div className="relative z-10 container mx-auto px-4 sm:px-6 lg:px-8">
           <div className="max-w-6xl mx-auto">
             <motion.div
@@ -303,7 +291,7 @@ export default function HomePage() {
               }}
             >
               <motion.h1
-                className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-bold text-white mb-6 leading-tight tracking-tight"
+                className="text-3xl sm:text-4xl md:text-5xl lg:text-6xl font-bold text-amber-50 mb-6 leading-tight tracking-tight"
                 variants={{
                   hidden: { opacity: 0, y: 20 },
                   visible: { opacity: 1, y: 0 }
@@ -311,7 +299,7 @@ export default function HomePage() {
               >
                 إيجاد منزلك الجديد<br />
                 <motion.span
-                  className="text-amber-400"
+                  className="text-amber-300"
                   animate={{
                     y: [0, -10, 0],
                   }}
@@ -325,7 +313,7 @@ export default function HomePage() {
                 </motion.span>
               </motion.h1>
               <motion.p
-                className="text-base sm:text-lg text-gray-200 max-w-2xl mx-auto leading-relaxed"
+                className="text-base sm:text-lg text-amber-50 max-w-2xl mx-auto leading-relaxed"
                 variants={{
                   hidden: { opacity: 0, y: 20 },
                   visible: { opacity: 1, y: 0 }
@@ -344,10 +332,10 @@ export default function HomePage() {
                 transition={{ delay: 0.5 }}
                 className="bg-white/10 backdrop-blur-lg rounded-2xl p-8 text-center border border-white/20"
               >
-                <h2 className="text-2xl font-bold text-white mb-2">
+                <h2 className="text-2xl font-bold text-amber-50 mb-2">
                   مرحباً {user?.name}!
                 </h2>
-                <p className="text-gray-200 mb-4">
+                <p className="text-amber-50/80 mb-4">
                   يمكنك إدارة عقاراتك من خلال لوحة التحكم الخاصة بك
                 </p>
                 <Link
diff --git a/next.config.mjs b/next.config.mjs
index 01f3311..7511783 100644
--- a/next.config.mjs
+++ b/next.config.mjs
@@ -14,6 +14,11 @@ const nextConfig = {
         hostname: "45.93.137.91",
         pathname: "/api/Pictures/**",
       },
+      {
+        protocol: "http",
+        hostname: "45.93.137.91",
+        pathname: "/Pictures/**",
+      },
     ],
   },
   // basePath: "/sweetHome",