fix chat area input bar

app/chat/[id].tsx

@@ -10,6 +10,7 @@ import {
   RefreshControl,
   type ListRenderItemInfo,
 } from "react-native";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { useLocalSearchParams, Stack, useRouter } from "expo-router";
 import { Ionicons } from "@expo/vector-icons";
 import { useQuery, useMutation } from "convex/react";
@@ -30,6 +31,7 @@ export default function ChatDetailScreen() {
   const { id } = useLocalSearchParams<{ id: string }>();
   const theme = useTheme();
   const router = useRouter();
+  const insets = useSafeAreaInsets();
   const { token, userId, isAuthenticated } = useAuth();
 
   const chat = useQuery(
@@ -138,9 +140,9 @@ export default function ChatDetailScreen() {
         }}
       />
       <KeyboardAvoidingView
-        behavior={Platform.OS === "ios" ? "padding" : undefined}
+        behavior={Platform.OS === "ios" ? "padding" : "height"}
         style={{ flex: 1, backgroundColor: theme.colors.background }}
-        keyboardVerticalOffset={90}
+        keyboardVerticalOffset={Platform.OS === "ios" ? 90 : 0}
       >
         {messages.length === 0 ? (
           <View
@@ -255,7 +257,8 @@ export default function ChatDetailScreen() {
             flexDirection: "row",
             alignItems: "flex-end",
             paddingHorizontal: 16,
-            paddingVertical: 12,
+            paddingTop: 12,
+            paddingBottom: Math.max(insets.bottom, 12),
             borderTopWidth: 1,
             borderTopColor: theme.colors.borderLight,
             backgroundColor: theme.colors.card,