diff --git a/components/chat/message-item/MessageBubble.tsx b/components/chat/message-item/MessageBubble.tsx
index aa49de6..d808c4e 100644
--- a/components/chat/message-item/MessageBubble.tsx
+++ b/components/chat/message-item/MessageBubble.tsx
@@ -1,46 +1,46 @@
+import { getMessageText, isMessageContainMedia } from "@/types/ask";
 import React from 'react';
 import { View } from 'react-native';
-import MessageContent from './MessageContent';
-import { getMessageText, isMessageContainMedia } from "@/types/ask";
+import MessageContent from "./MessageContent";
 
 interface MessageBubbleProps {
-  item: any;
-  isUser: boolean;
-  setModalVisible: React.Dispatch<React.SetStateAction<{ visible: boolean, data: any }>>;
-  setCancel: React.Dispatch<React.SetStateAction<boolean>>;
-  cancel: boolean;
-  t: any;
-  setSelectedImages: React.Dispatch<React.SetStateAction<string[]>>;
-  setModalDetailsVisible: React.Dispatch<React.SetStateAction<{ visible: boolean, content: any }>>;
+    item: any;
+    isUser: boolean;
+    setModalVisible: React.Dispatch<React.SetStateAction<{ visible: boolean, data: any }>>;
+    setCancel: React.Dispatch<React.SetStateAction<boolean>>;
+    cancel: boolean;
+    t: any;
+    setSelectedImages: React.Dispatch<React.SetStateAction<string[]>>;
+    setModalDetailsVisible: React.Dispatch<React.SetStateAction<{ visible: boolean, content: any }>>;
 }
 
-const MessageBubble = ({ 
-  item, 
-  isUser, 
-  setModalVisible, 
-  setCancel, 
-  cancel, 
-  t, 
-  setSelectedImages, 
-  setModalDetailsVisible
+const MessageBubble = ({
+    item,
+    isUser,
+    setModalVisible,
+    setCancel,
+    cancel,
+    t,
+    setSelectedImages,
+    setModalDetailsVisible
 }: MessageBubbleProps) => {
-  return (
-    <View
-      className={`${isUser ? '!bg-bgPrimary ml-10 rounded-full' : '!bg-aiBubble  rounded-2xl'} border-0 ${!isUser && isMessageContainMedia(item) ? '!rounded-t-3xl !rounded-b-2xl' : '!rounded-3xl'} px-4 py-3`}
-      style={{ marginRight: getMessageText(item) == "keepSearchIng" ? 0 : isUser ? 0 : 10 }}
-    >
-      <MessageContent 
-        item={item}
-        isUser={isUser}
-        setModalVisible={setModalVisible}
-        setCancel={setCancel}
-        cancel={cancel}
-        t={t}
-        setSelectedImages={setSelectedImages}
-        setModalDetailsVisible={setModalDetailsVisible}
-      />
-    </View>
-  );
+    return (
+        <View
+            className={`${isUser ? '!bg-bgPrimary ml-10 rounded-full' : '!bg-aiBubble  rounded-2xl'} border-0 ${!isUser && isMessageContainMedia(item) ? '!rounded-t-3xl !rounded-b-2xl' : '!rounded-3xl'} px-3`}
+            style={{ marginRight: getMessageText(item) == "keepSearchIng" ? 0 : isUser ? 0 : 10 }}
+        >
+            <MessageContent
+                item={item}
+                isUser={isUser}
+                setModalVisible={setModalVisible}
+                setCancel={setCancel}
+                cancel={cancel}
+                t={t}
+                setSelectedImages={setSelectedImages}
+                setModalDetailsVisible={setModalDetailsVisible}
+            />
+        </View>
+    );
 };
 
 export default React.memo(MessageBubble);
diff --git a/components/chat/message-item/MessageContent.tsx b/components/chat/message-item/MessageContent.tsx
index eaa7577..b19f7ee 100644
--- a/components/chat/message-item/MessageContent.tsx
+++ b/components/chat/message-item/MessageContent.tsx
@@ -1,9 +1,9 @@
 import MoreSvg from "@/assets/icons/svg/more.svg";
 import { ContentPart, getMessageText, isMessageContainMedia } from "@/types/ask";
-import { MarkdownTextInput, parseExpensiMark } from '@expensify/react-native-live-markdown';
 import { TFunction } from 'i18next';
 import React from 'react';
-import { TouchableOpacity, View } from 'react-native';
+import { Platform, StyleSheet, TouchableOpacity, View } from 'react-native';
+import Markdown from "react-native-markdown-display";
 import Loading from '../../ask/threeCircle';
 import { ThemedText } from "../../ThemedText";
 import MediaGrid from './MediaGrid';
@@ -19,7 +19,85 @@ interface MessageContentProps {
     setModalDetailsVisible: React.Dispatch<React.SetStateAction<{ visible: boolean, content: any }>>;
 }
 
-
+const chineseMarkdownStyle = StyleSheet.create({
+    // General body text
+    body: {
+        fontSize: 14,
+        lineHeight: 24.5, // 1.75 * fontSize for better readability
+        color: '#333',
+    },
+    // Headings
+    heading1: {
+        fontSize: 24,
+        fontWeight: 'bold',
+        marginTop: 10,
+        marginBottom: 10,
+        lineHeight: 36,
+        borderBottomWidth: 1,
+        borderColor: '#eee',
+        paddingBottom: 5,
+    },
+    heading2: {
+        fontSize: 22,
+        fontWeight: 'bold',
+        marginTop: 8,
+        marginBottom: 8,
+        lineHeight: 33,
+    },
+    heading3: {
+        fontSize: 20,
+        fontWeight: 'bold',
+        marginTop: 6,
+        marginBottom: 6,
+        lineHeight: 30,
+    },
+    // Paragraph: Add vertical margin for better separation
+    paragraph: {
+        marginTop: 10,
+        marginBottom: 10,
+    },
+    // Lists
+    bullet_list_icon: {
+        fontSize: 16,
+        lineHeight: 28,
+        marginRight: 8,
+    },
+    list_item: {
+        flexDirection: 'row',
+        alignItems: 'flex-start',
+        marginBottom: 8,
+    },
+    // Code blocks
+    code_block: {
+        fontFamily: Platform.OS === 'ios' ? 'Courier New' : 'monospace',
+        backgroundColor: '#f5f5f5',
+        padding: 15,
+        borderRadius: 4,
+        marginVertical: 10,
+        fontSize: 14,
+        lineHeight: 21,
+    },
+    // Blockquote
+    blockquote: {
+        backgroundColor: '#f0f0f0',
+        borderLeftColor: '#ccc',
+        borderLeftWidth: 4,
+        paddingHorizontal: 15,
+        paddingVertical: 10,
+        marginVertical: 10,
+    },
+    // Link
+    link: {
+        color: '#007aff', // Standard blue link color
+        textDecorationLine: 'underline',
+    },
+    // Horizontal Rule
+    hr: {
+        backgroundColor: '#e0e0e0',
+        height: 1,
+        marginVertical: 15,
+    },
+});
 
 const MessageContent = ({
     item,
@@ -32,14 +110,15 @@ const MessageContent = ({
     setModalDetailsVisible
 }: MessageContentProps) => {
     return (
-        <View className={`${isUser ? 'bg-bgPrimary' : 'bg-aiBubble'}`}>
+        <View className={`${isUser ? 'bg-bgPrimary' : 'bg-aiBubble'} rounded-2xl`}>
             {getMessageText(item) == "keepSearchIng" && !isUser ? (
                 <Loading />
             ) : (
-                <MarkdownTextInput
-                    value={getMessageText(item)}
-                    parser={parseExpensiMark}
-                />
+                <View className="px-2">
+                    <Markdown style={chineseMarkdownStyle}>
+                        {getMessageText(item)}
+                    </Markdown>
+                </View>
             )}