Improve scroll handling and robustness for chat UI

Added 'overscroll-behavior: contain' to body and Chromebook scroll containers to prevent unwanted scroll chaining. Updated scrollToBottom utilities to handle null/undefined containers and errors gracefully. Fixed ChatDetail to use the correct scroll handler function.

components/dashboard/ChatDetail.tsx

@@ -347,7 +347,7 @@ export default function ChatDetail({ chatId }: { chatId: string }) {
 
           // If near bottom, scroll to new messages
           if (isNearBottom()) {
-            setTimeout(scrollToBottom, 50);
+            setTimeout(scrollToBottomHandler, 50);
           }
 
           // Set timeout to mark new messages as read
@@ -447,7 +447,7 @@ export default function ChatDetail({ chatId }: { chatId: string }) {
     setMessages(prev => [...prev, tempMessage]);
 
     // Scroll to bottom to show the new message
-    setTimeout(scrollToBottom, 50);
+    setTimeout(scrollToBottomHandler, 50);
 
     try {
       setSending(true);
@@ -844,5 +844,5 @@ export default function ChatDetail({ chatId }: { chatId: string }) {
       />
     </div>
   );
-} 
+}
 

components/dashboard/ChatTable.tsx

@@ -354,7 +354,7 @@ export default function ChatTable() {
                           <div>
                             <div className="font-semibold text-sm flex items-center gap-2">
                               {chat.telegramUsername ? (
-                                <span className="text-blue-400">@{chat.telegramUsername}</span>
+                                <span>@{chat.telegramUsername}</span>
                               ) : (
                                 <span className="text-foreground">Customer {chat.buyerId.slice(0, 6)}...</span>
                               )}