@include('layout.header')
<div class="recharge">
    <!-- HEADER -->
    <nav class="top_nav">
        <div class="left">
            <a href="{{ url('/user/bankCard') }}"><img src="{{ asset('assets/img/back_arrow.png') }}" alt="" />
            </a>
            <span>Add Bank Card</span>
        </div>
    </nav>
    <!-- HEADER -->

    <form action="{{ url('/user/addBankCard') }}" method="post">
        @csrf
        <div class="input_card">
            <ul class="card_ul list-unstyled">
                <li>
                    <p>Actual Name</p>
                    <input type="text" name="name" required />
                </li>
                <li>
                    <p>UPI Id</p>
                    <input type="text" name="upi" required />
                </li>
                <li>
                    <p>IFSC Code</p>
                    <input type="text" name="ifsc" required />
                </li>
                <li>
                    <p>Bank Name</p>
                    <input type="text" name="bank_name" required />
                </li>
                <li>
                    <p>Bank Account</p>
                    <input type="text" name="account" required />
                </li>
                <li>
                    <p>State/Territory</p>
                    <input type="text" name="state" required />
                </li>
                <li>
                    <p>City</p>
                    <input type="text" name="city" required />
                </li>
                <li>
                    <p>Address</p>
                    <input type="text" name="address" required />
                </li>
                <li>
                    <div>
                        <p>Mobile Number</p>
                        <span>+91</span> <input type="text" name="mobile_number" required />
                    </div>
                </li>
                <li>
                    <p>Email</p>
                    <input type="text" name="email" required />
                </li>
                @if (env('ENABLE_OTP'))
                    <li>
                        <p>Code</p>
                        <div style="display: flex">
                            <input type="text" id="login_otp" onkeyup="checkBankAccountOtp(this.value)"
                                onchange="checkBankAccountOtp(this.value)" oninput="checkBankAccountOtp(this.value)"
                                disabled placeholder="Verification Code" style="width:80%;" />
                            <input style="width:20%;" class="gocode m-t-12 m-b-12" type="button"
                                onclick="sendBankAccountOtp()" id="reg_otp" value="OTP" />
                        </div>
                        <div>
                            <span id="otp_error" class="error"></span>
                        </div>
                    </li>
                @endif
            </ul>

            <div class="container-fluid pb-5 pt-4">
                <div class="row">
                    <div class="col-10 col-md-8 col-lg-6 mx-auto">
                        <input type="submit" id="submit" class="w-100 btn btn-primary"
                            @if (env('ENABLE_OTP')) disabled="disabled" @endif value="Continue" />
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

<script>
    let mobile = "{{ Auth::user()->mobile }}";
</script>


@include('layout.footer')
