fix for Downpayment label + fix for invoice modal

public/index.html

@@ -437,7 +437,10 @@
                             + Add Item
                         </button>
                     </div>
-                    <div id="invoice-items"></div>
+                    <div id="invoice-items" 
+                        class="overflow-y-auto pr-1"
+                        style="max-height: 40vh; min-height: 80px;">
+                    </div>
                 </div>
                 
                 <div class="bg-gray-50 p-4 rounded-lg">

src/services/pdf-service.js

@@ -118,18 +118,27 @@ function renderInvoiceItems(items, invoice = null) {
             <td class="total-amount" style="font-size: 16px;">$${formatMoney(total)}</td>
         </tr>`;
     
+    // Add downpayment/balance if partial
     // Add downpayment/balance if partial
     if (amountPaid > 0) {
+        const isFullyPaid = balanceDue <= 0.01; // allow for rounding
+        const paymentLabel = isFullyPaid ? 'Payment:' : 'Downpayment:';
+        
         itemsHTML += `
         <tr class="footer-row">
-            <td colspan="3" class="total-label" style="color: #059669;">Downpayment:</td>
+            <td colspan="3" class="total-label" style="color: #059669;">${paymentLabel}</td>
             <td class="total-amount" style="color: #059669;">-$${formatMoney(amountPaid)}</td>
-        </tr>
+        </tr>`;
+
+        // Only show BALANCE DUE row if there's actually a remaining balance
+        if (!isFullyPaid) {
+            itemsHTML += `
         <tr class="footer-row">
             <td colspan="3" class="total-label" style="font-weight: bold; font-size: 16px; border-top: 2px solid #333; padding-top: 8px;">BALANCE DUE:</td>
             <td class="total-amount" style="font-weight: bold; font-size: 16px; border-top: 2px solid #333; padding-top: 8px;">$${formatMoney(balanceDue)}</td>
         </tr>`;
         }
+    }
     
     // Thank you message
     itemsHTML += `