diff --git a/src/components/LeaveSession.jsx b/src/components/LeaveSession.jsx
index 10535a6..8a76ba3 100644
--- a/src/components/LeaveSession.jsx
+++ b/src/components/LeaveSession.jsx
@@ -1,5 +1,5 @@
-import React from "react";
 import axios from "axios";
+import ConfirmModal from "./confirmModal";
 
 const LeaveSession = ({ projectId }) => {
   const isGuest = localStorage.getItem(`project_${projectId}_guest`) === "true";
@@ -7,20 +7,32 @@ const LeaveSession = ({ projectId }) => {
 
   if (!isGuest) return null;
 
-  const handleLeave = async () => {
-    if (
-      !confirm(
-        "Are you sure you want to leave? You won't be able to access this project again from this device."
-      )
-    ) {
-      return;
-    }
+  const [modalState, setModalState] = React.useState({
+    isOpen: false,
+    type: "",
+    title: "",
+    message: "",
+    onConfirm: null,
+  });
+
+  const handleLeave = () => {
+    setModalState({
+      isOpen: true,
+      type: "confirm",
+      title: "Leave Session",
+      message:
+        "Are you sure you want to leave? You won't be able to access this project again from this device.",
+      onConfirm: performLeave,
+    });
+  };
 
+  const performLeave = async () => {
+    setModalState((prev) => ({ ...prev, isOpen: false }));
     try {
       await axios.post(
         `${serverUrl}/api/projects/${projectId}/leave-session`,
         {},
-        { withCredentials: true }
+        { withCredentials: true },
       );
 
       // Clear local data
@@ -28,11 +40,24 @@ const LeaveSession = ({ projectId }) => {
       localStorage.removeItem(`project_${projectId}_ws`);
       localStorage.removeItem(`project_${projectId}_guest`);
 
-      alert("Session ended. Redirecting...");
-      window.location.href = "/";
+      setModalState({
+        isOpen: true,
+        type: "alert",
+        title: "Session Ended",
+        message: "Session ended. Redirecting...",
+        onConfirm: () => {
+          window.location.href = "/";
+        },
+      });
     } catch (error) {
       console.error("Leave error:", error);
-      alert("Failed to leave session");
+      setModalState({
+        isOpen: true,
+        type: "alert",
+        title: "Error",
+        message: "Failed to leave session",
+        onConfirm: () => setModalState((prev) => ({ ...prev, isOpen: false })),
+      });
     }
   };
 
@@ -52,6 +77,18 @@ const LeaveSession = ({ projectId }) => {
           Leave Session
         </button>
       </div>
+      <ConfirmModal
+        isOpen={modalState.isOpen}
+        title={modalState.title}
+        message={modalState.message}
+        confirmText="OK"
+        cancelText={modalState.type === "confirm" ? "Cancel" : ""}
+        onConfirm={() => {
+          if (modalState.onConfirm) modalState.onConfirm();
+          else setModalState((prev) => ({ ...prev, isOpen: false }));
+        }}
+        onCancel={() => setModalState((prev) => ({ ...prev, isOpen: false }))}
+      />
     </div>
   );
 };
diff --git a/src/components/easyMathInput.jsx b/src/components/easyMathInput.jsx
index a95ad2d..edd381a 100644
--- a/src/components/easyMathInput.jsx
+++ b/src/components/easyMathInput.jsx
@@ -174,7 +174,11 @@ const EasyMathInput = ({ onClose, onInsert }) => {
       if (data.success && data.pdfUrl) return `${API_BASE_URL}${data.pdfUrl}`;
       throw new Error("No URL returned");
     } catch (e) {
-      alert(`Error: ${e.message}`);
+      setErrorModal({
+        isOpen: true,
+        title: "Compile Error",
+        message: `Error: ${e.message}`,
+      });
       return null;
     } finally {
       setIsCompiling(false);
@@ -263,7 +267,14 @@ const EasyMathInput = ({ onClose, onInsert }) => {
   };
 
   const handleSaveEquation = async () => {
-    if (!saveFileName.trim()) return alert("Enter filename");
+    if (!saveFileName.trim()) {
+      setErrorModal({
+        isOpen: true,
+        title: "Name Required",
+        message: "Enter filename",
+      });
+      return;
+    }
     try {
       await fetch(`${API_BASE_URL}/api/equations/save`, {
         method: "POST",
@@ -273,7 +284,7 @@ const EasyMathInput = ({ onClose, onInsert }) => {
       setShowSaveDialog(false);
       loadSavedEquations();
     } catch (e) {
-      alert(e.message);
+      setErrorModal({ isOpen: true, title: "Save Error", message: e.message });
     }
   };
   const handleDeleteEquation = async (fileName) => {
@@ -1014,7 +1025,6 @@ const EasyMathInput = ({ onClose, onInsert }) => {
                         <button
                           onClick={() => {
                             navigator.clipboard.writeText(eq.latex);
-                            alert("Copied");
                             setToastMessage("✓ Copied to clipboard");
                             setTimeout(() => setToastMessage(null), 2000);
                           }}
diff --git a/src/components/navBar.jsx b/src/components/navBar.jsx
index 0c3a17b..d03757d 100644
--- a/src/components/navBar.jsx
+++ b/src/components/navBar.jsx
@@ -33,6 +33,11 @@ const NavBar = ({ onStartTour }) => {
   const [showSaveTemplateModal, setShowSaveTemplateModal] = useState(false);
   const [templateName, setTemplateName] = useState("");
   const [showCloseConfirm, setShowCloseConfirm] = useState(false);
+  const [alertModal, setAlertModal] = useState({
+    isOpen: false,
+    title: "",
+    message: "",
+  });
 
   const hasProject = projectDetails.currentProject !== null;
   // File Menu Actions
@@ -66,7 +71,11 @@ const NavBar = ({ onStartTour }) => {
 
   const handleSaveProject = async () => {
     if (!projectDetails.currentProject || !projectDetails.activeFile) {
-      alert("No project to save");
+      setAlertModal({
+        isOpen: true,
+        title: "No Project",
+        message: "No project to save",
+      });
       return;
     }
 
@@ -271,7 +280,11 @@ const NavBar = ({ onStartTour }) => {
     const pdfUrl = projectDetails.pdfUrl;
     const fileTitle = projectDetails.currentProject.title;
     if (!pdfUrl) {
-      alert("Please compile your document first to generate a PDF");
+      setAlertModal({
+        isOpen: true,
+        title: "PDF Not Found",
+        message: "Please compile your document first to generate a PDF",
+      });
       return;
     }
 
@@ -316,7 +329,11 @@ const NavBar = ({ onStartTour }) => {
       }
     } catch (error) {
       console.error("Error during PDF export:", error);
-      alert(`An error occurred during PDF export: ${error.message}`);
+      setAlertModal({
+        isOpen: true,
+        title: "Export Error",
+        message: `An error occurred during PDF export: ${error.message}`,
+      });
     }
   };
 
@@ -364,14 +381,12 @@ const NavBar = ({ onStartTour }) => {
   };
 
   const handleAbout = () => {
-    alert(
-      "Docière Pro v1.0\nLaTeX Editor Redefined\n\n" +
-        "A modern LaTeX editor with intuitive interfaces:\n" +
-        "• Full Code View with Monaco Editor\n" +
-        "• Rich Text Editor for WYSIWYG editing\n" +
-        "• Section-based editing for structured documents\n\n" +
-        "Created with ❤️ for seamless document creation",
-    );
+    setAlertModal({
+      isOpen: true,
+      title: "About Docière Pro",
+      message:
+        "Docière Pro v1.0\nLaTeX Editor Redefined\n\nA modern LaTeX editor with intuitive interfaces:\n• Full Code View with Monaco Editor\n• Rich Text Editor for WYSIWYG editing\n• Section-based editing for structured documents\n\nCreated with ❤️ for seamless document creation",
+    });
   };
 
   // Menu Configurations
@@ -680,14 +695,22 @@ const NavBar = ({ onStartTour }) => {
       shortcut: "Ctrl+Shift+P",
       action: () => {
         // Open command palette
-        alert("Command Palette - Coming in next update");
+        setAlertModal({
+          isOpen: true,
+          title: "Coming Soon",
+          message: "Command Palette - Coming in next update",
+        });
       },
     },
     { divider: true },
     {
       label: "Check for Updates",
       action: () => {
-        alert("You are using the latest version of Docière Pro v1.0");
+        setAlertModal({
+          isOpen: true,
+          title: "Up to Date",
+          message: "You are using the latest version of Docière Pro v1.0",
+        });
       },
     },
     {
diff --git a/src/components/pdfViewer.jsx b/src/components/pdfViewer.jsx
index b74ac3d..d40dce2 100644
--- a/src/components/pdfViewer.jsx
+++ b/src/components/pdfViewer.jsx
@@ -659,6 +659,7 @@ import "react-pdf/dist/Page/TextLayer.css";
 import "react-pdf/dist/Page/AnnotationLayer.css";
 import "../assets/styles/pdfViewer.css";
 import { useSettings } from "../context/useSettings";
+import ConfirmModal from "./confirmModal";
 
 pdfjs.GlobalWorkerOptions.workerSrc = "./pdf.worker.min.js";
 
@@ -694,6 +695,11 @@ const PdfViewer = ({
   const scaleRef = useRef(scale);
   const scrollToPageAfterZoomRef = useRef(null);
   const { settings } = useSettings();
+  const [alertModal, setAlertModal] = useState({
+    isOpen: false,
+    title: "",
+    message: "",
+  });
 
   const ESTIMATED_PAGE_HEIGHT = 842;
   const GAP = 16;
@@ -839,7 +845,11 @@ const PdfViewer = ({
 
   const handleExportPDF = async () => {
     if (!pdfUrl) {
-      alert("Please compile your document first to generate a PDF");
+      setAlertModal({
+        isOpen: true,
+        title: "PDF Not Found",
+        message: "Please compile your document first to generate a PDF",
+      });
       return;
     }
     try {
@@ -867,7 +877,11 @@ const PdfViewer = ({
         window.URL.revokeObjectURL(downloadUrl);
       }
     } catch (error) {
-      alert(`An error occurred during PDF export: ${error.message}`);
+      setAlertModal({
+        isOpen: true,
+        title: "Export Error",
+        message: `An error occurred during PDF export: ${error.message}`,
+      });
     }
   };
 
@@ -1269,6 +1283,15 @@ const PdfViewer = ({
           </div>
         )}
       </div>
+      <ConfirmModal
+        isOpen={alertModal.isOpen}
+        title={alertModal.title}
+        message={alertModal.message}
+        confirmText="OK"
+        cancelText=""
+        onConfirm={() => setAlertModal({ ...alertModal, isOpen: false })}
+        onCancel={() => setAlertModal({ ...alertModal, isOpen: false })}
+      />
     </div>
   );
 };
diff --git a/src/pages/User_Account/signup.jsx b/src/pages/User_Account/signup.jsx
index b158a48..d7b25b5 100644
--- a/src/pages/User_Account/signup.jsx
+++ b/src/pages/User_Account/signup.jsx
@@ -1,6 +1,7 @@
 import react, { useEffect, useState } from "react";
 import axios from "axios";
 import { useNavigate } from "react-router-dom";
+import ConfirmModal from "../../components/confirmModal";
 
 function DynamicSignup() {
   const navigate = useNavigate();
@@ -8,6 +9,11 @@ function DynamicSignup() {
   const [password, setPassword] = useState("");
   const [emailId, setEmail] = useState("");
   const [loading, setLoading] = useState(false);
+  const [alertModal, setAlertModal] = useState({
+    isOpen: false,
+    title: "",
+    message: "",
+  });
 
   const handleSubmit = async (event) => {
     event.preventDefault();
@@ -38,7 +44,11 @@ function DynamicSignup() {
       navigate("/");
     } catch (err) {
       console.error("Signup failed:", err);
-      alert("Failed to create user. Please try again.");
+      setAlertModal({
+        isOpen: true,
+        title: "Signup Failed",
+        message: "Failed to create user. Please try again.",
+      });
     } finally {
       setLoading(false);
     }
@@ -194,6 +204,15 @@ function DynamicSignup() {
           <p>© 2025 Dociere. All rights reserved.</p>
         </div>
       </div>
+      <ConfirmModal
+        isOpen={alertModal.isOpen}
+        title={alertModal.title}
+        message={alertModal.message}
+        confirmText="OK"
+        cancelText=""
+        onConfirm={() => setAlertModal({ ...alertModal, isOpen: false })}
+        onCancel={() => setAlertModal({ ...alertModal, isOpen: false })}
+      />
     </div>
   );
 }
diff --git a/src/pages/detailsPage.jsx b/src/pages/detailsPage.jsx
index 042054d..fdeff70 100644
--- a/src/pages/detailsPage.jsx
+++ b/src/pages/detailsPage.jsx
@@ -142,7 +142,7 @@ const DetailsPage = () => {
     /*
     for (const author of authorDetails) {
       if (!author.name.trim()) {
-        alert("Please enter author name.");
+        setAlertModal({ isOpen: true, title: "Missing Author", message: "Please enter author name." });
         return;
       }
     }
diff --git a/src/pages/startingPage.jsx b/src/pages/startingPage.jsx
index 877c9eb..5725562 100644
--- a/src/pages/startingPage.jsx
+++ b/src/pages/startingPage.jsx
@@ -22,6 +22,11 @@ const StartingPage = () => {
   const { settings } = useSettings();
   const navigate = useNavigate();
   const [isUploading, setIsUploading] = useState(false);
+  const [alertModal, setAlertModal] = useState({
+    isOpen: false,
+    title: "",
+    message: "",
+  });
 
   useEffect(() => {
     fetchData();
@@ -73,15 +78,22 @@ const StartingPage = () => {
         }
       } catch (err) {
         console.error("Failed to upload zip project:", err);
-        alert("Failed to upload project. Please try again.");
+        setAlertModal({
+          isOpen: true,
+          title: "Upload Failed",
+          message: "Failed to upload project. Please try again.",
+        });
       } finally {
         setIsUploading(false);
         if (fileRef.current) fileRef.current.value = "";
       }
     } else if (file.name.endsWith(".tex")) {
-      alert(
-        "Direct .tex upload is not yet supported. Please zip your project folder and upload the .zip file.",
-      );
+      setAlertModal({
+        isOpen: true,
+        title: "Unsupported Format",
+        message:
+          "Direct .tex upload is not yet supported. Please zip your project folder and upload the .zip file.",
+      });
       if (fileRef.current) fileRef.current.value = "";
     }
   };
@@ -233,8 +245,18 @@ const StartingPage = () => {
           title="Delete Project"
           message={`Are you sure you want to delete "${projectToDelete?.title}"? This will permanently remove the project folder (${projectToDelete?.id}) and all its contents.`}
           confirmText="Delete Project"
+          cancelText="Cancel"
           isDanger={true}
         />
+        <ConfirmModal
+          isOpen={alertModal.isOpen}
+          title={alertModal.title}
+          message={alertModal.message}
+          confirmText="OK"
+          cancelText=""
+          onConfirm={() => setAlertModal({ ...alertModal, isOpen: false })}
+          onCancel={() => setAlertModal({ ...alertModal, isOpen: false })}
+        />
       </div>
     </>
   );