feat : add types for all props components , add scroll css styles

src/index.css

@@ -32,4 +32,41 @@
     @apply backdrop-blur-[19px] backdrop-saturate-[200%] bg-[rgba(17,25,40,0.25)] rounded-xl;
     -webkit-backdrop-filter: blur(19px) saturate(200%);
   }
+  /* برای مرورگرهای WebKit (مثل Chrome و Safari) */
+  ::-webkit-scrollbar {
+    width: 12px; /* عرض نوار اسکرول */
+  }
+
+  ::-webkit-scrollbar-track {
+    background: transparent; /* پس‌زمینه نوار اسکرول */
+  }
+
+  ::-webkit-scrollbar-thumb {
+    @apply bg-yellow-600; /* رنگ نوار اسکرول */
+    border-radius: 20px; /* گرد کردن نوار اسکرول */
+    border: 3px solid transparent; /* ایجاد فضای خالی در اطراف نوار اسکرول */
+    background-clip: content-box; /* اطمینان از حفظ فضای خالی */
+  }
+
+  /* برای مرورگر Firefox */
+  * {
+    scrollbar-width: thin; /* عرض نوار اسکرول */
+    scrollbar-color: #ca8a04 transparent; /* رنگ نوار اسکرول و پس‌زمینه */
+  }
+
+  /* برای مرورگرهای مبتنی بر Blink (مثل Edge) */
+  ::-webkit-scrollbar {
+    width: 12px;
+  }
+
+  ::-webkit-scrollbar-track {
+    background: transparent;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    background-color: #ca8a04;
+    border-radius: 20px;
+    border: 3px solid transparent;
+    background-clip: content-box;
+  }
 }