@extends('layout.main')

@push('title')
    <title>Payment- SSP Softpro India</title>
    
    <meta name="description" content="Get in touch with us for affordable website designing, digital marketing services in Tilak nagar, Delhi. Reach out to us.">
    <meta name="author" content="SSP Softrpo India Pvt Ltd">
    <meta name="robots" content="index, follow" />
    <meta name="distribution" content="global" />
    <meta name="coverage" content="india" />
    <meta name="object" content="document"/>
    <meta name="audience" content="All" />
    <meta name="revisit-after" content="1 day"/>
    <meta name="language" content="en"/>
    <meta name="rating" content="general"/>
    <meta name="copyright" content="© 2023 All Rights Reserved by SSP SoftPro India Pvt Ltd."/>
    
    
    <!--canonical tag-->
    <link rel="canonical" href="https://www.sspsoftproindia.com/payment"/>
    
    
      <!--Additional OG:Meta-->
    <meta property="og:type" content="Website"/>
    <meta property="og:title" content="Contact Us - SSP Softpro India"/>
    <meta property="og:description" content=""/>
    <meta property="og:site_name" content="SSP SoftPro India Pvt Ltd"/>
    <meta property="og:url" content="https://www.sspsoftproindia.com/payment"/>
    <meta property="og:image" content="https://www.sspsoftproindia.com/public/images/white-logo.png"/>
    
    
    
    <script type="application/ld+json">
{
  "@context": "https://schema.org/", 
  "@type": "BreadcrumbList", 
  "itemListElement": [{
    "@type": "ListItem", 
    "position": 1, 
    "name": "Home",
    "item": "https://www.sspsoftproindia.com/"  
  },{
    "@type": "ListItem", 
    "position": 2, 
    "name": "Our Contact",
    "item": "https://www.sspsoftproindia.com/contact"  
  }]
}
</script>

@endpush

@push('nav-bg')
    <header class="header-pr nav-bg-w main-header navfix fixed-top menu-white">
@endpush

@section('main-section')
    <section class="breadcrumb-area banner-6">
        <div class="text-block">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12 v-center">
                        <div class="bread-inner">
                            <div class="bread-menu wow fadeInUp" data-wow-delay=".2s">
                                <ul>
                                    <li><a href="{{ url('/') }}">Home</a></li>
                                    <li><a href="{{ url('/contact') }}">Payment</a></li>
                                </ul>
                            </div>
                            <div class="bread-title wow fadeInUp" data-wow-delay=".5s">
                                <h2>Pay Us</h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!--    <div class="modal-info">-->
    <!--        <div class="info">-->
    <!--            <h1>Enter the Amount</h1>-->
    <!--            <form method="post" style="margin-top: 50px;" id="myForm">-->
    <!--    @csrf-->
    <!--    <ul class="form-list">-->
    <!--                    <li class="form-list-row">-->
    <!--                        <div class="user">-->
    <!--                            <label for="#">Name</label><br>-->
    <!--                            <i class="fa fa-user"aria-hidden="true"></i></i><input type="text" name="name" required>-->
    <!--                        </div>-->
    <!--                    </li>-->
    <!--                </ul>-->
    <!--    <ul class="form-list">-->
    <!--                    <li class="form-list-row">-->
    <!--                        <div class="user">-->
    <!--                            <label for="#">Email</label><br>-->
    <!--                            <i class="fas fa-envelope"></i></i><input type="text" name="email" required>-->
    <!--                        </div>-->
    <!--                    </li>-->
    <!--                </ul>-->
    <!--    <ul class="form-list">-->
    <!--                    <li class="form-list-row">-->
    <!--                        <div class="user">-->
    <!--                            <label for="#">Phone</label><br>-->
    <!--                            <i class="fa fa-phone"></i></i><input type="number" name="phone" required>-->
    <!--                        </div>-->
    <!--                    </li>-->
    <!--                </ul>-->
    <!--    <ul class="form-list">-->
    <!--                    <li class="form-list-row">-->
    <!--                        <div class="user">-->
    <!--                            <label for="#">Amount</label><br>-->
    <!--                            <i class="fas fa-rupee-sign"></i></i><input type="number" min="1" name="amount" required>-->
    <!--                        </div>-->
    <!--                    </li>-->
    <!--                </ul>-->
    <!--    <div class="formgroup">-->
    <!--</div>-->
    <!--    <button type="submit" class="btn btn-primary">Pay Now</button>-->
    <!--</form>-->
    
    <section class="contact-page pad-tb bg-gradient2">
        <div class="container">
            <div class="row justify-content-between">
                <div class="col-lg-6 col-md-6 col-sm-12" style="justify-content: start;display: flex;align-items: center;">
                     <img src="public/images/Mobile_payments-rafiki-removebg-preview.png"/>
                </div>
                <div class="col-lg-6 col-md-6 col-sm-12">
                    <div class="niwax23form shadow">
                        <div class="common-heading text-l">
                            <h2 class="mt0 mb0">Get In Touch</h2>
                            <p class="mb50 mt10">We will catch you as early as we receive the message</p>
                        </div>
                        <div class="contact-form-card-pr contact-block-sw m0 iconin">
                            <div class="form-block niwaxform">
                                <form action="{{ route('razorpay.payment') }}" method="post">
                                   @csrf
                                    <input type="hidden" name="contact" value="contact">
                                    <div class="fieldsets">
                                        <div class="form-group floating-label">
                                            <div class="formicon"><i class="fas fa-user"></i></div>
                                            <input type="text" placeholder="" name="name" class="floating-input" value="{{ old('name') }}">
                                            <label>Full Name*</label>
                                        </div>
                                    </div>
                                    <div class="fieldsets row">
                                        <div class="col-md-6 form-group floating-label">
                                            <div class="formicon"><i class="fas fa-envelope"></i></div>
                                            <input type="text" placeholder=" " class="floating-input" name="email" value="{{ old('email') }}">
                                            <label>Email*</label>
                                        </div>
                                        <div class="col-md-6 form-group floating-label">
                                            <div class="formicon"><i class="fas fa-phone-alt"></i></div>
                                            <input type="tel" placeholder=" " class="floating-input" name="phone" value="{{ old('phone') }}">
                                            <label>Phone*</label>
                                        </div>
                                    </div>
                                    <div class="fieldsets row">
                                        <div class="col-md-6 form-group floating-label">
                                            <div class="formicon"><i class="fa fa-rupee"></i></div>
                                            <input type="number" placeholder=" " class="floating-input" name="amount" value="{{ old('amount') }}">
                                            <label>Amount*</label>
                                        </div>
                                    </div>
                                    <div class="fieldsets row textareax">
                                        <div class="col-md-12 form-group floating-label">
                                            <div class="formicon"><i class="fas fa-comment-dots"></i></div>
                                            <textarea placeholder=" " class="floating-input" name="remarks"></textarea>
                                            <label>Remarks*</label>
                                        </div>
                                    </div>
                                    <div class="fieldsets mt20">
                                        <button type="submit" name="contact-form" class="btn btn-main bg-btn w-fit mb20">
                                            <span>Submit <i class="fas fa-chevron-right fa-icon"></i></span>
                                            <span class="loader"></span>
                                        </button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
            
            @endsection