From be72ca9a5820ccab4798d59ed71e30ebcbdc47ae Mon Sep 17 00:00:00 2001
From: Kartik Sharma <kartik.sharma@marcoaiot.com>
Date: Sat, 27 Sep 2025 10:09:09 +0530
Subject: [PATCH] =?UTF-8?q?Scrollbar=20Behavior=20in=20"Choose=20Organizat?=
 =?UTF-8?q?ion"=20(Projects=20=E2=86=92=20Organization=20Tab)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Organization/OrgPicker.css     | 24 +++++++++++++++++++
 .../Organization/OrgPickerfromTenant.jsx      |  3 ++-
 2 files changed, 26 insertions(+), 1 deletion(-)
 create mode 100644 src/components/Organization/OrgPicker.css

diff --git a/src/components/Organization/OrgPicker.css b/src/components/Organization/OrgPicker.css
new file mode 100644
index 00000000..279b37fa
--- /dev/null
+++ b/src/components/Organization/OrgPicker.css
@@ -0,0 +1,24 @@
+/* Default: hide scrollbar */
+.scrollable-tbody {
+  max-height: 350px;
+  overflow-y: auto;
+  scrollbar-width: none; /* Firefox */
+}
+.scrollable-tbody::-webkit-scrollbar {
+  width: 0; /* Chrome, Safari */
+}
+
+/* On hover: show scrollbar */
+.scrollable-tbody:hover {
+  scrollbar-width: thin; /* Firefox */
+}
+.scrollable-tbody:hover::-webkit-scrollbar {
+  width: 6px; /* Adjust width */
+}
+.scrollable-tbody:hover::-webkit-scrollbar-thumb {
+  background-color: rgba(0, 0, 0, 0.3);
+  border-radius: 10px;
+}
+.scrollable-tbody:hover::-webkit-scrollbar-track {
+  background: transparent;
+}
diff --git a/src/components/Organization/OrgPickerfromTenant.jsx b/src/components/Organization/OrgPickerfromTenant.jsx
index 6f71d4a0..6bfb9394 100644
--- a/src/components/Organization/OrgPickerfromTenant.jsx
+++ b/src/components/Organization/OrgPickerfromTenant.jsx
@@ -6,6 +6,7 @@ import {
 import { ITEMS_PER_PAGE } from "../../utils/constants";
 import Label from "../common/Label";
 import Pagination from "../common/Pagination";
+import "./OrgPicker.css"
 
 const OrgPickerfromTenant = ({ title }) => {
   const [searchText, setSearchText] = useState("");
@@ -104,7 +105,7 @@ const OrgPickerfromTenant = ({ title }) => {
 
           <div
             className="scrollable-tbody overflow-y-auto"
-            style={{ maxHeight: "350px", overflowY: "auto" }}
+            style={{ maxHeight: "350px" }}
           >
             <table className="table dataTable text-nowrap mb-0">
               <tbody>