<div class="row justify-content-center">
    <div class="col-lg-8">
        <div class="card">
            <div class="card-header">
                <h5 class="card-title mb-0"><i class="fas fa-money-bill-wave me-2"></i><?= lang('finance.record_payment') ?></h5>
            </div>
            <div class="card-body">
                <form id="payment-form" method="POST" action="/finance/payments" data-ajax="true">
                    <?= csrf_field() ?>

                    <div class="row g-3">
                        <div class="col-md-8">
                            <label class="form-label"><?= lang('finance.member') ?> <span class="text-danger">*</span></label>
                            <select name="member_id" id="pay-member-select" class="form-select" required>
                                <?php if ($member): ?>
                                <option value="<?= $member['id'] ?>" selected><?= e($member['membership_number'] . ' - ' . $member['full_name_en']) ?></option>
                                <?php endif; ?>
                            </select>
                            <div class="invalid-feedback" data-field="member_id"></div>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label"><?= lang('finance.amount') ?> <span class="text-danger">*</span></label>
                            <input type="number" name="amount" class="form-control" step="0.01" min="0.01" required
                                   value="<?= $invoice ? e($invoice['balance_due']) : '' ?>">
                            <div class="invalid-feedback" data-field="amount"></div>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label"><?= lang('finance.payment_method') ?> <span class="text-danger">*</span></label>
                            <select name="payment_method_id" class="form-select" required>
                                <?php foreach ($methods as $m): ?>
                                <option value="<?= $m['id'] ?>" data-type="<?= $m['method_type'] ?>" data-ref="<?= $m['requires_reference'] ?>"><?= e($m['name_en']) ?></option>
                                <?php endforeach; ?>
                            </select>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label"><?= lang('finance.payment_date') ?> <span class="text-danger">*</span></label>
                            <input type="date" name="payment_date" class="form-control" value="<?= date('Y-m-d') ?>" required>
                        </div>
                        <div class="col-md-4">
                            <label class="form-label"><?= lang('finance.reference_number') ?></label>
                            <input type="text" name="reference_number" class="form-control">
                        </div>
                        <div class="col-md-6">
                            <label class="form-label"><?= lang('finance.allocate_to_invoice') ?></label>
                            <select name="invoice_id" id="invoice-select" class="form-select">
                                <option value=""><?= lang('finance.auto_allocate') ?></option>
                                <?php if ($invoice): ?>
                                <option value="<?= $invoice['id'] ?>" selected>#<?= e($invoice['invoice_number']) ?> - <?= lang('finance.balance') ?>: <?= money($invoice['balance_due']) ?></option>
                                <?php endif; ?>
                            </select>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label"><?= lang('finance.cash_register_session') ?></label>
                            <select name="cash_register_session_id" class="form-select">
                                <option value="">-- <?= lang('finance.no_session') ?> --</option>
                                <?php foreach ($registers as $reg): ?>
                                    <?php if ($reg['session_id']): ?>
                                    <option value="<?= $reg['session_id'] ?>"><?= e($reg['name_en']) ?> (<?= lang('finance.open') ?>)</option>
                                    <?php endif; ?>
                                <?php endforeach; ?>
                            </select>
                        </div>
                    </div>

                    <div class="mt-4 d-flex gap-2">
                        <button type="submit" class="btn btn-primary"><i class="fas fa-save me-1"></i><?= lang('finance.record_payment') ?></button>
                        <a href="/finance/payments" class="btn btn-secondary"><?= lang('common.cancel') ?></a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<?php $__view->push('scripts'); ?>
<script>
document.addEventListener('DOMContentLoaded', function() {
    <?php if (!$member): ?>
    $('#pay-member-select').select2({
        theme: 'bootstrap-5', width: '100%',
        ajax: {
            url: '/finance/api/members/search', dataType: 'json', delay: 300,
            data: function(params) { return { q: params.term, page: params.page || 1 }; },
            processResults: function(data) { return data; }
        },
        minimumInputLength: 2,
        placeholder: '<?= lang('finance.search_member') ?>...'
    }).on('select2:select', function(e) {
        // Load outstanding invoices for this member
        $.get('/finance/api/invoices/for-member', { member_id: e.params.data.id }, function(response) {
            var sel = document.getElementById('invoice-select');
            sel.innerHTML = '<option value=""><?= lang('finance.auto_allocate') ?></option>';
            if (response.data) {
                response.data.forEach(function(inv) {
                    var opt = document.createElement('option');
                    opt.value = inv.id;
                    opt.textContent = '#' + inv.invoice_number + ' - Balance: ' + parseFloat(inv.balance_due).toFixed(2);
                    sel.appendChild(opt);
                });
            }
        });
    });
    <?php endif; ?>
});
</script>
<?php $__view->endPush(); ?>