@extends($data['layout'])

@section('title', 'Checkout - ' . app_name())

@section('content')
<div class="row">
    <div class="col-md-12 mb-2">
        <div id="main-banner-after-header"  class="bg-buttery-white align-items-center d-flex banner-3 justify-content-center">
            <h1 class="title category_detail_heading h1-tag">
                Checkout
            </h1>
        </div>
    </div>
</div>

@if($data['layout'] == 'frontend.layouts.app' )
    @include('includes.partials.bread-crumbs')
@endif

    <div class="container-fluid">
        {{-- <div class="row">
            <div class="col-md-12 mt-4 mb-2">
                <h2 class="title">Checkout</h2>
            </div>
        </div> --}}
        <div class="row">
            <div class="col-12 page-content mb-5">
                <div class="checkout-page">
                    <div class="row row-40">
                        <div class="col-12">
                            @if(session()->get('flash_danger'))
                                <div class="alert alert-danger" role="alert">
                                    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                        <span aria-hidden="true">&times;</span>
                                    </button>
                                    <i class="fa fa-exclamation-triangle" aria-hidden="true"></i>
                                    @if(is_array(json_decode(session()->get('flash_danger'), true)))
                                        {!! implode('', session()->get('flash_danger')->all(':message<br/>')) !!}
                                    @else
                                        {!! session()->get('flash_danger') !!}
                                    @endif
                                </div>
                            @endif
                            @if(request()->input('pc') == '1')
                                <div class="alert alert-danger" role="alert">
                                    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                        <span aria-hidden="true">&times;</span>
                                    </button>
                                    <i class="fa fa-exclamation-triangle" aria-hidden="true"></i>
                                    Seems like you have returned from PayPal without making payment, would you like to pay using Credit Card?
                                </div>
                            @endif
                            @if(!$data['customer'])
                                <div class="user-actions mt-1 coupon-accordion">
                                    {{-- <h3 class="h5">
                                        <i class="zmdi zmdi-account-o" aria-hidden="true"></i>
                                        Returning customer?
                                        <a class="Returning h6" id="sp_customer_login_link" href="javascript:;">Click here to login</a>

                                        </h3> --}}
                                        <!-- Implement new design -->
                                        <h3>Returning customer? <span id="showlogin"><a class="Returning" id="sp_customer_login_link" href="javascript:;">Click here to login</a></span></h3>
                                        <div id="checkout-login" class="coupon-content" style="display: none;">
                                        <div class="coupon-info">
                                            <p class="coupon-text mb-2"> If you have shopped with us before, please enter your details in the boxes below. If you are a new
                                                customer please proceed to the Billing & Shipping section.
                                            </p>
                                            {{ html()->form('POST', route('frontend.auth.login.post'))->open() }}
                                            <p class="form-row-first">
                                            {{ html()->label(__('validation.attributes.frontend.email'))->for('email') }}
                                                {{ html()->email('email')
                                                    ->class('text_input')
                                                    ->placeholder(__('validation.attributes.frontend.email'))
                                                    ->attribute('maxlength', 191)
                                                    ->required() }}
                                            </p>
                                            <p class="form-row-last">
                                            {{ html()->label(__('validation.attributes.frontend.password'))->for('password') }}
                                                {{ html()->password('password')
                                                    ->class('text_input')
                                                    ->placeholder(__('validation.attributes.frontend.password'))
                                                    ->required() }}
                                            </p>
                                            <p class="form-row">
                                                <input value="Login" type="submit">
                                                <label>
                                                {{ html()->label(html()->checkbox('remember', true, 1) . ' ' . __('labels.frontend.auth.remember_me'))->for('remember') }}
                                                </label>
                                            </p>
                                            <p class="lost-password"><a href="/reset-password">Lost your password?</a></p>
                                            {{ html()->form()->close() }}
                                        </div>
                                    </div>
                                    <!-- done -->
                                   {{-- <div id="checkout_login" class="d-none mb-2">
                                        <div class="checkout_info">
                                            <p>
                                                If you have shopped with us before, please enter your details in the boxes below. If you are a new
                                                customer please proceed to the Billing & Shipping section.
                                            </p>
                                            {{ html()->form('POST', route('frontend.auth.login.post'))->open() }}
                                                <div class="form_group">
                                                    {{ html()->label(__('validation.attributes.frontend.email'))->for('email') }}
                                                    {{ html()->email('email')
                                                        ->class('text_input')
                                                        ->placeholder(__('validation.attributes.frontend.email'))
                                                        ->attribute('maxlength', 191)
                                                        ->required() }}
                                                </div>
                                                <div class="form_group">
                                                    {{ html()->label(__('validation.attributes.frontend.password'))->for('password') }}
                                                    {{ html()->password('password')
                                                        ->class('text_input')
                                                        ->placeholder(__('validation.attributes.frontend.password'))
                                                        ->required() }}
                                                </div>
                                                <div class="form_group group_3 pt-2 mb-1">
                                                    <button type="submit" class="btn btn-primary button_for_new_design">Login</button>
                                                    <label for="remember_box" class="ps-1">
                                                        {{ html()->label(html()->checkbox('remember', true, 1) . ' ' . __('labels.frontend.auth.remember_me'))->for('remember') }}
                                                    </label>
                                                </div>
                                                <a href="{{ route('frontend.auth.password.reset') }}">Lost your password?</a>
                                            {{ html()->form()->close() }}
                                        </div>
                                    </div> --}}
                                </div>
                            @endif
                        </div>
                        <div class="col-lg-8 mb-20">
                            <div class="accordion checkout_form quicky-form mb-4" id="accordion_order">
                                <div class="card mb-2">
                                    <div class="card-header card-border" id="acc_shipping_address">
                                        <h4 class="mb-0">
                                            <a href="javascript:;" class="checkout-headers" data-toggle="collapse" data-target="#acc_body_shipping_address" aria-expanded="true" aria-controls="collapseOne">
                                                <i class="zmdi zmdi-home" aria-hidden="true"></i> Shipping Address
                                            </a>
                                        </h4>
                                    </div>
                                    <div id="acc_body_shipping_address"  @if(!empty($data['shipping_details']['email']) || $data['checkout_step'] != '1') class="collapse" @endif aria-labelledby="acc_shipping_address" data-parent="#accordion_order">
                                        <div class="card-body">
                                            <div id="div_saved_addresses" @if($data['address_option'] == 'new') class="d-none" @endif>
                                                <h6 class="pb-3">Please select from already saved addresses:</h6>
                                                @if($data['customer'] && count($data['customer']->addresses) > 0)
                                                    @foreach($data['customer']->addresses as $address)
                                                        <fieldset class="scheduler-border p-3 @if($data['shipping_address_id'] == $address->id) selected @endif" title="Use this address for shipping" id="fs_{{ $address->id }}">
                                                            <legend class="scheduler-border"><span>{{ $address->first_name . ' ' . $address->last_name }}</span></legend>
                                                            <div class="control-group">
                                                                <div class="row">
                                                                    <div class="col-md-8">
                                                                        @if(trim($address->company) != null) {{ $address->company }} <br> @endif
                                                                        {!! $address->address1.' <br> '. ( empty($address->address2) ? '' : $address->address2 . ' <br> ' ) . $address->city.', '. \App\Models\State::get_state_name($address->state) .', '.$address->zip.' <br> '. \App\Models\Country::get_country_name($address->country)  !!}
                                                                        @if(trim($address->phone) != null) <br> Tel: {{ $address->phone }} @endif
                                                                        <div class="d-none"><input type="radio" value="{{ $address->id }}" name="sp_id" id="sp_id_{{ $address->id }}" @if($data['shipping_address_id'] == $address->id) checked="checked" @endif></div>
                                                                    </div>
                                                                    <div class="col-md-4 text-right"><button onclick="select_shipping_address({{ $address->id }});" type="button" class="button mobile-btn use-address @if($data['layout'] == 'frontend.layouts.mobile' ) bg-black px-2 py-1 text-white @endif">Use This Address</button></div>
                                                                </div>
                                                            </div>
                                                        </fieldset>
                                                    @endforeach
                                                    <div class="float-right form-group pt-25" style="padding-left: 13px;">
                                                        <div id="sp-shipping-error"></div>
                                                        <button type="button" class="button @if($data['layout'] == 'frontend.layouts.mobile' ) bg-black px-2 py-1 text-white mobile-btn @endif" id="add_shipping_address">Use Different Address</button>
                                                        <button type="button" class="button @if($data['layout'] == 'frontend.layouts.mobile' ) bg-black px-2 py-1 text-white mt-2 mobile-btn @endif" id="shipping_address_continue">Continue</button>
                                                    </div>
                                                    <div class="clearfix"></div>
                                                @endif
                                            </div>
                                            <div id="div_shipping_address_new" @if($data['address_option'] == 'existing') class="d-none" @endif>
                                                {!! Form::open(array('method' => 'POST', 'id' => 'frm_checkout_address')) !!}
                                                <div id="billing-form11" class="mb-40">
                                                    <div class="row">
                                                        @if(!$data['customer'])
                                                            <div class="col-md-12 col-12 mb-20">
                                                                {!! Form::label('email', 'Email Address:') !!}
                                                                {{-- {!! Form::text('email', $data['v_shipping_details']['email'], ['required' => 'required', 'class' => 'text_input', 'placeholder' => 'Enter email address ...', 'id' => 'sp_email', 'type' => 'email']) !!} --}}
                                                                <input value="{{$data['v_shipping_details']['email']}}" class="text_input" id="sp_email" type="email" pattern="^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$"  required name="email" class="form-control mb-0" oninvalid="setCustomValidity('Please enter a valid email address.')" onchange="try{setCustomValidity('')}catch(e){}" placeholder="Enter email address ...">
                                                                <div id="div_sp_email" class="alert alert-info d-none mt--10" role="alert"></div>
                                                            </div>
                                                        @endif
                                                        <div class="col-md-6 col-12 mb-20">
                                                            {!! Form::label('first_name', 'First Name:') !!}
                                                            {!! Form::text('first_name', $data['v_shipping_details']['first_name'],['required' => 'required', 'placeholder'=>'Enter first name ...', 'class' => 'text_input']) !!}
                                                        </div>
                                                        <div class="col-md-6 col-12 mb-20">
                                                            {!! Form::label('last_name', 'Last Name:') !!}
                                                            {!! Form::text('last_name', $data['v_shipping_details']['last_name'],['required' => 'required', 'placeholder'=>'Enter last name ...', 'class' => 'text_input']) !!}
                                                        </div>
                                                        <div class="col-12 mb-20">
                                                            {!! Form::label('company', 'Company:') !!}
                                                            {!! Form::text('company', $data['v_shipping_details']['company'],['placeholder'=>'Enter company name ...', 'class' => 'text_input']) !!}
                                                        </div>

                                                        <div class="col-12 mb-20">
                                                            <label for="address1">Address *</label>
                                                            {!! Form::text('address1', $data['v_shipping_details']['address1'],['required' => 'required', 'placeholder'=>'Enter address line 1...', 'id' => 'address1', 'class' => 'text_input']) !!}
                                                            <div class="pt-1">{!! Form::text('address2', $data['v_shipping_details']['address2'],['placeholder'=>'Enter address line 2 ...', 'id' => 'address2', 'class' => 'text_input']) !!}</div>
                                                        </div>
                                                        <div class="col-12 col-12 mb-20">
                                                            {!! Form::label('country', 'Country:') !!}
                                                            {!! Form::select('country', $data['countries'], $data['v_shipping_details']['country'],['class' => 'form-control', 'required' => 'required', 'class' => 'text_input', 'onchange="get_states(this.value);"', 'placeholder'=>'Select country ...']) !!}
                                                        </div>
                                                        <div class="col-md-6 col-12 mb-20">
                                                            {!! Form::label('state', 'State:') !!}
                                                            <div id="div_state">
                                                                @php
                                                                    $show_text_field = true;
                                                                    if(isset($data['address']))
                                                                    {
                                                                        if(is_numeric($data['address']->state))
                                                                            $show_text_field = false;
                                                                    }
                                                                @endphp
                                                                @if($show_text_field)
                                                                    {!! Form::text('state', $data['v_shipping_details']['state'], ['required' => 'required', 'placeholder'=>'Enter state ...', 'class' => 'text_input']) !!}
                                                                @else
                                                                    {!! Form::select('state', $data['states'], $data['v_shipping_details']['state'],['class' => 'text_input', 'required' => 'required', 'placeholder'=>'Enter state ...']) !!}
                                                                @endif
                                                            </div>
                                                        </div>
                                                        <div class="col-md-6 col-12 mb-20">
                                                            {!! Form::label('city', 'City:') !!}
                                                            {!! Form::text('city', $data['v_shipping_details']['city'],['required' => 'required', 'placeholder'=>'Enter city ...', 'class' => 'text_input']) !!}
                                                        </div>
                                                        <div class="col-md-6 col-12 mb-20">
                                                            {!! Form::label('zip', 'Zip / Post Code:') !!}
                                                            {!! Form::text('zip', $data['v_shipping_details']['zip'],['required' => 'required', 'maxlength'=>'8', 'placeholder'=>'Enter zip / post code ...', 'class' => 'checkout_zip_code text_input', 'id' =>'checkout_zip']) !!}
                                                        </div>
                                                        <div class="col-md-6 col-12 mb-20">
                                                            {!! Form::label('phone', 'Phone:') !!}
                                                            {{-- {!! Form::text('phone', $data['v_shipping_details']['phone'],['required' => 'required','pattern'=>"\d*",'maxlength'=>'13', 'placeholder'=>'Enter phone ...', 'class' => 'text_input' , 'id' =>'checkout_phone']) !!} --}}
                                                            {{ html()->text('phone')->value($data['v_shipping_details']['phone'])
                                                            ->placeholder(__('validation.attributes.frontend.phone'))
                                                            ->class(['phone', 'text_input'])
                                                            ->id('phone')
                                                            ->required()
                                                            ->style('transition:none') }}
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="pt-1">
                                                    <div id="sp-shipping-error-form"></div>
                                                    <button type="submit" class="btn btn-primary button_for_new_design">Continue</button>
                                                    @if($data['customer'] && count($data['customer']->addresses) > 0)
                                                        <button type="button" class="btn btn-info button_for_new_design @if($data['layout'] == 'frontend.layouts.mobile' ) mt-2 @endif" id="select_saved_shipping_address">Use From Existing Address</button>
                                                    @endif
                                                </div>
                                                {!! Form::close() !!}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="card mb-2">
                                    {!! Form::open(array('method' => 'POST', 'id' => 'frm_checkout_shipping')) !!}
                                    {{-- {!! Form::open(array('route' => 'frontend.save-order', 'method' => 'POST', 'id' => 'frm_checkout_shipping')) !!} --}}
                                    <div class="card-header card-border" id="acc_shipping_method">
                                        <h4 class="mb-0">
                                            <a href="javascript:;" class="checkout-headers" disabled="disabled" data-toggle="collapse" data-target="#acc_body_shipping_method" aria-expanded="true" aria-controls="collapseOne">
                                                <i class="zmdi zmdi-truck" aria-hidden="true"></i> Shipping Method
                                            </a>
                                        </h4>
                                    </div>
                                    @php
                                        if((!empty($data['shipping_details']['email']) && !isset($data['shipping_rate'])) || $data['checkout_step'] == '2')
                                            $css = '';
                                        else
                                            $css = 'class="collapse"';
                                    @endphp
                                    <div id="acc_body_shipping_method" {!! $css !!} aria-labelledby="acc_shipping_method" data-parent="#accordion_order">
                                        <div class="card-body">
                                            <div class="alert alert-warning d-none" role="alert" id="shipping_alert">
                                                <i class="fa fa-exclamation-triangle" aria-hidden="true"></i> Please select the shipping service to continue.
                                            </div>
                                            <div id="div_shipping_rates">
                                                @if(isset($data['rates']) && !isset($data['rates']['status']))
                                                    @foreach($data['rates'] as $service)
                                                        <div class="radio">
                                                            <label>
                                                                <input type="radio" name="shipping_service" value="{{ $service['enc'] }}" @if($service['selected']) checked="checked" @endif> {{ $service['service'] }} (${{ $service['rate'] }})
                                                            </label>
                                                        </div>
                                                    @endforeach
                                                @elseif(isset($data['rates']) && isset($data['rates']['status']) && $data['rates']['status'] == 0)
                                                    <div class="alert alert-warning" role="alert">{{ $data['rates']['message'] }}</div>
                                                @else
                                                    <strong>Sorry, no quotes are available for this order at this time.</strong><br><br>
                                                @endif
                                            </div>

                                            @php
                                                $notes = '';
                                                if(isset($data['shipping_details']['notes']))
                                                    $notes = $data['shipping_details']['notes'];
                                            @endphp
                                            <div id="div_shipping_notes">
                                                {!! Form::label('notes', 'Shipping / Order Notes:') !!}<br>
                                                {!! Form::textarea('notes', $notes, ['rows' => 4, 'placeholder'=>'Notes about your order, e.g. special notes for delivery ...', 'class' => 'form-control']) !!}
                                            </div>
                                            <div class="pt-1 form_group group_3 checkout-buttons" id="btn_checkout_shipping">
                                                <button type="submit" class="button @if($data['layout'] == 'frontend.layouts.mobile' ) mobile-btn bg-black px-2 py-1 text-white @endif">Continue</button>
                                                {{-- <button type="submit" class="btn btn-primary " id="btn_select_shipping_save_order">Continue</button> --}}
                                            </div>
                                        </div>
                                    </div>
                                    {!! Form::close() !!}
                                </div>
                                <div class="card">
                                    <div class="card-header card-border" id="acc_payment_form">
                                        <h4 class="mb-0">
                                            <a href="javascript:;" class="checkout-headers disabled" data-toggle="collapse" data-target="#acc_body_payment_form" aria-expanded="true" aria-controls="collapseOne">
                                                <i class="zmdi zmdi-card" aria-hidden="true"></i> Payment Method
                                            </a>
                                        </h4>
                                    </div>
                                    @php
                                        if((!empty($data['shipping_details']['email']) && isset($data['shipping_rate'])) || $data['checkout_step'] == '3')
                                            $css = '';
                                        else
                                            $css = 'class="collapse"';
                                    @endphp

                                    <div id="acc_body_payment_form" {!! $css !!} aria-labelledby="acc_payment_form" data-parent="#accordion_order">
                                        <div class="card-body">

                                            {!! Form::open(array('route' => 'frontend.save-order', 'method' => 'POST', 'id' => 'frm_payment_method')) !!}

                                            {!! Form::hidden('payment_method', null, ['id' => 'payment_method']) !!}

                                            <div id="div-payment-method-error"></div>

                                            <div class="payment-method-selection" id="div-payment-paypal" onclick="set_payment_option('paypal');">
                                                <table class="table table-borderless">
                                                    <tr>
                                                        <td width="70%">
                                                            <strong>Pay Using PayPal</strong>
                                                        </td>
                                                        <td rowspan="2" class="text-right">
                                                            <img src="static/assets/images/paypal.png" class="pt-2" alt="PayPal">
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>Fast, easy and secure</td>
                                                    </tr>
                                                </table>
                                            </div>

                                            <div class="payment-method-selection mt-1" id="div-payment-credit-card" onclick="set_payment_option('credit-card');">
                                                <table class="table table-borderless">
                                                    <tr>
                                                        <td width="70%">
                                                            <strong>Pay Using Credit / Debit Card</strong>
                                                        </td>
                                                        <td rowspan="2" class="text-right">
                                                            <img src="static/assets/images/pay_with_credit_cards.png" class="pt-4" alt="Pay with Credit Cards">
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>Visa, AMEX, MasterCard, Discover</td>
                                                    </tr>
                                                </table>
                                            </div>

                                            @if($data['customer'] && $data['customer']->group->bank_payment == 'Y')

                                                <div class="payment-method-selection mt-1" id="div-payment-bank-transfer" onclick="set_payment_option('bank-transfer');">
                                                    <table class="table table-borderless">
                                                        <tr>
                                                            <td width="70%">
                                                                <strong>Pay By Bank Transfer</strong>
                                                            </td>
                                                            <td rowspan="2" class="text-right">
                                                                <img src="static/assets/images/pay_with_bank_transfer.png" class="pt-4" alt="Pay with Bank Transfer">
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td>{!! \App\Models\Settings::getSettingValue(1) !!}</td>
                                                        </tr>
                                                    </table>
                                                </div>

                                            @endif

                                            <div class="pt-3 d-none" id="div-btn-payment">
                                                <button type="button" id="btn_proceed_to_payment" class="button  @if($data['layout'] == 'frontend.layouts.mobile' ) bg-black px-2 py-1 text-white @endif">Proceed to Payment</button>
                                            </div>

                                            {!! Form::hidden('h_shipping_details_exists', $data['h_shipping_details_exists'], ['id' => 'h_shipping_details_exists']) !!}
                                            {!! Form::hidden('h_shipping_method_exists', $data['h_shipping_method_exists'], ['id' => 'h_shipping_method_exists']) !!}

                                            {!! Form::close() !!}


                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4">
                            <div class="row">

                                <!-- Cart Total -->
                                <div class="col-12">
                                    <div class="checkout-cart-total order-summary">
                                        <h3 class="checkout-title">Order Review</h3>
                                        <h4>Product <span class="float-end">Total</span></h4>

                                        <ul>
                                            @php
                                                $sub_total = 0;
                                                $bogo_discount = 0;
                                            @endphp
                                            @foreach($data['cart'] as $cart)

                                                @php
                                                    //$sub_total += $cart->getPriceWithConditions();
                                                    $item_price = $cart->getPriceWithConditions();
                                                    $total_price = $cart->getPriceSumWithConditions();

                                                    if($cart->bogo_free)
                                                    {
                                                        $total_price_discount = $cart->bogo_free * $item_price;
                                                        $bogo_discount += $total_price_discount;
                                                        $talal_price_after_bogo = $total_price - $total_price_discount;
                                                    }

                                                    if($cart->bogod_count)
                                                    {
                                                        $discounted_price = ($item_price * $cart->bogod_percent) / 100;
                                                        $total_price_discount = $cart->bogod_count * $discounted_price;
                                                        $bogo_discount += $total_price_discount;
                                                        $talal_price_after_bogo = $total_price - $total_price_discount;
                                                    }

                                                    $sub_total += $total_price;
                                                @endphp

                                                <li>
                                                        <span class="left">
                                                            {{ $cart->name }}<br>&bull; <em>{{ $cart->attributes->sku }} &nbsp;
                                                            ({{ $cart->quantity }})
                                                                @if($cart->bogo_free)
                                                                    <br> <small class="red-text">{{ $cart->bogo_free }} free @if($cart->bogo_free > 1) items @else item @endif</small>
                                                                @elseif($cart->bogod_count)
                                                                    <br> <small class="red-text"> {{ $cart->bogod_percent }}% discount on {{ $cart->bogod_count }} @if($cart->bogod_count > 1) items @else item @endif</small>
                                                            @endif
                                                        </span>
                                                    @if($cart->bogo_free || $cart->bogod_count)
                                                        <span class="right">${{ number_format($talal_price_after_bogo, 2) }}</span>
                                                        {{--<small class="right red-text">{{ $cart->bogo_free }} free @if($cart->bogo_free > 1) items @else item @endif</small>--}}
                                                    @else
                                                        <span class="right" @if($cart->bogo_free || $cart->bogod_count) class="old-price" @endif>${{ number_format($cart->getPriceSumWithConditions(), 2) }}</span>
                                                    @endif
                                                </li>
                                            @endforeach
                                        </ul>

                                        @php
                                            $discount = 0;

                                            if(request()->session()->get('ses_coupon'))
                                            {
                                                $coupon = request()->session()->get('ses_coupon');

                                                if($coupon['type'] == 'amount')
                                                {
                                                    $discount = $coupon['value'];
                                                }
                                                else
                                                {
                                                    $discount = ($sub_total * $coupon['value']) / 100;
                                                }
                                            }

                                            if($bogo_discount)
                                            {
                                                $discount += $bogo_discount;
                                            }

                                            if( request()->session()->get('ses_shipping_rate') )
                                                $shipping_rate = request()->session()->get('ses_shipping_rate');
                                            else
                                                $shipping_rate = 0;

                                            $grand_total = ($sub_total + $shipping_rate) - $discount;

                                            session()->put('ses_grand_total', $grand_total);
                                        @endphp

                                        <p>Sub Total <span class="float-end">${{ number_format($sub_total, 2) }}</span></p>
                                        <p>Discount <span class="float-end">${{ number_format($discount, 2) }}</span></p>
                                        <p>Shipping Fee <span class="float-end" id="sp_shipping_fee">{{ $data['shipping_rate'] ?? "$0.00" }}</span></p>
                                        <h4 class="mt-4">Grand Total <span class="float-end" id="sp_grand_total">${{ number_format($grand_total, 2) }}</span></h4>

                                    </div>
                                </div>
                                <!-- Cart total -->
                            </div>
                        </div>
                    </div>
                </div>


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


            <!-- <div class="checkout-area">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <div class="coupon-accordion">
                        @if(!$data['customer'])
                            <h3>Returning customer? <span id="showlogin">Click here to login</span></h3>
                            <div id="checkout-login" class="coupon-content">
                                <div class="coupon-info">
                                    <p class="coupon-text">Quisque gravida turpis sit amet nulla posuere lacinia. Cras sed est
                                        sit amet ipsum luctus.</p>
                                    <form action="javascript:void(0)">
                                        <p class="form-row-first">
                                            <label>Username or email <span class="required">*</span></label>
                                            <input type="text" name="email">
                                        </p>
                                        <p class="form-row-last">
                                            <label>Password <span class="required">*</span></label>
                                            <input type="password" name="password" >
                                        </p>
                                        <p class="form-row">
                                            <input value="Login" type="submit">
                                            <label>
                                                <input type="checkbox">
                                                Remember me
                                            </label>
                                        </p>
                                        <p class="lost-password"><a href="javascript:void(0)">Lost your password?</a></p>
                                    </form>
                                </div>
                            </div>
                        @endif
                            <h3>Have a coupon? <span id="showcoupon">Click here to enter your code</span></h3>
                            <div id="checkout_coupon" class="coupon-checkout-content">
                                <div class="coupon-info">
                                    <form action="#">
                                        <p class="checkout-coupon">
                                            <input id="coupon_code" placeholder="Coupon code" type="text" name="coupon_code">
                                            <input class="coupon-inner_btn" name="apply_coupon" value="Apply Coupon" type="submit">
                                        </p>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-6 col-12">
                        <form action="javascript:void(0)">
                            <div class="checkbox-form">
                                <h3>Billing Details</h3>
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="country-select clearfix">
                                            <label>Country <span class="required">*</span></label>
                                            <select class="myniceselect nice-select wide">
                                                <option data-display="Bangladesh">Bangladesh</option>
                                                <option value="uk">London</option>
                                                <option value="rou">Romania</option>
                                                <option value="fr">French</option>
                                                <option value="de">Germany</option>
                                                <option value="aus">Australia</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="checkout-form-list">
                                            <label>First Name <span class="required">*</span></label>
                                            <input placeholder="" type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="checkout-form-list">
                                            <label>Last Name <span class="required">*</span></label>
                                            <input placeholder="" type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>Company Name</label>
                                            <input placeholder="" type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>Address <span class="required">*</span></label>
                                            <input placeholder="Street address" type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <input placeholder="Apartment, suite, unit etc. (optional)" type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="checkout-form-list">
                                            <label>Town / City <span class="required">*</span></label>
                                            <input type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="checkout-form-list">
                                            <label>State / County <span class="required">*</span></label>
                                            <input placeholder="" type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="checkout-form-list">
                                            <label>Postcode / Zip <span class="required">*</span></label>
                                            <input placeholder="" type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="checkout-form-list">
                                            <label>Email Address <span class="required">*</span></label>
                                            <input placeholder="" type="email">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="checkout-form-list">
                                            <label>Phone <span class="required">*</span></label>
                                            <input type="text">
                                        </div>
                                    </div>
                                    <div class="col-md-12">
                                        <div class="checkout-form-list create-acc">
                                            <input id="cbox" type="checkbox">
                                            <label>Create an account?</label>
                                        </div>
                                        <div id="cbox-info" class="checkout-form-list create-account">
                                            <p>Create an account by entering the information below. If you are a returning
                                                customer please login at the top of the page.</p>
                                            <label>Account password <span class="required">*</span></label>
                                            <input placeholder="password" type="password">
                                        </div>
                                    </div>
                                </div>
                                <div class="different-address">
                                    <div class="ship-different-title">
                                        <h3>
                                            <label>Ship to a different address?</label>
                                            <input id="ship-box" type="checkbox">
                                        </h3>
                                    </div>
                                    <div id="ship-box-info" class="row">
                                        <div class="col-md-12">
                                            <div class="myniceselect country-select clearfix">
                                                <label>Country <span class="required">*</span></label>
                                                <select class="myniceselect nice-select wide">
                                                    <option data-display="Bangladesh">Bangladesh</option>
                                                    <option value="uk">London</option>
                                                    <option value="rou">Romania</option>
                                                    <option value="fr">French</option>
                                                    <option value="de">Germany</option>
                                                    <option value="aus">Australia</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="checkout-form-list">
                                                <label>First Name <span class="required">*</span></label>
                                                <input placeholder="" type="text">
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="checkout-form-list">
                                                <label>Last Name <span class="required">*</span></label>
                                                <input placeholder="" type="text">
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="checkout-form-list">
                                                <label>Company Name</label>
                                                <input placeholder="" type="text">
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="checkout-form-list">
                                                <label>Address <span class="required">*</span></label>
                                                <input placeholder="Street address" type="text">
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="checkout-form-list">
                                                <input placeholder="Apartment, suite, unit etc. (optional)" type="text">
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="checkout-form-list">
                                                <label>Town / City <span class="required">*</span></label>
                                                <input type="text">
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="checkout-form-list">
                                                <label>State / County <span class="required">*</span></label>
                                                <input placeholder="" type="text">
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="checkout-form-list">
                                                <label>Postcode / Zip <span class="required">*</span></label>
                                                <input placeholder="" type="text">
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="checkout-form-list">
                                                <label>Email Address <span class="required">*</span></label>
                                                <input placeholder="" type="email">
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <div class="checkout-form-list">
                                                <label>Phone <span class="required">*</span></label>
                                                <input type="text">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="order-notes">
                                        <div class="checkout-form-list checkout-form-list-2">
                                            <label>Order Notes</label>
                                            <textarea id="checkout-mess" cols="30" rows="10" placeholder="Notes about your order, e.g. special notes for delivery."></textarea>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="col-lg-6 col-12">
                        <div class="your-order">
                            <h3>Your order</h3>
                            <div class="your-order-table table-responsive">
                                <table class="table">
                                    <thead>
                                        <tr>
                                            <th class="cart-product-name">Product</th>
                                            <th class="cart-product-total">Total</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr class="cart_item">
                                            <td class="cart-product-name"> Vestibulum suscipit<strong class="product-quantity">
                                            × 1</strong></td>
                                            <td class="cart-product-total"><span class="amount">£165.00</span></td>
                                        </tr>
                                        <tr class="cart_item">
                                            <td class="cart-product-name"> Vestibulum suscipit<strong class="product-quantity">
                                            × 1</strong></td>
                                            <td class="cart-product-total"><span class="amount">£165.00</span></td>
                                        </tr>
                                    </tbody>
                                    <tfoot>
                                        <tr class="cart-subtotal">
                                            <th>Cart Subtotal</th>
                                            <td><span class="amount">£215.00</span></td>
                                        </tr>
                                        <tr class="order-total">
                                            <th>Order Total</th>
                                            <td><strong><span class="amount">£215.00</span></strong></td>
                                        </tr>
                                    </tfoot>
                                </table>
                            </div>
                            <div class="payment-method">
                                <div class="payment-accordion">
                                    <div id="accordion">
                                        <div class="card">
                                            <div class="card-header" id="#payment-1">
                                                <h5 class="panel-title">
                                                    <a href="javascript:void(0)" class="" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                                                        Direct Bank Transfer.
                                                    </a>
                                                </h5>
                                            </div>
                                            <div id="collapseOne" class="collapse show" data-bs-parent="#accordion">
                                                <div class="card-body">
                                                    <p>Make your payment directly into our bank account. Please use your Order
                                                        ID as the payment
                                                        reference. Your order won’t be shipped until the funds have cleared in
                                                        our account.</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="card">
                                            <div class="card-header" id="#payment-2">
                                                <h5 class="panel-title">
                                                    <a href="javascript:void(0)" class="collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                                                        Cheque Payment
                                                    </a>
                                                </h5>
                                            </div>
                                            <div id="collapseTwo" class="collapse" data-bs-parent="#accordion">
                                                <div class="card-body">
                                                    <p>Make your payment directly into our bank account. Please use your Order
                                                        ID as the payment
                                                        reference. Your order won’t be shipped until the funds have cleared in
                                                        our account.</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="card">
                                            <div class="card-header" id="#payment-3">
                                                <h5 class="panel-title">
                                                    <a href="javascript:void(0)" class="collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                                                        PayPal
                                                    </a>
                                                </h5>
                                            </div>
                                            <div id="collapseThree" class="collapse" data-bs-parent="#accordion">
                                                <div class="card-body">
                                                    <p>Make your payment directly into our bank account. Please use your Order
                                                        ID as the payment
                                                        reference. Your order won’t be shipped until the funds have cleared in
                                                        our account.</p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="order-button-payment">
                                        <input value="Place order" type="submit">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div> -->



    @push('after-scripts')
        <script>
            @if($data['shipping_details']['country'] != '')
            $(function(){
                get_states($('#country').val(), '{{ $data['shipping_details']['state'] }}');
            });
            @endif
            @if(session()->get('move_to'))
            move_page_to('{{ session()->get('move_to') }}');
            @endif
        </script>
        <script defer src="/js/custom.js?version=004"></script>
        <script>
            function select_shipping_address(sp_id) {
                $(".scheduler-border").removeClass("selected");
                $("input[name='sp_id']").each(function () {
                    if ($(this).val() == sp_id) $(this).prop("checked", true);
                    else $(this).prop("checked", false);
                });
                $("#fs_" + sp_id).addClass("selected");
            }
        </script>
        @if($data['layout'] == 'frontend.layouts.mobile' )
            <script>
                $("#add_shipping_address").on("click", function () {
                    $("#div_saved_addresses").addClass("d-none");
                    $("#div_shipping_address_new").removeClass("d-none");
                });

                $("#select_saved_shipping_address").on("click", function () {
                    $("#div_saved_addresses").removeClass("d-none");
                    $("#div_shipping_address_new").addClass("d-none");
                });

                $("#shipping_address_continue").on("click", function () {
                    let checked = false;
                    let sp_id = null;
                    $("input[name='sp_id']").each(function () {
                        if ($(this).prop("checked")) {
                            checked = true;
                            sp_id = $(this).val();
                        }
                    });
                    if (checked) {
                        show_overlay();
                        $.ajax({
                            method: "get",
                            url: "/set-shipping-address",
                            data: { sp_id: sp_id },
                        }).done(function (msg) {
                            if (msg.status == "1") {console.log(msg)
                                print_shipping(msg);
                            } else {
                                $("#div_shipping_rates, #sp-shipping-error").html(
                                    '<div class="alert alert-danger" role="alert">' +
                                        msg.message +
                                        "</div>"
                                );
                                document.getElementById('error-text').innerHTML = msg.message;
                            }

                            hide_overlay();
                        });
                    } else {
                        alert("Please select shipping address to continue.");
                    }
                });
            </script>
        @endif
    @endpush
@endsection