Replace embed with iframe for better PDF preview support

Switch from embed to iframe element for displaying PDFs to improve
cross-browser compatibility and mobile experience. Add responsive
styling with proper positioning and iOS smooth scrolling support.
Adjust preview container heights for mobile devices.

components/FilePreviewModal.vue

@@ -50,11 +50,12 @@
         
         <!-- PDF Preview -->
         <div v-else-if="isPdf" class="pdf-preview-container">
-          <embed
+          <iframe
             :src="previewUrl"
-            type="application/pdf"
             width="100%"
             height="100%"
+            frameborder="0"
+            class="pdf-iframe"
           />
         </div>
       </v-card-text>
@@ -255,5 +256,28 @@ onUnmounted(() => {
   width: 100%;
   height: 70vh;
   overflow: hidden;
+  position: relative;
+}
+
+.pdf-iframe {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  -webkit-overflow-scrolling: touch; /* Enable smooth scrolling on iOS */
+  overflow: auto;
+}
+
+/* Mobile-specific adjustments */
+@media (max-width: 600px) {
+  .pdf-preview-container {
+    height: 60vh; /* Slightly smaller on mobile for better UX */
+  }
+  
+  .image-preview-container {
+    min-height: 300px;
+    max-height: 60vh;
+  }
 }
 </style>