diff --git a/frontend/src/app/router.jsx b/frontend/src/app/router.jsx
index 1b3d674..7c05760 100644
--- a/frontend/src/app/router.jsx
+++ b/frontend/src/app/router.jsx
@@ -60,9 +60,22 @@ export function AppRouter() {
             </ProtectedRoute>
           }
         />
-        <Route path="/dashboard" element={<DashboardPage />} />
-        <Route path="/expenses" element={<ExpensePage />} />
-        <Route path="/approvals" element={<ApprovalQueuePage />} />
+        <Route
+  path="/dashboard"
+  element={<DashboardPage />}
+/>
+        <Route
+  path="/expenses"
+  element={<ExpensePage />}
+/>
+        <Route
+  path="/approvals"
+  element={
+    <ProtectedRoute allowedRoles={["manager", "admin"]}>
+      <ApprovalQueuePage />
+    </ProtectedRoute>
+  }
+/>
         <Route
           path="/analytics"
           element={
diff --git a/frontend/src/components/layout/AppLayout.jsx b/frontend/src/components/layout/AppLayout.jsx
index 3b5a752..9573fb5 100644
--- a/frontend/src/components/layout/AppLayout.jsx
+++ b/frontend/src/components/layout/AppLayout.jsx
@@ -8,6 +8,7 @@ import {
   FileCheck,
   Receipt,
   Settings,
+  ShieldCheck,
   LogOut,
   ChevronDown,
   Search,
@@ -23,7 +24,12 @@ const NAV_ITEMS = [
     icon: LayoutDashboard,
     roles: ["admin", "manager"],
   },
-  { path: "/admin", label: "Settings", icon: Settings, roles: ["admin"] },
+  {
+    path: "/admin",
+    label: "Approval Rules",
+    icon: ShieldCheck,
+    roles: ["admin"],
+  },
 ];
 
 export default function AppLayout() {