diff --git a/src/components/Chatbot/Navbar.jsx b/src/components/Chatbot/Navbar.jsx
new file mode 100644
index 0000000..b4f6837
--- /dev/null
+++ b/src/components/Chatbot/Navbar.jsx
@@ -0,0 +1,41 @@
+// Navbar.js
+import React, { useState } from "react";
+import { useNavigate } from "react-router-dom";
+import styles from "./Navbar.module.css";
+
+const Navbar = ({ user }) => {
+  const navigate = useNavigate();
+  const [showDropdown, setShowDropdown] = useState(false);
+
+  const toggleDropdown = () => {
+    setShowDropdown((prev) => !prev);
+  };
+
+  return (
+    <nav className={styles.navbar}>
+      <h1 className={styles.logo} onClick={() => navigate("/")}>
+        Logo
+      </h1>
+      <ul className={styles.nav_links}>
+        <li onClick={() => navigate("/chatbot")}>Chatbot</li>
+        <li onClick={() => navigate("/reminder")}>Reminder</li>
+        <li onClick={() => navigate("/plan")}>Plan & Bay Chart</li>
+        <li onClick={() => navigate("/about")}>About Us</li>
+        <li onClick={() => navigate("/contact")}>Contact Us</li>
+      </ul>
+      <div className={styles.user_menu} onClick={toggleDropdown}>
+        <div className={styles.user_icon}>
+          <i className={`fas fa-${user ? "user" : "female"} fa-1x`}></i>
+        </div>
+        {showDropdown && (
+          <div className={styles.dropdown_content}>
+            <a href="#">Manage Account</a>
+            <a onClick={() => alert("Logging out...")}>Logout</a>
+          </div>
+        )}
+      </div>
+    </nav>
+  );
+};
+
+export default Navbar;
diff --git a/src/components/Chatbot/Navbar.module.css b/src/components/Chatbot/Navbar.module.css
new file mode 100644
index 0000000..e339947
--- /dev/null
+++ b/src/components/Chatbot/Navbar.module.css
@@ -0,0 +1,93 @@
+/* Navbar.module.css */
+
+.navbar {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 15px 30px;
+    background-color: #333;
+    color: white;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  }
+  
+  .logo {
+    font-size: 24px;
+    font-weight: bold;
+    cursor: pointer;
+    color: white;
+    text-transform: uppercase;
+  }
+  
+  .nav_links {
+    display: flex;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+  
+  .nav_links li {
+    margin-left: 20px;
+    cursor: pointer;
+    font-size: 16px;
+    transition: color 0.3s;
+  }
+  
+  .nav_links li:hover {
+    color: #4CAF50;
+  }
+  
+  .user_menu {
+    position: relative;
+    cursor: pointer;
+  }
+  
+  .user_icon {
+    font-size: 22px;
+    color: white;
+  }
+  
+  .dropdown_content {
+    position: absolute;
+    top: 30px;
+    right: 0;
+    background-color: #fff;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+    border-radius: 8px;
+    padding: 10px;
+    z-index: 10;
+  }
+  
+  .dropdown_content a {
+    display: block;
+    padding: 8px 15px;
+    text-decoration: none;
+    color: #333;
+    font-size: 16px;
+    transition: background-color 0.3s;
+  }
+  
+  .dropdown_content a:hover {
+    background-color: #f1f1f1;
+  }
+  
+  .favourited {
+    color: #ff6347;
+  }
+  
+  @media (max-width: 768px) {
+    .navbar {
+      flex-direction: column;
+      align-items: flex-start;
+    }
+  
+    .nav_links {
+      flex-direction: column;
+      margin-top: 10px;
+    }
+  
+    .nav_links li {
+      margin-left: 0;
+      margin-bottom: 10px;
+    }
+  }
+  
\ No newline at end of file
diff --git a/src/components/Chatbot/Save.module.css b/src/components/Chatbot/Save.module.css
index 2183ec6..ff6637b 100644
--- a/src/components/Chatbot/Save.module.css
+++ b/src/components/Chatbot/Save.module.css
@@ -1,11 +1,139 @@
-/* Styles for Navbar */
-.navbar_section {
-  position: fixed;
-  top: 0;
+/* Page Container */
+.pageContainer {
+  padding: 20px;
+  font-family: Arial, sans-serif;
+}
+
+/* Title */
+.title {
+  text-align: center;
+  font-size: 28px;
+  margin-bottom: 20px;
+  color: #333;
+}
+
+/* Message Table */
+.messageTable {
   width: 100%;
-  z-index: 1000;
+  margin-top: 20px;
+}
+
+/* Table Header */
+.tableHeader {
+  display: flex;
+  padding: 20px;
+  background-color: #f1f1f1;
+  border-radius: 8px;
+  justify-content: space-between;
+  margin-bottom: 10px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.columnHeader {
+  font-weight: bold;
+  width: 48%;
+  text-align: center;
+  color: #555;
+}
+
+/* Message Row */
+.messageRow {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 10px;
+  padding: 15px;
+  background-color: #fff;
+  border-radius: 8px;
+  border: 1px solid #ddd;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  transition: transform 0.3s, box-shadow 0.3s;
+}
+
+.messageRow:hover {
+  transform: translateY(-5px);
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+}
+
+/* Message Text */
+.messageText {
+  width: 48%;
+  padding: 10px;
+  background-color: #f9f9f9;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  transition: background-color 0.3s;
+}
+
+.messageText:hover {
+  background-color: #eaeaea;
+}
+
+/* Action Icons */
+.actionIcons {
+  width: 48%;
+  display: flex;
+  justify-content: center;
+  gap: 15px;
+}
+
+.deleteButton, .favouriteButton {
+  background: none;
+  border: none;
+  font-size: 22px;
+  cursor: pointer;
+  transition: color 0.3s, transform 0.3s;
+}
+
+.deleteButton:hover, .favouriteButton:hover {
+  color: #ff4d4d;
+  transform: scale(1.2);
+}
+
+.favourited {
+  color: #ff6347;
+}
+
+/* Buttons Container */
+.buttonsContainer {
+  display: flex;
+  justify-content: space-between;
+  margin-top: 30px;
+}
+
+.backButton, .clearButton {
+  padding: 12px 25px;
+  background-color: #4CAF50;
+  color: white;
+  border-radius: 8px;
+  border: none;
+  cursor: pointer;
+  font-size: 16px;
+  transition: background-color 0.3s, transform 0.3s;
+}
+
+.backButton:hover, .clearButton:hover {
+  background-color: #45a049;
+  transform: scale(1.05);
 }
 
+.clearButton {
+  background-color: #f44336;
+}
+
+.clearButton:hover {
+  background-color: #e53935;
+}
+
+/* No Messages */
+.noMessages {
+  text-align: center;
+  color: #777;
+  font-size: 18px;
+  font-style: italic;
+}
+
+/* Navbar Styles */
 .navbar {
   height: 70px;
   background-color: #52a7bc;
@@ -15,6 +143,10 @@
   padding: 0 20px;
   margin: 0;
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+  position: fixed;
+  top: 0;
+  width: 100%;
+  z-index: 1000;
 }
 
 .logo {
@@ -23,12 +155,14 @@
   cursor: pointer;
 }
 
+/* Navbar Links Section */
 .nav_links {
   list-style-type: none;
   display: flex;
   gap: 20px;
 }
 
+/* Each Navbar Item */
 .nav_links li {
   color: white;
   padding: 10px;
@@ -41,40 +175,51 @@
   color: #cfcfcf;
 }
 
-/* Styles for Saved Messages */
-.title {
-  text-align: center;
-  margin: 20px 0;
+/* User Menu Section */
+.user_menu {
+  display: flex;
+  align-items: center;
+  position: relative;
+  cursor: pointer;
+  margin-left: 20px;
 }
 
-.messageTable {
+/* User Icon Style (دائرة تمثل نوع المستخدم) */
+.user_icon {
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  background-color: #f1f1f1;
   display: flex;
-  flex-direction: column;
   align-items: center;
+  justify-content: center;
+  color: white;
+  font-size: 1.2rem;
+  cursor: pointer;
+  margin-left: 20px;
 }
 
-.messageRow {
+.dropdown_content {
   display: flex;
-  justify-content: space-between;
-  width: 80%;
-  padding: 10px;
-  border-bottom: 1px solid #ddd;
+  flex-direction: column;
+  position: absolute;
+  top: 50px;
+  right: 0;
+  background-color: white;
+  min-width: 160px;
+  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
+  z-index: 1;
+  border-radius: 5px;
 }
 
-.iconContainer {
-  display: flex;
-  gap: 10px;
+.dropdown_content a {
+  padding: 10px;
+  text-decoration: none;
+  color: black;
+  border-radius: 5px;
 }
 
-.backButton, .clearButton {
-  margin: 10px;
-  padding: 10px 20px;
-  border: none;
+.dropdown_content a:hover {
   background-color: #52a7bc;
   color: white;
-  cursor: pointer;
 }
-
-.clearButton {
-  background-color: #ff4d4d; /* Red color for clear button */
-}
\ No newline at end of file
diff --git a/src/components/Chatbot/SavedMessages.jsx b/src/components/Chatbot/SavedMessages.jsx
index f9c2aa4..5e68f66 100644
--- a/src/components/Chatbot/SavedMessages.jsx
+++ b/src/components/Chatbot/SavedMessages.jsx
@@ -1,93 +1,90 @@
+// SavedMessages.js
 import React, { useEffect, useState } from "react";
 import { useNavigate } from "react-router-dom";
+import Navbar from "./Navbar"; // استيراد الـ Navbar
 import styles from "./Save.module.css";
-import { initializeApp } from 'firebase/app';
-import { getFirestore, collection, getDocs, setDoc, doc } from 'firebase/firestore';
-
-const firebaseConfig = {
-  apiKey: "AIzaSyDc1iS4NX2um7sqJuYRSll9Il_7V6g6LsE",
-  authDomain: "graduatinproject.firebaseapp.com",
-  projectId: "graduatinproject",
-  storageBucket: "graduatinproject.appspot.com",
-  messagingSenderId: "361149223809",
-  appId: "1:361149223809:web:58467e248f81422f97ce80",
-  measurementId: "G-NRG6TMTB8Q"
-};
-
-// Initialize Firebase
-const app = initializeApp(firebaseConfig);
-const db = getFirestore(app);
 
 const SavedMessages = () => {
   const navigate = useNavigate();
   const [savedMessages, setSavedMessages] = useState([]);
+  const [user, setUser] = useState(true); // لتحديد نوع المستخدم، يمكنك تعديل هذه القيمة بحسب حالتك.
 
+  // تحميل الرسائل المحفوظة من localStorage عند تحميل الصفحة
   useEffect(() => {
-    const fetchMessages = async () => {
-      const messagesCollection = collection(db, "messages");
-      const messageSnapshot = await getDocs(messagesCollection);
-      const messagesList = messageSnapshot.docs.map(doc => ({ id: doc.id, ...doc.data() }));
-      setSavedMessages(messagesList);
-    };
-
-    fetchMessages();
+    const storedMessages = JSON.parse(localStorage.getItem("savedMessages")) || [];
+    setSavedMessages(storedMessages);
   }, []);
 
-  const handleDeleteMessage = async (id) => {
-    // حذف الرسالة من Firebase
-    await deleteDoc(doc(db, "messages", id));
-    setSavedMessages(savedMessages.filter(msg => msg.id !== id));
+  // حذف رسالة محفوظة
+  const handleDeleteMessage = (index) => {
+    const updatedMessages = savedMessages.filter((_, i) => i !== index);
+    setSavedMessages(updatedMessages);
+    localStorage.setItem("savedMessages", JSON.stringify(updatedMessages));
+  };
+
+  // إضافة رسالة للمفضلة
+  const handleFavouriteMessage = (index) => {
+    const updatedMessages = [...savedMessages];
+    updatedMessages[index].favourite = !updatedMessages[index].favourite;
+    setSavedMessages(updatedMessages);
+    localStorage.setItem("savedMessages", JSON.stringify(updatedMessages));
   };
 
-  const handleClearAllMessages = async () => {
-    for (const msg of savedMessages) {
-      await deleteDoc(doc(db, "messages", msg.id));
-    }
+  // مسح كل الرسائل المحفوظة
+  const handleClearAllMessages = () => {
     setSavedMessages([]);
+    localStorage.removeItem("savedMessages");
   };
 
   return (
-    <div className={styles.pageContainer}>
-      <nav className={styles.navbar}>
-        <h1 className={styles.logo} onClick={() => navigate("/")}>Logo</h1>
-        <ul className={styles.nav_links}>
-          <li onClick={() => navigate("/chatbot")}>Chatbot</li>
-          <li onClick={() => navigate("/reminder")}>Reminder</li>
-          <li onClick={() => navigate("/plan")}>Plan & Bay Chart</li>
-          <li onClick={() => navigate("/about")}>About Us</li>
-          <li onClick={() => navigate("/contact")}>Contact Us</li>
-        </ul>
-      </nav>
-      <h2 className={styles.title}>Saved Messages</h2>
-      <div className={styles.messageTable}>
+    <div>
+      {/* استخدام الـ Navbar هنا */}
+      <Navbar user={user} />
+
+      <div className={styles.pageContainer}>
+        <h2 className={styles.title}>Saved Messages</h2>
         {savedMessages.length > 0 ? (
-          savedMessages.map((msg) => (
-            <div key={msg.id} className={styles.messageRow}>
-              <p className={styles.messageText}>{msg.text}</p>
-              <div className={styles.iconContainer}>
-                <button onClick={() => handleDeleteMessage(msg.id)} className={styles.deleteButton}>
-                  <i className="fas fa-trash"></i>
-                </button>
-                <button className={styles.favouriteButton}>
-                  <i className="fas fa-heart"></i>
-                </button>
-              </div>
+          <div className={styles.messageTable}>
+            <div className={styles.tableHeader}>
+              <div className={styles.columnHeader}>Saved Messages</div>
+              <div className={styles.columnHeader}>Actions</div>
             </div>
-          ))
+            {savedMessages.map((msg, index) => (
+              <div key={index} className={styles.messageRow}>
+                <div className={styles.messageText}>{msg.text}</div>
+                <div className={styles.actionIcons}>
+                  <button
+                    className={styles.deleteButton}
+                    onClick={() => handleDeleteMessage(index)}
+                  >
+                    <i className="fas fa-trash"></i>
+                  </button>
+                  <button
+                    className={styles.favouriteButton}
+                    onClick={() => handleFavouriteMessage(index)}
+                  >
+                    <i
+                      className={`fas fa-heart ${msg.favourite ? styles.favourited : ""}`}
+                    ></i>
+                  </button>
+                </div>
+              </div>
+            ))}
+          </div>
         ) : (
           <p className={styles.noMessages}>No saved messages yet.</p>
         )}
-      </div>
-      <div className={styles.buttonContainer}>
-        <button className={styles.backButton} onClick={() => navigate("/chatbot")}>
-          Back to Home
-        </button>
-        <button className={styles.clearButton} onClick={handleClearAllMessages}>
-          Clear All Messages
-        </button>
+        <div className={styles.buttonsContainer}>
+          <button className={styles.backButton} onClick={() => navigate("/chatbot")}>
+            Back to Home
+          </button>
+          <button className={styles.clearButton} onClick={handleClearAllMessages}>
+            Clear All Messages
+          </button>
+        </div>
       </div>
     </div>
   );
 };
 
-export default SavedMessages;
\ No newline at end of file
+export default SavedMessages;
diff --git a/src/components/Chatbot/index.jsx b/src/components/Chatbot/index.jsx
index 83a345d..2de3468 100644
--- a/src/components/Chatbot/index.jsx
+++ b/src/components/Chatbot/index.jsx
@@ -85,7 +85,6 @@ const Chatbot = () => {
     localStorage.setItem("savedMessages", JSON.stringify(updatedSavedMessages));
   };
 
-
   // إضافة رسالة إلى الـ Favourite Messages
   const handleFavouriteMessage = (msg) => {
     setFavouriteMessages((prevFav) => [...prevFav, msg]);
@@ -196,7 +195,6 @@ const Chatbot = () => {
           <div className={styles.iconsRight}>
             <img
               src="https://www.flaticon.com/download/icon/9333991?icon_id=9333991&author=1294&team=1294&keyword=Send&pack=9333862&style=1&style_id=1370&format=png&color=%23000000&colored=1&size=512&selection=1&type=standard&token=03AFcWeA4sINaafmg6j4sGYxvhHe0ubt4ntLJaeokNtm8ka1gvUjMNWsWYyeYMwb4JtiS4R2evrSe5LQ1qbTCRVwOwQwqa1JrwuseCJZJrWuHdHPTBu9cHf4WiD57rd72B_fHZuokqir9Ug3HBiDWmw9OIp5QRathHg4NLbm85VyP6u5_np2RZI_AQxYaCMaO9AIKWUBpkthMuGAT-eyfpmpLLkudBV8li2_89zhgC6CgXtXkKZgY0ypn45XrPRKijrr4IfzKVbOKypOn-QZh9SvVunkjk_sOfpkZjmMZFCub4lQx5CUrz0XwoxI-aWgD7IUesIBG3dLsHycIMoII-yiY8qeCvN-_1W4FlrWQuuBiaOOJVelrY8zLi2-9Gd_lrI2_i6ZpTlVIRK35OSboFnNrwmAnHW5vc0va7SQ-FY71tVdu_0PzAMy_SVJcF_WM7JDcN-WYAng1ZRA5wVu98jTtEnAaztWeCpEXxd5WqewQjT_7xE1qK7reFmpo7AxIWd4ToGU8VDFMjVebVRjtXfMpSwzKKajx_FwLVdpOihEQhU3DNbfZq0vrH5d2TYx07vBEShJSEsW4TQ7qXH0bVFqueg0z6YzURT9gZ_vcpeoGNRhgtZv-byD_ziXTknTb4BwgBpRVMMOKJepA_lqr27U_TLIp6bK4NpDMgeuEGn6MBU1hArZTyEFrHkFcqTkCfJwAjQv8Z6qGBUa5BbKDGIVgekHf7rZPraqJoMaqQ7cKIgTd23rctrp3MYSRcjWdxOJWBSKtqI9o-2B671_Blq7_9dzZxd8fBDkSR-XX9ZNpcog06Owxld_NHUXOPtC1gl9ZQsUW0ivCb6tAJ6_vGtLEo-entG2t1ArpL7DWdhnTq3ToGFWYXSUZ6j3c1SKVSFQ_OTFqx3giG1-kdqvSwYiHeNO9Tu45zMrEoGOk9niLCLqbxDXsMB1lDXJk7Biqf69nzhlLNmgyo__Y7B49juKGt46MvHfbcireA78RnvlNeDnx_ANrIjsX1qgyTq-wi_f0iYwZ_kUrW4gFWCeDnKEgrVb2ncQi20FCLePo1P12GAWzP4It_OqGv9ppPwkx0B54iZebyPpbXX1s-DKon48PLmuSCiY-csufoiwf9Gaz_pz6ewpbF8dCS9PmrS_YltrVrSA6j23xNIuB7uBEtnk7rz5A6Z5pfQkEjpgd4ePqxc1rTP25AmmtnAqNIR3PCaj8Iy9zG8NW_gjXQlqumEo5DUJFV0zTIC1oVXU7GUM7cpiakjio95XGcIjzUFQoAzMzGhKjudgcV8wcJHSXr77rF7B46sTL99ZAvgZs-V_f_HjhpBPB2mHJHri5BueMfnBTtguDCzPGcHUKpUu9B9DeGpqMeZHfeFWy82KazTLIeuZndaeKE6sJlQdJ41-rnvFHSLMVzqXMOQjgifcxDychvChR-u6f5IW-JGs8uiSq6mbeb0LSeB4Ya8Ivv1XWslkn9zxFO0x7WimsELOP8aX9pseOo0o7VV3bZ1DeTigq2hLOs-3f0rLpYZTnuCQZ9h19L-Qnorjl6TJRtv9JGyDxKVmnOheiWZkLaapVveqClXZLU4kFBHjX5MY_9Lv9n9OU9GAfI56wn6KZ51SgEbracTFG1rgYmNQR0lnup2KLhOv3zNrhhgjIoDGISPYe7moILmhwDypUE4DDZJBH_YXbpewA_8LzgWy9LAbLWIfDjOhZDIbFvZqf_8E_eY_QrvV3OA5DlLSg4eNwWO9_sRMmxO9LNzSSfvUsOwBzZsD9rgfOxDUMbpI4DBh4_2VDieqqtZuUYwx9kKtDH_sL_z-Q0PRfvrtf5xDKzYavIAt0oMRRaGYdtxS4tO21od5Dj_eMTfxcFMnQtb60ZFaDY2Or7mwiJCu3gO7o7hI1AaX7ZiTXJml2ccmLxRiKc9T4aWQbIp06X1P&search=send"
-              alt="Send"
               onClick={sendMessage}
               className={styles.sendIcon}
             />
diff --git a/src/firebaseConfig.js b/src/firebaseConfig.js
index 68839d5..387a560 100644
--- a/src/firebaseConfig.js
+++ b/src/firebaseConfig.js
@@ -1,25 +1,24 @@
-// firebaseConfig.js
-import { initializeApp } from 'firebase/app';
-import { getAuth, GoogleAuthProvider, FacebookAuthProvider } from 'firebase/auth';
+import { initializeApp } from "firebase/app";
+import { getAuth, GoogleAuthProvider, FacebookAuthProvider } from "firebase/auth";
+import { getFirestore } from "firebase/firestore";  // استيراد Firestore
 
 const firebaseConfig = {
   apiKey: "AIzaSyDc1iS4NX2um7sqJuYRSll9Il_7V6g6LsE",
   authDomain: "graduatinproject.firebaseapp.com",
   projectId: "graduatinproject",
-  storageBucket: "graduatinproject.firebasestorage.app",
+  storageBucket: "graduatinproject.appspot.com",  // تأكد من صحة الـ storageBucket
   messagingSenderId: "361149223809",
   appId: "1:361149223809:web:58467e248f81422f97ce80",
-  measurementId: "G-NRG6TMTB8Q"
+  measurementId: "G-NRG6TMTB8Q",
 };
 
 // Initialize Firebase
 const app = initializeApp(firebaseConfig);
 
-// Get Auth instance
+// Get Firebase services
 const auth = getAuth(app);
-
-// Setup providers
 const googleProvider = new GoogleAuthProvider();
 const facebookProvider = new FacebookAuthProvider();
+const db = getFirestore(app);  // تهيئة Firestore
 
-export { auth, googleProvider, facebookProvider };
+export { auth, googleProvider, facebookProvider, db };  // تصدير auth و db و المزودين