diff --git a/components/ComposeEmail.tsx b/components/ComposeEmail.tsx
index b730f479..76e7c7d1 100644
--- a/components/ComposeEmail.tsx
+++ b/components/ComposeEmail.tsx
@@ -101,12 +101,11 @@ export default function ComposeEmail({
         })
         .then(response => response.json())
         .then(parsed => {
-          // Create the reply/forward structure
+          // Create a single editable area with the reply/forward structure
           content = `
-            <div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px; border: 1px solid #e5e7eb; border-radius: 4px; margin-bottom: 20px;"></div>
-            <div class="quoted-content" contenteditable="false" style="color: #6b7280; font-size: 0.875rem;">
+            <div class="compose-area" contenteditable="true" style="min-height: 100px; padding: 10px; border: 1px solid #e5e7eb; border-radius: 4px;">
               ${forwardFrom ? `
-                <div style="margin-bottom: 10px;">
+                <div style="margin-bottom: 10px; color: #6b7280; font-size: 0.875rem;">
                   ---------- Forwarded message ---------<br/>
                   From: ${forwardFrom.from}<br/>
                   Date: ${new Date(forwardFrom.date).toLocaleString()}<br/>
@@ -117,10 +116,10 @@ export default function ComposeEmail({
                   ${parsed.html || parsed.text}
                 </div>
               ` : `
-                <div style="margin-bottom: 10px;">
+                <div style="margin-bottom: 10px; color: #6b7280; font-size: 0.875rem;">
                   On ${new Date(replyTo?.date || '').toLocaleString()}, ${replyTo?.from} wrote:
                 </div>
-                <blockquote style="margin: 0; padding-left: 1em; border-left: 2px solid #e5e7eb;">
+                <blockquote style="margin: 0; padding-left: 1em; border-left: 2px solid #e5e7eb; color: #6b7280;">
                   ${parsed.html || parsed.text}
                 </blockquote>
               `}
@@ -176,11 +175,7 @@ export default function ComposeEmail({
     const composeArea = composeBodyRef.current.querySelector('.compose-area');
     if (!composeArea) return;
     
-    // Get the quoted content if it exists
-    const quotedContent = composeBodyRef.current.querySelector('.quoted-content');
-    
-    // Combine compose area and quoted content
-    const content = composeArea.innerHTML + (quotedContent ? quotedContent.outerHTML : '');
+    const content = composeArea.innerHTML;
     
     if (!content.trim()) {
       console.warn('Email content is empty');
@@ -220,16 +215,12 @@ export default function ComposeEmail({
     }
 
     // Get the current content
-    const composeContent = composeArea.innerHTML;
-    if (!composeContent.trim()) {
+    const content = composeArea.innerHTML;
+    if (!content.trim()) {
       console.error('Email content is empty');
       return;
     }
 
-    // Get the quoted content if it exists
-    const quotedContent = composeBodyRef.current.querySelector('.quoted-content');
-    const fullContent = composeContent + (quotedContent ? quotedContent.outerHTML : '');
-
     // Create MIME headers
     const mimeHeaders = {
       'MIME-Version': '1.0',
@@ -240,7 +231,7 @@ export default function ComposeEmail({
     // Combine headers and content
     const mimeContent = Object.entries(mimeHeaders)
       .map(([key, value]) => `${key}: ${value}`)
-      .join('\n') + '\n\n' + fullContent;
+      .join('\n') + '\n\n' + content;
 
     setComposeBody(mimeContent);