<script>
    document.addEventListener("DOMContentLoaded", function() {
        let spareRowCount = 0;

        function calculateSparePartsNetAmount(row) {
            let amount = parseFloat(row.querySelector(".customSparePartsAmount").value.trim()) || 0;
            let quantity = parseFloat(row.querySelector(".customSparePartsQuantity").value.trim()) || 1;
            let discount = parseFloat(row.querySelector(".customSparePartsDiscount").value.trim()) || 0;
            discount = Math.min(100, Math.max(0, discount));

            let totalAmount = amount * quantity;
            let netAmount = totalAmount - (totalAmount * discount / 100);
            row.querySelector(".customSparePartsNetAmount").value = netAmount.toFixed(2);
            updateTotalCustomSpareNetAmount();
        }

        function updateTotalCustomSpareNetAmount() {
            let totalCustomSpare = 0;
            document.querySelectorAll(".customSparePartsNetAmount").forEach(input => {
                totalCustomSpare += parseFloat(input.value) || 0;
            });
            document.getElementById("totalCustomSpare").value = totalCustomSpare.toFixed(2);
            updateFinalBillTotal();
        }

        function addEventListenersToSparePartsRow(row) {
            row.querySelector(".customSparePartsAmount").addEventListener("input", function() {
                calculateSparePartsNetAmount(row);
            });
            row.querySelector(".customSparePartsQuantity").addEventListener("input", function() {
                calculateSparePartsNetAmount(row);
            });
            row.querySelector(".customSparePartsDiscount").addEventListener("input", function() {
                calculateSparePartsNetAmount(row);
            });
            row.querySelector(".deleteSparePartsRow").addEventListener("click", function() {
                if (document.querySelectorAll(".sparePartsRow").length > 1) {
                    row.remove();
                    spareRowCount--;
                    updateTotalCustomSpareNetAmount();
                } else {
                    alert("At least one row is required!");
                }
            });
        }

        // Ensure this only runs AFTER the DOM is fully loaded
        document.addEventListener("DOMContentLoaded", function() {
            // Optional safeguard
            if (!window.sparePartsHandlerAttached) {
                window.sparePartsHandlerAttached = true;

                document.getElementById("addSparePartsRow").addEventListener("click", function() {
                    if (spareRowCount < 100) {
                        let container = document.getElementById("sparePartsContainer");
                        let originalRow = container.querySelector(".sparePartsRow");

                        if (originalRow) {
                            let newRow = originalRow.cloneNode(true);
                            newRow.querySelectorAll("input").forEach(input => {
                                input.value = input.type === "text" ? "" : "0";
                            });

                            container.appendChild(newRow);
                            addEventListenersToSparePartsRow(newRow);

                            spareRowCount++; // Increment row count when a new row is added
                        }
                    } else {
                        alert("You can add a maximum of 100 rows.");
                    }
                });
            }
        });


        function updateFinalBillTotal() {
            let totalCustomSpare = parseFloat(document.getElementById("totalCustomSpare").value) || 0;
            let totalSpareAjax = parseFloat(document.getElementById("totalSpareAjax").value) || 0;
            let finalTotal = totalCustomSpare + totalSpareAjax;
            document.querySelector("input[name='billAmount']").value = finalTotal.toFixed(2);
        }

        let initialRow = document.querySelector(".sparePartsRow");
        if (initialRow) addEventListenersToSparePartsRow(initialRow);
    });
</script>