diff --git a/src/components/Organization/OrgPickerFromSPId.jsx b/src/components/Organization/OrgPickerFromSPId.jsx
index d250e48b..b0306981 100644
--- a/src/components/Organization/OrgPickerFromSPId.jsx
+++ b/src/components/Organization/OrgPickerFromSPId.jsx
@@ -149,7 +149,7 @@ const OrgPickerFromSPId = () => {
 
       {/* Footer Back button */}
       {flowType !== "default" && (
-        <div className="d-flex text-secondary mt-3">
+        <div className="d-flex text-secondary mt-7">
           <button
             type="button"
             className="btn btn-xs btn-outline-secondary"
diff --git a/src/components/Organization/OrganizationsList.jsx b/src/components/Organization/OrganizationsList.jsx
index 611ce2de..144863b0 100644
--- a/src/components/Organization/OrganizationsList.jsx
+++ b/src/components/Organization/OrganizationsList.jsx
@@ -4,18 +4,19 @@ import { ITEMS_PER_PAGE } from "../../utils/constants";
 import Avatar from "../common/Avatar";
 import { useDebounce } from "../../utils/appUtils";
 import Pagination from "../common/Pagination";
+import { SpinnerLoader } from "../common/Loader";
 
-const OrganizationsList = ({searchText}) => {
-   const [currentPage, setCurrentPage] = useState(1);
-    const searchString = useDebounce(searchText,500)
+const OrganizationsList = ({ searchText }) => {
+  const [currentPage, setCurrentPage] = useState(1);
+  const searchString = useDebounce(searchText, 500)
   const {
     data = [],
     isLoading,
     isFetching,
     isError,
     error,
-  } = useOrganizationsList(ITEMS_PER_PAGE, 1, true,null,searchString);
-    const {onClose, startStep, flowType, onOpen,orgData } = useOrganizationModal();
+  } = useOrganizationsList(ITEMS_PER_PAGE, 1, true, null, searchString);
+  const { onClose, startStep, flowType, onOpen, orgData } = useOrganizationModal();
 
   const organizationsColumns = [
     {
@@ -39,21 +40,21 @@ const OrganizationsList = ({searchText}) => {
       label: "Contact Person",
       getValue: (org) => (
         (
-        <div className="d-flex align-items-center ps-1">
-          <Avatar
-            size="xs"
-            classAvatar="m-0"
-            firstName={(org?.name || "").trim().split(" ")[0] || ""}
-            lastName={(org?.name || "").trim().split(" ")[1] || ""}
-          />
-          <span
-            className="text-truncate d-inline-block "
-            style={{ maxWidth: "150px" }}
-          >
-            {org?.name || "N/A"}
-          </span>
-        </div>
-      )
+          <div className="d-flex align-items-center ps-1">
+            <Avatar
+              size="xs"
+              classAvatar="m-0"
+              firstName={(org?.name || "").trim().split(" ")[0] || ""}
+              lastName={(org?.name || "").trim().split(" ")[1] || ""}
+            />
+            <span
+              className="text-truncate d-inline-block "
+              style={{ maxWidth: "150px" }}
+            >
+              {org?.name || "N/A"}
+            </span>
+          </div>
+        )
       ),
       align: "text-start",
     },
@@ -67,7 +68,7 @@ const OrganizationsList = ({searchText}) => {
       key: "email",
       label: "Email",
       getValue: (org) => (
-         <span
+        <span
           className="text-truncate d-inline-block"
           style={{ maxWidth: "200px" }}
         >
@@ -84,7 +85,7 @@ const OrganizationsList = ({searchText}) => {
     },
   ];
 
-   const paginate = (page) => {
+  const paginate = (page) => {
     if (page >= 1 && page <= (data?.totalPages ?? 1)) {
       setCurrentPage(page);
     }
@@ -93,73 +94,81 @@ const OrganizationsList = ({searchText}) => {
   if (isError) return <div>{error?.message || "Something went wrong"}</div>;
 
   return (
-       <div
-          className="card-datatable table-responsive overflow-auto"
-          id="horizontal-example"
-        >
-          <div className="dataTables_wrapper no-footer px-2 ">
-            <table className="table border-top dataTable text-nowrap">
-            <thead>
-              <tr className="table_header_border">
-                {organizationsColumns.map((col) => (
-                  <th
-                    key={col.key}
-                    className="sorting d-table-cell"
-                    aria-sort="descending"
-                  >
-                    <div className={`${col.align}`}>{col.label}</div>
-                  </th>
-                ))}
-                <th className="sticky-action-column bg-white text-center">
-                  Action
+    <div
+      className="card-datatable table-responsive overflow-auto"
+      id="horizontal-example"
+    >
+      <div className="dataTables_wrapper no-footer px-2 ">
+        <table className="table border-top dataTable text-nowrap">
+          <thead>
+            <tr className="table_header_border">
+              {organizationsColumns.map((col) => (
+                <th
+                  key={col.key}
+                  className="sorting d-table-cell"
+                  aria-sort="descending"
+                >
+                  <div className={`${col.align}`}>{col.label}</div>
                 </th>
-              </tr>
-            </thead>
-            <tbody>
-              {data?.data?.length > 0 ? (
-                data?.data?.map((org) => (
-                  <tr key={org.id}>
-                    {organizationsColumns.map((col) => (
-                      <td
-                        key={col.key}
-                        style={{ height: "50px" }}
-                        className={`d-table-cell ${col.align ?? ""}`}
-                      >
-                        {col.customRender
-                          ? col.customRender(org)
-                          : col.getValue(org)}
-                      </td>
-                    ))}
-                    <td className="sticky-action-column ">
-                      <div className="d-flex justify-content-center gap-2">
-                        <i className="bx bx-show text-primary cursor-pointer"  onClick={()=>onOpen({startStep:5,orgData:org.id,flowType:"view"})}></i>
-                        <i className="bx bx-edit text-secondary cursor-pointer" onClick={()=>onOpen({startStep:4,orgData:org,flowType:"edit"})}></i>
-                        <i className="bx bx-trash text-danger cursor-not-allowed"></i>
-                      </div>
+              ))}
+              <th className="sticky-action-column bg-white text-center">
+                Action
+              </th>
+            </tr>
+          </thead>
+          <tbody>
+            {data?.data?.length > 0 ? (
+              data?.data?.map((org) => (
+                <tr key={org.id}>
+                  {organizationsColumns.map((col) => (
+                    <td
+                      key={col.key}
+                      style={{ height: "50px" }}
+                      className={`d-table-cell ${col.align ?? ""}`}
+                    >
+                      {col.customRender
+                        ? col.customRender(org)
+                        : col.getValue(org)}
                     </td>
-                  </tr>
-                ))
-              ) : (
-                <tr>
-                  <td
-                    colSpan={organizationsColumns.length + 1}
-                    className="text-center"
-                  >
-                    <p className="fw-semibold">{isLoading ? "Loading....":"Not Found Organization"}</p>
+                  ))}
+                  <td className="sticky-action-column ">
+                    <div className="d-flex justify-content-center gap-2">
+                      <i className="bx bx-show text-primary cursor-pointer" onClick={() => onOpen({ startStep: 5, orgData: org.id, flowType: "view" })}></i>
+                      <i className="bx bx-edit text-secondary cursor-pointer" onClick={() => onOpen({ startStep: 4, orgData: org, flowType: "edit" })}></i>
+                      <i className="bx bx-trash text-danger cursor-not-allowed"></i>
+                    </div>
                   </td>
                 </tr>
-              )}
-            </tbody>
-          </table>
-          {data?.data?.length > 0 && (
-              <Pagination
-                currentPage={currentPage}
-                totalPages={data.totalPages}
-                onPageChange={paginate}
-              />
+              ))
+            ) : (
+              <tr>
+                <td
+                  colSpan={organizationsColumns.length + 1}
+                  className="text-center"
+                  style={{ height: "250px" }} 
+                >
+                  {isLoading ? (
+                    <div className="d-flex justify-content-center align-items-center h-100">
+                      <SpinnerLoader />
+                    </div>
+                  ) : (
+                    <p className="fw-semibold mt-3">Not Found Organization</p>
+                  )}
+                </td>
+              </tr>
+
             )}
-        </div>
+          </tbody>
+        </table>
+        {data?.data?.length > 0 && (
+          <Pagination
+            currentPage={currentPage}
+            totalPages={data.totalPages}
+            onPageChange={paginate}
+          />
+        )}
       </div>
+    </div>
   );
 };