diff --git a/dev-dist/sw.js b/dev-dist/sw.js
index 24a967b..115230b 100644
--- a/dev-dist/sw.js
+++ b/dev-dist/sw.js
@@ -82,7 +82,7 @@ define(['./workbox-54d0af47'], (function (workbox) { 'use strict';
     "revision": "3ca0b8505b4bec776b69afdba2768812"
   }, {
     "url": "index.html",
-    "revision": "0.f3u8hds6p7"
+    "revision": "0.3bv9k3911i8"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {
diff --git a/src/Layouts/DefaultLayout.tsx b/src/Layouts/DefaultLayout.tsx
index 1cf5b32..97af72e 100644
--- a/src/Layouts/DefaultLayout.tsx
+++ b/src/Layouts/DefaultLayout.tsx
@@ -7,9 +7,10 @@ import logo from '../assets/logo.svg';
 import { AccordionItem, AccordionItemContent, AccordionItemTrigger, AccordionRoot } from "../components/ui/accordion";
 import { Avatar } from "../components/ui/avatar";
 import { LuLogOut } from "react-icons/lu";
-import { logout, setToken } from "../Redux/Service/authSlice";
+import { logout } from "../Redux/Service/authSlice";
 import { useDispatch } from "react-redux";
 import GlobalStateContext from "../Contexts/GlobalStateContext";
+import { useLogOutMutation } from "../Redux/Service/apiSlice";
 
 const DefaultLayout: FC<{ children: React.ReactNode }> = ({ children }) => {
 
@@ -23,18 +24,29 @@ const DefaultLayout: FC<{ children: React.ReactNode }> = ({ children }) => {
     throw new Error('App must be used within a GlobalStateProvider');
   }
   const { setIsAuthenticate } = context;
+  const [ logOutAdmin ] = useLogOutMutation()
 
 
   // Logout function
-  const handleLogout = () => {
-    dispatch(logout())
-    localStorage.removeItem("token"); // Clear token
-    setIsAuthenticate(false); // Update state
+  const handleLogout = async () => {
+    try {
+      // ✅ Call mutation and wait for the response
+      const res = await logOutAdmin().unwrap(); 
+      console.log("Logout Success:", res);
+  
+      // ✅ Clear local storage & update authentication state
+      dispatch(logout());
+      localStorage.removeItem("token"); 
+      setIsAuthenticate(false); 
+      // ✅ Redirect to login page
+      navigate("/login");
+    } catch (error) {
+      console.error("Logout Failed:", error);
+    }
   };
 
   return (
     <HStack overflow={'hidden'} position={'relative'} bg="#F2F2F2" backgroundPosition="center" backgroundRepeat="repeat" backgroundSize="cover" gap={0} w="100%" h="100vh" p={0}>
-    
       <VStack  zIndex={1} gap={0} rounded={'lg'} h="100%" w="16%" overflow={'auto'} >
         <HStack w={'100%'} p={3} h={'8%'} justifyContent={'center'}>
           <Image w={55} src={logo} />
@@ -49,13 +61,10 @@ const DefaultLayout: FC<{ children: React.ReactNode }> = ({ children }) => {
               </AccordionItem>
             </AccordionRoot>)}
         </VStack>
-
         <VStack w={'100%'} p={3} pt={0}>
         <HStack onClick={handleLogout} className="link"  style={{ cursor: 'pointer', borderRadius: '8px', padding: '6px', width: '100%', display: 'flex', alignItems: 'center', gap: 6, border: '1px solid #ffffff', backgroundColor:'#fff', color:'#000', boxShadow:'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'}} ><LuLogOut style={{ fontSize: '20px' }} /> <Text fontSize={'xs'} w={'100%'}>Logout</Text></HStack>
         </VStack>
       </VStack>
-
-
       <VStack  gap={0} h="100%" w="85%" >
         <HStack h={'12%'} w={'100%'} justifyContent={'flex-end'} pe={3} gap={6}>
           <NavLink to={'/manage-notification'}><RiNotificationLine color="#013e3e" cursor={'pointer'} style={{ fontSize: '22px' }} /></NavLink>
diff --git a/src/Pages/ManageCMS/FAQ/EditDetails.tsx b/src/Pages/ManageCMS/FAQ/EditDetails.tsx
index 2ea1b8d..ee9a64e 100644
--- a/src/Pages/ManageCMS/FAQ/EditDetails.tsx
+++ b/src/Pages/ManageCMS/FAQ/EditDetails.tsx
@@ -1,15 +1,23 @@
+import { TbEdit } from "react-icons/tb";
 import { Button } from "../../../components/ui/button"
 import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
-import { Field, Grid, Input, Stack, Text, Textarea } from "@chakra-ui/react"
+import { Field, Grid, Icon, Input, Stack, Text, Textarea } from "@chakra-ui/react"
 import { FaRegEdit } from "react-icons/fa";
 function EditDetails() {
     return (
 
         <DialogRoot placement="center">
             <DialogTrigger asChild>
-               
-                    <FaRegEdit style={{ cursor: "pointer", fontSize:'16px' }} color="#000" />
-               
+            <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <TbEdit />
+          </Icon>
                 {/* <Button><FaRegEdit /></Button> */}
 
             </DialogTrigger>
diff --git a/src/Pages/ManageGroups/EditDetailGroup.tsx b/src/Pages/ManageGroups/EditDetailGroup.tsx
index 31ad9ba..b7da10c 100644
--- a/src/Pages/ManageGroups/EditDetailGroup.tsx
+++ b/src/Pages/ManageGroups/EditDetailGroup.tsx
@@ -1,19 +1,26 @@
 import { Button } from "../../components/ui/button"
 import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
-import { Avatar, Box, Field, Heading, Input, Stack, Text } from "@chakra-ui/react"
+import { Avatar, Box, Field, Heading, Icon, Input, Stack, Text } from "@chakra-ui/react"
 import { Switch } from "../../components/ui/switch";
 import { FaRegEdit } from "react-icons/fa";
 import { AvatarGroup } from "../../components/ui/avatar";
+import { TbEdit } from "react-icons/tb";
 function EditDetailGroups() {
     return (
 
         <DialogRoot placement="center" >
             <DialogTrigger asChild>
                 
-                    <FaRegEdit style={{ cursor: "pointer", fontSize:'16px'}}  color="#000"/>
-                
-                {/* <Button><FaRegEdit /></Button> */}
-
+            <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <TbEdit />
+          </Icon>
             </DialogTrigger>
 
             <DialogContent
diff --git a/src/Pages/ManageGroups/ViewManageGroup.tsx b/src/Pages/ManageGroups/ViewManageGroup.tsx
index 720e799..4622904 100644
--- a/src/Pages/ManageGroups/ViewManageGroup.tsx
+++ b/src/Pages/ManageGroups/ViewManageGroup.tsx
@@ -1,19 +1,27 @@
 import { Button } from "../../components/ui/button"
 import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
-import { Avatar, Box, Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react"
+import { Avatar, Box, Field, Grid, Heading, Icon, Input, Stack, Text } from "@chakra-ui/react"
 import { Checkbox } from "../../components/ui/checkbox"
 import { MdOutlineRemoveRedEye } from "react-icons/md";
 import { Switch } from "../../components/ui/switch";
 import { AvatarGroup } from "../../components/ui/avatar";
+import { TbEdit } from "react-icons/tb";
 function ViewManageGroup() {
     return (
 
         <DialogRoot placement="center" >
             <DialogTrigger asChild>
                 
-                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize:'16px'}}  color="#000"/>
-               
-                {/* <Button><FaRegEdit /></Button> */}
+            <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <MdOutlineRemoveRedEye />
+          </Icon>
 
             </DialogTrigger>
 
diff --git a/src/Pages/ManageJobs/ManageJobs.tsx b/src/Pages/ManageJobs/ManageJobs.tsx
index 0e2beaa..06ec2bf 100644
--- a/src/Pages/ManageJobs/ManageJobs.tsx
+++ b/src/Pages/ManageJobs/ManageJobs.tsx
@@ -1,15 +1,11 @@
-import { Box, createListCollection, HStack, Image, Input, Text } from "@chakra-ui/react";
-import MainFrame from "../../components/MainFrame"
-import ViewSubAdmin from "../SubAdmin/ViewSubAdmin";
-import EditSubAdmin from "../../components/EditSubAdmin";
-import AlertDailog from "../../components/AlertDailog";
-import { InputGroup } from "../../components/ui/input-group";
+import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
 import { LuSearch } from "react-icons/lu";
-import AddModel from "../SubAdmin/AddModel";
-import DataTable from "../../components/DataTable";
 import { RiDeleteBin5Line } from "react-icons/ri";
+import AlertDailog from "../../components/AlertDailog";
+import DataTable from "../../components/DataTable";
+import MainFrame from "../../components/MainFrame";
+import { InputGroup } from "../../components/ui/input-group";
 import ManageJobsAdd from "./ManageJobsAdd";
-import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger, SelectValueText } from "../../components/ui/select";
 import ViewManageJob from "./ViewManageJob";
 
 
diff --git a/src/Pages/ManageJobs/ManageJobsAdd.tsx b/src/Pages/ManageJobs/ManageJobsAdd.tsx
index 4d90998..60f300e 100644
--- a/src/Pages/ManageJobs/ManageJobsAdd.tsx
+++ b/src/Pages/ManageJobs/ManageJobsAdd.tsx
@@ -1,9 +1,9 @@
-import { Button } from "../../components/ui/button"
-import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
-import { createListCollection, Field, Input, SelectValueText, Stack } from "@chakra-ui/react"
+import { Field, Icon, Input, SelectValueText, Stack, createListCollection } from "@chakra-ui/react";
+import { Button } from "../../components/ui/button";
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog";
 
-import { FaRegEdit } from "react-icons/fa"
-import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger } from "../../components/ui/select"
+import { TbEdit } from "react-icons/tb";
+import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger } from "../../components/ui/select";
 
 const frameworks = createListCollection({
     items: [
@@ -19,9 +19,16 @@ function ManageJobsAdd() {
 
         <DialogRoot placement="center">
             <DialogTrigger asChild>
-                
-                    <FaRegEdit style={{ cursor: "pointer", fontSize: "16px" }} color="#000" />
-                
+            <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <TbEdit />
+          </Icon>
             </DialogTrigger>
 
             <DialogContent
diff --git a/src/Pages/ManageJobs/ViewManageJob.tsx b/src/Pages/ManageJobs/ViewManageJob.tsx
index 7dbcc0e..bcd9bc8 100644
--- a/src/Pages/ManageJobs/ViewManageJob.tsx
+++ b/src/Pages/ManageJobs/ViewManageJob.tsx
@@ -1,10 +1,9 @@
+import { Field, Icon, Input, SelectValueText, Stack, createListCollection, } from "@chakra-ui/react"
 import { Button } from "../../components/ui/button"
 import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
-import { createListCollection, Field, Input, SelectValueText, Stack, } from "@chakra-ui/react"
 
-import { FaRegEdit } from "react-icons/fa"
-import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger } from "../../components/ui/select"
 import { MdOutlineRemoveRedEye } from "react-icons/md"
+import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger } from "../../components/ui/select"
 
 const frameworks = createListCollection({
     items: [
@@ -20,9 +19,16 @@ function ViewManageJob() {
 
         <DialogRoot placement="center">
             <DialogTrigger asChild>
-               
-                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }}  color="#000"/>
-               
+            <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <MdOutlineRemoveRedEye />
+          </Icon>
             </DialogTrigger>
 
             <DialogContent
diff --git a/src/Pages/ManagePost/ManagePost.tsx b/src/Pages/ManagePost/ManagePost.tsx
index 9f57344..fe4709e 100644
--- a/src/Pages/ManagePost/ManagePost.tsx
+++ b/src/Pages/ManagePost/ManagePost.tsx
@@ -27,7 +27,7 @@ const managepost: any[] = [
     "Sr. No": i + 1,
     "Images": (
       // <Image w={50} src={img} />
-      <Image w={100} h={50} src={img} />
+      <Image rounded={'lg'} w={100} h={50} src={img} />
 
 
     ),
@@ -36,8 +36,8 @@ const managepost: any[] = [
     </Text>),
     "Publish Data": "12/01/2025",
     "Activate/Deactivate": (
-      <Box>
-        <Switch colorPalette={'teal'} />
+      <Box w={'100%'} >
+        <Switch size={'sm'} colorPalette={'teal'} />
       </Box>
     ),
     "Action": (
diff --git a/src/Pages/ManagePost/ViewDailog.tsx b/src/Pages/ManagePost/ViewDailog.tsx
index dcd0c94..390da84 100644
--- a/src/Pages/ManagePost/ViewDailog.tsx
+++ b/src/Pages/ManagePost/ViewDailog.tsx
@@ -1,16 +1,23 @@
-import { MdOutlineRemoveRedEye } from "react-icons/md"
-import { Button } from "../../components/ui/button"
-import { DialogBody, DialogCloseTrigger, DialogContent, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
-import { Field, Image, Input, Stack } from "@chakra-ui/react"
+import { Field, Icon, Image, Input, Stack } from "@chakra-ui/react"
+import { TbEdit } from "react-icons/tb"
 import img from "../../assets/waterfall.jpg"
+import { DialogBody, DialogCloseTrigger, DialogContent, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
+
 function ViewDailog() {
     return (
 
         <DialogRoot placement="center">
             <DialogTrigger asChild>
-                
-                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} color="#000" />
-                
+            <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <TbEdit />
+          </Icon>
             </DialogTrigger>
 
             <DialogContent
diff --git a/src/Pages/ManageUsers/DeactivatedAccounts/DeactivatedAccounts.tsx b/src/Pages/ManageUsers/DeactivatedAccounts/DeactivatedAccounts.tsx
index 1a5a24f..8daf4f8 100644
--- a/src/Pages/ManageUsers/DeactivatedAccounts/DeactivatedAccounts.tsx
+++ b/src/Pages/ManageUsers/DeactivatedAccounts/DeactivatedAccounts.tsx
@@ -21,7 +21,7 @@ const manageUser: any[] = [
     "Company name": "9876543210",
     "Activate/Deactivate": (
       <Box display={'flex'} justifyContent={'center'}>
-        <Switch colorPalette={'teal'} />
+        <Switch size={'sm'} colorPalette={'teal'} />
       </Box>
     ),
   })),
diff --git a/src/Pages/ManageUsers/RegisterUsers/EditRegisterUsers.tsx b/src/Pages/ManageUsers/RegisterUsers/EditRegisterUsers.tsx
index 30b934f..739830f 100644
--- a/src/Pages/ManageUsers/RegisterUsers/EditRegisterUsers.tsx
+++ b/src/Pages/ManageUsers/RegisterUsers/EditRegisterUsers.tsx
@@ -1,5 +1,5 @@
 import { MdOutlineRemoveRedEye } from "react-icons/md";
-import { Field, Input, Stack } from "@chakra-ui/react";
+import { Field, Icon, Input, Stack } from "@chakra-ui/react";
 import {
   DialogActionTrigger,
   DialogBody,
@@ -13,12 +13,22 @@ import {
 } from "../../../components/ui/dialog";
 import { BiEdit } from "react-icons/bi";
 import { Button } from "../../../components/ui/button";
+import { TbEdit } from "react-icons/tb";
 
 function EditRegisterUsers() {
   return (
     <DialogRoot placement="center">
       <DialogTrigger asChild>
-        <BiEdit style={{ cursor: "pointer", fontSize: "16px" }} />
+            <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <TbEdit />
+          </Icon>
       </DialogTrigger>
 
       <DialogContent
diff --git a/src/Pages/ManageUsers/RegisterUsers/RegisterUsers.tsx b/src/Pages/ManageUsers/RegisterUsers/RegisterUsers.tsx
index 7a6c6f2..95965a9 100644
--- a/src/Pages/ManageUsers/RegisterUsers/RegisterUsers.tsx
+++ b/src/Pages/ManageUsers/RegisterUsers/RegisterUsers.tsx
@@ -33,7 +33,7 @@ const registerUser: any[] = [
     "Language": "Mumbai",
     "Activate/Deactivate": (
       <Box>
-        <Switch colorPalette={'teal'} />
+        <Switch size={'sm'} colorPalette={'teal'} />
       </Box>
     ),
     "Action": (
diff --git a/src/Pages/ManageUsers/RegisterUsers/ViewRegisterUsers.tsx b/src/Pages/ManageUsers/RegisterUsers/ViewRegisterUsers.tsx
index 7826ee4..5f26943 100644
--- a/src/Pages/ManageUsers/RegisterUsers/ViewRegisterUsers.tsx
+++ b/src/Pages/ManageUsers/RegisterUsers/ViewRegisterUsers.tsx
@@ -1,5 +1,5 @@
 import { MdOutlineRemoveRedEye } from "react-icons/md";
-import { Field, Input, Stack } from "@chakra-ui/react";
+import { Field, Icon, Input, Stack } from "@chakra-ui/react";
 import {
   DialogBody,
   DialogCloseTrigger,
@@ -14,10 +14,16 @@ function ViewRegisterUsers() {
   return (
     <DialogRoot placement="center">
       <DialogTrigger asChild>
-        <MdOutlineRemoveRedEye
-          color="#000"
-          style={{ cursor: "pointer", fontSize: "16px" }}
-        />
+      <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <MdOutlineRemoveRedEye />
+          </Icon>
       </DialogTrigger>
 
       <DialogContent
diff --git a/src/Pages/MasterModule/AgencyMaster/EditAgencyMaster.tsx b/src/Pages/MasterModule/AgencyMaster/EditAgencyMaster.tsx
index c075e91..e524e50 100644
--- a/src/Pages/MasterModule/AgencyMaster/EditAgencyMaster.tsx
+++ b/src/Pages/MasterModule/AgencyMaster/EditAgencyMaster.tsx
@@ -1,7 +1,8 @@
 import { FaRegEdit } from "react-icons/fa"
 import { Button } from "../../../components/ui/button"
 import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
-import { Field, Input, Stack, } from "@chakra-ui/react"
+import { Field, Icon, Input, Stack, } from "@chakra-ui/react"
+import { TbEdit } from "react-icons/tb"
 
 
 function EditAgencyMaster() {
@@ -10,9 +11,16 @@ function EditAgencyMaster() {
 
         <DialogRoot placement="center">
             <DialogTrigger asChild>
-                
-                    <FaRegEdit style={{ cursor: "pointer", fontSize: "16px" }}  color="#000"/>
-               
+            <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <TbEdit />
+          </Icon>
             </DialogTrigger>
 
             <DialogContent
diff --git a/src/Pages/MasterModule/AgencyMaster/ViewAgencyMaster.tsx b/src/Pages/MasterModule/AgencyMaster/ViewAgencyMaster.tsx
index 63bab62..e8e2d9a 100644
--- a/src/Pages/MasterModule/AgencyMaster/ViewAgencyMaster.tsx
+++ b/src/Pages/MasterModule/AgencyMaster/ViewAgencyMaster.tsx
@@ -1,5 +1,5 @@
 import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
-import { Field, Input, Stack, } from "@chakra-ui/react"
+import { Field, Icon, Input, Stack, } from "@chakra-ui/react"
 import { MdOutlineRemoveRedEye } from "react-icons/md"
 import { Button } from "../../../components/ui/button"
 
@@ -11,8 +11,16 @@ function ViewAgencyMaster() {
         <DialogRoot placement="center">
             <DialogTrigger asChild>
                 
-                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }}  color="#000"/>
-            
+            <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <MdOutlineRemoveRedEye />
+          </Icon>
             </DialogTrigger>
 
             <DialogContent
diff --git a/src/Pages/SubAdmin/AddModel.tsx b/src/Pages/SubAdmin/AddModel.tsx
index 5fab47e..03472cb 100644
--- a/src/Pages/SubAdmin/AddModel.tsx
+++ b/src/Pages/SubAdmin/AddModel.tsx
@@ -12,7 +12,7 @@ function AddModel() {
                 {/* <Button bg={"transparent"} size="sm">
                     <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
                 </Button> */}
-                <Button px={4} size={"xs"} bg={"#02A0A0"}><IoMdAdd /> Add</Button>
+                <Button rounded={'md'} px={4} py={2} size={"xs"} bg={"#02A0A0"}><IoMdAdd /> Add</Button>
 
             </DialogTrigger>
 
diff --git a/src/Pages/SubAdmin/SubAdmin.tsx b/src/Pages/SubAdmin/SubAdmin.tsx
index 974216f..51a01b2 100644
--- a/src/Pages/SubAdmin/SubAdmin.tsx
+++ b/src/Pages/SubAdmin/SubAdmin.tsx
@@ -76,10 +76,10 @@ const SubAdmin = () => {
                 p={3}
                 w={300}
                 bg={"#fff"}
-                colorPalette={"blue"}
+                colorPalette={"cyan"}
                 _focus={{ border: "1px solid #02A0A0" }}
                 rounded={"md"}
-                size={"2xs"}
+                size={"xs"}
                 fontSize={"2sm"}
                 placeholder="Search..."
                 bgColor={'#EEEEEE'}
diff --git a/src/Pages/SubAdmin/ViewSubAdmin.tsx b/src/Pages/SubAdmin/ViewSubAdmin.tsx
index c1d3a56..b566162 100644
--- a/src/Pages/SubAdmin/ViewSubAdmin.tsx
+++ b/src/Pages/SubAdmin/ViewSubAdmin.tsx
@@ -1,17 +1,28 @@
 import { Button } from "../../components/ui/button"
 import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
-import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react"
+import { Field, Grid, Heading, Icon, Input, Stack, Text } from "@chakra-ui/react"
 import { Checkbox } from "../../components/ui/checkbox"
 import { MdOutlineRemoveRedEye } from "react-icons/md";
+import { FaRegEdit } from "react-icons/fa";
 function ViewSubAdmin() {
     return (
 
         <DialogRoot placement="center" >
             <DialogTrigger asChild>
+            <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <MdOutlineRemoveRedEye />
+          </Icon>
                
-                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize:'16px'}} color="#000"/>
+                    {/* <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize:'16px'}} color="#000"/> */}
                
-                {/* <Button><FaRegEdit /></Button> */}
+                {/* <Button><MdOutlineRemoveRedEye /></Button> */}
 
             </DialogTrigger>
 
diff --git a/src/Redux/Service/apiSlice.tsx b/src/Redux/Service/apiSlice.tsx
index 13eb4e6..b93eaf0 100644
--- a/src/Redux/Service/apiSlice.tsx
+++ b/src/Redux/Service/apiSlice.tsx
@@ -51,6 +51,14 @@ export const dashboard = createApi({
 
     getPosts: builder.query<Post[], void>({ query: () => "/posts" }),
 
+    
+    // 🔹 POST: Create a new post
+    logOut: builder.mutation<void, void>({
+      query: () => ({
+        url: "/logout",
+        method: "POST",
+      }),
+    }),
 
 
 
@@ -58,7 +66,7 @@ export const dashboard = createApi({
   }),
 });
 
-export const { useGetPostsQuery } = dashboard;
+export const { useGetPostsQuery, useLogOutMutation } = dashboard;
 
 export type Post = {
   id: number;
diff --git a/src/components/EditSubAdmin.tsx b/src/components/EditSubAdmin.tsx
index 9b826a4..4928b75 100644
--- a/src/components/EditSubAdmin.tsx
+++ b/src/components/EditSubAdmin.tsx
@@ -1,4 +1,7 @@
+import { Field, Grid, Heading, Icon, Input, Stack, Text } from "@chakra-ui/react";
+import { TbEdit } from "react-icons/tb";
 import { Button } from "./ui/button";
+import { Checkbox } from "./ui/checkbox";
 import {
   DialogBody,
   DialogCloseTrigger,
@@ -9,16 +12,22 @@ import {
   DialogTitle,
   DialogTrigger,
 } from "./ui/dialog";
-import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react";
-import { Checkbox } from "./ui/checkbox";
-import { FaRegEdit } from "react-icons/fa";
 function EditSubAdmin() {
   return (
     <DialogRoot placement="center">
       <DialogTrigger asChild>
-        <Button bg={"transparent"} size="sm">
-          <FaRegEdit style={{ cursor: "pointer" }} color="#000" />
-        </Button>
+          {/* <FaRegEdit style={{ cursor: "pointer" }} color="#000" /> */}
+
+          <Icon
+            cursor={"pointer"}
+            p={0.5}
+            _hover={{ bg: "#00000015" }}
+            rounded={"md"}
+            boxSize={5}
+            // color={iconColor && iconColor}
+          >
+            <TbEdit />
+          </Icon>
         {/* <Button><FaRegEdit /></Button> */}
       </DialogTrigger>
 
diff --git a/src/components/MainFrame.tsx b/src/components/MainFrame.tsx
index 2646c63..e486ade 100644
--- a/src/components/MainFrame.tsx
+++ b/src/components/MainFrame.tsx
@@ -13,7 +13,7 @@ interface MainFrameProps {
 
 const MainFrame: FC<MainFrameProps> = ({ children }) => {
   return (
-    <MotionVStack  rounded="lg" overflowY={'auto'} overflowX={'hidden'} {...OPACITY_ON_LOAD} w="100%" minH="93%" p={0}  pb={2}>
+    <MotionVStack  rounded="lg" overflowY={'auto'} overflowX={'hidden'} {...OPACITY_ON_LOAD} w="100%" minH="93%" p={0} pe={2}  pb={2}>
       <Box
         w="100%"
         // h="100%"