From df50c3868d836f37fc5b71984290e41a4555017f Mon Sep 17 00:00:00 2001
From: lorentz <lorentz@wulfconsulting.com>
Date: Mon, 23 Mar 2026 11:15:52 -0400
Subject: [PATCH] fix: widen modal to 90vw/max-4xl, add break-words to prevent
 horizontal scroll

---
 components/quotes/ticket-detail-modal.tsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/components/quotes/ticket-detail-modal.tsx b/components/quotes/ticket-detail-modal.tsx
index 15f8016..e83f875 100644
--- a/components/quotes/ticket-detail-modal.tsx
+++ b/components/quotes/ticket-detail-modal.tsx
@@ -179,7 +179,7 @@ export function TicketDetailModal({ ticketNumber, open, onOpenChange }: TicketDe
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-w-2xl max-h-[85vh] overflow-y-auto">
+      <DialogContent className="max-w-4xl w-[90vw] max-h-[85vh] overflow-y-auto overflow-x-hidden">
         <DialogHeader className="pb-0">
           <DialogTitle className="flex items-center gap-2 text-base">
             <TicketIcon className="h-4 w-4 shrink-0" />
@@ -250,7 +250,7 @@ export function TicketDetailModal({ ticketNumber, open, onOpenChange }: TicketDe
             {ticket.description && (
               <div>
                 <p className="text-xs font-semibold text-muted-foreground uppercase tracking-wide mb-1">Description</p>
-                <div className="p-3 bg-muted rounded-lg whitespace-pre-wrap text-sm">
+                <div className="p-3 bg-muted rounded-lg whitespace-pre-wrap break-words text-sm">
                   {ticket.description}
                 </div>
               </div>
@@ -260,7 +260,7 @@ export function TicketDetailModal({ ticketNumber, open, onOpenChange }: TicketDe
             {ticket.resolution && (
               <div>
                 <p className="text-xs font-semibold text-muted-foreground uppercase tracking-wide mb-1">Resolution</p>
-                <div className="p-3 bg-muted rounded-lg whitespace-pre-wrap text-sm">
+                <div className="p-3 bg-muted rounded-lg whitespace-pre-wrap break-words text-sm">
                   {ticket.resolution}
                 </div>
               </div>
@@ -349,7 +349,7 @@ export function TicketDetailModal({ ticketNumber, open, onOpenChange }: TicketDe
                                   </div>
                                 </div>
                                 {e.summaryNotes && (
-                                  <p className="text-xs text-muted-foreground whitespace-pre-wrap">{e.summaryNotes}</p>
+                                  <p className="text-xs text-muted-foreground whitespace-pre-wrap break-words">{e.summaryNotes}</p>
                                 )}
                               </div>
                             </div>
@@ -377,7 +377,7 @@ export function TicketDetailModal({ ticketNumber, open, onOpenChange }: TicketDe
                               </div>
                               {n.title && <p className="text-xs font-medium text-muted-foreground mb-0.5">{n.title}</p>}
                               {n.description && (
-                                <p className="text-xs whitespace-pre-wrap">{n.description}</p>
+                                <p className="text-xs whitespace-pre-wrap break-words">{n.description}</p>
                               )}
                             </div>
                           </div>