@extends('shop.layouts.app')

@section('content')
    <section class="bg-gray-300 py-5">
        <form class="container-wrap">
            <div class="row">
                <div class="col-md-8">
                    <div class="card">
                        <h5 class="card-header">
                            Checkout
                        </h5>
                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-6 mb-4">
                                    <label for="">First name <span class="text-danger">*<span></label>
                                    <input type="text" class="form-control" placeholder="First name">
                                </div>
                                <div class="col-md-6 mb-4">
                                    <label for="">Last name <span class="text-danger">*<span></label>
                                    <input type="text" class="form-control" placeholder="Last name">
                                </div>
                                <div class="col-md-6 mb-4">
                                    <label for="">Email Address <span class="text-danger">*<span></label>
                                    <input type="text" class="form-control" placeholder="Email Address">
                                </div>
                                <div class="col-md-6 mb-4">
                                    <label for="">Phone Number <span class="text-danger">*<span></label>
                                    <input type="text" class="form-control" placeholder="Phone Number">
                                </div>
                                <div class="col-md-6 mb-4">
                                    <label for="">Address <span class="text-danger">*<span></label>
                                    <input type="text" class="form-control" placeholder="Address">
                                </div>
                                <div class="col-md-6 mb-4">
                                    <label for="">City <span class="text-danger">*<span></label>
                                    <input type="text" class="form-control" placeholder="City">
                                </div>
                                <div class="col-md-6 mb-4">
                                    <label for="">Provice <span class="text-danger">*<span></label>
                                    <input type="text" class="form-control" placeholder="Provice ">
                                </div>
                                <div class="col-md-6 mb-4">
                                    <label for="">Postal Code <span class="text-danger">*<span></label>
                                    <input type="text" class="form-control" placeholder="Postal Code">
                                </div>
                                <div class="col-md-12 mb-4">
                                    <label for="">Instructions </label>
                                    <textarea name="" id="" class="form-control"  rows="5"></textarea>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-4">
                    <div class="order-summary card p-4">
                        <h5 class="fw6 mb-4">Cart Summary</h5>

                        <div class="row mb-3">
                            <span class="col-8">Sub Total</span>
                            <span class="col-4 text-right">${{ Session::get('total') }}</span>
                        </div>

                        <div class="row mb-3">
                            <span id="taxrate-0" class="col-8">Discount Amount</span>
                            <span id="basetaxamount-0" class="col-4 text-right">$0.00</span>
                        </div>

                        <div class="row mb-3">
                            <span id="taxrate-0" class="col-8">Tax</span>
                            <span id="basetaxamount-0" class="col-4 text-right">$0.00</span>
                        </div>
                        <hr>
                        <div id="grand-total-detail" class="payable-amount row mb-5">
                            <span class="col-8">Grand Total</span>
                            <span id="grand-total-amount-detail" class="col-4 text-right fw6">${{ Session::get('total') }}</span>
                        </div>

                            <div>
                                <button   class="btn btn-success btn-block btn-lg">Proceed to checkout</button>
                            </div>
                    </div>
                </div>
            </div>
        </form>
    </section>
@endsection
