@php
    $balance = getWalletBallance($userId);
    $user    = App\Models\User::find($userId);
@endphp
<form action="{{ route('payment.pay_to_customer') }}" method="POST">
    @csrf
    <input type="hidden" name="user_id" value="{{ $userId }}">
    <div class="modal-header" style="background:linear-gradient(135deg,#667eea,#764ba2);border:none;">
        <div>
            <h5 class="modal-title h6 text-white mb-1">💳 Pay to Customer</h5>
            <div style="font-size:12px;color:rgba(255,255,255,0.8);">{{ $user->name ?? '' }} · {{ $user->phone ?? '' }}</div>
        </div>
        <button type="button" class="close text-white" data-dismiss="modal"><span>&times;</span></button>
    </div>
    <div class="modal-body">
        {{-- Balance Info --}}
        <div style="background:#f8fafc;border-radius:12px;padding:14px;margin-bottom:16px;display:flex;justify-content:space-between;align-items:center;">
            <div>
                <div style="font-size:11px;color:#718096;font-weight:600;text-transform:uppercase;">Available Balance</div>
                <div style="font-size:20px;font-weight:800;color:#2d3748;">{{ single_price($balance) }}</div>
            </div>
            <a href="/admin/customers/{{ $userId }}/wallet" target="_blank"
               style="font-size:12px;color:#667eea;text-decoration:none;">
                View History →
            </a>
        </div>

        <div class="form-group">
            <label style="font-weight:600;font-size:13px;">Amount (₹) <span class="text-danger">*</span></label>
            <input type="number" lang="en" min="0" max="{{ $balance }}" step="0.01"
                   name="amount" id="pay-amount" value=""
                   class="form-control" required
                   style="border:1.5px solid #e2e8f0;border-radius:10px;padding:10px 14px;font-size:14px;"
                   placeholder="Enter amount to pay">
        </div>

        <div class="form-group">
            <label style="font-weight:600;font-size:13px;">Payment Method <span class="text-danger">*</span></label>
            <select name="payment_method" class="form-control" required
                    style="border:1.5px solid #e2e8f0;border-radius:10px;padding:10px 14px;font-size:13px;">
                <option value="">Select Payment Method</option>
                <option value="bank_payment">Bank Payment</option>
                <option value="upi">UPI</option>
                <option value="cash">Cash</option>
            </select>
        </div>
    </div>
    <div class="modal-footer" style="border-top:1px solid #f0f0f0;">
        <button type="button" class="btn btn-light" data-dismiss="modal">Cancel</button>
        <button type="submit" class="btn"
                style="background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:10px;padding:8px 20px;font-weight:700;">
            Pay Now 💸
        </button>
    </div>
</form>