From fcba1a853ddb64cee3af56bd1ddeab8043c6e255 Mon Sep 17 00:00:00 2001
From: NotII <46204250+NotII@users.noreply.github.com>
Date: Tue, 28 Oct 2025 11:07:07 +0000
Subject: [PATCH] Adjust chat UI padding for safe area insets

Updated padding calculations in ChatDetail to account for device safe area insets, improving layout on devices with notches or rounded corners. This affects both the chat scroll container and the input area at the bottom.
---
 components/dashboard/ChatDetail.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/components/dashboard/ChatDetail.tsx b/components/dashboard/ChatDetail.tsx
index 6a9b602..a02e3f0 100644
--- a/components/dashboard/ChatDetail.tsx
+++ b/components/dashboard/ChatDetail.tsx
@@ -633,8 +633,9 @@ export default function ChatDetail({ chatId }: { chatId: string }) {
       <div 
         ref={scrollContainerRef}
         className={cn(
-          "flex-1 overflow-y-auto space-y-2 pb-[80px]",
-          isTouchDevice ? "p-3" : "p-2"
+          isTouchDevice 
+            ? "flex-1 overflow-y-auto space-y-2 p-3 pb-[calc(112px+env(safe-area-inset-bottom))]" 
+            : "flex-1 overflow-y-auto space-y-2 p-2 pb-[calc(88px+env(safe-area-inset-bottom))]"
         )}
         role="log"
         aria-label="Chat messages"
@@ -768,7 +769,8 @@ export default function ChatDetail({ chatId }: { chatId: string }) {
       
       <div className={cn(
         "absolute bottom-0 left-0 right-0 border-t border-border bg-background",
-        isTouchDevice ? "p-3" : "p-4"
+        isTouchDevice ? "p-3" : "p-4",
+        "pb-[env(safe-area-inset-bottom)]"
       )}>
         <form onSubmit={handleSendMessage} className="flex space-x-2">
           <Input