diff --git a/teressa-copeland-homes/src/app/portal/(protected)/documents/[docId]/_components/PdfViewerWrapper.tsx b/teressa-copeland-homes/src/app/portal/(protected)/documents/[docId]/_components/PdfViewerWrapper.tsx
new file mode 100644
index 0000000..ae241d0
--- /dev/null
+++ b/teressa-copeland-homes/src/app/portal/(protected)/documents/[docId]/_components/PdfViewerWrapper.tsx
@@ -0,0 +1,8 @@
+'use client';
+import dynamic from 'next/dynamic';
+
+const PdfViewer = dynamic(() => import('./PdfViewer').then(m => m.PdfViewer), { ssr: false });
+
+export function PdfViewerWrapper({ docId }: { docId: string }) {
+  return <PdfViewer docId={docId} />;
+}
diff --git a/teressa-copeland-homes/src/app/portal/(protected)/documents/[docId]/page.tsx b/teressa-copeland-homes/src/app/portal/(protected)/documents/[docId]/page.tsx
index f691366..e32ab10 100644
--- a/teressa-copeland-homes/src/app/portal/(protected)/documents/[docId]/page.tsx
+++ b/teressa-copeland-homes/src/app/portal/(protected)/documents/[docId]/page.tsx
@@ -4,7 +4,7 @@ import { db } from '@/lib/db';
 import { documents, clients } from '@/lib/db/schema';
 import { eq } from 'drizzle-orm';
 import Link from 'next/link';
-import { PdfViewer } from './_components/PdfViewer';
+import { PdfViewerWrapper } from './_components/PdfViewerWrapper';
 
 export default async function DocumentPage({
   params,
@@ -37,7 +37,7 @@ export default async function DocumentPage({
           <p className="text-sm text-gray-500">{doc.client?.name}</p>
         </div>
       </div>
-      <PdfViewer docId={docId} />
+      <PdfViewerWrapper docId={docId} />
     </div>
   );
 }