@extends('layout.app')
@section('title', 'Create Purchase Voucher')
@push('header_script')
    <style>
        .width-85 {
            margin-top: 10px;
            width: 100px !important;
            margin-right: 15px !important;
        }

        .d-flex {
            margin-bottom: 3px;
        }

        .shopPayment {
            display: none !important;
        }

        .innerTableSpacing {
            padding: 10px 20px;
            background: #f8f9fa;
            border-radius: 6px;
        }

        /* Redesign UI styles matching Freight Billing UI */
        .form-section-title {
            font-size: 0.95rem;
            font-weight: 600;
            color: #495057;
            margin-bottom: 1rem;
            padding-bottom: 0.5rem;
            border-bottom: 1px solid #e9ecef;
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .form-section-title i {
            color: #0d6efd;
        }

        .bg-light-input {
            background-color: #f8f9fa;
        }

        .total-card {
            background: #f0f4f8;
            border: 1px dashed #cbd5e1;
        }

        .party-card {
            height: 100%;
            border: 1px solid #e2e8f0;
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
        }

        .party-card .card-header {
            background-color: #f2f2f9;
            padding: 0.6rem 1rem;
        }

        .party-card .card-body {
            padding: 1rem;
            background-color: #fff;
        }

        .party-info-row {
            display: flex;
            margin-bottom: 0.5rem;
            font-size: 0.9rem;
            border-bottom: 1px dashed #f1f5f9;
            padding-bottom: 0.5rem;
        }

        .party-info-row:last-child {
            border-bottom: none;
            margin-bottom: 0;
            padding-bottom: 0;
        }

        .party-info-row label {
            font-weight: 600;
            color: #64748b;
            width: 130px;
            flex-shrink: 0;
        }

        .party-info-row span {
            color: #334155;
            font-weight: 500;
            flex-grow: 1;
        }

        .goods-table th {
            background-color: #f8fafc;
            font-size: 0.8rem;
            font-weight: 700;
            text-transform: uppercase;
            color: #475569;
            padding: 0.6rem;
            border-bottom: 2px solid #e2e8f0;
        }

        .goods-table td {
            vertical-align: middle;
            font-size: 0.85rem;
            padding: 0.5rem;
        }

        .goods-table input.form-control {
            padding: 0.25rem 0.5rem;
            font-size: 0.85rem;
            border-color: #e2e8f0;
        }

        .goods-table input.form-control:focus {
            border-color: #0d6efd;
            box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.1);
        }

        .readonly-input {
            background-color: #f1f5f9 !important;
            cursor: not-allowed;
            color: #64748b;
        }
    </style>
    <link rel="stylesheet" href="{{ asset('theme/assets/vendor/daterange/daterange.css') }}">
@endpush
@section('content')
    <div class="app-hero-header d-flex align-items-center">
        <ol class="breadcrumb">
            <li class="breadcrumb-item">
                <a href="javascript:void(0);">Create Purchase Voucher</a>
            </li>
        </ol>
        <div class="ms-auto d-lg-flex flex-row">
            <div class="d-flex flex-row gap-1 day-sorting">
                <a href="{{ route('purchase-voucher.index') }}" class="btn btn-sm btn-primary"><i
                        class="ri-arrow-left-circle-fill"></i> Back</a>
            </div>
        </div>
    </div>
        <div class="app-body">
        {!! Form::open([
            'route' => ['purchase-voucher.store'],
            'onsubmit' => 'BtnSubmit.disabled = true',
            'class' => 'needs-validation',
            'method' => 'post',
            'autocomplete' => 'off',
            'files' => true,
        ]) !!}
        <input type="hidden" name="redirect_to" value="{{ request()->query('redirect_to') }}">

        <div class="row gx-3">
            {{-- ========================================
                    SECTION 1: VOUCHER DETAILS
                    ======================================== --}}
            <div class="col-12">
                <div class="card mb-3">
                    <div class="card-body">
                        <div class="form-section-title">
                            <i class="ri-file-list-3-line"></i> Voucher Details
                        </div>

                        <div class="row g-3">
                            <div class="col-md-3 col-12">
                                <label class="form-label" for="voucher_no">Voucher No. <span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control fw-bold readonly-input" id="voucher_no" name="voucher_no"
                                    required value="{{ $voucherNo }}"
                                    readonly>
                                <div class="text-danger">{{ $errors->first('voucher_no') }}</div>
                            </div>

                            <div class="col-md-3 col-12">
                                <label class="form-label" for="voucher_date">Voucher Date <span
                                        class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text">
                                        <i class="ri-calendar-todo-line"></i>
                                    </span>
                                    <input type="text" id="voucher_date" class="form-control datepicker" name="voucher_date" required
                                        min="{{ date('Y-m-d', strtotime($companyDetails->year_from)) }}"
                                        value="{{ date('d-m-Y') }}">
                                </div>
                                <div class="text-danger">{{ $errors->first('voucher_date') }}</div>
                            </div>

                            <div class="col-md-3 col-12">
                                <label class="form-label" for="supplier_invoice_no">Supplier Invoice No.</label>
                                <input type="text" class="form-control bg-light-input" id="supplier_invoice_no"
                                    name="supplier_invoice_no" value="{{ old('supplier_invoice_no') }}">
                                <div class="text-danger">{{ $errors->first('supplier_invoice_no') }} </div>
                            </div>

                            <div class="col-md-3 col-12">
                                <label class="form-label" for="supplier_invoice_date">Supplier Invoice Date</label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="ri-calendar-todo-line"></i></span>
                                    <input type="text" id="supplier_invoice_date" class="form-control datepicker"
                                        name="supplier_invoice_date" value="{{ old('supplier_invoice_date') }}">
                                </div>
                                <div class="text-danger">{{ $errors->first('supplier_invoice_date') }}</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="row gx-3">
            {{-- ========================================
                    PARTY DETAILS CARD
                    ======================================== --}}
            <div class="col-md-6">
                <div class="card party-card mb-3">
                    <div class="card-header">
                        <small class="fw-bold text-uppercase"><i class="ri-user-star-line"></i> Party Details</small>
                    </div>
                    <div class="card-body">
                        <div class="party-info-row">
                            <label>Party Name</label>
                            <span class="fw-bold" id="disp_party_name">-</span>
                        </div>
                        <div class="party-info-row">
                            <label>GST No</label>
                            <span class="fw-bold" id="disp_gst_no">-</span>
                        </div>
                        <div class="party-info-row">
                            <label>Mobile</label>
                            <span id="disp_mobile_no">-</span>
                        </div>
                        <div class="party-info-row">
                            <label>Address</label>
                            <span id="disp_address">-</span>
                        </div>
                        <div class="party-info-row">
                            <label>City/State</label>
                            <span id="disp_city_state">-</span>
                        </div>
                        <div class="party-info-row">
                            <label>GST Type</label>
                            <span id="disp_gst_type">-</span>
                        </div>
                        <div class="party-info-row">
                            <label>Opening Balance</label>
                            <span id="disp_opening_balance">-</span>
                        </div>
                    </div>
                </div>
            </div>

            {{-- ========================================
                    INFORMATION PANEL CARD
                    ======================================== --}}
            <div class="col-md-6">
                <div class="card mb-3 h-100">
                    <div class="card-header bg-light">
                        <small class="fw-bold text-uppercase text-dark"><i class="ri-information-line"></i> Information Panel</small>
                    </div>
                    <div class="card-body">
                        <div class="row g-3">
                            <div class="col-12">
                                <label class="form-label" for="party_account_ledger_id">Select Party <span
                                        class="text-danger">*</span></label>
                                <button type="button" class="btn btn-sm btn-primary py-0 px-1 float-end" data-bs-toggle="modal"
                                    data-bs-target="#commonPartyModal" data_type="purchase_party">
                                    <i class="ri-add-circle-line"></i> Add Party
                                </button>
                                {!! Form::select(
                                    'party_account_ledger_id',
                                    ['' => '--Select--'] + $partyLedger,
                                    old('party_account_ledger_id'),
                                    ['class' => 'form-control select2', 'id' => 'party_account_ledger_id', 'required'],
                                ) !!}
                                <small class="text-muted d-block mt-1">
                                    Balance: <span id="party_balance" class="fw-bold"></span>
                                </small>

                                <div class="text-danger">{{ $errors->first('party_account_ledger_id') }}</div>
                                <input type="hidden" name="party_state_id" id="party_state_id"
                                    value="{{ old('party_state_id') }}">
                                <input type="hidden" name="party_register_type" id="party_register_type"
                                    value="{{ old('party_register_type') }}">
                                <input type="hidden" name="is_party_cash_bank" id="is_party_cash_bank"
                                    value="{{ old('is_party_cash_bank') }}">
                            </div>

                            <div class="col-12">
                                <label class="form-label" for="created_by">Created By <span
                                        class="text-danger">*</span></label>
                                <input type="text" class="form-control readonly-input" id="created_by" name="created_by"
                                    required readonly value="{{ \Illuminate\Support\Facades\Auth::user()->name }}">
                                <div class="text-danger">{{ $errors->first('created_by') }}</div>
                            </div>

                            <div class="col-12">
                                <label class="form-label" for="doc">Document Upload</label>
                                <input type="file" class="form-control" id="doc" name="doc"
                                    value="{{ old('doc') }}">
                                <div class="text-danger">{{ $errors->first('doc') }}</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        {{-- ========================================
                SECTION 3: SELECTED ITEM DETAILS
                ======================================== --}}
        <div class="row gx-3">
            <div class="col-12">
                <div class="card mb-3">
                    <div class="card-header py-2 d-flex justify-content-between align-items-center bg-white border-bottom">
                        <div>
                            <span class="fw-bold text-dark">
                                <i class="ri-file-list-line text-primary"></i> Selected Item Details
                            </span>
                        </div>
                    </div>
                    <div class="card-body p-0">
                        <div class="table-responsive">
                            <table class="table table-bordered mb-0 goods-table text-center align-middle" id="tabdata">
                                <thead class="table-light">
                                    <tr>
                                        <th style="width: 25%">Name of Item <i class="text-danger"> *</i>
                                            <button type="button" class="btn btn-sm btn-primary py-0 px-1"
                                                data-bs-toggle="modal" data-bs-target="#productModal"
                                                data_type="product">
                                                <i class="ri-add-circle-line"></i>
                                            </button>
                                        </th>
                                        <th style="width: 10%">Qty <i class="text-danger"> *</i></th>
                                        <th style="width: 10%">Unit <i class="text-danger"> *</i></th>
                                        <th style="width: 10%">Rate/Unit <i class="text-danger"> *</i></th>
                                        <th style="width: 10%">Amount <i class="text-danger"> *</i></th>
                                        <th style="width: 12%">Tax Rate (%)</th>
                                        <th style="width: 10%">Tax Amount</th>
                                        <th style="width: 10%">Total Amount <i class="text-danger"> *</i></th>
                                        <th style="width: 3%">
                                            <button type="button" id="addrow"
                                                class="btn btn-sm btn-primary">
                                                <i class="ri-add-circle-fill"></i>
                                            </button>
                                        </th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>
                                            {!! Form::select('product_id[]', ['' => '--Select--'] + $product, old('product'), [
                                                'class' => 'form-control select2',
                                                'id' => 'product_id_10',
                                                'required',
                                            ]) !!}
                                            <input type="hidden" name="serial_numbers[]" id="serial_numbers_10">
                                            <button type="button"
                                                class="btn btn-sm btn-outline-info mt-1 d-none serial-btn"
                                                id="serial_btn_10" onclick="openSerialModal(10)">
                                                <i class="ri-barcode-line"></i> Serials
                                            </button>
                                        </td>
                                        <td><input class="form-control floatnumber" type="text" name="qty[]"
                                                value="1" min="1" id="qty_10"
                                                required></td>
                                        <td><input class="form-control readonly-input" type="text" name="unit[]"
                                                readonly id="unit_10" required>
                                        </td>
                                        <td><input class="form-control floatnumber" type="text" name="rate[]"
                                                id="rate_10" value="0.00" required onfocus="if(this.value=='0' || this.value=='0.00') this.value='';" onblur="if(this.value=='') this.value='0.00';"></td>
                                        <td><input class="form-control floatnumber totalProductAmount"
                                                type="text" name="amount[]"
                                                value="0.00" id="amount_10" required onfocus="if(this.value=='0' || this.value=='0.00') this.value='';" onblur="if(this.value=='') this.value='0.00';">
                                        </td>
                                        <td>
                                            <input class="form-control readonly-input" type="hidden" readonly
                                                name="tax[]" id="tax_10"
                                                value="0.00">
                                            {!! Form::select('tax_group_id[]', ['' => '--Select--'] + $taxGroup, old('tax_group_id'), [
                                                'class' => 'form-control select2 taxGroupIds',
                                                'id' => 'tax_group_id_10',
                                                'required',
                                            ]) !!}
                                        </td>
                                        <td><input class="form-control readonly-input totalTaxAmount" type="text"
                                                name="tax_amount[]" id="tax_amount_10"
                                                value="0.00" readonly required></td>
                                        <td><input class="form-control readonly-input totalValueWithTax" type="text"
                                                value="0.00" id="total_amount_10"
                                                name="total_amount[]" readonly></td>
                                        <td></td>
                                    </tr>
                                </tbody>
                                <tfoot>
                                    <tr class="table-light fw-bold">
                                        <td colspan="4" class="text-end">Total Amount</td>
                                        <td><input type="text" name="total_purchase_amount" id="total_purchase_amount"
                                                value="0.00" readonly
                                                class="form-control readonly-input text-end fw-bold"></td>
                                        <td></td>
                                        <td><input type="text" name="total_tax_amount" id="total_tax_amount"
                                                readonly value="0.00"
                                                class="form-control readonly-input text-end fw-bold"></td>
                                        <td><input type="text" name="final_purchase_amount" id="final_purchase_amount"
                                                value="0.00" readonly
                                                class="form-control readonly-input text-end fw-bold"></td>
                                        <td></td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="row gx-3">
            <div class="col-12">
                <div class="card mb-3">
                    <div class="card-body">
                        <div class="row gx-3">
                            {{-- Calculation Section --}}
                            <div class="col-12">

                                {{-- OTHER CHARGES BEFORE GST --}}
                                <div class="row mb-4">
                                    <div class="col-md-8 d-flex flex-column">
                                        <div class="d-flex align-items-center gap-2 mb-2">
                                            <label class="fw-semibold mb-0">Other Charges <small
                                                    class="text-muted">(Before GST — Enter negative to
                                                    deduct)</small></label>
                                            <button type="button" id="addExpense"
                                                class="btn btn-sm btn-primary">+</button>
                                        </div>
                                        <div id="otherExpTable" class="flex-grow-1"></div>
                                    </div>
                                    <div class="col-md-4 d-flex flex-column justify-content-end">
                                        <input type="text" name="total_other_charge" id="total_other_charge"
                                            value="0" readonly
                                            class="form-control form-control-sm text-end fw-semibold">
                                    </div>
                                </div>

                                {{-- GST BREAKUP --}}
                                <div id="gstSection" style="display:none;">
                                    <div id="cgstSgstBlock" style="display:none;">
                                        <div class="row mb-2">
                                            <div class="col-md-8"><label>CGST Input</label></div>
                                            <div class="col-md-4">
                                                <input type="text" name="cgst_input" id="cgst_input"
                                                    value="{{ old('cgst_input', 0) }}" readonly
                                                    class="form-control form-control-sm text-end fw-semibold">
                                            </div>
                                        </div>
                                        <div class="row mb-3">
                                            <div class="col-md-8"><label>SGST Input</label></div>
                                            <div class="col-md-4">
                                                <input type="text" name="sgst_input" id="sgst_input"
                                                    value="{{ old('sgst_input', 0) }}" readonly
                                                    class="form-control form-control-sm text-end fw-semibold">
                                            </div>
                                        </div>
                                    </div>
                                    <div id="igstBlock" style="display:none;">
                                        <div class="row mb-3">
                                            <div class="col-md-8"><label>IGST Input</label></div>
                                            <div class="col-md-4">
                                                <input type="text" name="igst_input" id="igst_input"
                                                    value="{{ old('igst_input', 0) }}" readonly
                                                    class="form-control form-control-sm text-end fw-semibold">
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <input type="hidden" name="final_tax_total" id="finalTaxTotal" value="0.00">

                                {{-- OTHER CHARGES AFTER GST --}}
                                <div class="row mb-4">
                                    <div class="col-md-8 d-flex flex-column">
                                        <div class="d-flex align-items-center gap-2 mb-2">
                                            <label class="fw-semibold mb-0">Other Charges After GST <small
                                                    class="text-muted">(Enter negative to deduct)</small></label>
                                            <button type="button" id="addAfterGstCharge"
                                                class="btn btn-sm btn-primary">+</button>
                                        </div>
                                        <div id="afterGstExpTable" class="flex-grow-1"></div>
                                    </div>
                                    <div class="col-md-4 d-flex flex-column justify-content-end">
                                        <input type="text" name="total_after_gst_charge" id="total_after_gst_charge"
                                            value="0" readonly
                                            class="form-control form-control-sm text-end fw-semibold">
                                    </div>
                                </div>

                                {{-- GROSS TOTAL --}}
                                <div class="row mb-3">
                                    <div class="col-md-8"><label class="fw-semibold">Gross Total</label></div>
                                    <div class="col-md-4">
                                        <input type="text" name="gross_total" id="gross_total"
                                            value="{{ old('gross_total', 0) }}" readonly
                                            class="form-control form-control-sm text-end fw-semibold">
                                    </div>
                                </div>

                                {{-- ROUND OFF --}}
                                <div class="row mb-2">
                                    <div class="col-md-8"><label>Round Off</label></div>
                                    <div class="col-md-4">
                                        <input type="text" name="round_off" id="round_off"
                                            value="{{ old('round_off', 0) }}"
                                            class="form-control form-control-sm text-end">
                                    </div>
                                </div>

                                <input type="hidden" name="tcs_amount" id="tcs_amount" value="0">

                                {{-- NET TOTAL --}}
                                <div class="row mb-3">
                                    <div class="col-md-8"><label class="fw-bold">Net Total</label></div>
                                    <div class="col-md-4">
                                        <input type="text" name="net_total" id="net_total" readonly
                                            class="form-control form-control-sm text-end fw-bold">
                                    </div>
                                </div>

                                {{-- PAID AMOUNT --}}
                                <div class="row mb-4 paymentSection">
                                    <div class="col-md-8 d-flex flex-column">
                                        <div class="d-flex align-items-center gap-2 mb-2">
                                            <label>Paid Amount</label>
                                            <button type="button" id="addPayment"
                                                class="btn btn-sm btn-primary">+</button>
                                        </div>
                                        <div id="paymentTable" class="flex-grow-1"></div>
                                    </div>
                                    <div class="col-md-4 d-flex flex-column justify-content-end">
                                        <input type="text" name="total_paid" id="total_paid"
                                            value="{{ old('total_paid', 0) }}" readonly
                                            class="form-control form-control-sm text-end fw-semibold">
                                    </div>
                                </div>

                                {{-- REMAINING BALANCE --}}
                                <div class="row mt-4">
                                    <div class="col-md-8"><label class="fw-bold">Remaining Balance</label></div>
                                    <div class="col-md-4">
                                        <input type="text" name="balance" id="balance"
                                            value="{{ old('balance', 0) }}" readonly
                                            class="form-control form-control-sm text-end fw-bold">
                                    </div>
                                </div>

                                <input type="hidden" name="total_other_deduction" id="total_other_deduction"
                                    value="0">

                            </div>

                            <div class="col-md-12 col-12">
                                <label class="form-label" for="remark">Remark</label>
                                <textarea class="form-control" name="remark">{{ old('remark') }}</textarea>
                                <div class="text-danger">{{ $errors->first('remark') }}</div>
                            </div>
                            <div class="col-xl-12 col-md-12 col-12">
                                <button class="btn btn-primary mt-1" id="BtnSubmit" type="submit">Submit</button>
                            </div>

                            {!! Form::close() !!}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    @include('common.modal.common_party')
    @include('common.modal.product')
    @include('common.modal.ledger')

    <!-- Serial Number Modal -->
    <div class="modal fade" id="serialNumberModal" tabindex="-1" aria-labelledby="serialNumberModalLabel"
        aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="serialNumberModalLabel">Enter Serial Numbers</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <div id="serialInputsContainer" class="row g-2">
                        <!-- Inputs will be generated here -->
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" data-bs-dismiss="modal">Done</button>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('footer_script')
    <script>
        $(".select2").select2();
        $('.number').keyup(function() {
            this.value = this.value.replace(/\D/g, '');
        });
        $(document).ready(function() {

            @if (session('new_party'))

                var newParty = @json(session('new_party'));

                var label = newParty.party_name + (newParty.gst_no ? ' - ' + newParty.gst_no : '');

                $('#party_account_ledger_id')
                    .append(new Option(label, newParty.ledger_id, true, true))
                    .trigger('change');
            @endif

        });
        $('.negativeNumber').keyup(function() {
            this.value = this.value.replace(/[^0-9\-.]/g, '');
        });
        $('.floatnumber').on('input', function() {
            this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');
        });

        function loadLedgerBalance(ledgerId, targetSpanId) {
            if (!ledgerId) {
                $('#' + targetSpanId).text('₹ 0.00').removeClass('text-success text-danger');
                return;
            }
            $.ajax({
                url: '{{ route("getLedgerBalance") }}',
                type: 'GET',
                data: { account_ledger_id: ledgerId },
                success: function(res) {
                    let colorClass = res.balance_type === 'Dr' ? 'text-success' : 'text-danger';
                    let label = res.display_type === 'Receivable' ? 'Receivable' : 'Payable';
                    let text = '₹ ' + parseFloat(res.balance).toFixed(2) + ' ' + res.balance_type + ' (' + label + ')';
                    $('#' + targetSpanId).text(text).removeClass('text-success text-danger').addClass(colorClass);
                }
            });
        }

        //  PARTY CHANGE
        $(document).ready(function() {
            let companyStateId = parseInt(@json($companyDetails->state_id));
            let taxGroupNoneId = @json($taxGroupNone->id);

            $('#party_account_ledger_id').on('change', function() {
                let party_account_ledger_id = $(this).val();
                loadLedgerBalance(party_account_ledger_id, 'party_balance');
                $.ajax({
                    url: '{{ route('commonPartyDetailByAccountLedgerId') }}',
                    type: 'GET',
                    data: {
                        party_account_ledger_id
                    },
                    success: function(response) {

                        let partyData = response[0];
                        let isCashBank = response[1];
                        let balance = response[2];

                        // Populate Party Info Card
                        if (partyData) {
                            $('#disp_party_name').text(partyData.party_name || '-');
                            $('#disp_gst_no').text(partyData.gst_no || '-');
                            $('#disp_mobile_no').text(partyData.mobile_no || '-');
                            $('#disp_address').text(partyData.address || '-');
                            $('#disp_city_state').text((partyData.city?.city_name || '') + ' / ' + (partyData.state?.state_name || '-'));
                            $('#disp_gst_type').text(partyData.register_type || '-');
                        } else {
                            $('#disp_party_name, #disp_gst_no, #disp_mobile_no, #disp_address, #disp_city_state, #disp_gst_type').text('-');
                        }

                        if (balance) {
                            let colorClass = balance.balance_type === 'Dr' ? 'text-success' : 'text-danger';
                            let htmlBal = `<span class="${colorClass}">₹ ${parseFloat(balance.balance).toFixed(2)} ${balance.balance_type}</span>`;
                            $('#disp_opening_balance').html(htmlBal);
                        } else {
                            $('#disp_opening_balance').text('-');
                        }

                        let isRegular = partyData && partyData.register_type === 'Regular';
                        if (isCashBank === 'yes' || !isRegular) {
                            if (isCashBank === 'yes') {
                                $('.paymentSection').addClass('shopPayment');
                                $('#is_party_cash_bank').val('yes');
                            } else {
                                $('.paymentSection').removeClass('shopPayment');
                                $('#is_party_cash_bank').val('no');
                            }
                            $('.taxGroupIds').val(taxGroupNoneId).trigger('change');
                            $('.totalTaxAmount').val('0.00');
                            $('#total_tax_amount').val('0.00');
                            $('#party_register_type').val('');
                            $('#party_state_id').val('');
                            $('#sgst_input, #cgst_input, #igst_input').val('0.00');
                            $('#gstSection').hide();
                            $('#cgstSgstBlock').hide();
                            $('#igstBlock').hide();
                        } else {
                            $('.paymentSection').removeClass('shopPayment');
                            $('#is_party_cash_bank').val('no');
                            $('#party_register_type').val('Regular');
                            getTaxGroupAndUpdateValueByProduct();
                            let partyStateId = parseInt(partyData.state_id || 0);
                            $('#party_state_id').val(partyStateId);
                            if (!partyStateId) {
                                $('#gstSection').hide();
                                $('#cgstSgstBlock').hide();
                                $('#igstBlock').hide();
                            } else if (partyStateId === companyStateId) {
                                $('#gstSection').show();
                                $('#cgstSgstBlock').show();
                                $('#igstBlock').hide();
                            } else {
                                $('#gstSection').show();
                                $('#cgstSgstBlock').hide();
                                $('#igstBlock').show();
                            }
                        }
                    },
                    error: function(xhr, status, error) {
                        console.error('AJAX Error:', status, error);
                    }
                });
            });
        });

        function getTaxGroupAndUpdateValueByProduct() {
            let taxGroupNoneIds = @json($taxGroupNone->id ?? []);
            let party_account_ledger_id = $('#party_account_ledger_id').val() || 0;
            $("select[id^='product_id_']").each(function() {
                let product_id = $(this).val();
                let id = $(this).attr('id').split('_').pop();
                if (product_id) productDetails(product_id, party_account_ledger_id, taxGroupNoneIds, id);
            });
        }


        $(document).ready(function() {
            let i = 11;
            $('#addrow').on('click', function() {
                let newRow = $('<tr>');
                let cols = '';
                cols += '<td><select name="product_id[]" class="form-control select2" id="product_id_' + i +
                    '" required><option value="">--Select--</option>@foreach ($product as $key => $prow)<option value="{{ $key }}">{{ $prow }}</option>@endforeach</select>' +
                    '<input type="hidden" name="serial_numbers[]" id="serial_numbers_' + i + '">' +
                    '<button type="button" class="btn btn-sm btn-outline-info mt-1 d-none serial-btn" id="serial_btn_' +
                    i + '" onclick="openSerialModal(' + i + ')">' +
                    '<i class="ri-barcode-line"></i> Serials</button></td>';
                cols +=
                    '<td><input name="qty[]" class="form-control floatnumber" required type="text" value="1" min="1" id="qty_' +
                    i + '"></td>';
                cols +=
                    '<td><input name="unit[]" class="form-control readonly" required type="text" readonly id="unit_' +
                    i + '"></td>';
                cols +=
                    '<td><input name="rate[]" class="form-control floatnumber" required type="text" value="0.00" id="rate_' +
                    i + '" onfocus="if(this.value==\'0\' || this.value==\'0.00\') this.value=\'\';" onblur="if(this.value==\'\') this.value=\'0.00\';"></td>';
                cols +=
                    '<td><input name="amount[]" class="form-control floatnumber totalProductAmount" required type="text" value="0.00" id="amount_' +
                    i + '" onfocus="if(this.value==\'0\' || this.value==\'0.00\') this.value=\'\';" onblur="if(this.value==\'\') this.value=\'0.00\';"></td>';
                cols += '<td><input name="tax[]" type="hidden" class="form-control" value="0.00" id="tax_' +
                    i +
                    '"><select name="tax_group_id[]" class="form-control select2 taxGroupIds" id="tax_group_id_' +
                    i +
                    '" required><option value="">--Select--</option>@foreach ($taxGroup as $key => $prow)<option value="{{ $key }}">{{ $prow }}</option>@endforeach</select></td>';
                cols +=
                    '<td><input name="tax_amount[]" class="form-control readonly totalTaxAmount" required type="text" value="0.00" readonly id="tax_amount_' +
                    i + '"></td>';
                cols +=
                    '<td><input name="total_amount[]" class="form-control readonly totalValueWithTax" required type="text" value="0.00" readonly id="total_amount_' +
                    i + '"></td>';
                cols +=
                    '<td><button type="button" class="btn btn-danger btn-sm delbtn"><i class="ri-delete-bin-line"></i></button></td>';
                i++;
                newRow.append(cols);
                $('#tabdata').append(newRow);
                $(".select2").select2();
                newRow.find('.floatnumber').on('input', function() {
                    this.value = this.value.replace(/[^0-9.\-]/g, '').replace(/(\..*)\./g, '$1')
                        .replace(/(?!^)-/g, '');
                });
            });
            $('#tabdata').on('click', '.delbtn', function() {
                $(this).closest('tr').remove();
                totalProductAmount();
                totalTaxAmount();
                finalTotalWithTax();
            });
        });


        $(document).on('change', "select[id^='product_id_']", function() {
            let id = $(this).attr('id').split('_').pop();
            callajax(id);
        });
        $(document).on('input', "input[id^='qty_'], input[id^='rate_']", function() {
            let id = $(this).attr('id').replace(/^(qty_|rate_)/, '');
            totalCal(id);
        });
        $(document).on('input', "input[id^='amount_']", function() {
            let id = $(this).attr('id').slice(7);
            totalCal(id);
        });
        $(document).on('change', "select[id^='tax_group_id_']", function() {
            let id = $(this).attr('id').replace('tax_group_id_', '');
            let tax_group_id = $(this).val();
            let party_ledger_id = $('#party_account_ledger_id').val() || 0;
            $.ajax({
                url: '{{ route('getTaxGroupDetailById') }}',
                type: 'GET',
                data: {
                    tax_group_id,
                    party_account_ledger_id: party_ledger_id
                },
                success: function(result) {
                    $('#tax_' + id).val(result.tax_slab || 0);
                    totalCal(id);
                },
                error: function(x, s, e) {
                    console.error('AJAX Error:', e);
                }
            });
        });

        function callajax(id) {
            let taxGroupNoneIds = @json($taxGroupNone->id);
            let party_account_ledger_id = $('#party_account_ledger_id').val();
            let product_id = $('#product_id_' + id).val();
            productDetails(product_id, party_account_ledger_id, taxGroupNoneIds, id);
        }

        function productDetails(product_id, party_account_ledger_id, taxGroupNoneIds, id) {
            $.ajax({
                url: '{{ route('getProductDetailById') }}',
                type: 'GET',
                data: {
                    product_id,
                    party_account_ledger_id
                },
                success: function(result) {

                    console.log('PRODUCT RESPONSE', result);

                    console.log('tax_group_id = ', result[0].tax_group_id);
                    $('#rate_' + id).val(result[0].rate_per);
                    let u = result[0].units || '';
                    $('#unit_' + id).val(u.charAt(0).toUpperCase() + u.slice(1));
                    totalCal(id);
                    let isRegularParty = result[1] && result[1].register_type === 'Regular';

                    // Serial Number logic
                    if (result[0].track_usage_type === 'unique') {
                        $('#serial_btn_' + id).removeClass('d-none');
                    } else {
                        $('#serial_btn_' + id).addClass('d-none');
                        $('#serial_numbers_' + id).val('');
                    }

                    if (isRegularParty) {
                        $('.expTaxGroupIds').removeAttr('disabled');
                        $('#party_register_type').val('Regular');
                        if (result[0].tax_group_id) {
                            $('#tax_group_id_' + id).val(result[0].tax_group_id).trigger('change').removeAttr(
                                'disabled');
                            let slab = (result[0].tax_group && result[0].tax_group.tax_slab) ? result[0]
                                .tax_group.tax_slab : 0;
                            $('#tax_' + id).val(slab);
                        } else {
                            $('#tax_group_id_' + id).val(taxGroupNoneIds).trigger('change').attr('disabled',
                                true);
                            $('#tax_' + id).val(0);

                            taxAmount(id);
                        }
                    } else {
                        $('#tax_group_id_' + id).val(taxGroupNoneIds).trigger('change').attr('disabled', true);
                        $('#tax_' + id).val(0);

                        taxAmount(id);

                        $('#total_paid').val('0.00');
                        $('.totalPaidAmount').val('0.00');
                    }
                }
            });
        }


        //  CALCULATION CHAIN
        function totalCal(id) {
            let rate = parseFloat($('#rate_' + id).val()) || 0;
            let qty = parseFloat($('#qty_' + id).val()) || 0;
            $('#amount_' + id).val((rate * qty).toFixed(2));
            totalProductAmount();
            taxAmount(id);
        }

        function totalProductAmount() {
            let sum = 0;
            $('.totalProductAmount').each(function() {
                sum += parseFloat(this.value) || 0;
            });
            $('#total_purchase_amount').val(sum.toFixed(2));
        }

        function taxAmount(id) {
            let party_register_type = $('#party_register_type').val();
            let amount = parseFloat($('#amount_' + id).val()) || 0;
            let tax = parseFloat($('#tax_' + id).val()) || 0;
            if (party_register_type === 'Regular') {
                let taxValue = (amount * tax) / 100;
                $('#tax_amount_' + id).val(taxValue.toFixed(2));
                $('#total_amount_' + id).val((amount + taxValue).toFixed(2));
            } else {
                $('#tax_amount_' + id).val('0.00');
                $('#total_amount_' + id).val(amount.toFixed(2));
            }
            totalTaxAmount();
        }

        function totalTaxAmount() {
            let sum = 0;
            $('.totalTaxAmount').each(function() {
                sum += parseFloat(this.value) || 0;
            });
            $('#total_tax_amount').val(sum.toFixed(2));
            finalTotalWithTax();
        }

        function finalTotalWithTax() {
            let finalSum = 0;
            $('.totalValueWithTax').each(function() {
                finalSum += parseFloat(this.value) || 0;
            });
            $('#final_purchase_amount').val(finalSum.toFixed(2));
            updateGstBreakup();
            calculation();
        }

        //  GST BREAKUP

        function updateGstBreakup() {
            let companyStateId = parseInt(@json($companyDetails->state_id));
            let partyStateId = parseInt($('#party_state_id').val()) || 0;
            let totalTax = parseFloat($('#total_tax_amount').val()) || 0;
            $('#cgst_input, #sgst_input, #igst_input').val('0.00');

            if (!partyStateId) {
                $('#gstSection').hide();
                $('#cgstSgstBlock').hide();
                $('#igstBlock').hide();
                return;
            }

            $('#gstSection').show();
            if (partyStateId === companyStateId) {
                let half = (totalTax / 2).toFixed(2);
                $('#cgst_input').val(half);
                $('#sgst_input').val(half);
                $('#cgstSgstBlock').show();
                $('#igstBlock').hide();
            } else {
                $('#igst_input').val(totalTax.toFixed(2));
                $('#cgstSgstBlock').hide();
                $('#igstBlock').show();
            }
        }


        //OTHER CHARGES BEFORE GST

        $(document).ready(function() {
            let j = 11;

            $('#addExpense').on('click', function() {
                addExpense(0);
                calculation();
            });

            function addExpense(expenseAmount) {
                let newRow = $('<div class="d-flex">');
                let taxGroupNoneId = @json($taxGroupNone->id);
                let cols =
                    '<select name="exp_account_ledger_id[]" class="form-control" id="exp_account_ledger_id_' +
                    j + '" required>' +
                    '<option value="">--Select--</option>' +
                    '<option value="add_ledger" style="color:#0d6efd;font-weight:600;">➕ Add Ledger</option>' +
                    '@foreach ($expenseLedger as $key => $prow)<option value="{{ $key }}">{{ $prow }}</option>@endforeach</select>' +
                    '<select name="exp_tax_group_id[]" style="margin-left:10px;" class="form-control expTaxGroupIds" id="exp_tax_group_id_' +
                    j + '" required>' +
                    '@foreach ($taxGroup as $keys => $prows)<option value="{{ $keys }}">{{ $prows }}</option>@endforeach</select>' +
                    '<input type="hidden" name="expense_tax[]" class="expenseTax" value="0.00" id="expense_tax_' +
                    j + '">' +
                    '<input name="exp_amount[]" style="margin-left:10px;" class="form-control expNegativeNumber totalExpenseAmount" value="' +
                    expenseAmount + '" required type="text" id="exp_amount_' + j +
                    '" placeholder="+ charge / - deduct" onfocus="if(this.value==\'0\' || this.value==\'0.00\') this.value=\'\';" onblur="if(this.value==\'\') this.value=\'0\';">' +
                    '<input name="expense_tax_amount[]" style="margin-left:10px;" class="form-control otherChargeTaxTotal" value="0.00" required type="hidden" id="expense_tax_amount_' +
                    j + '">' +
                    '<input name="total_expense_amount[]" style="margin-left:10px;" class="form-control totalExpAmount" value="0.00" required type="hidden" id="total_expense_amount_' +
                    j + '">' +
                    '<button type="button" id="del_expense_btn_' + j +
                    '" style="border-radius:15px;height:20px;width:20px;margin-top:10px;margin-left:5px;" class="btn btn-danger btn-sm"><i class="ri-delete-bin-2-line ri-sm" style="position:relative;bottom:6px;right:4px;"></i></button>';
                j++;
                newRow.append(cols);
                $('#otherExpTable').append(newRow);
                $(".select2").select2();
                let is_party_cash_bank = $('#is_party_cash_bank').val();
                let checkParty = $('#party_register_type').val();
                if (is_party_cash_bank === 'yes' || checkParty !== 'Regular') {
                    $('.expTaxGroupIds').val(taxGroupNoneId).attr('disabled', true);
                } else {
                    $('.expTaxGroupIds').removeAttr('disabled');
                }
                newRow.find('.expNegativeNumber').on('input', function() {
                    this.value = this.value.replace(/[^0-9.\-]/g, '').replace(/(\..*)\./g, '$1').replace(
                        /(?!^)-/g, '');
                });
            }

            $(document).on('input', "input[id^='exp_amount_']", function() {
                let id = $(this).attr('id').slice(11);
                expenseTaxCal(id);
            });
            $(document).on('change', "select[id^='exp_tax_group_id_']", function() {
                let id = $(this).attr('id').replace('exp_tax_group_id_', '');
                let tax_group_id = $(this).val();
                $.ajax({
                    url: '{{ route('getTaxGroupDetailById') }}',
                    type: 'GET',
                    data: {
                        tax_group_id
                    },
                    success: function(result) {
                        $('#expense_tax_' + id).val(result.tax_slab || 0);
                        expenseTaxCal(id);
                    },
                    error: function(x, s, e) {
                        console.error('AJAX Error:', e);
                    }
                });
            });
            $(document).on('click', "button[id^='del_expense_btn_']", function() {
                $(this).closest('.d-flex').remove();
                let sum = 0;
                $('.totalExpAmount').each(function() {
                    sum += parseFloat(this.value) || 0;
                });
                $('#total_other_charge').val(sum.toFixed(2));
                calculation();
            });
        });

        function expenseTaxCal(id) {

            let exp_amount = parseFloat($('#exp_amount_' + id).val()) || 0;
            let expense_tax = parseFloat($('#expense_tax_' + id).val()) || 0;

            let sign = exp_amount < 0 ? -1 : 1;
            let absAmount = Math.abs(exp_amount);

            let expTaxAmount = (absAmount * expense_tax) / 100 * sign;

            $('#expense_tax_amount_' + id).val(expTaxAmount.toFixed(2));

            // Only amount (NO GST)
            $('#total_expense_amount_' + id).val(exp_amount.toFixed(2));

            let sum = 0;
            $('.totalExpAmount').each(function() {
                sum += parseFloat(this.value) || 0;
            });

            $('#total_other_charge').val(sum.toFixed(2));

            calculation();
        }
        $(document).ready(function() {
            let ag = 11;

            $('#addAfterGstCharge').on('click', function() {
                addAfterGstCharge(0);
                calculation();
            });

            function addAfterGstCharge(amt) {
                let newRow = $('<div class="d-flex mb-1">');
                let cols =
                    '<select name="after_gst_ledger_id[]" class="form-control select2" id="after_gst_ledger_id_' +
                    ag + '" required>' +
                    '<option value="">--Select--</option>' +
                    '<option value="add_ledger" style="color:#0d6efd;font-weight:600;">➕ Add Ledger</option>' +
                    '@foreach ($expenseLedger as $key => $prow)<option value="{{ $key }}">{{ $prow }}</option>@endforeach</select>' +
                    '<input name="after_gst_amount[]" style="margin-left:10px;" class="form-control afterGstNegNumber totalAfterGstAmount" value="' +
                    amt + '" required type="text" id="after_gst_amount_' + ag +
                    '" placeholder="+ charge / - deduct" onfocus="if(this.value==\'0\' || this.value==\'0.00\') this.value=\'\';" onblur="if(this.value==\'\') this.value=\'0\';">' +
                    '<button type="button" id="del_after_gst_btn_' + ag +
                    '" style="border-radius:15px;height:20px;width:20px;margin-top:10px;margin-left:5px;" class="btn btn-danger btn-sm"><i class="ri-delete-bin-2-line ri-sm" style="position:relative;bottom:6px;right:4px;"></i></button>';
                ag++;
                newRow.append(cols);
                $('#afterGstExpTable').append(newRow);
                $(".select2").select2();
                newRow.find('.afterGstNegNumber').on('input', function() {
                    this.value = this.value.replace(/[^0-9.\-]/g, '').replace(/(\..*)\./g, '$1').replace(
                        /(?!^)-/g, '');
                });
            }

            $(document).on('input', "input[id^='after_gst_amount_']", function() {
                afterGstCal();
            });
            $(document).on('click', "button[id^='del_after_gst_btn_']", function() {
                $(this).closest('.d-flex').remove();
                afterGstCal();
            });
        });

        function afterGstCal() {
            let sum = 0;
            $('.totalAfterGstAmount').each(function() {
                sum += parseFloat(this.value) || 0;
            });
            $('#total_after_gst_charge').val(sum.toFixed(2));
            calculation();
        }


        $(document).ready(function() {
            let k = 11;
            $('#addPayment').on('click', function() {
                addPayment(0);
                calculation();
            });
            $('#total_paid').on('change', function() {
                addPayment($(this).val());
                calculation();
            });

            function addPayment(paidAmount) {
                let newRow = $('<div class="d-flex">');
                let cols =
                    '<select name="payment_account_ledger_id[]" style="width:45%;" class="form-control select2" id="payment_account_ledger_id' +
                    k + '" required>' +
                    '@foreach ($paymentLedger as $key => $prow)<option value="{{ $key }}">{{ $prow }}</option>@endforeach</select>' +
                    '<input name="paid_amount[]" style="margin-left:10px;width:45%;" class="form-control floatnumber totalPaidAmount" value="' +
                    paidAmount + '" required type="text" id="paid_amount_' + k + '" onfocus="if(this.value==\'0\' || this.value==\'0.00\') this.value=\'\';" onblur="if(this.value==\'\') this.value=\'0\';">' +
                    '<button type="button" id="del_payment_btn_' + k +
                    '" style="border-radius:15px;height:20px;width:20px;margin-top:10px;margin-left:5px;" class="btn btn-danger btn-sm"><i class="ri-delete-bin-2-line ri-sm" style="position:relative;bottom:6px;right:4px;"></i></button>';
                k++;
                newRow.append(cols);
                $('#paymentTable').append(newRow);
                $(".select2").select2();
                newRow.find('.floatnumber').on('input', function() {
                    this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');
                });
            }

            $(document).on('input', "input[id^='paid_amount_']", function() {
                paymentCal();
            });
            $(document).on('click', "button[id^='del_payment_btn_']", function() {
                $(this).closest('.d-flex').remove();
                paymentCal();
            });
        });

        function paymentCal() {
            let total = 0;
            $('.totalPaidAmount').each(function() {
                total += parseFloat(this.value) || 0;
            });
            $('#total_paid').val(total.toFixed(2));
            calculation();
        }

        $('#round_off').on('change input', function() {
            calculation();
        });

        /* ══════════════════════════════════════════════════════════
           FINAL CALCULATION
           gross_total = final_purchase_amount
                       + other_charge_before_gst (net signed)
                       + other_charge_before_gst_tax
                       + other_charge_after_gst (net signed, no tax)
           net_total   = gross_total + round_off
           balance     = net_total - total_paid
        ══════════════════════════════════════════════════════════ */
        function calculation() {

            let finalPurchaseAmount = parseFloat($('#final_purchase_amount').val()) || 0;

            let otherCharge = parseFloat($('#total_other_charge').val()) || 0;

            let afterGstCharge = parseFloat($('#total_after_gst_charge').val()) || 0;

            let productTax = parseFloat($('#total_tax_amount').val()) || 0;

            let otherChargeTaxSum = 0;
            $('.otherChargeTaxTotal').each(function() {
                otherChargeTaxSum += parseFloat(this.value) || 0;
            });

            let finalTaxTotal = productTax + otherChargeTaxSum;

            $('#finalTaxTotal').val(finalTaxTotal.toFixed(2));

            // GST split
            let companyStateId = parseInt(@json($companyDetails->state_id));
            let partyStateId = parseInt($('#party_state_id').val()) || 0;

            if (partyStateId && partyStateId === companyStateId) {

                let cgst = (finalTaxTotal / 2).toFixed(2);
                let sgst = (finalTaxTotal - cgst).toFixed(2);

                $('#cgst_input').val(cgst);
                $('#sgst_input').val(sgst);
                $('#igst_input').val('0.00');

            } else {

                $('#cgst_input').val('0.00');
                $('#sgst_input').val('0.00');
                $('#igst_input').val(finalTaxTotal.toFixed(2));

            }

            //  FIXED GROSS TOTAL
            let gross_total =
                finalPurchaseAmount +
                otherCharge +
                otherChargeTaxSum +
                afterGstCharge;

            $('#gross_total').val(gross_total.toFixed(2));

            let roundOff = parseFloat($('#round_off').val()) || 0;

            let netAmount = gross_total + roundOff;

            $('#net_total').val(netAmount.toFixed(2));

            if ($('#is_party_cash_bank').val() === 'yes') {
                $('#total_paid').val(netAmount.toFixed(2));
            }

            let total_paid = parseFloat($('#total_paid').val()) || 0;

            $('#balance').val((netAmount - total_paid).toFixed(2));
        }
    </script>

    <script src="{{ asset('theme/assets/vendor/daterange/daterange.js') }}"></script>
    <script>
        $(".datepicker").daterangepicker({
            singleDatePicker: true,
            startDate: moment().startOf("hour"),
            endDate: moment().startOf("hour").add(32, "hour"),
            locale: {
                format: "DD-MM-YYYY"
            },
        });
    </script>
    <script>
        $(document).ready(function() {

            var mpDataType = '';
            //  MODAL OPEN — reset everything
            $('#productModal').on('show.bs.modal', function(event) {

                var btn = event.relatedTarget;
                mpDataType = btn ? ($(btn).attr('data_type') || '') : '';
                $('.mp-error').html('');
                $('#mp_product_category_id').val('');
                $('#mp_product_name').val('');
                $('#mp_units').val('');
                $('#mp_gst_applicable').val('');
                $('#mp_tax_group_id').val('');
                $('#mp_hsn_code').val('');
                $('#mp_opening_stock').val('0');
                $('#mp_stock_alert').val('0');
                $('#mp_rate_per').val('0.00');
                $('#mp_value').val('0.00');
                $('#mp_remark').val('');
                $('#mp_application_reverse_charge').prop('checked', false);
                $('#mp_request_from').val('model');


                $('.mp_ApplicableYes').hide();
                $('#mp_tax_group_id').removeAttr('required');
                $('#mp_hsn_code').removeAttr('required');
            });

            $(document).on('focus', "input[name='rate[]'], input[name='amount[]'], input[name='exp_amount[]'], input[name='after_gst_amount[]'], input[name='paid_amount[]'], input[name='round_off']", function() {
                if ($(this).val() == '0.00' || $(this).val() == '0') {
                    $(this).val('');
                }
            });

            $(document).on('blur', "input[name='rate[]'], input[name='amount[]'], input[name='exp_amount[]'], input[name='after_gst_amount[]'], input[name='paid_amount[]'], input[name='round_off']", function() {
                if ($(this).val().trim() === '') {
                    $(this).val('0.00');
                }
            });

            $(document).on('change', '#mp_gst_applicable', function() {
                var val = $(this).val();
                if (val === 'yes') {
                    $('.mp_ApplicableYes').show();
                    $('#mp_tax_group_id').attr('required', true);
                    $('#mp_hsn_code').attr('required', true);
                } else {
                    $('.mp_ApplicableYes').hide();
                    $('#mp_tax_group_id').removeAttr('required').val('');
                    $('#mp_hsn_code').removeAttr('required').val('');
                }
            });

            $(document).on('input', '#mp_opening_stock, #mp_rate_per', function() {
                var stock = parseFloat($('#mp_opening_stock').val()) || 0;
                var rate = parseFloat($('#mp_rate_per').val()) || 0;
                $('#mp_value').val((stock * rate).toFixed(2));
            });

            $(document).on('keyup input', '#mp_opening_stock, #mp_stock_alert', function() {
                this.value = this.value.replace(/\D/g, '');
            });


            $(document).on('input', '#mp_rate_per', function() {
                this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');
            });


            $(document).on('click', '#mpBtnSubmit', function() {


                $('.mp-error').html('');

                $('#mpBtnSubmit').prop('disabled', true).text('Saving...');

                $.ajax({
                    url: "{{ route('product.store') }}",
                    type: "POST",
                    data: $('#productModalForm').serialize(),
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest',
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    success: function(response) {
                        if (response.success) {

                            var product = response.data;

                            if (mpDataType === 'product') {
                                var $lastSelect = $('select[id^="product_id_"]').last();
                                var lastId = $lastSelect.attr('id').split('_').pop();


                                $lastSelect.append(
                                    $('<option>', {
                                        value: product.id,
                                        text: product.product_name,
                                        selected: true
                                    })
                                );

                                var unit = product.units || '';
                                $('#unit_' + lastId).val(unit.charAt(0).toUpperCase() + unit
                                    .slice(1));
                                $('#rate_' + lastId).val(parseFloat(product.rate_per).toFixed(
                                    2));

                                if (typeof totalCal === 'function') {
                                    totalCal(lastId);
                                }
                            }

                            $('#productModal').modal('hide');

                        } else {
                            alert('Something went wrong. Please try again.');
                        }
                    },
                    error: function(xhr) {
                        if (xhr.status === 422 && xhr.responseJSON && xhr.responseJSON.errors) {

                            $.each(xhr.responseJSON.errors, function(field, messages) {
                                $('.mp-error[data-field="' + field + '"]').html(
                                    messages[0]);
                            });
                        } else {
                            alert('An unexpected error occurred. Please try again.');
                        }
                    },
                    complete: function() {
                        $('#mpBtnSubmit').prop('disabled', false).text('Submit');
                    }
                });
            });

        });
    </script>

    <script>
        $(document).ready(function() {


            $(document).on('change', "select[id^='exp_account_ledger_id_']", function() {
                if ($(this).val() === 'add_ledger') {

                    var triggeredSelectId = $(this).attr('id');
                    $('#ml_target_select_id').val(triggeredSelectId);
                    $(this).val('');
                    $('#ledgerModal').modal('show');
                }
            });


            $('#ledgerModal').on('show.bs.modal', function() {
                $('.ml-error').html('');
                $('#ml_account_group_id').val('');
                $('#ml_ledger_name').val('');
                $('#ml_date').val(new Date().toISOString().split('T')[0]);
                $('#ml_is_edit').val('yes');
            });


            $(document).on('click', '#mlBtnSubmit', function() {
                $('.ml-error').html('');
                $('#mlBtnSubmit').prop('disabled', true).text('Saving...');

                $.ajax({
                    url: "{{ route('account-ledger.store') }}",
                    type: "POST",
                    data: $('#ledgerModalForm').serialize(),
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest',
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    success: function(response) {
                        if (response.success) {
                            var ledger = response.data;
                            var targetId = $('#ml_target_select_id').val();

                            if (targetId) {
                                var $targetSelect = $('#' + targetId);

                                $targetSelect.append(
                                    $('<option>', {
                                        value: ledger.id,
                                        text: ledger.ledger_name,
                                        selected: true
                                    })
                                );
                            }

                            $('#ledgerModal').modal('hide');

                        } else {
                            alert('Something went wrong. Please try again.');
                        }
                    },
                    error: function(xhr) {
                        if (xhr.status === 422 && xhr.responseJSON && xhr.responseJSON.errors) {
                            $.each(xhr.responseJSON.errors, function(field, messages) {
                                $('.ml-error[data-field="' + field + '"]').html(
                                    messages[0]);
                            });
                        } else {
                            alert('An unexpected error occurred. Please try again.');
                        }
                    },
                    complete: function() {
                        $('#mlBtnSubmit').prop('disabled', false).text('Submit');
                    }
                });
            });

        });

        $(document).on('change', "select[id^='after_gst_ledger_id_']", function() {

            if ($(this).val() === 'add_ledger') {

                var triggeredSelectId = $(this).attr('id');

                $('#ml_target_select_id').val(triggeredSelectId);

                $(this).val('');

                $('#ledgerModal').modal('show');

            }

        });
    </script>

    <script>
        $(document).ready(function() {

            var cpDataType = '';


            $('#commonPartyModal').on('show.bs.modal', function(event) {
                var btn = event.relatedTarget;
                cpDataType = btn ? ($(btn).attr('data_type') || '') : '';


                $('#cp_account_group_id').val('');
                $('#cp_party_name').val('');
                $('#cp_mobile_no').val('');
                $('#cp_email').val('');
                $('#cp_address').val('');
                $('#cp_country').val('India');
                $('#cp_state_id').val('');
                $('#cp_city').val('');
                $('#cp_pin_code').val('');
                $('#cp_register_type').val('Regular');
                $('#cp_gst_no').val('');
                $('#cp_pan_no').val('');
                $('#cp_opening_balance').val('0');
                $('#cp_starting_date').val('{{ $financial_year_start }}');
                $('#cp_maintain_bal_bil').prop('checked', false);
                $('input[data-type="cp_receiving_payment_pending"]').prop('checked', false).removeAttr(
                    'required');
                $('.cp-error').html('');

                cpRegisterChange();
            });


            $('#commonPartyModal').on('shown.bs.modal', function() {


                $('.select2-cp-modal').each(function() {
                    if ($(this).hasClass('select2-hidden-accessible')) {
                        $(this).select2('destroy');
                    }
                });

                $('.select2-cp-modal').select2({
                    dropdownParent: $('#commonPartyModal'),
                    placeholder: '--Select--',
                    allowClear: true,
                    width: '100%'
                });

                $('#cp_account_group_id').val('').trigger('change');
                $('#cp_state_id').val('').trigger('change');

                if (!$('#cp_starting_date').data('daterangepicker')) {
                    $('#cp_starting_date').daterangepicker({
                        singleDatePicker: true,
                        startDate: moment('{{ $financial_year_start }}', 'DD-MM-YYYY'),
                        locale: {
                            format: 'DD-MM-YYYY'
                        }
                    });
                } else {
                    $('#cp_starting_date').data('daterangepicker').setStartDate(moment(
                        '{{ $financial_year_start }}', 'DD-MM-YYYY'));
                }
            });


            $('#commonPartyForm').on('submit', function(e) {
                e.preventDefault();

                $('.cp-error').html('');
                $('#cpBtnSubmit').prop('disabled', true).text('Saving...');

                $.ajax({
                    url: $(this).attr('action'),
                    type: 'POST',
                    data: new FormData(this),
                    processData: false,
                    contentType: false,
                    headers: {
                        'X-Requested-With': 'XMLHttpRequest'
                    },
                    success: function(response) {
                        if (response.success) {

                            var party = response.new_party || response.data;
                            var label = party.party_name + (party.gst_no ? ' - ' + party
                                .gst_no : '');


                            if (cpDataType === 'purchase_party') {
                                $('#party_account_ledger_id')
                                    .append(new Option(label, party.ledger_id, true, true))
                                    .trigger('change');
                            }


                            if (cpDataType === 'consignor') {
                                $('select[id^="consignor_id"]').last()
                                    .append(new Option(party.party_name, party.id, true, true))
                                    .trigger('change');
                                $('select[id^="consignee_id"]')
                                    .append(new Option(party.party_name, party.id, false,
                                        false));
                            }

                            if (cpDataType === 'consignee') {
                                $('select[id^="consignee_id"]').last()
                                    .append(new Option(party.party_name, party.id, true, true))
                                    .trigger('change');
                                $('select[id^="consignor_id"]')
                                    .append(new Option(party.party_name, party.id, false,
                                        false));
                            }

                            $('#commonPartyModal').modal('hide');

                        } else {
                            alert('Something went wrong. Please try again.');
                        }
                    },
                    error: function(xhr) {
                        if (xhr.status === 422 && xhr.responseJSON && xhr.responseJSON.errors) {
                            $.each(xhr.responseJSON.errors, function(field, messages) {
                                $('.cp-error[data-field="' + field + '"]').html(
                                    messages[0]);
                            });
                        } else {
                            alert('An unexpected error occurred. Please try again.');
                        }
                    },
                    complete: function() {
                        $('#cpBtnSubmit').prop('disabled', false).text('Submit');
                    }
                });
            });


            $(document).on('change', '#cp_opening_balance', function() {
                var val = parseFloat($(this).val()) || 0;
                var radios = $('input[data-type="cp_receiving_payment_pending"]');
                if (val > 0) {
                    if (!radios.filter(':checked').length) {
                        radios.first().attr('required', true);
                    } else {
                        radios.removeAttr('required');
                    }
                } else {
                    radios.removeAttr('required').prop('checked', false);
                }
            });

            $(document).on('change', 'input[data-type="cp_receiving_payment_pending"]', function() {
                $('input[data-type="cp_receiving_payment_pending"]').removeAttr('required');
            });


            $(document).on('change', '#cp_register_type', function() {
                cpRegisterChange();
            });

            $(document).on('keyup', '.cp_number', function() {
                this.value = this.value.replace(/\D/g, '');
            });

            $(document).on('input', '#cp_gst_no', function() {
                var gst = $(this).val().toUpperCase().replace(/[^A-Z0-9]/g, '');
                $(this).val(gst);
                if (gst.length === 15) {
                    $('#cp_pan_no').val(gst.substring(2, 12));
                } else {
                    $('#cp_pan_no').val('');
                }
            });

        });

        function cpRegisterChange() {
            var type = $('#cp_register_type').val();
            if (type === 'Unregistered') {
                $('#cp_gst_no').removeAttr('required').val('');
                $('.cp_gstShow').hide();
            } else {
                $('#cp_gst_no').attr('required', true);
                $('.cp_gstShow').show();
            }
        }

        $(document).ready(function() {
            $('form').on('submit', function() {
                $('.taxGroupIds, .expTaxGroupIds').removeAttr('disabled');
            });
        });

        var currentSerialRowId = null;

        function openSerialModal(id) {
            currentSerialRowId = id;
            let qty = parseInt($('#qty_' + id).val()) || 0;
            if (qty <= 0) {
                alert('Please enter quantity first');
                return;
            }

            let container = $('#serialInputsContainer');
            container.empty();

            let existingSerials = [];
            try {
                let val = $('#serial_numbers_' + id).val();
                if (val) existingSerials = JSON.parse(val);
            } catch (e) {
                console.error('Error parsing serials', e);
            }

            for (let k = 0; k < qty; k++) {
                let val = existingSerials[k] || '';
                container.append(`
                    <div class="col-md-6 mb-2">
                        <label class="form-label">Serial ${k+1}</label>
                        <input type="text" class="form-control serial-input" data-index="${k}" value="${val}" required placeholder="Enter unique number">
                    </div>
                `);
            }

            $('#serialNumberModal').modal('show');
        }

        $('#serialNumberModal .btn-primary').on('click', function() {
            let serials = [];
            $('#serialInputsContainer .serial-input').each(function() {
                let val = $(this).val().trim();
                if (val) serials.push(val);
            });

            if (serials.length === 0) {
                $('#serial_numbers_' + currentSerialRowId).val('');
                $('#serial_btn_' + currentSerialRowId).removeClass('btn-info').addClass('btn-outline-info');
                return;
            }

            if (currentSerialRowId) {
                $('#serial_numbers_' + currentSerialRowId).val(JSON.stringify(serials));
                $('#serial_btn_' + currentSerialRowId).removeClass('btn-outline-info').addClass('btn-info');
            }
        });
    </script>
@endpush