updates

components/ClientEmailSection.vue

@@ -160,20 +160,20 @@
                             color="primary"
                             variant="tonal"
                             prepend-icon="mdi-paperclip"
-                            class="mr-2"
+                            class="mr-2 mb-1"
                           >
                             {{ attachment.name || attachment }}
                           </v-chip>
                         </div>
                         
-                        <div class="d-flex justify-space-between mt-3">
+                        <div class="d-flex justify-space-between mt-3 gap-2">
                           <v-btn variant="text" size="small" color="primary" @click.stop="viewEmail(email)">
-                            <v-icon start>mdi-email-open</v-icon>
-                            View
+                            <v-icon :start="!mobile" :size="mobile ? 'small' : 'default'">mdi-email-open</v-icon>
+                            <span v-if="!mobile" class="ml-1">View</span>
                           </v-btn>
                           <v-btn variant="text" size="small" color="primary" @click.stop="replyToEmail(email)">
-                            <v-icon start>mdi-reply</v-icon>
-                            Reply
+                            <v-icon :start="!mobile" :size="mobile ? 'small' : 'default'">mdi-reply</v-icon>
+                            <span v-if="!mobile" class="ml-1">Reply</span>
                           </v-btn>
                         </div>
                       </v-card-text>
@@ -1079,6 +1079,8 @@ const saveSignature = () => {
   max-height: 100px;
   overflow: hidden;
   position: relative;
+  word-wrap: break-word;
+  overflow-wrap: break-word;
 }
 
 .email-preview::after {
@@ -1089,21 +1091,25 @@ const saveSignature = () => {
   right: 0;
   height: 30px;
   background: linear-gradient(to bottom, transparent, white);
+  pointer-events: none;
 }
 
 .email-content-mobile {
-  max-height: 150px;
+  max-height: 120px;
   font-size: 0.875rem;
+  line-height: 1.4;
 }
 
 .email-content :deep(p) {
   margin: 0 0 0.5em 0;
+  word-wrap: break-word;
+  overflow-wrap: break-word;
 }
 
 .email-content :deep(br) {
   display: block;
   content: "";
-  margin: 0.5em 0;
+  margin: 0.25em 0;
 }
 
 .email-threads {

components/EOISection.vue

@@ -29,30 +29,41 @@
       </div>
       
       <!-- Generate EOI Button - Only show if no documents uploaded -->
-      <div v-if="!hasEOI && !hasEOIDocuments" class="mb-4">
+      <div v-if="!hasEOI && !hasEOIDocuments" class="d-flex flex-wrap gap-2">
         <v-btn
           @click="generateEOI"
           :loading="isGenerating"
           color="primary"
           variant="flat"
           prepend-icon="mdi-file-document-plus"
-          size="default"
+          :size="mobile ? 'default' : 'large'"
         >
           Generate EOI
         </v-btn>
-      </div>
         
-      <!-- Upload EOI Button -->
-      <div class="mb-4">
         <v-btn
           @click="showUploadDialog = true"
-          :variant="hasEOI ? 'tonal' : 'outlined'"
-          :color="hasEOI ? 'success' : 'primary'"
-          :prepend-icon="!mobile ? 'mdi-upload' : undefined"
+          variant="outlined"
+          color="primary"
+          prepend-icon="mdi-upload"
           :disabled="isUploading"
           :size="mobile ? 'default' : 'large'"
         >
-          {{ mobile ? 'Upload EOI' : (hasEOI ? 'Upload Signed EOI' : 'Upload EOI Document') }}
+          Upload EOI Document
+        </v-btn>
+      </div>
+      
+      <!-- Upload EOI Button - Only show if EOI exists or has documents -->
+      <div v-else-if="hasEOI || hasEOIDocuments" class="mb-4">
+        <v-btn
+          @click="showUploadDialog = true"
+          variant="tonal"
+          color="success"
+          prepend-icon="mdi-upload"
+          :disabled="isUploading"
+          :size="mobile ? 'default' : 'large'"
+        >
+          Upload Signed EOI
         </v-btn>
       </div>