Responsive updates

src/pages/dashboard/invoices/[id].astro

@@ -205,7 +205,8 @@ const isDraft = invoice.status === 'draft';
 
         <!-- Items Table -->
         <div class="mb-8">
-          <table class="w-full">
+          <div class="overflow-x-auto">
+            <table class="w-full min-w-[600px]">
             <thead>
               <tr class="border-b-2 border-base-200 text-left text-xs font-bold uppercase tracking-wider text-base-content/40">
                 <th class="py-3">Description</th>
@@ -242,7 +243,8 @@ const isDraft = invoice.status === 'draft';
                 </tr>
               )}
             </tbody>
-          </table>
+            </table>
+          </div>
         </div>
 
         <!-- Add Item Form (Only if Draft) -->

src/pages/dashboard/invoices/index.astro

@@ -109,7 +109,8 @@ const getStatusColor = (status: string) => {
 
   <div class="card bg-base-100 shadow-xl border border-base-200">
     <div class="card-body p-0">
-      <table class="table table-zebra">
+      <div class="overflow-x-auto">
+        <table class="table table-zebra">
           <thead>
             <tr class="bg-base-200/50">
               <th>Number</th>
@@ -210,6 +211,7 @@ const getStatusColor = (status: string) => {
             )}
           </tbody>
         </table>
+      </div>
     </div>
   </div>
 </DashboardLayout>