{% extends "layouts/base.twig" %}

{% block title %}{{ translations.invoice }}{% endblock %}

{% block page_heading %}
    <div class="page-heading">
        <h3>{{ translations.invoice }}</h3>
        <p class="text-subtitle text-muted">{{ translations.invoice_subtitle }}</p>
    </div>
{% endblock %}

{% block content %}

    <div class="card">
        <div class="card-header">
            <h4 class="card-title">{{ translations.credit_note_creator }}</h4>
            <p class="text-subtitle text-muted">{{ translations.credit_note_creator_subtitle }}</p>
        </div>
        <div class="card-body">
            <div class="row">
                <form method="POST" onsubmit="return false;">

                    <style>
                        .invoice-table td {
                            padding: 2px 4px !important;
                            vertical-align: top;
                            font-size: 0.85rem;
                        }
                        .invoice-section-title {
                            font-size: 0.9rem;
                            margin-bottom: 4px;
                            font-weight: 600;
                        }
                        .value-box {
                            background: #f8f9fa;
                            border: 1px solid #dcdcdc;
                            padding: 4px 6px;
                            border-radius: 4px;
                            font-size: 0.85rem;
                            min-height: 26px;
                        }
                        .compact-card {
                            padding: 6px !important;
                        }
                    </style>

                    <div class="row">

                        <div class="col-6">

                            <!-- SPRZEDAWCA -->
                            <div class="card border border-primary shadow-sm compact-card">
                                <div class="invoice-section-title text-center">{{ translations.consignor }}</div>

                                <table class="table table-borderless table-sm invoice-table mb-0">
                                    <tr>
                                        <td class="fw-bold">{{ translations.consignor_name }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getConsignorName() }}</div></td>
                                    </tr>
                                    <tr>
                                        <td class="fw-bold">{{ translations.tax_number }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getConsignorTaxNumber() }}</div></td>
                                    </tr>
                                    <tr>
                                        <td class="fw-bold">{{ translations.address_1 }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getConsignorAddress1() }}</div></td>
                                    </tr>
                                    <tr>
                                        <td class="fw-bold">{{ translations.address_2 }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getConsignorAddress2() }}</div></td>
                                    </tr>
                                    <tr>
                                        <td class="fw-bold">{{ translations.phone }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getConsignorPhone() }}</div></td>
                                    </tr>
                                    <tr>
                                        <td class="fw-bold">{{ translations.bank_number }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getConsignorBank() }}</div></td>
                                    </tr>
                                </table>
                            </div>

                            <!-- DOKUMENT -->
                            <div class="card border border-success shadow-sm compact-card">
                                <div class="invoice-section-title text-center">{{ translations.document }}</div>

                                <table class="table table-borderless table-sm invoice-table mb-0">
                                    <tr>
                                        <td class="fw-bold">{{ translations.document_number }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getDocumentNumber() }}</div></td>
                                    </tr>
                                    <tr>
                                        <td class="fw-bold">{{ translations.invoice_number }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getInvoiceNumber() }}</div></td>
                                    </tr>
                                    <tr>
                                        <td class="fw-bold">{{ translations.reference }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getReferenceComment() }}</div></td>
                                    </tr>
                                </table>
                            </div>
                        </div>


                        <div class="col-6">
                            <!-- NABYWCA -->
                            <div class="card border border-success shadow-sm compact-card">
                                <div class="invoice-section-title text-center">{{ translations.consignee }}</div>

                                <table class="table table-borderless table-sm invoice-table mb-0">
                                    <tr>
                                        <td class="fw-bold">{{ translations.consignee_name }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getConsigneeName() }}</div></td>
                                    </tr>
                                    <tr>
                                        <td class="fw-bold">{{ translations.tax_number }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getConsigneeTaxNumber() }}</div></td>
                                    </tr>
                                    <tr>
                                        <td class="fw-bold">{{ translations.address_1 }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getConsigneeAddress1() }}</div></td>
                                    </tr>
                                    <tr>
                                        <td class="fw-bold">{{ translations.address_2 }}:</td>
                                        <td><div class="value-box">{{ invoiceData.getInvoice().getConsigneeAddress2() }}</div></td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    </div>

                    {# ====== TABELA: CURRENT VALUES (z MODELU) ====== #}
                    <div class="row mt-4">
                        <hr>
                        <h4 class="text-center mb-3">
                            {{ translations.current_values }}
                        </h4>

                        <table class="table table-hover text-sm">
                            <thead>
                            <th style="width: 40%">{{ translations.product }}</th>
                            <th style="width: 12%">{{ translations.unit_gross_price }}</th>
                            <th style="width: 12%">{{ translations.quantity }}</th>
                            <th style="width: 12%">{{ translations.item_tax_perc }}</th>
                            <th style="width: 12%">{{ translations.item_discount_value }}</th>
                            <th style="width: 12%">{{ translations.total_gross_value_after_discount }}</th>
                            </thead>
                            <tbody>
                            {% for line in invoiceData.getLines() %}
                                {% set discount = (line.getUnitGrossPrice() * line.getQuantity()) - line.getGross() %}
                                <tr>
                                    <td>{{ line.getProductName() }}</td>
                                    <td>
                                        <input type="text" class="form-control" disabled
                                               value="{{ line.getUnitGrossPrice()|number_format(2, '.', '') }}">
                                    </td>
                                    <td>
                                        <input type="text" class="form-control" disabled
                                               value="{{ line.getQuantity()|number_format(3, '.', '') }}">
                                    </td>
                                    <td>
                                        <input type="text" class="form-control" disabled
                                               value="{{ line.getVatRate()|number_format(0) }}">
                                    </td>
                                    <td>
                                        <input type="text" class="form-control" disabled
                                               value="{{ discount|number_format(2, '.', '') }}">
                                    </td>
                                    <td>
                                        <input type="text" class="form-control" disabled
                                               value="{{ line.getGross()|number_format(2, '.', '') }}">
                                    </td>
                                </tr>
                            {% endfor %}
                            </tbody>
                        </table>
                    </div>

                    {# ====== TABELA: VALUES AFTER CREDIT NOTE (edytowalna) ====== #}
                    <div class="row mt-4">
                        <hr>
                        <h4 class="text-center mb-3">
                            {{ translations.values_after_credit_note }}
                        </h4>

                        <table class="table table-hover text-sm">
                            <thead>
                            <th style="width: 5%"></th>
                            <th style="width: 35%">{{ translations.product }}</th>
                            <th style="width: 12%">{{ translations.unit_gross_price }}</th>
                            <th style="width: 12%">{{ translations.quantity }}</th>
                            <th style="width: 12%">{{ translations.item_tax_perc }}</th>
                            <th style="width: 12%">{{ translations.item_discount_value }}</th>
                            <th style="width: 12%">{{ translations.total_gross_value_after_discount }}</th>
                            </thead>

                            <tbody id="after-corrections-body">
                            {% for line in invoiceData.getLines() %}
                                {% set discount = (line.getUnitGrossPrice() * line.getQuantity()) - line.getGross() %}
                                <tr id="product-row-{{ line.getGroupKey()|e('html_attr') }}"
                                    data-group-key="{{ line.getGroupKey()|e('html_attr') }}"
                                    data-product-id="{{ line.getIdProduct() }}"
                                    data-tax="{{ line.getVatRate() }}">

                                    <td>
                                        <button class="btn btn-danger btn-sm remove-row-btn" type="button"
                                                data-remove-group="{{ line.getGroupKey()|e('html_attr') }}">
                                            <i class="bi bi-trash"></i>
                                        </button>
                                    </td>

                                    <td>{{ line.getProductName() }}</td>

                                    <td>
                                        <input class="form-control invoice-input"
                                               data-group-key="{{ line.getGroupKey()|e('html_attr') }}"
                                               data-field="unit_price"
                                               value="{{ line.getUnitGrossPrice()|number_format(2, '.', '') }}">
                                    </td>

                                    <td>
                                        <input class="form-control invoice-input"
                                               data-group-key="{{ line.getGroupKey()|e('html_attr') }}"
                                               data-field="quantity"
                                               value="{{ line.getQuantity()|number_format(3, '.', '') }}">
                                    </td>

                                    <td>
                                        <input class="form-control invoice-input"
                                               data-group-key="{{ line.getGroupKey()|e('html_attr') }}"
                                               data-field="tax" disabled
                                               value="{{ line.getVatRate()|number_format(0) }}">
                                    </td>

                                    <td>
                                        <input class="form-control invoice-input"
                                               data-group-key="{{ line.getGroupKey()|e('html_attr') }}"
                                               data-field="discount"
                                               value="{{ discount|number_format(2, '.', '') }}">
                                    </td>

                                    <td>
                                        <input class="form-control"
                                               id="total-{{ line.getGroupKey()|e('html_attr') }}"
                                               disabled
                                               value="{{ line.getGross()|number_format(2, '.', '') }}">
                                    </td>
                                </tr>
                            {% endfor %}
                            </tbody>

                            <tbody>
                            <tr>
                                <td colspan="2">
                                    <select class="form-select choices" id="productToAddToInvoice">
                                        {% for product in products %}
                                            <option value="{{ product.getId() }}">{{ product.getName() }}</option>
                                        {% endfor %}
                                    </select>
                                </td>
                                <td colspan="5">
                                    <button class="btn btn-success btn-sm" type="button" onclick="addProductToInvoice()">
                                        {{ translations.add_product_to_invoice }}
                                    </button>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>

                    {# ====== REASON + SUMMARY ====== #}
                    <div class="row mt-3">
                        <div class="col-6">
                            <h5>{{ translations.correction_reason }}</h5>
                            <textarea class="form-control" rows="3" name="correction_reason"></textarea>
                        </div>

                        <div class="col-6">
                            <h5>{{ translations.summary_after_corrections }}</h5>

                            <table class="table">
                                <tr>
                                    <td>{{ translations.total_before_corrections }}</td>
                                    <td><strong id="total-before">0.00</strong></td>
                                </tr>

                                <tr>
                                    <td>{{ translations.total_after_corrections }}</td>
                                    <td><strong id="total-after">0.00</strong></td>
                                </tr>

                                <tr>
                                    <td>{{ translations.difference }}</td>
                                    <td><strong id="difference" class="text-primary">0.00</strong></td>
                                </tr>
                            </table>
                        </div>
                    </div>

                    <div class="row mt-2">
                        <div class="col-4">
                            <button type="button" class="btn btn-warning" onclick="saveCorrection(this)">
                                {{ translations.save_correction }}
                            </button>
                        </div>
                    </div>

                </form>
            </div>
        </div>
    </div>

{% endblock %}

{% block scripts %}
    <script>
        // ========== DATA ==========
        // invoiceData jest modelem -> json_encode da strukturę jak z API (invoice/lines/vat_summary)
        const invoiceData = {{ invoiceData|json_encode|raw }};
        const products = {{ products|json_encode|raw }};

        const tableBody = document.querySelector('#after-corrections-body');

        // Original lines map by group_key (snapshot from API)
        const originalLines = invoiceData.lines || [];
        const originalMap = {};
        originalLines.forEach(l => {
            originalMap[l.group_key] = normalizeLineFromApi(l);
        });

        // Total before = sum gross from API lines
        const totalBefore = sumOriginalGross();
        document.getElementById('total-before').innerText = money(totalBefore);

        // ========== HELPERS ==========
        function num(v, decimals = null) {
            if (v === null || v === undefined) return 0;
            const s = String(v).replace(',', '.').trim();
            const n = parseFloat(s);
            if (isNaN(n)) return 0;
            if (decimals === null) return n;
            return parseFloat(n.toFixed(decimals));
        }

        function money(v) { return num(v, 2).toFixed(2); }
        function qty3(v) { return num(v, 3).toFixed(3); }

        function clamp(v, min, max) {
            return Math.min(Math.max(v, min), max);
        }

        // group_key format: "id_product|12.90|6"
        function buildGroupKey(idProduct, unitGross, taxPerc) {
            const u = num(unitGross, 2).toFixed(2);
            const t = parseInt(taxPerc, 10);
            return `${idProduct}|${u}|${t}`;
        }

        function parseGroupKey(groupKey) {
            const parts = String(groupKey).split('|');
            return {
                id_product: parseInt(parts[0], 10) || 0,
                unit_gross_price: num(parts[1], 2),
                item_tax_perc: parseInt(parts[2], 10) || 0,
            };
        }

        // discount = unit*qty - gross
        function normalizeLineFromApi(l) {
            const unit = num(l.unit_gross_price, 2);
            const qty = num(l.quantity, 3);
            const gross = num(l.gross, 2);
            const discount = clamp(num(unit * qty - gross, 2), 0, unit * qty);

            return {
                group_key: l.group_key,
                id_product: parseInt(l.id_product, 10),
                product_name: l.product_name,
                unit_gross_price: unit,
                quantity: qty,
                item_tax_perc: parseInt(l.vat_rate, 10),
                item_discount_value: discount,
                total_gross_value_after_discount: gross,
            };
        }

        function sumOriginalGross() {
            let sum = 0;
            originalLines.forEach(l => sum += num(l.gross, 2));
            return num(sum, 2);
        }

        function computeGross(unit, qty, discount) {
            const grossBefore = num(unit, 2) * num(qty, 3);
            const disc = clamp(num(discount, 2), 0, grossBefore);
            return clamp(num(grossBefore - disc, 2), 0, grossBefore);
        }

        // ========== RECALC ==========
        function recalcRow(groupKey) {
            const row = document.querySelector(`#after-corrections-body tr[data-group-key="${cssEscape(groupKey)}"]`);
            if (!row) return;

            const unitInput = row.querySelector('[data-field="unit_price"]');
            const qtyInput = row.querySelector('[data-field="quantity"]');
            const discountInput = row.querySelector('[data-field="discount"]');

            // Pobierz wartości z zabezpieczeniem przed pustymi polami
            let unitValue = unitInput.value.trim();
            let qtyValue = qtyInput.value.trim();
            let discountValue = discountInput.value.trim();

            // Jeśli pole jest puste, ustaw 0
            if (unitValue === '' || unitValue === '-' || unitValue === '.') unitValue = '0';
            if (qtyValue === '' || qtyValue === '-' || qtyValue === '.') qtyValue = '0';
            if (discountValue === '' || discountValue === '-' || discountValue === '.') discountValue = '0';

            const unit = num(unitValue, 2);
            const qty = clamp(num(qtyValue, 3), 0, 999999);
            const maxDiscount = unit * qty;
            const discount = clamp(num(discountValue, 2), 0, maxDiscount);

            // Formatuj i ustaw wartości
            unitInput.value = money(unit);
            qtyInput.value = qty3(qty);
            discountInput.value = money(discount);

            // Zapisz jako ostatnie poprawne wartości
            unitInput.dataset.lastValidValue = money(unit);
            qtyInput.dataset.lastValidValue = qty3(qty);
            discountInput.dataset.lastValidValue = money(discount);

            const total = computeGross(unit, qty, discount);

            const totalInput = document.getElementById(`total-${groupKey}`);
            if (totalInput) totalInput.value = money(total);

            recalcInvoiceTotals();
        }

        function recalcInvoiceTotals() {
            let newSum = 0;

            document.querySelectorAll('#after-corrections-body tr').forEach(row => {
                const groupKey = row.dataset.groupKey;
                const totalField = document.getElementById(`total-${groupKey}`);
                const newTotal = totalField ? num(totalField.value, 2) : 0;
                newSum += newTotal;
            });

            newSum = num(newSum, 2);

            document.getElementById('total-after').innerText = money(newSum);

            const diff = num(newSum - totalBefore, 2);
            const diffElem = document.getElementById('difference');

            diffElem.innerText = money(diff);
            diffElem.classList.remove('text-success', 'text-danger', 'text-primary');

            if (diff > 0) diffElem.classList.add('text-success');
            else if (diff < 0) diffElem.classList.add('text-danger');
            else diffElem.classList.add('text-primary');
        }

        // ========== GROUP KEY CHANGE ==========
        function updateRowGroupKey(row, newGroupKey) {
            const oldGroupKey = row.dataset.groupKey;
            if (oldGroupKey === newGroupKey) return true;

            if (document.getElementById(`product-row-${newGroupKey}`)) {
                Swal.fire({
                    icon: 'warning',
                    title: 'Duplikat pozycji',
                    text: 'Pozycja z takim produktem, ceną i VAT już istnieje. Zmień wartości albo usuń duplikat.',
                    confirmButtonText: 'OK'
                });
                const parsed = parseGroupKey(oldGroupKey);
                row.querySelector('[data-field="unit_price"]').value = money(parsed.unit_gross_price);
                return false;
            }

            row.id = `product-row-${newGroupKey}`;
            row.dataset.groupKey = newGroupKey;

            const btn = row.querySelector('.remove-row-btn');
            if (btn) btn.dataset.removeGroup = newGroupKey;

            row.querySelectorAll('input[data-group-key]').forEach(inp => {
                inp.dataset.groupKey = newGroupKey;
            });

            const totalInput = row.querySelector('input[id^="total-"]');
            if (totalInput) totalInput.id = `total-${newGroupKey}`;

            return true;
        }

        function cssEscape(s) {
            return String(s).replace(/(["\\])/g, '\\$1');
        }

        // ========== LISTENERS ==========
        // Obsługa focusu - zapamiętaj ostatnią poprawną wartość
        document.addEventListener('focus', function (e) {
            if (!e.target.classList.contains('invoice-input')) return;
            e.target.dataset.lastValidValue = e.target.value;
        }, true);

        // Obsługa kliknięcia - zaznacz całą zawartość dla łatwej edycji
        document.addEventListener('click', function (e) {
            if (!e.target.classList.contains('invoice-input')) return;
            if (!e.target.disabled) {
                e.target.select();
            }
        });

        // Przeliczaj tylko po zakończeniu edycji (blur) lub zmianie (change)
        function handleInputChange(e) {
            if (!e.target.classList.contains('invoice-input')) return;

            const field = e.target.dataset.field;
            const groupKey = e.target.dataset.groupKey;
            const inputValue = e.target.value.trim();

            // Jeśli pole jest puste, przywróć ostatnią poprawną wartość
            if (inputValue === '' || inputValue === '-' || inputValue === '.') {
                const lastValid = e.target.dataset.lastValidValue || '0';
                e.target.value = lastValid;
                return;
            }

            // Sprawdź czy wartość jest liczbą
            const parsedValue = num(inputValue);
            if (isNaN(parsedValue)) {
                const lastValid = e.target.dataset.lastValidValue || '0';
                e.target.value = lastValid;
                Swal.fire({
                    icon: 'warning',
                    title: 'Nieprawidłowa wartość',
                    text: 'Wprowadź prawidłową liczbę.',
                    confirmButtonText: 'OK',
                    timer: 2000
                });
                return;
            }

            // Walidacja dla ilości (nie może być ujemna)
            if (field === 'quantity') {
                if (parsedValue < 0) {
                    e.target.value = e.target.dataset.lastValidValue || '0.000';
                    Swal.fire({
                        icon: 'warning',
                        title: 'Nieprawidłowa ilość',
                        text: 'Ilość nie może być ujemna.',
                        confirmButtonText: 'OK',
                        timer: 2000
                    });
                    return;
                }
                recalcRow(groupKey);
                return;
            }

            // Walidacja dla rabatu (nie może być ujemny)
            if (field === 'discount') {
                if (parsedValue < 0) {
                    e.target.value = e.target.dataset.lastValidValue || '0.00';
                    Swal.fire({
                        icon: 'warning',
                        title: 'Nieprawidłowy rabat',
                        text: 'Rabat nie może być ujemny.',
                        confirmButtonText: 'OK',
                        timer: 2000
                    });
                    return;
                }
                recalcRow(groupKey);
                return;
            }

            // Walidacja dla ceny jednostkowej
            if (field === 'unit_price') {
                if (parsedValue < 0) {
                    e.target.value = e.target.dataset.lastValidValue || '0.00';
                    Swal.fire({
                        icon: 'warning',
                        title: 'Nieprawidłowa cena',
                        text: 'Cena nie może być ujemna.',
                        confirmButtonText: 'OK',
                        timer: 2000
                    });
                    return;
                }

                const row = e.target.closest('tr');
                if (!row) return;

                const idProduct = parseInt(row.dataset.productId, 10) || parseGroupKey(groupKey).id_product;
                const tax = parseInt(row.dataset.tax, 10) || parseGroupKey(groupKey).item_tax_perc;
                const newUnit = num(e.target.value, 2);

                const newKey = buildGroupKey(idProduct, newUnit, tax);
                const ok = updateRowGroupKey(row, newKey);
                if (ok) {
                    recalcRow(newKey);
                } else {
                    // Jeśli nie udało się zmienić klucza (duplikat), przywróć starą wartość
                    e.target.value = e.target.dataset.lastValidValue || '0.00';
                }
            }
        }

        // Dodaj listenery dla blur i change
        document.addEventListener('blur', handleInputChange, true);
        document.addEventListener('change', handleInputChange);

        tableBody.addEventListener('click', function(e) {
            const btn = e.target.closest('.remove-row-btn');
            if (!btn) return;
            removeProductFromInvoice(btn.dataset.removeGroup);
        });

        // ========== DELETE / ADD ==========
        function removeProductFromInvoice(groupKey) {
            const row = document.getElementById(`product-row-${groupKey}`);
            if (row) {
                row.remove();
                recalcInvoiceTotals();
            }
        }

        function addProductToInvoice() {
            const select = document.getElementById('productToAddToInvoice');
            const productId = parseInt(select.value, 10);

            const product = products.find(p => parseInt(p.id, 10) === productId);
            if (!product) {
                alert("Nie znaleziono produktu.");
                return;
            }

            const unitPrice = num(product.suggested_sale_price ?? 0, 2);
            const tax = parseInt(product.tax_val_perc ?? 6, 10);

            const groupKey = buildGroupKey(productId, unitPrice, tax);

            if (document.getElementById(`product-row-${groupKey}`)) {
                Swal.fire({
                    icon: 'info',
                    title: 'Duplikat',
                    text: 'Ten produkt (w tej cenie i VAT) już istnieje.',
                    confirmButtonText: 'OK'
                });
                return;
            }

            const quantity = 1;
            const discount = 0;
            const total = computeGross(unitPrice, quantity, discount);

            const newRow = document.createElement('tr');
            newRow.id = `product-row-${groupKey}`;
            newRow.dataset.groupKey = groupKey;
            newRow.dataset.productId = String(productId);
            newRow.dataset.tax = String(tax);

            newRow.innerHTML = `
            <td>
                <button class="btn btn-danger btn-sm remove-row-btn" type="button" data-remove-group="${groupKey}">
                    <i class="bi bi-trash"></i>
                </button>
            </td>

            <td>${product.name}</td>

            <td>
                <input class="form-control invoice-input"
                       data-group-key="${groupKey}"
                       data-field="unit_price"
                       value="${money(unitPrice)}">
            </td>

            <td>
                <input class="form-control invoice-input"
                       data-group-key="${groupKey}"
                       data-field="quantity"
                       value="${qty3(quantity)}">
            </td>

            <td>
                <input class="form-control invoice-input"
                       data-group-key="${groupKey}"
                       data-field="tax"
                       value="${tax}" disabled>
            </td>

            <td>
                <input class="form-control invoice-input"
                       data-group-key="${groupKey}"
                       data-field="discount"
                       value="${money(discount)}">
            </td>

            <td>
                <input class="form-control"
                       id="total-${groupKey}"
                       disabled
                       value="${money(total)}">
            </td>
        `;

            tableBody.appendChild(newRow);
            recalcRow(groupKey);
        }

        // ========== COLLECT DATA ==========
        function collectCorrectionData() {
            const invoiceId = parseInt(invoiceData.invoice.id, 10);
            const reason = document.querySelector('textarea[name="correction_reason"]').value.trim();

            const desiredLines = [];

            document.querySelectorAll('#after-corrections-body tr').forEach(row => {
                const groupKey = row.dataset.groupKey;

                const idProduct = parseInt(row.dataset.productId, 10) || parseGroupKey(groupKey).id_product;
                const tax = parseInt(row.dataset.tax, 10) || parseGroupKey(groupKey).item_tax_perc;

                const unit = num(row.querySelector('[data-field="unit_price"]').value, 2);
                const qty = clamp(num(row.querySelector('[data-field="quantity"]').value, 3), 0, 999999);
                const discount = clamp(num(row.querySelector('[data-field="discount"]').value, 2), 0, unit * qty);

                const gross = computeGross(unit, qty, discount);

                desiredLines.push({
                    group_key: groupKey,
                    id_product: idProduct,
                    product_name: row.children[1].innerText,
                    unit_gross_price: num(unit, 2),
                    quantity: num(qty, 3),
                    item_tax_perc: tax,
                    item_discount_value: num(discount, 2),
                    total_gross_value_after_discount: num(gross, 2),
                });
            });

            return {
                id_invoice: invoiceId,
                correction_reason: reason,
                desired_lines: desiredLines
            };
        }

        function hasAnyChanges(payload) {
            const desired = payload.desired_lines || [];
            const desiredMap = {};
            desired.forEach(l => desiredMap[l.group_key] = l);

            for (const gk in originalMap) {
                if (!desiredMap[gk]) return true;
            }
            for (const gk in desiredMap) {
                if (!originalMap[gk]) return true;
            }

            for (const gk in desiredMap) {
                if (!originalMap[gk]) continue;

                const o = originalMap[gk];
                const n = desiredMap[gk];

                if (Math.abs(num(o.quantity, 3) - num(n.quantity, 3)) > 0.0005) return true;
                if (Math.abs(num(o.unit_gross_price, 2) - num(n.unit_gross_price, 2)) > 0.005) return true;
                if (Math.abs(num(o.item_discount_value, 2) - num(n.item_discount_value, 2)) > 0.005) return true;
                if (parseInt(o.item_tax_perc, 10) !== parseInt(n.item_tax_perc, 10)) return true;
                if (Math.abs(num(o.total_gross_value_after_discount, 2) - num(n.total_gross_value_after_discount, 2)) > 0.005) return true;
            }

            return false;
        }

        async function saveCorrection(btn) {
            const payload = collectCorrectionData();

            if (!hasAnyChanges(payload)) {
                Swal.fire({
                    icon: 'info',
                    title: 'Brak zmian',
                    text: 'Nie wprowadzono żadnych różnic względem aktualnego stanu faktury. Nie można utworzyć pustej korekty.',
                    confirmButtonText: 'OK'
                });
                return;
            }

            // btn.disabled = true;
            const prevHtml = btn.innerHTML;
            btn.innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> ' + btn.innerText;

            api(`/ajax/invoices/${payload.id_invoice}/corrections`, {
                method: 'POST',
                data: payload
            })
                .then(async function (res) {
                    if (res.ok) {
                        await Swal.fire({
                            icon: 'success',
                            title: '{{ translations.correction_saved }}',
                            text: '{{ translations.correction_saved_successfully }}',
                            confirmButtonText: '{{ translations.ok }}'
                        });

                        await downloadPdf(
                            `/ajax/invoices/${payload.id_invoice}/pdf`,
                            {},
                            `invoice.pdf`
                        );

                        location.href = `/panel/invoices/generated`;
                        return;
                    }

                    btn.disabled = false;
                    btn.innerHTML = prevHtml;

                    Swal.fire({
                        icon: 'error',
                        title: '{{ translations.error }}',
                        text: res.message || '{{ translations.correction_save_error }}',
                        confirmButtonText: '{{ translations.ok }}'
                    });
                })
                .catch(err => {
                    btn.disabled = false;
                    btn.innerHTML = prevHtml;
                    alert("Błąd połączenia: " + err);
                });
        }

        // INIT
        recalcInvoiceTotals();
    </script>
{% endblock %}