updaed javascript to update on row delete

assets/javascripts/line_items.js

@@ -1,8 +1,19 @@
 function updateLineItemTotals() {
-
   let grandTotal = 0;
 
   document.querySelectorAll(".line-item").forEach(function(row){
+    
+    // 1. Look for the Rails _destroy hidden field
+    let destroyInput = row.querySelector("input[name*='[_destroy]']");
+    let isDestroyed = destroyInput && (destroyInput.value === "1" || destroyInput.value === "true");
+    
+    // 2. Safely check if the row is hidden via CSS, without relying on physical layout
+    let isHidden = row.style.display === "none" || window.getComputedStyle(row).display === "none";
+
+    // If it's deleted or explicitly hidden, skip calculating it
+    if (isDestroyed || isHidden) {
+      return; 
+    }
 
     let qty = parseFloat(row.querySelector(".qty-field")?.value || 0);
     let price = parseFloat(row.querySelector(".price-field")?.value || 0);
@@ -24,17 +35,24 @@ function updateLineItemTotals() {
   }
 }
 
+// Recalculate on input changes
 document.addEventListener("input", function(e){
-
   if(e.target.classList.contains("qty-field") ||
      e.target.classList.contains("price-field")){
-
     updateLineItemTotals();
-
   }
-
 });
 
+// Recalculate when the remove button is clicked
+document.addEventListener("click", function(e){
+  let removeBtn = e.target.closest("[data-nested-form-remove]");
+  
+  if(removeBtn){
+    setTimeout(updateLineItemTotals, 10);
+  }
+});
+
+// Initial calculation on load
 document.addEventListener("DOMContentLoaded", function(){
   updateLineItemTotals();
 });