@extends('web.layout.master')

@section('content')
<style>
    //PR, VI, GU, MP, AP, AA, AP
    .card-input-element:checked + .card {
      border: 1px solid black;
    }


    .card-input {
        margin: 10px;
        padding: 00px;
    }

    .card-input:hover {
        cursor: pointer;
    }

    .select2-dropdown {
        z-index:99999;
    }

    .modal>span.select2-container {
        z-index:10050;
    }
    .paybutton:disabled {
        background: #333;
        border: 1px solid #333;
    }

   #loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    text-align: center;
    background: url(https://i.imgur.com/Cn9MC39.gif) 50% 50% no-repeat rgba(255,255,255,0.9);
    vertical-align: middle;
    color: #000;
    background-size: 80px;
    background-position: center;

}
#loader p{
    position: fixed;
    top: calc(50% + 90px);
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    text-align: center;

    vertical-align: middle;
    color: #000;

}
#loader:before{
      content: attr(data-wordLoad);
      color: #000;
      position: absolute;
      top: calc(50% + 50px);
    //   left: calc(50% - 90px);
        width: 100%;
        display: table-cell;
        text-align: center;
        vertical-align: middle;
      font-size: 1.5rem;
}
#qtyloader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    text-align: center;
    background: url(https://i.imgur.com/Cn9MC39.gif) 50% 50% no-repeat rgba(255,255,255,0.9);
    vertical-align: middle;
    color: #000;
    background-size: 80px;
    background-position: center;

}
#qtyloader p{
    position: fixed;
    top: calc(50% + 90px);
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    text-align: center;

    vertical-align: middle;
    color: #000;

}
#qtyloader:before{
      content: attr(data-wordLoad);
      color: #000;
      position: absolute;
      top: calc(50% + 50px);
    //   left: calc(50% - 90px);
        width: 100%;
        display: table-cell;
        text-align: center;
        vertical-align: middle;
      font-size: 1.5rem;
}
    @media only screen and (max-width: 767px){
        .shipping-wrapper .sticky-top {top: 75px;}
        }
        #flip{ display: none;}
    @media only screen and (max-width: 1199px) {
        .giftcard-main-left{width: 80%;}
    }
    @media only screen and (max-width: 991px) {
        .giftcard-main-left{width: 70%;}
    }
    @media only screen and (max-width: 767px) {
        .giftcard-main-left{width: 85%;}
        .shipping-form-3column-main ul li {padding: 0 0px 15px 0px;float: none;width: 100%;}
        .shipping-form-3column-main ul{ margin: 0px;}
        #flip{ display: block;}
        #flip {padding: 5px;text-align: center; cursor: pointer; background-color: #dc3545;border: solid 1px #dc3545;margin: 0px 0px 20px 0px; border-radius: 10px; color: #fff;}
        #panel {display: none;}
        .sticky-top.bg-right {margin: 0 0 20px 0;}
    }
    @media only screen and (max-width: 500px) {
        .giftcard-main-left{width: 80%;}
        .shipping-wrapper{
            margin-top: 5px !important;
        }
    }
    @media only screen and (max-width: 400px) {
        .giftcard-main-left{width: 75%;}
    }

    @media only screen and (min-width: 767px){
        .bg-right {
        background-color: #f1f1f1;
        border: 1px solid #ccc;
        padding: 6px;
        border-radius: 10px;
        /* position: fixed !important; */
        top: 200px !important;
        }
        .cust-sticky{
        //  z-index: -1 !important;
        }
        .cartlisting-main01{
            padding: 8px !important;
            margin-left: 6px !important;
        }
    }
</style>
<style>
    /* width */
    ::-webkit-scrollbar {
      width: 8px;
    }

    /* Track */
    ::-webkit-scrollbar-track {
      background: #f1f1f1;
    }

    /* Handle */
    ::-webkit-scrollbar-thumb {
      background: #888;
    }

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
      background: #555;
    }
</style>

<div id="loader" class="chkoutLoader" style="display: none" data-wordLoad="Your order is processing...">
    <!-- <h3>Your order is processing...</h3> -->
    <p>If you do not receive an order confirmation in 30 seconds please call 866.243.2721</p>
</div>
<div id="qtyloader" class="chkoutLoader" style="display: none" data-wordLoad="Loading...">
    <!-- <h3>Your order is processing...</h3> -->
</div>
<div class="container mt-5 shipping-wrapper">
    <div class="row">
        <div class="col-md-12"></div>
        <div class="col-md-5 order-md-2 sticky-top cust-sticky" >
            @php
            $total = 0;
            $qtyTotal = 0;
            @endphp

            @forelse ($cartItems as $item)
                @php
                    $total += ($item->price);
                    $qtyTotal += $item->quantity;
                @endphp
            @endforeach
            <div id="flip" class="clearfix flip-main">
                <div class="flip-left"><i class="fas fa-shopping-cart"></i> Shopping Cart Details</div>
                <div class="flip-right"> <span class="TotalAmount">$499.00</span>
                    <i class="fas fa-angle-down"></i>
                </div>
            </div>
            <div class="" id="panel" style="height:100%;">
                <div class="sticky-top1 bg-right" style="position:sticky;">
                    <div class="cartItemList" style="max-height:400px; overflow-y: scroll;overflow-x: hidden;">

                    </div>
                    <div class="row">
                        <div class="col-8" >
                          <input aria-labelledby="PartsWarehouse" placeholder="Coupon Code" type="text" name="coupon_code" id="coupon_code" class="form-control">
                          <span id="couponError" style="display: none"></span>&nbsp;&nbsp;<a href="#" onclick="removeCouponCode()" id="removeCouponCode" style="display: none">Remove</a>
                        </div>
                        <div class="col-4">
                            <img src="{{ asset('assets/web') }}/images/1_Apply.png" onclick="applyCouponCode()" style="cursor:pointer; margin-top:-4px;width:100%" class="cursor-pointer" alt="..." srcset="" height="42px" aria-label="">
                          <!-- <button aria-labelledby="..." class="btn btn-danger font-weight-bold" onclick="applyCouponCode()">Apply</button> -->
                        </div>

                      </div>
                      <div class="subtotal-main clearfix">
                        <div class="subtotal-left">
                          Subtotal
                        </div>
                        <div class="subtotal-right">
                          <strong class="subTotalAmount"></strong>
                        </div>
                      </div>
                      <div class="subtotal-main clearfix discountPriceDiv" style="display: none">
                        <div class="subtotal-left text-success">
                          Discount <span id="couponDiscountDiv"></span>
                        </div>
                        <div class="subtotal-right discountPrice text-success">
                          <span>Dependent upon shipping address</span>
                        </div>
                      </div>
                      <div class="subtotal-main clearfix">
                        <div class="subtotal-left">
                          Shipping <span id="surchageShippingrright"></span>
                        </div>
                        <div class="subtotal-right ShippingCharges">
                          <span>Dependent upon shipping address</span>
                        </div>
                      </div>
                      <div class="subtotal-main clearfix ShippingSurchargesDiv" style="display: none">
                        <div class="subtotal-left">
                          Shipping Surcharges
                        </div>
                        <div class="subtotal-right ShippingSurcharges">
                          <span>Dependent upon shipping address</span>
                        </div>
                      </div>
                      <div class="subtotal-main clearfix">
                        <div class="subtotal-left">
                         Estimated Tax
                        </div>
                        <div class="subtotal-right ShippingTax">
                          <span >Dependent upon shipping address</span>
                        </div>
                      </div>
                      <div class="final-total-main clearfix">
                        <div class="final-total-left">
                          Total
                        </div>
                        <div class="final-total-right" >
                          <span>USD</span> <strong class="TotalAmount">${{ number_format($total,2); }}</strong>
                        </div>
                      </div>
                      <div class="text-center d-lg-none" >
                            <button class="btn btn-success btn-sm cartMobileBtn" style="background: #bb2026;font-weight: 600;border-color: #bb2026;">Continue</button>
                      </div>
                </div>
            </div>
        </div>



        <div class="col-md-7 order-md-1">
            <h3>Shipping Address</h3>
            <!-- <h4>Shipping</h4>
            <p>Shipping options and tax will be calculated for your review prior to purchase.</p> -->
            <div class="row">
                <div class="col-md-12">
                    @if(!auth()->check())
                        <p class="mb-0">Already have an account? <span style="text-decoration:underline; cursor:pointer;" onclick="loginModel()">Login</span></p>
                    @else
                        <p class="mb-0">You are logged in as {{ Auth::user()->emailaddress }} (not you? <a href="{{ route('customer-logout') }}">Logout</a>)</p>
                    @endif
                </div>
                
            </div>
            


            <div class="express-checkout-wrapper">
                @if(!auth()->check())
                <!-- <div class="col-md-12" onclick="loginModel()" style="cursor:pointer; text-align:center; padding:5px; border:2px solid #000; border-radius: 5px;margin-bottom: 10px;">
                    <a><img src="{{ asset('assets/web') }}/images/PartsWarehouse_btn_img.png" style="height:45px;" /></a>
                </div> -->
                @endif
               <!-- <ul class="clearfix">
                    @if(!auth()->check())
                    {{--  <li><a aria-label="" href="#" onclick="loginModel()"><img alt="" src="{{ asset('assets/web') }}/images/white-button.png"></a></li>
                    <li><a aria-label="" href="#" ><img alt="" src="{{ asset('assets/web') }}/images/shop02.png"></a></li>
                        <li><a aria-label="" href="#"><img alt="" src="{{ asset('assets/web') }}/images/shop03.png"></a></li>
                        <li><a aria-label="" href="#"><img alt="" src="{{ asset('assets/web') }}/images/shop04.png"></a></li> --}}

                    @endif
                    
                </ul> -->
            </div>
            <form id="checkoutForm" action="#" method="post">
                @csrf
                @if(!auth()->check())
                <!-- <div class="or-section">
                    <p>OR</p>
                </div> -->
                @endif
                <p class="alert alert-danger" id="addressTaxFail" style="display: none" role="alert"></p>
                <input aria-labelledby="PartsWarehouse" type="hidden" value="" name="paypal_order_id" id="paypal_order_id" />
                <input aria-labelledby="PartsWarehouseCheckout" type="hidden" value="" name="paypal_fundingSource" id="paypal_fundingSource" />
                <div class="frb-group row mt-4">
                    {{--  <h4>Shipping Address</h4>  --}}
                    <div id="primaryAddressCustom" style="display: none">
                        <div class="col-md-12">
                            <div class="frb frb-default">
                                <div class="row">
                                    <div class="col-md-6">

                                        <label  style="padding-left: 20px">
                                            <span class="frb-description" id="primaryAddressDescription"></span>
                                        </label>
                                    </div>
                                    <div class="col-md-6 ">
                                        <div class="text-center p-4">
                                            <a href="#" class="btn btn-primary mt-2 text-uppercase" onclick="chnageAddress()" aria-label="Change Shipping Address">Change Shipping Address</a>

                                        </div>

                                    </div>
                                </div>

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

                    @if(empty($address) && empty($customerAddressPrimary) && auth()->check())
                    {{--  <div>
                        <a href="#" class="btn btn-success text-uppercase mb-2" onclick="chnageAddressAll(0)" aria-label="Add New Address"><i class="fa fa-plus"
                            aria-hidden="true"></i> Add New Address</a>
                    </div>  --}}
                    @endif

                    <div id="primaryAddress">
                    @if (!empty($customerAddressPrimary))
                        <div class="col-md-12">
                            <div class="frb frb-default">
                                <div class="row">
                                    <div class="col-md-6">

                                        <label  style="padding-left: 20px">
                                            <span class="frb-description"><b> {{ $customerAddressPrimary->name }}</b><br>{{ $customerAddressPrimary->street_name }}<br> @if(!empty($customerAddressPrimary->street_app_unit)) {{ $customerAddressPrimary->street_app_unit }}<br> @endif {{ $customerAddressPrimary->city }}, {{ $customerAddressPrimary->state }} {{ $customerAddressPrimary->zip }}<br> {{ $customerAddressPrimary->country }}</span>
                                        </label>
                                    </div>
                                    <div class="col-md-6 ">
                                        <div class="text-center p-4">
                                            <a href="#" class="btn btn-primary mt-2 text-uppercase" onclick="chnageAddress()" aria-label="Change Shipping Address">Change Shipping Address</a>

                                        </div>

                                    </div>
                                </div>

                            </div>
                        </div>
                    @endif
                    </div>
                    <div id="allAddress" style="display: none">

                        <div class="col-md-12">
                            @foreach ($customerAddress as $address)
                            <div class="frb frb-default row mt-2">


                                    <div class="col-md-6 ">
                                        <input aria-labelledby="PartsWarehouse" type="radio" id="radio-button-{{ $loop->index }}" @if($address->is_primary == 1)
                                        checked @endif name="shipping-address" data-name="{{ $address->name }}" data-zip="{{ $address->zip }}" data-statecode="{{ $address->state }}" data-city="{{ $address->city }}" data-street_name="{{ $address->street_name }}" data-street_app_unit="{{ $address->street_app_unit }}" data-country="{{ $address->country }}" data-name="{{ $address->country }}" value="{{ $address->id }}">
                                        <label for="radio-button-{{ $loop->index }}">
                                            <span class="frb-description"><b>
                                                    {{ $address->name }}</b><br>{{ $address->street_name }}<br>
                                                @if(!empty($address->street_app_unit)) {{ $address->street_app_unit }}<br>
                                                @endif {{ $address->city }}, {{ $address->state }} {{ $address->zip }}<br>
                                                {{ $address->country }}</span>
                                        </label>
                                    </div>

                                    <div class="col-md-6 ">
                                        <div class="text-center mt-4 mb-2">
                                            <a href="#" class="btn btn-primary btn-sm text-uppercase"
                                                onclick="chnageAddressAll('{{ $address->id }}')" aria-label="EDIT ADDRESS"><i class="fa fa-edit"></i>
                                                EDIT ADDRESS</a>

                                                    <label href="#" class="btn btn-info btn-sm ms-2"  for="radio-button-{{ $loop->index }}">SHIP HERE</label>

                                        </div>

                                    </div>


                            </div>
                            @endforeach
                            <div class="text-end mt-2">
                                <a href="#" class="btn btn-danger text-uppercase" onclick="cancelAddress()" aria-label="Cancel">Cancel</a>
                                <a href="#" class="btn btn-success text-uppercase" onclick="chnageAddressAll(0)" aria-label="Add New Address"><i class="fa fa-plus"
                                        aria-hidden="true"></i> Add New Address</a>
                            </div>
                        </div>
                    </div>
                    @if(!auth()->check())
                        {{--  <div class="col-md-12">
                            <div class="frb frb-default mt-4">
                                <input aria-labelledby="PartsWarehouse" type="radio" id="radio-button-custom" checked name="shipping-address" value="custom">
                                <label for="radio-button-custom">
                                    <span class="frb-description mt-2">Custom Address</span>
                                </label>
                            </div>

                        </div>  --}}
                    @endif
                </div>

                @if(!auth()->check() || (empty($address) && empty($customerAddressPrimary) && auth()->check()))
                <p class="alert alert-danger" id="customeAddressVerifyFail" style="display: none" role="alert"></p>
                <div class="customeVerifyAddressDiv " style="display: none">

                        <div class="col-md-12">
                            <div class="frb frb-default">
                                <div class="row">
                                    <div class="col-md-6">

                                        <label  style="padding: 10px">
                                            <span class="frb-description" id="customeVerifyAddressDescription"></span>
                                        </label>
                                    </div>
                                    <div class="col-md-6 ">
                                        <div class="text-center p-4">
                                            <a href="#" class="btn btn-primary mt-2 text-uppercase" onclick="chnageCustomAddress()" aria-label="Change Shipping Address">Change Shipping Address</a>

                                        </div>

                                    </div>
                                </div>

                            </div>
                        </div>

                    {{--  <div class="row mt-2" style="min-height: 300px">
                        <div class="col-md-4">

                            <div class="card mt-2 border border-dark border-3">
                                <div class="checkCustomAddress1" style="display: none"><i class="fa fa-check-circle" aria-hidden="true"></i></div>
                                <div class="card-body">
                                    <div style="min-height: 135px">
                                        <p id="unfinedCustomAddress">asda</p>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12 text-center">
                                        <button aria-labelledby="..." type="button" class="btn btn-success mb-3 " onclick="addressApplyAction(1)">USE THIS ADDRESS</button>
                                        <span class="text-danger">Unverified</span>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="card mt-2 border border-dark border-3">
                                <div class="checkCustomAddress2" style="display: none"><i class="fa fa-check-circle" aria-hidden="true"></i></div>
                                <div class="card-body">
                                    <div style="min-height: 135px">
                                        <p id="ReccommandedCustomAddress">asda</p>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12 text-center">
                                            <button aria-labelledby="..." type="button" class="btn btn-success mb-3" onclick="addressApplyAction(2)">USE THIS ADDRESS</button>
                                            <span class="text-success">Recommended</span>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>  --}}
                </div>
                <div class="customeAddressDiv" >


                    <div class="shipping-form-2column-main clearfix form-group">

                        <div class="">
                            <select name="custom_country" id="custom_country" style="width: 100%" data-palcehoder="Select Country" class="form-control" onChange="getCountryWiseState(this.value)">
                                <option value="" disabled  selected>Select Country</option>
                                @foreach ($countries as $c)
                                    <option data-id="{{ $c->id }}" data-shortname="{{ $c->shortname }}" value="{{ $c->name }}">{{ $c->name }}</option>
                                @endforeach
                            </select>
                            <label id="custom_country-error" class="error" style="display:none" for="custom_country">Please select country</label>
                            <span class="country_error error" style="display:none">Please select country</span>
                        </div>



                    </div>



                    <div class="shipping-address-input mt-3">
                        <input aria-labelledby="PartsWarehouse" placeholder="Street Address" type="text" name="custom_street_name" id="custom_street_name" class="form-control">
                        <span class="street_name_error error" style="display:none">Please enter street name</span>
                    </div>
                    <div class="shipping-address-input">
                        <input aria-labelledby="PartsWarehouse" placeholder="Apt/Unit # (Optional) " type="text" name="custom_street_app_unit" id="custom_street_app_unit" class="form-control">
                    </div>

                    <div class="shipping-form-2column-main clearfix form-group">
                        <div class="shipping-form-3column-left">
                        <input aria-labelledby="PartsWarehouse" placeholder="City" type="text" name="custom_city" id="custom_city" class="form-control">
                        <span class="city_error error" style="display:none">Please enter city</span>
                        </div>
                        <div class="shipping-form-3column-left">

                            <select name="custom_state" id="custom_state" class="form-control w-100" style="width: 100%" palcehoder="Select State" data-palcehoder="Select State">
                                <option value="" disabled  selected>State/Region</option>

                            </select>
                            <label id="custom_state-error" class="error" style="display:none" for="custom_state">Please select state</label>
                            <span class="state_error error" style="display:none">Please select state</span>
                        </div>
                        <div class="shipping-form-3column-left">
                            <input aria-labelledby="PartsWarehouse" placeholder="ZIP/Postal Code" type="text" id="custom_zip_code" name="custom_zip_code"  title="Five digit zip code" class="form-control">
                            <span class="zip_code_error error" style="display:none">Please enter zip code</span>
                        </div>
                    </div>
                    <input aria-labelledby="PartsWarehouse" type="hidden" id="checkApplyAddress" name="checkApplyAddress">

                    <div class="apply-btn" id="shippingDiv">
                        <img src="{{ asset('assets/web') }}/images/1_Calculate_Shipping_and_Tax.png" onclick="addressApply()" style="cursor:pointer;" class="cursor-pointer" id="shippingBtn" alt="..." srcset="" height="42px" aria-label="" tabindex="0">
                        <!-- <button aria-labelledby="..." type="button" class="btn btn-danger font-weight-bold" >Calculate Shipping & Tax</button> -->
                    </div>


                </div>
                @endif
                <div id="shippingOptionHead" style="display: none;">
                    <h4 class="pt-3">Shipping Options</h4>
                    <p>Transit times are based upon carrier estimates. We cannot gurantee carrier performance.</p>



                    <div class="radio-main clearfix" id="shippingOption">
                        <div class="custom-control custom-radio01">
                            <label class="custom-control-label clearfix" for="shippingOption1">Dependent upon shipping address</label>
                        </div>
                    </div>
                </div>
                <h4 class="pt-3">Contact Information</h4>
                <div class="contactInformation">
                    <div class="shipping-form-2column-main clearfix">
                        <div class="shipping-address-input">
                            <input aria-labelledby="PartsWarehouse" placeholder="Email" type="text" id="email" name="email" @if(auth()->check())
                            value="{{ auth()->user()->emailaddress }}" @endif class="form-control">
                        </div>
                        <div class="shipping-form-2column-left">
                            <input aria-labelledby="PartsWarehouse" placeholder="First name" name="firstname" id="firstname" @if(auth()->check())
                            value="{{ auth()->user()->firstname }}" @endif type="text" class="form-control">
                        </div>
                        <div class="shipping-form-2column-right">
                            <input aria-labelledby="PartsWarehouse" placeholder="Last name" id="lastname" name="lastname" @if(auth()->check())
                            value="{{ auth()->user()->lastname }}" @endif type="text" class="form-control">
                        </div>
                    </div>

                    <div class="shipping-address-input">
                        <input aria-labelledby="PartsWarehouse" placeholder="Company (Optional)" type="text" name="company" @if(auth()->check())
                        value="{{ auth()->user()->companyname }}" @endif class="form-control">
                    </div>

                    <div class="shipping-address-input">
                        <input aria-labelledby="PartsWarehouse" placeholder="Phone" id="contactPhone" name="phone" type="text" @if(auth()->check())
                        value="{{ auth()->user()->phonenumber }}" @endif class="form-control">
                    </div>
                    <div class="form-check email-checkbox">
                        <input aria-labelledby="PartsWarehouse" class="form-check-input" type="checkbox" checked value="" id="defaultCheck1">
                        <label class="form-check-label" for="defaultCheck1">
                            Its OK to send me occasional updates and offers.
                        </label>
                    </div>
                    <h4 class="pt-3">Payment</h4>
                    <div class="form-check email-checkbox">
                        <input aria-labelledby="PartsWarehouse" type="hidden" name="is_billing_address" value="0">
                        <input aria-labelledby="PartsWarehouse" class="form-check-input" type="checkbox" checked value="1" name="is_billing_address"
                            id="is_billing_address">
                        <label class="form-check-label" for="is_billing_address">
                            Billing name and address same as Shipping.
                        </label>
                    </div>
                    <div id="customBillingAddress" style="display: none">

                        <div class="shipping-form-2column-main clearfix form-group">
                            <div class="mb-3">
                                <select class="form-control" name="billingcountry" id="billingcountry" style="width: 100%"
                                    data-palcehoder="Select Country" onChange="getCountryWiseStatebilling(this.value)">
                                    <option value="" disabled selected>Select Country</option>
                                    @foreach ($countries as $c)
                                    <option data-id="{{ $c->id }}" value="{{ $c->name }}">{{ $c->name }}</option>
                                    @endforeach
                                </select>

                            </div>

                        </div>

                        <div class="shipping-form-2column-main clearfix">
                            <div class="shipping-form-2column-left">
                                <input aria-labelledby="PartsWarehouse" placeholder="First name" name="billingfirstname" id="billingfirstname" type="text"
                                    class="form-control">
                            </div>
                            <div class="shipping-form-2column-right">
                                <input aria-labelledby="PartsWarehouse" placeholder="Last name" name="billinglastname" id="billinglastname" type="text"
                                    class="form-control">
                            </div>
                        </div>

                        <div class="shipping-address-input">
                            <input aria-labelledby="PartsWarehouse" placeholder="Company (Optional)" name="billingcompanyname" id="billingcompanyname" type="text"
                                class="form-control">
                        </div>

                        <div class="shipping-address-input">
                            <input aria-labelledby="PartsWarehouse" placeholder="Street Address" name="billingstreetname" id="billingstreetname" type="text"
                                class="form-control">
                        </div>
                        <div class="shipping-address-input">
                            <input aria-labelledby="PartsWarehouse" placeholder="Apt/Unit # (Optional) " name="billingunitname" id="billingunitname" type="text"
                                class="form-control">
                        </div>
                        <div class="shipping-form-2column-main clearfix form-group">
                            <div class="shipping-form-3column-left">
                                <input aria-labelledby="PartsWarehouse" placeholder="City" name="billingcity" id="billingcity" type="text" class="form-control">
                            </div>
                            <div class="shipping-form-3column-left">
                                <select class="form-control" name="billingstate" id="billingstate" style="width: 100%"
                                    data-palcehoder="Select State">
                                    <option value="" disabled selected>State/Region</option>

                                </select>
                                <label id="billingstate-error" class="error" for="billingstate" style="display:none;">Please
                                    enter a state</label>
                            </div>
                            <div class="shipping-form-3column-left">
                                <input aria-labelledby="PartsWarehouse" placeholder="ZIP/Postal Code" name="billingzipcode" id="billingzipcode" type="text"
                                    class="form-control">
                            </div>
                            {{-- <div class="shipping-form-2column-right">
                        <select class="form-control">
                            <option>Country</option>
                            <option value=">United States" selected>United States</option>

                        </select>
                        </div> --}}
                        </div>

                        <div class="shipping-form-2column-main clearfix">
                            {{-- <div class="shipping-form-2column-left">
                        <input aria-labelledby="PartsWarehouse" placeholder="ZIP Code" name="billingzipcode" id="billingzipcode"  type="text" class="form-control">
                        </div> --}}
                            {{-- <div class="shipping-form-2column-right">
                        <select class="form-control" name="billingstate" id="billingstate">
                            <option>State</option>
                            <option>Gujarat</option>
                            <option>2</option>
                            <option>3</option>
                            <option>4</option>
                            <option>5</option>
                        </select>
                        </div> --}}
                        </div>

                        <div class="shipping-address-input">
                            <input aria-labelledby="PartsWarehouse" placeholder="Phone" name="billingphone" id="billingphone" type="text" class="form-control">
                        </div>


                    </div>
                    <div>
                        <div id="paypal-button-container"></div>
                    </div>

                                        @if(!$cardData->isEmpty())
                    <div class="row carddiv">
                        <div class="col-md-1">

                        </div>
                        <div class="col-md-3" id="showCvv">

                        </div>
                    </div>
                    <div class="row carddiv oppenaddCard mt-2">
                        <div class="col-md-1">
                            <div class="icheck-primary d-inline">
                                <input aria-labelledby="PartsWarehouse" type="radio" id="customer_card_id2" onchange="cardIdChange()" name="customer_card_id" value="0">
                            </div>
                        </div>

                        <div class="col-md-3">
                            <div class="icheck-primary d-inline ">
                                <label for="radioPrimary1">
                                    Add New Card
                                </label>
                            </div>
                        </div>

                    </div>
                    @endif

                    <div class="row mt-2" id="paypaldiv" style="display: none">
                        <div class="col-1">
                            <div class="icheck-primary d-inline">
                                <input aria-labelledby="PartsWarehouse" type="radio" id="customer_card_id3" name="paypalid" checked value="0">
                            </div>
                        </div>

                        <div class="col-6">
                            <div class="icheck-primary d-inline ">
                                <label for="radioPrimary1">
                                <img src="{{ asset('assets/web') }}/images/paypal-logo.png" alt="" srcset="" width="100px"><br>
                                <span id="paypalemail"></span>
                                </label>
                            </div>
                        </div>

                    </div>
                    <div class="addNewCard"  @if(auth()->check() && !$cardData->isEmpty()) style="display: none;"  @endif>
                        <input aria-labelledby="PartsWarehouse" type="hidden" name="authorizeId" id="authorizeId" value="">
                        <div class="shipping-address-input carddiv mt-2">

                            <span class="card-type" style="padding-left:10px;"></span>
                            <input aria-labelledby="PartsWarehouse" placeholder="Card Number" id="cc" name="card_number" type="text" onchange="return checkDigit(event,this)"
                                onkeypress="return checkDigit(event,this)" class="form-control">
                        </div>

                        <div class="date-cvv-main clearfix carddiv">

                            <div class="row">
                                <div class="col-lg-2 col-md-4 col-sm-4 col-5">
                                    <select name="expiry_date" id="expiry_date" class="form-control  ">
                                        <option value=""> Month</option>
                                        <option value="01">01</option>
                                        <option value="02">02</option>
                                        <option value="03">03</option>
                                        <option value="04">04</option>
                                        <option value="05">05</option>
                                        <option value="06">06</option>
                                        <option value="07">07</option>
                                        <option value="08">08</option>
                                        <option value="09">09</option>
                                        <option value="10">10</option>
                                        <option value="11">11</option>
                                        <option value="12">12</option>
                                    </select>

                                </div>
                                <div class="col-lg-2 col-md-4 col-sm-4 col-5">
                                    <select name="expiry_year" id="expiry_year" class="form-control form-control-solid ">
                                        <option value="">Year</option>
                                                                                <option value="2025">2025</option>
                                                                                <option value="2026">2026</option>
                                                                                <option value="2027">2027</option>
                                                                                <option value="2028">2028</option>
                                                                                <option value="2029">2029</option>
                                                                                <option value="2030">2030</option>
                                                                                <option value="2031">2031</option>
                                                                                <option value="2032">2032</option>
                                                                                <option value="2033">2033</option>
                                                                                <option value="2034">2034</option>
                                                                                <option value="2035">2035</option>
                                        
                                    </select>
                                </div>

                                <div class="col-lg-3 col-md-4 col-sm-4 col-5">
                                    <input aria-labelledby="PartsWarehouse" placeholder="CVV" id="paycardCVV" name="cvv" type="text" maxlength="4"
                                        class="form-control">
                                </div>
                            </div>

                        </div>
                    </div>

                <div class="pay-btn justify-content-center d-flex mt-3">
                    <button aria-labelledby="..." type="submit" class="btn btn-primary font-weight-bold  @if($total <= 0) disabled @endif paybutton">Pay <span class="TotalAmount">$ {{ number_format($total,2); }}</span></button>
                    <button aria-labelledby="..." type="submit" class="btn btn-primary font-weight-bold disabled paybuttondis" style="display: none">Processing...</button>
                </div>
                <div class="text-center terms-main">
                    <p class="text-center">By clicking Pay, you're agreeing to the terms and conditions.</p>

                    <div class="mb-2">
                        <img src="{{ asset('assets/web') }}/images/secure_ssl_encryption.jpg" alt="" srcset="" width="120px">
                    </div>

                    <a onclick="window.history.go(-1); return false;" class="font-weight-bold" aria-label=""><img src="{{ asset('assets/web') }}/images/keep_shopping.png" class="btn border-0 p-0" alt="..." width="150px"></a>
                </div>

            </form>
        </div>

    </div>
  </div>


  <div class="modal fade" id="customShipaddressModel" tabindex="-1" aria-labelledby="customShipaddressModelLabel" aria-hidden="true" style="z-index: 9999;">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <form action="#" id="addressAddForm12" method="post">
            <div class="modal-header">
            <h5 class="modal-title" id="customShipaddressModelLabel">Shipping Address</h5>
            <button aria-labelledby="..." type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <p class="alert alert-danger" id="addressTaxFailLookup" style="display: none" role="alert"></p>
                <div class="row mt-2 justify-content-center" style="min-height: 300px">
                    <div class="col-md-4">

                        <div class="card mt-2 border border-dark border-3">

                            <div class="card-body">
                                <div style="min-height: 135px">
                                    <p id="unfinedCustomAddress">asda</p>
                                </div>
                                <div class="row">
                                    <div class="col-md-12 text-center">
                                      <button aria-labelledby="..." type="button" class="btn btn-success mb-3" onclick="addressApplyAction(1)">USE THIS ADDRESS</button>
                                      <span class="text-danger">Unverified</span>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="card mt-2 border border-dark border-3">

                            <div class="card-body">
                                <div style="min-height: 135px">
                                    <p id="ReccommandedCustomAddress">asda</p>
                                </div>
                                <div class="row">
                                    <div class="col-md-12 text-center">
                                        <button aria-labelledby="..." type="button" class="btn btn-success mb-3" onclick="addressApplyAction(2)">USE THIS ADDRESS</button>
                                        <span class="text-success">Recommended</span>
                                      </div>

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

            </div>

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

  <div class="modal fade" id="addressModel" tabindex="-1" aria-labelledby="addressModelLabel" aria-hidden="true" style="z-index: 9999;">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <form action="#" id="addressAddForm" method="post">
            <div class="modal-header">
            <h5 class="modal-title" id="addressModelLabel">Change Address</h5>
            <button aria-labelledby="..." type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="addressVerifyDiv" style="display: none">
                    <div class="row mt-2" style="min-height: 300px">
                        <div class="col-md-4">

                            <div class="card mt-2 border border-dark border-3">
                                <div class="checkAddress1" style="display: none"><i class="fa fa-check-circle" aria-hidden="true"></i></div>
                                <div class="card-body">
                                    <div style="min-height: 135px">
                                        <p id="unfinedAddress">asda</p>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12 text-center">
                                          <button aria-labelledby="..." type="button" class="btn btn-success mb-3 " onclick="addressAction(1)">USE1 THIS ADDRESS</button>
                                          <span class="text-danger">Unverified</span>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <input aria-labelledby="PartsWarehouse" type="hidden" name="addressUrl" id="addressUrl">
                            <input aria-labelledby="PartsWarehouse" type="hidden" name="re_addressId" id="re_addressId">
                            <input aria-labelledby="PartsWarehouse" type="hidden" name="re_country" id="re_country" value="{{ (auth()->check() && !empty($address->country)) ? $address->country : "" }}">
                            <input aria-labelledby="PartsWarehouse" type="hidden" name="re_state" id="re_state" value="{{ (auth()->check() && !empty($address->state)) ? $address->state : "" }}">
                            <input aria-labelledby="PartsWarehouse" type="hidden" name="re_name" id="re_name" value="{{ (auth()->check() && !empty($address->name)) ? $address->name : "" }}">
                            <input aria-labelledby="PartsWarehouse" type="hidden" name="re_street_name" id="re_street_name" value="{{ (auth()->check() && !empty($address->street_name)) ? $address->street_name : "" }}">
                            <input aria-labelledby="PartsWarehouse" type="hidden" name="re_street_app_unit" id="re_street_app_unit" value="{{ (auth()->check() && !empty($address->street_app_unit)) ? $address->street_app_unit : "" }}">
                            <input aria-labelledby="PartsWarehouse" type="hidden" name="re_city" id="re_city" value="{{ (auth()->check() && !empty($address->city)) ? $address->city : "" }}">
                            <input aria-labelledby="PartsWarehouse" type="hidden" name="re_state" id="re_state" value="{{ (auth()->check() && !empty($address->state)) ? $address->state : "" }}">
                            <input aria-labelledby="PartsWarehouse" type="hidden" name="re_zip" id="re_zip" value="{{ (auth()->check() && !empty($address->zip)) ? $address->zip : "" }}">
                            <input aria-labelledby="PartsWarehouse" type="hidden" name="re_phone" id="re_phone" value="{{ (auth()->check() && !empty($address->phone)) ? $address->phone : "" }}">

                            <div class="card mt-2 border border-dark border-3">
                                <div class="checkAddress2" style="display: none"><i class="fa fa-check-circle" aria-hidden="true"></i></div>
                                <div class="card-body">
                                    <div style="min-height: 135px">
                                        <p id="ReccommandedAddress">asda</p>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-12 text-center">
                                            <button aria-labelledby="..." type="button" class="btn btn-success mb-3" onclick="addressAction(2)">USE THIS ADDRESS</button>
                                            <span class="text-success">Recommended</span>
                                          </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row addressVerifyOld">
                            <p class="alert alert-danger" id="addressVerifyFail" style="display: none" role="alert"></p>
                            <div class="col-md-12">

                                    @csrf
                                <input aria-labelledby="PartsWarehouse" type="hidden" name="id" id="addressId" value="">


                                <div class="row">

                                    <div class="col-md-6">
                                        <div class="mb-3 form-group">
                                            <label for="country">Country</label>

                                            <select name="country" id="country" style="width: 100%" data-palcehoder="Select Country" class="form-control" onChange="getCountryWiseState(this.value)">
                                                <option value="" disabled  selected>Select Country</option>

                                                @foreach ($countries as $c)
                                                    <option data-id="{{ $c->id }}" value="{{ $c->name }}">{{ $c->name }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="mb-3 form-group">
                                            <label for="state">State/Region</label>
                                            <select name="state" id="state" style="width: 100%" data-palcehoder="Select State"  class="form-control">
                                                <option value="" disabled  selected>State/Region</option>

                                            </select>

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




                                    <div class="mb-3 form-group">
                                        <label for="fullname">Full Name</label>
                                        <input aria-labelledby="PartsWarehouse" type="text" class="form-control" name="name" id="fullname"
                                            placeholder="First and Last">
                                    </div>
                                    <div class="mb-3 form-group">
                                        <label for="street_address">Address Line 1</label>
                                        <input aria-labelledby="PartsWarehouse" type="text" class="form-control" name="street_name" id="street_address"
                                            placeholder="1234 Street Name">
                                    </div>
                                    <div class="form-group">
                                        <label for="street_app_unit">Address Line 2</label>
                                        <input aria-labelledby="PartsWarehouse" type="text" class="form-control" name="street_app_unit" id="street_app_unit"
                                            placeholder="Apt/Unit # (Optional) ">
                                    </div>
                                    <div class="row mt-4">
                                        <div class="col-md-6">
                                            <div class="mb-3 form-group">
                                                <label for="city">City</label>
                                                <input aria-labelledby="PartsWarehouse" type="text" class="form-control" name="city" id="city"
                                                    placeholder="Please Enter City">
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            <div class="mb-3 form-group">
                                                <label for="zip">Zip</label>
                                                <input aria-labelledby="PartsWarehouse" type="text" class="form-control" name="zip" id="zip" placeholder="12345">
                                            </div>
                                        </div>
                                    </div>

                                    <div class="row">


                                        <div class="col-md-6">
                                            <div class="mb-3 form-group">
                                                <label for="phone">Phone</label>
                                                <input aria-labelledby="PartsWarehouse" type="text" class="form-control" name="phone" id="phone"
                                                    placeholder="123-456-7890">
                                            </div>
                                        </div>
                                    </div>
                                    <input aria-labelledby="PartsWarehouse" type="hidden" name="is_primary" id="isPrimary" value="0">
                                    <div class="form-check" id="isPrimaryDiv" style="display: none">

                                            <input aria-labelledby="PartsWarehouse" class="form-check-input" type="checkbox" name="is_primary" value="1" id="isprimary">
                                            <label class="form-check-label" for="isprimary">
                                                Make this my primary address
                                            </label>
                                    </div>



                    </div>

                </div>

            </div>
            <div class="modal-footer">
            <button aria-labelledby="..." type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
            <button aria-labelledby="..." type="submit" class="btn btn-primary">Save</button>
            </div>
        </form>
      </div>
    </div>
  </div>


<script>
    $(document).ready(function(){

        $("input[name='customer_card_id']").on("click", function() {
            @if(auth()->check())
            var is_checked = $(this).val();
            if(is_checked != "0"){
                $(".addNewCard").hide();
            }

            $('.cvvadd').html('');
            $('.cvvaddno_'+is_checked).html('<input aria-labelledby="PartsWarehouse" placeholder="CVV" id="paycardCVV1" name="cvv1" type="text" maxlength="4" class="form-control">');
            $('#paycardCVV1').inputmask("999");
            @else
            $(".addNewCard").show();
            @endif



        });


        $(".oppenaddCard").click(function(){
            $(".addNewCard").toggle();
        });


        var input = document.getElementById("shippingDiv");
            input.addEventListener("keypress", function(event) {
            if (event.key === "Enter") {
                event.preventDefault();
                document.getElementById("shippingBtn").click();
            }
        });

       
    
    });
</script>

<script>

    var addressId = 0;
    var verifyAddress1 = "";
    var verifyAddress2 = "";
    var verifyCity = "";
    var verifyState = "";
    var verifyZip = "";
    var verifyCountry = "";

   
    function getCountryWiseStatebilling(val,state="") {
        var country_name = val;

        $.ajax({
                headers: {
                    'X-CSRF-TOKEN': "{{ csrf_token() }}"
                },
                url: "{{ route('shipping-countrywise-state') }}",
                dataType: "json",
                type: "GET",
                data: {
                    'Country_name': country_name
                },

                success: function(data) {

                    $('#billingstate').html('');
                    $('#billingstate').append($("<option selected disabled>State/Region</option>"));



                    $.each(data, function(key, value) {
                            $('#billingstate').append('<option value="'+ value.state_code +'">'+ value.name +'</option>');
                    });

                      $('#billingcountry').val(val);
                      if(state){
                        $('#billingstate').val(state);
                      }

                      $('#billingcountry').select2("destroy").select2();
                },
            });
    }



    function getCountryWiseState(val,state="") {

        var country_name = val;
        if(country_name == "United States"){
            $('#custom_zip_code').inputmask('99999');
        }else{
            $('#custom_zip_code').inputmask('remove');
        }
        $.ajax({
                headers: {
                    'X-CSRF-TOKEN': "{{ csrf_token() }}"
                },
                url: "{{ route('shipping-countrywise-state') }}",
                dataType: "json",
                type: "GET",
                data: {
                    'Country_name': country_name
                },

                success: function(data) {

                    $('#state').html('');
                    $('#state').append($("<option selected disabled>State/Region</option>"));

                    $('#custom_state').html('');
                    $('#custom_state').append($("<option selected value=''>State/Region</option>"));


                    $.each(data, function(key, value) {

                            $('#state').append('<option value="'+ value.state_code +'">'+ value.name +'</option>');
                            $('#custom_state').append('<option value="'+ value.state_code +'">'+ value.name +'</option>');

                    });
                      $('#country').val(val);
                      $('#state').val(state);
                      $('#country').select2("destroy").select2();

                      $('#custom_country').val(val);
                      if(state){
                        $('#custom_state').val(state);
                      }

                      $('#custom_country').select2("destroy").select2();

                },
            });
    }
    
    function chnageAddress(){
        $('#allAddress').show();
        $('#primaryAddress').hide();
        $('#primaryAddressCustom').hide();
    }
    onload = function() {
        document.getElementById('cc').oninput = function() {
          this.value = cc_format(this.value)
        }
    }
    function checkDigit(event,$t) {
        var code = (event.which) ? event.which : event.keyCode;

        if ((code < 48 || code > 57) && (code > 31)) {
            return false;
        }

        var cardType = GetCardType($($t).val());
        $('.card-type').html('<i class="fab fa-brands fa-cc-'+cardType+'"></i>');

        return true;
    }

    function GetCardType(number){
        // visa
        var re = new RegExp("^4");
        if (number.match(re) != null)
            return "visa";

        // Mastercard
        // Updated for Mastercard 2017 BINs expansion
        if (/^(5[1-5][0-9]{14}|2(22[1-9][0-9]{12}|2[3-9][0-9]{13}|[3-6][0-9]{14}|7[0-1][0-9]{13}|720[0-9]{12}))$/.test(number))
            return "mastercard";

        // AMEX
        re = new RegExp("^3[47]");
        if (number.match(re) != null)
            return "amex";

        // Discover
        re = new RegExp("^(6011|622(12[6-9]|1[3-9][0-9]|[2-8][0-9]{2}|9[0-1][0-9]|92[0-5]|64[4-9])|65)");
        if (number.match(re) != null)
            return "discover";

        // Diners
        re = new RegExp("^36");
        if (number.match(re) != null)
            return "diners-club";

        // Diners - Carte Blanche
        re = new RegExp("^30[0-5]");
        if (number.match(re) != null)
            return "diners-club";

        // JCB
        re = new RegExp("^35(2[89]|[3-8][0-9])");
        if (number.match(re) != null)
            return "jcb";

        // Visa Electron
        re = new RegExp("^(4026|417500|4508|4844|491(3|7))");
        if (number.match(re) != null)
            return "visa";

        return "";
    }

    function cc_format(value) {
        var v = value.replace(/\s+/g, '').replace(/[^0-9]/gi, '')
        var matches = v.match(/\d{4,16}/g);
        var match = matches && matches[0] || ''
        var parts = []
        for (i=0, len=match.length; i<len; i+=4) {
          parts.push(match.substring(i, i+4))
        }
        if (parts.length) {
          return parts.join(' ')
        } else {
          return value
        }
    }

    $('#primaryAddress').show();

    function cancelAddress(){
        $('#allAddress').hide();
       // $('#primaryAddress').show();

        if($('#primaryAddressCustom').is(':visible')){
            $('#primaryAddress').hide();
            $('#primaryAddressCustom').show();

        }else{
            $('#primaryAddress').show();
            $('#primaryAddressCustom').hide();
        }
        @if(auth()->check())
            var country = "{{ !empty($customerAddressPrimary->country) ? $customerAddressPrimary->country : "" }}";
            shippingOption(country);
        @endif

    }

    function chnageAddressAll(addressId = 0){

        if(addressId == 0){
            $('#addressAddForm').trigger("reset");
           $('#addressAddForm').attr('action',"{{ route('addresses-add-process') }}");
           $('#addressUrl').val("{{ route('addresses-add-process') }}");

            $('#addressModelLabel').text('Add New Address');
            $('#addressModel').modal('show');
            $('#isPrimaryDiv').show();
            $('#isPrimary').val(0);

        }else{
            var addressUrl = "{{ route('addresses-edit',':id') }}";
            addressUrl = addressUrl.replace(':id',addressId);
            $('#addressUrl').val("{{ route('addresses-update') }}");
           $('#addressAddForm').attr('action',"{{ route('addresses-update') }}");
            $('#addressModelLabel').text('Change Address');
            $.ajax({
                type: 'get',
                url: addressUrl,
                dataType: "json",
                success: function(responce) {
                    var address = responce.data;
                    addressId = addressId;
                        $('#addressId').val(addressId);
                        $('#re_addressId').val(addressId);
                        $('#fullname').val(address.name);
                        $('#street_address').val(address.street_name);
                        $('#street_address').val(address.street_name);
                        $('#city').val(address.city);
                        // $('#state').val(address.state).change();

                        getCountryWiseState(address.country,address.state)
                        // if(address.country){
                        //     $('#country').val(address.country);
                        // }

                        $('#zip').val(address.zip);
                        $('#phone').val(address.phone);


                    $('#addressModel').modal('show');
                    $('#isPrimaryDiv').hide();
                    $('#isPrimary').val(1);
                }
            });


        }

        $('#addressAddForm').validate({
            rules: {
                name: {
                    required: true
                },
                street_name: {
                    required: true
                },
                city: {
                    required: true
                },
                state: {
                    required: true
                },
                country: {
                    required: true
                },
                zip: {
                    required: true
                },
                phone: {
                    required: true
                }
            },
            messages: {

                name: {
                    required: "Please enter full name"
                },
                street_name: {
                    required: "Please enter a street name"
                },
                city: {
                    required: "Please enter a city",
                },
                state: {
                    required: "Please enter a state",
                },
                country: {
                    required: "Please enter a country",
                },
                zip: {
                    required: "Please enter a zip",

                },
                phone: {
                    required: "Please enter a phone",
                    minlength: "Please enter valid phone",
                    maxlength: "Please enter valid phone",
                }

            },
            errorElement: 'span',
            errorPlacement: function (error, element) {
                $(element).parents('.form-group').append(error)
            },
            highlight: function (element, errorClass, validClass) {
                $(element).addClass('is-invalid');
            },
            unhighlight: function (element, errorClass, validClass) {
                $(element).removeClass('is-invalid');
            },
            submitHandler: function (form) {
                if($('#country').val() != 'United States'){
                    var addressData = {
                        '_token': '{{ csrf_token() }}',
                        'id' :$('#addressId').val(),
                        'name': $('#fullname').val(),
                        'street_name': $('#street_address').val(),
                        'street_app_unit': $('#street_app_unit').val(),
                        'city': $('#city').val(),
                        'state': $('#state').val(),
                        'country': $('#country').val(),
                        'zip': $('#zip').val(),
                        'phone': $('#phone').val(),
                        'is_primary':$('#isPrimary').val(),
                    };


                    console.log(addressData);
                    addressUrl = $('#addressUrl').val();
                    $.ajax({
                        type: 'POST',
                        url: addressUrl,
                        data: addressData,
                        dataType: "json",
                        success: function (resultData) {
                            location.reload();
                        }
                    });
                }else{
                    var addressData = {
                        "_token": '{{ csrf_token() }}',
                        'name': $('#fullname').val(),
                        'street_name': $('#street_address').val(),
                        'street_app_unit': $('#street_app_unit').val(),
                        'city': $('#city').val(),
                        'state': $('#state').val(),
                        'country': $('#country').val(),
                        'zip': $('#zip').val(),
                        'phone': $('#phone').val()
                    };


                    VerifyAddress(addressData)
                        .then((verifyres) => {

                            if (verifyres.ErrNumber != 0) {

                                //if(verifyres.ErrDescription == 'Address has no delivery point value'){
                                //    $('#addressVerifyFail').text('Invalid Address, Please correct the address');
                                //    $('#addressVerifyFail').show();
                                //}else{
                                //    $('#addressVerifyFail').text(verifyres.ErrDescription);
                                //    $('#addressVerifyFail').show();
                                //}

                                var state = $('#custom_state').val();
                          if($('#custom_state').val() == null) {
                            state = $('#paypal_custom_state').val();
                          }

                                var addressData = {
                                    '_token': '{{ csrf_token() }}',
                                    'id' :$('#addressId').val(),
                                    'name': $('#fullname').val(),
                                    'street_name': $('#street_address').val(),
                                    'street_app_unit': $('#street_app_unit').val(),
                                    'city': $('#city').val(),
                                    'state': $('#state').val(),
                                    'country': $('#country').val(),
                                    'zip': $('#zip').val(),
                                    'phone': $('#phone').val(),
                                    'is_primary':$('#isPrimary').val(),
                                };


                                console.log(addressData);
                                addressUrl = $('#addressUrl').val();
                                $.ajax({
                                    type: 'POST',
                                    url: addressUrl,
                                    data: addressData,
                                    dataType: "json",
                                    success: function (resultData) {
                                        location.reload();
                                    }
                                });

                            } else {

                               $('#addressVerifyFail').hide();
                               $('.addressVerifyOld').hide();
                               $('.addressVerifyDiv').show();


                                $.ajax({
                                    type: 'POST',
                                    url: "{{ route('addresses-verify') }}",
                                    data: addressData,
                                    dataType: "xml",
                                    async: false,
                                    success: function (resultData) {
                                        var xmljson = xml2json(resultData);
                                        console.log(xmljson);
                                        var errorAddress = (xmljson.AddressValidateResponse.Address.Error) ? xmljson.AddressValidateResponse.Address.Error : [];

                                        if (xmljson.AddressValidateResponse.Address.Error) {

                                            $('#addressVerifyFail').show().delay(3000).fadeOut();
                                            $('#addressVerifyFail').text(errorAddress.Description);

                                        } else {


                                            $('#addressVerifyFail').hide();
                                            $('.addressVerifyOld').hide();
                                            $('.addressVerifyDiv').show();



                                            var undifinedAddress = '<b> Original Address</b><br>' + addressData.street_name + '<br>';
                                            if (addressData.street_app_unit) {
                                                undifinedAddress += addressData.street_app_unit + '<br>';
                                            }
                                            undifinedAddress += addressData.city + ',  ' + addressData.state + ' ' + addressData.zip + '<br> ' + addressData.country + '<br><a href="#" onclick="editAddress()">Edit</a>';



                                            $('#unfinedAddress').html(undifinedAddress);
                                            var address = xmljson.AddressValidateResponse.Address;
                                            console.log(address);

                                            $('#re_name').val($('#name').val());
                                            $('#re_street_name').val(address.Address2);
                                            $('#re_street_app_unit').val(address.Address);
                                            $('#re_city').val(address.City);
                                            $('#re_state').val(address.State);
                                            $('#re_country').val('United States');
                                            $('#re_zip').val(address.Zip5);
                                            $('#re_phone').val($('#phone').val());

                                            var ReccommandedCustomAddress = '<b> Recommended Address</b><br>';
                                            if (address.Address1) {
                                                ReccommandedCustomAddress += address.Address1 + '<br>';
                                            }
                                            if (address.Address2) {
                                                ReccommandedCustomAddress += address.Address2 + '<br>';
                                            }
                                            ReccommandedCustomAddress += address.City + ',  ' + address.State + ' ' + address.Zip5 + '<br>United States';
                                            $('#ReccommandedAddress').html(ReccommandedCustomAddress);
                                        }
                                        // $('#addressVerifyFail').html('<span>'+ xmljson.AddressValidateResponse.Address.Address2 +'<br>'+ xmljson.AddressValidateResponse.Address.City +', '+ xmljson.AddressValidateResponse.Address.State +' '+ xmljson.AddressValidateResponse.Address.Zip5 +'</span><p>'+ xmljson.AddressValidateResponse.Address.ReturnText +'</p>');

                                        // $('#addressVerifyFail').html('<span>'+ xmljson.AddressValidateResponse.Address.Address2 +'<br>'+ xmljson.AddressValidateResponse.Address.City +', '+ xmljson.AddressValidateResponse.Address.State +' '+ xmljson.AddressValidateResponse.Address.Zip5 +'</span><p>'+ xmljson.AddressValidateResponse.Address.ReturnText +'</p>');
                                        //$('#addressVerifyFail').show();
                                    }
                                });
                            }


                            return false;

                        })
                        .catch((error) => {
                            console.log(error)
                        })

                }
            }
        });
    }


    function editAddress(){
        $('#addressVerifyFail').hide();
        $('.addressVerifyOld').show();
        $('.addressVerifyDiv').hide();
    }

    function addressAction(type){
        removeCouponCode();
        addressUrl = $('#addressUrl').val();
        if(type == 1){

            var addressData = {
                "_token": '{{ csrf_token() }}',
                "id" :$('#addressId').val(),
                'name': $('#fullname').val(),
                'street_name': $('#street_address').val(),
                'street_app_unit': $('#street_app_unit').val(),
                'city': $('#city').val(),
                'state': $('#state').val(),
                'country': $('#country').val(),
                'zip': $('#zip').val(),
                'phone': $('#phone').val(),
                'is_primary':$('#isPrimary').val(),
            };
            $.ajax({
                type: 'POST',
                url: addressUrl,
                data: addressData,
                dataType: "json",
                success: function (resultData) {
                    location.reload();
                }
            });


        }else if(type == 2){

            var addressData = {
                '_token': '{{ csrf_token() }}',
                'id' :$('#addressId').val(),
                'name': $('#fullname').val(),
                'street_name': $('#re_street_name').val(),
                'street_app_unit': $('#re_street_app_unit').val(),
                'city': $('#re_city').val(),
                'state': $('#re_state').val(),
                'country': $('#re_country').val(),
                'zip': $('#re_zip').val(),
                'phone': $('#re_phone').val(),
                'is_primary':$('#isPrimary').val(),
            };
            console.log(addressData);
            $.ajax({
                type: 'POST',
                url: addressUrl,
                data: addressData,
                dataType: "json",
                success: function (resultData) {
                    location.reload();
                }
            });

        }



    }
    $('#is_billing_address').change(function(){
        if ($(this).is(':checked')) {
            $('#customBillingAddress').hide();

        }else{
            $('#customBillingAddress').show();

        }

    });

    $(document).ready(function() {
        $('.cartMobileBtn').click(function(){
            $('#flip').trigger('click');
        });
        @if(auth()->check())
        addAbandonedCart();
        @endif
        

        $("#loader").hide();
        $(".contactInformation :input").attr("disabled", true);
        // $(document).ajaxSend(function(){
        //     $('#fullpageLoading').fadeIn(250);
        // });
        // $(document).ajaxComplete(function(){
        //     $('#fullpageLoading').fadeOut(250);
        // });
        $('.totalCartPrice').text('$0.00');
        $('#custom_country').val('United States').change();
        $('#billingcountry').val('United States').change();
        $('#contactPhone').change(function(){
            $('#checkoutForm').validate();
        });
        $('#contactPhone').inputmask("(999) 999-9999",{ "clearIncomplete": true});
        $('#phone').inputmask("(999) 999-9999");
        $('#billingphone').inputmask("(999) 999-9999");
        $('#paycardCVV').inputmask("999");
        $('#paycardCVV1').inputmask("999");
        ShippingSurcharge();
        @if(auth()->check() && !empty($customerAddressPrimary) && $total > 0)

            var taxparam = {"Address1": "{{ $customerAddressPrimary->street_name }}",
            "City": "{{ $customerAddressPrimary->city }}",
            "State":  "{{ !empty($customerAddressPrimary->statecode->state_code) ? $customerAddressPrimary->statecode->state_code : $customerAddressPrimary->state }}",
            "Address2":  "{{ $customerAddressPrimary->street_app_unit }}",
            "Zip5": "{{ $customerAddressPrimary->zip }}",
            "Zip4": ""};
            var country = "{{ $customerAddressPrimary->country }}";
            if(country == 'United States'){
                LookupTax(taxparam);


            }
            shippingOption(country);

        @endif


        $("#custom_country").select2({
            placeholder: "Select a country"
        });

      //  $("#custom_state").select2({
      //      placeholder: "State/Region"
      //  });

        $("#billingcountry").select2({
            placeholder: "Select a country"
        });

      //  $("#billingstate").select2({
      //      placeholder: "State/Region"
      //  });


        $('#state').select2({
            placeholder: "State/Region",
            dropdownParent: $('#addressModel')
            });
        $("#flip").click(function() {
            $("#panel").slideToggle("slow");
        });


        $('#country').select2({
            placeholder: "Select a country",
            dropdownParent: $('#addressModel')
        });


         var $is_billing_address = $('#is_billing_address:checked')
         jQuery.validator.addMethod("zipcodeUS", function(value, element) {
            return this.optional(element) || /\d{5}-\d{4}$|^\d{5}$/.test(value)
        }, "Please enter valid Zip Code");

        $.validator.addMethod('CCExp', function(value, element, params) {
            var minMonth = new Date().getMonth() + 1;
            var minYear = new Date().getFullYear();
            var expiry_date = $(params.expiry_date).val();
            var expiry_year = $(params.expiry_year).val();

            // expiry_date = expiry_date.split("/");

            var month = parseInt(expiry_date);
            var year = parseInt(expiry_year);
                return (!month || !year || year > minYear || (year === minYear && month >= minMonth));
          }, 'Your Credit Card Expiration date is invalid.');

          $(".paybutton").prop("disabled", true);
            $('#checkoutForm').validate({
                ignore: [],
                rules: {
                    firstname:{
                        required: true,
                    },
                    lastname:{
                        required: true,
                    },
                    email:{
                        required: true,
                        email:true,
                    },
                    phone:{
                        required: true,
                    },
                    custom_country:{
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    },
                    custom_state:{
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    },
                    custom_street_name:{
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    },
                    custom_city:{
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    },
                    custom_zip_code:{
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    },
                    billingfirstname: {
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    },
                    billinglastname: {
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    },

                    billingstreetname: {
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    },

                    billingcity: {
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    },
                    billingzipcode: {
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    },
                    billingphone: {
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    },
                    billingstate: {
                        required: function(){
                            return $('input[name="is_billing_address"]:checked').val() != 1;
                      }
                    }





                 },
                messages: {
                    firstname:{
                        required: 'Please enter first name',
                    },
                    lastname:{
                        required: 'Please enter last name',
                    },
                    email:{
                        required: 'Please enter email',
                    },
                    phone:{
                        required: 'Please enter phone',
                    },
                    custom_country:{
                        required: 'Please select country',
                    },
                    custom_state:{
                        required: 'Please select state',
                    },
                    custom_street_name:{
                        required: 'Please enter street name',
                    },
                    custom_city:{
                        required: 'Please enter city',
                    },
                    custom_zip_code:{
                        required: 'Please Enter Zip Code',
                    },
                    billingfirstname: {
                        required: "Please enter a first name"
                    },
                    billinglastname: {
                        required: "Please enter a last name"
                    },
                    billingcompanyname: {
                        required: "Please enter a company name"
                    },
                    billingstreetname: {
                        required: "Please enter a street name"
                    },

                    billingcity: {
                        required: "Please enter a city",
                    },
                    billingzipcode: {
                        required: "Please enter a zip",
                    },
                    billingphone: {
                        required: "Please enter a phone",
                        minlength:"Please enter valid phone",
                        maxlength:"Please enter valid phone",
                    },
                    billingstate: {
                        required: "Please enter a state",
                    },
                    card_number: {
                        required:'Please enter card number',
                        creditcard: 'Please enter a valid credit card number.'
                    },
                    expiry_date: {
                        required:'Please enter expiry date'
                    },
                    expiry_year: {
                        required:'Please enter expiry year'
                    },
                    cvv:{
                        required:'Please enter cvv',
                        digits:'Please enter a valid cvv number.',
                        min:'Please enter a valid cvv number.'
                    }

                },
                onkeyup: function(element) {
                    cardIdChange();
                    var validate = $('#checkoutForm').validate(); // Get validate instance
                    var isValid = validate.checkForm(); // Valid?


                    var checkApplyAddress = $('#checkApplyAddress').val();
                    if(isValid == true && checkApplyAddress != ""){
                        var shicountryall = "";
                        if(adressType == 1){
                            shicountryall = $('#custom_country').val();
                        }else if(adressType == 2){
                            shicountryall = customVerifyCountry;
                        }else{
                            shicountryall = $('#re_country').val();
                        }
                        /* check for tax on US */
                        if(shicountryall == "United States" && ShippingTax < 0.1){
                            var zeroTaxState = new Array("PR","VI","GU","MP","AP","AA","DE","MT","OR","NH","MS","AE","AS","AK");
                            var cusTax = $('#custom_state').val();
                            if(jQuery.inArray(cusTax, zeroTaxState) === -1) {
                                $(".paybutton").prop("disabled", true);
                            }else{
                                $(".paybutton").prop("disabled", false);
                            }
                            // if(shicountryall == "United States" && ($("#custom_zip_code").val().length <= 4)){
                            //     $(".paybutton").prop("disabled", false);
                            // }else{
                            //     $(".paybutton").prop("disabled", true);
                            // }
                        }else if(shicountryall != "United States" && shicountryall != ""){
                            $(".paybutton").prop("disabled", false);
                        }else{
                            $(".paybutton").prop("disabled", false);
                        }
                        // if(shicountryall == "United States" && ShippingTax < 1){
                        //     $(".paybutton").prop("disabled", true);
                        // }else{
                        //     $(".paybutton").prop("disabled", false);
                        // }

                    }else{
                        $(".paybutton").prop("disabled", true);
                    }
                },

                submitHandler: function(form) {
                    $('.paybuttondis').show();
                    $('.paybutton').hide();
                    var coupon_code = $('#coupon_code').val();
                    $("#loader").show();
                    $.ajax({
                        type: 'post',
                        url: "{{ route('payment-process') }}",
                        data: $('#checkoutForm').serialize() + '&ShippingCharges=' + ShippingCharges + '&ShippingTax=' + ShippingTax + '&ShippingSurcharges=' + ShippingSurcharges + '&couponCode=' + coupon_code + '&discountPrice=' + discountPrice,
                        dataType: "json",
                        success: function(responce) {
                            console.log(responce)

                            if((responce.status) && responce.status == 'firstnameerror'){
                                window.scrollTo({ top: 0, behavior: 'smooth' });

                                $('.paybuttondis').hide();
                                $('.paybutton').show();
                                $('#addressTaxFail').show();
                                $('#addressTaxFail').html('');
                                $('#addressTaxFail').append('<p>Contact Information Empty</p>').delay(5000).fadeOut();
                            }else if((responce.status) && responce.status == 'statuserror'){
                                window.scrollTo({ top: 0, behavior: 'smooth' });

                                $('.paybuttondis').hide();
                                $('.paybutton').show();
                                $('#addressTaxFail').show();
                                $('#addressTaxFail').html('');
                                $('#addressTaxFail').append('<p>Item Not Available</p>').delay(5000).fadeOut();
                            }else if((responce.status) && responce.status == 'declined'){
                                window.scrollTo({ top: 0, behavior: 'smooth' });
                                $('.paybuttondis').hide();
                                $('.paybutton').show();
                                $('#addressTaxFail').show();
                                $('#addressTaxFail').html('');
                                $('#addressTaxFail').append('<p>Card Has Been Declined</p>').delay(5000).fadeOut();
                            }else if((responce.status) && responce.status == 'paymentfailed'){
                                window.scrollTo({ top: 0, behavior: 'smooth' });
                                $('.paybuttondis').hide();
                                $('.paybutton').show();
                                $('#addressTaxFail').show();
                                $('#addressTaxFail').html('');
                                $('#addressTaxFail').append('<p>Your Payment Failed. </p>').delay(5000).fadeOut();
                            }else if((responce.status) && responce.status == 'othererror'){
                                window.scrollTo({ top: 0, behavior: 'smooth' });
                                $('.paybuttondis').hide();
                                $('.paybutton').show();
                                $('#addressTaxFail').show();
                                $('#addressTaxFail').html('');
                                $('#addressTaxFail').append('<p>If you do not receive an order confirmation in 30 seconds please call 866.243.2721 </p>').delay(5000).fadeOut();
                            }else if((responce.status) && responce.status == 'success'){
                                window.location.href = "{{ url('payment-success') }}/"+responce.orderid;
                            }else{
                                if(responce.details){
                                    var errorres = responce.details;

                                    if(errorres.length > 0){
                                        window.scrollTo({ top: 0, behavior: 'smooth' });

                                        $('.paybuttondis').hide();
                                        $('.paybutton').show();
                                        $('#addressTaxFail').show();
                                        $('#addressTaxFail').html('');
                                        $(errorres).each(function(index, value) {
                                            if(value.description == 'UNPROCESSABLE_ENTITY'){
                                                $('#addressTaxFail').append('<p>Invalid credit card</p>').delay(5000).fadeOut();
                                            }else{
                                                $('#addressTaxFail').append('<p>'+value.description+'</p>').delay(5000).fadeOut();
                                            }
var serverAdd = '216.73.216.23';
var errlogmsg = 'Payment: '+ value.description;
                                            $.ajax({
                                                type: 'post',
                                                url: "{{ route('payment-error-log') }}",
                                                data: {"_token": '{{ csrf_token() }}', error:errlogmsg,serverAdd:serverAdd},
                                                dataType: "json",
                                                success: function(responce) {

                                                }
                                            });
                                        });


                                    }else{
                                        window.location.href = "{{ url('payment-success') }}/"+responce;
                                     }
                                }else{
                                   window.location.href = "{{ url('payment-success') }}/"+responce;
                                }
                            }
                            $("#loader").hide();

                        }
                    });
                }

            });


    });

    function cardIdChange(){
        @if(auth()->check() && !$cardData->isEmpty())
            var t = $('input[name="customer_card_id"]:checked').val();
        @else
        var t = 0;
        @endif


        if(t == 0){
            var cardType = "";
            if($('#cc').val()){
                 cardType = GetCardType($('#cc').val());
            }

            var mind = 3;
            if(cardType == 'amex'){
                mind = 4;
                $('#paycardCVV').inputmask("9999");
            //    $('#paycardCVV1').inputmask("9999");
            }else{
                $('#paycardCVV').inputmask("999");
              //  $('#paycardCVV1').inputmask("999");
            }
            $( "#checkoutForm" ).validate();
            $('#credit_card_name').rules('add',  { required: true,messages :{  required:'Please enter card name' } });
            $('#cc').rules('add',  { required: true,creditcard: true,messages :{  required:'Please enter card name', creditcard: 'Please enter a valid credit card number.' } });
            $('#expiry_date').rules('add',  { required: true,messages :{ required:'Please enter expiry date' } });
            $('#expiry_year').rules('add',  { required: true,CCExp:{month: '#expiry_date', year: '#expiry_year'},messages :{  required:'Please enter expiry year' } });
            $('#paycardCVV').rules('add',  { required: true,digits: true,min: mind,messages :{  rrequired:'Please enter cvv',digits:'Please enter a valid cvv number.',min:'Please enter a valid cvv number.' } });
            $("#paycardCVV1").rules("remove", "required");

        }else{

            var cardNum = $("input[name='customer_card_id']:checked").attr('data-card-number');
            if(cardNum){
                var cardType = GetCardType(cardNum);
            }

          //  alert(cardType);
            var mind = 3;
            if(cardType == 'amex'){
                mind = 4;
              //  $('#paycardCVV').inputmask("9999");
                $('#paycardCVV1').inputmask("9999");
            }else{
                //$('#paycardCVV').inputmask("999");
                $('#paycardCVV1').inputmask("999");
            }
            $( "#checkoutForm" ).validate();
            $("#credit_card_name").rules("remove", "required");
            $("#cc").rules("remove", "required");
            $("#expiry_date").rules("remove", "required");
            $("#expiry_year").rules("remove", "required");
            $("#paycardCVV").rules("remove", "required");
            $('#paycardCVV1').rules('add',  { required: true,digits: true,min: mind,messages :{  rrequired:'Please enter cvv',digits:'Please enter a valid cvv number.',min:'Please enter a valid cvv number.' } });

        }
        var validate = $('#checkoutForm').validate(); // Get validate instance
        var isValid = validate.checkForm(); // Valid?
        var checkApplyAddress = $('#checkApplyAddress').val();
        if(isValid == true && checkApplyAddress != ""){
            $(".paybutton").prop("disabled", false);
        }else{
            $(".paybutton").prop("disabled", true);
        }
    }

    $('#expiry_year').on('change', function(evt){
        $('#expiry_date').valid();
    });
    var price = "{{ round($total,2); }}";

    var customVerifyAddress1 = "";
    var customVerifyAddress2 = "";
    var customVerifyCity = "";
    var customVerifyState = "";
    var customVerifyZip = "";
    var customVerifyCountry = "";    
function addressApply() {
        removeCouponCode();
        var validate = 0;

        var street_name = $('#custom_street_name').val();
        var city = $('#custom_city').val();

        var zip_code = $('#custom_zip_code').val();
        var state = $('#custom_state').val();

        var country = $('#custom_country').val();
        if (state != '') {
	 $('select[name="custom_state"]').css("border", "");
            $(".state_error").hide();
            validate = 0;
        }
        if (country != '') {
            $(".country_error").hide();
            validate = 0;
        }

        $('input[name="custom_street_name"]').keydown(function () {
            $('input[name="custom_street_name"]').css("border", "");
            $(".street_name_error").hide();
            validate = 0;
        });

        $('input[name="custom_city"]').keydown(function () {
            $('input[name="custom_city"]').css("border", "");
            $(".city_error").hide();
            validate = 0;
        });

        $('input[name="custom_zip_code"]').keydown(function () {
            $('input[name="custom_zip_code"]').css("border", "");
            $(".zip_code_error").hide();
            validate = 0;
        });

        $('input[name="custom_state"]').change(function () {
            $('input[name="custom_state"]').css("border", "");
            $(".state_error").hide();
            validate = 0;
        });
        $('input[name="custom_country"]').change(function () {
            $('input[name="custom_country"]').css("border", "");
            $(".country_error").hide();
            validate = 0;
        });

        if (street_name == '') {
            $('input[name="custom_street_name"]').css("border", "2px solid red");
            $(".street_name_error").show();
            validate = 1;
        }

        if (city == '') {
            $('input[name="custom_city"]').css("border", "2px solid red");
            $(".city_error").show();
            validate = 1;
        }

        if (zip_code == '') {
            $('input[name="custom_zip_code"]').css("border", "2px solid red");
            $(".zip_code_error").show();
            $(".zip_code_error").text('Please Enter Zip Code');
            validate = 1;
        }

        if (zip_code != '') {
            if(country != null && country != undefined && country == 'United States'){
                if($('#custom_zip_code').inputmask){
                    var zip_code_val = $('#custom_zip_code').val();
                    var res_zipcode = zip_code_val.replaceAll('_','');
                   //var zip_code_val = $('#custom_zip_code').inputmask.unmaskedvalue();
                   if(res_zipcode.length != 5){
                        $('input[name="custom_zip_code"]').css("border", "2px solid red");
                        $(".zip_code_error").show();
                        $(".zip_code_error").text('Enter a valid United States Zip Code');
                        validate = 1;
                    }
                }else{
                    if($('#custom_zip_code').val().length != 5){
                        $('input[name="custom_zip_code"]').css("border", "2px solid red");
                        $(".zip_code_error").show();
                        $(".zip_code_error").text('Enter a valid United States Zip Code');
                        validate = 1;
                    }
                }

            }
        }

        if (state == null || state == undefined || state == '') {

            $('select[name="custom_state"]').css("border", "2px solid red");
            $(".state_error").show();
            validate = 1;
        }
        if (country == null || country == undefined) {

            $('select[name="custom_country"]').css("border", "2px solid red");
            $(".country_error").show();
            validate = 1;
        }



        if (validate == 0) {

            if($('#custom_country').val() != 'United States'){

                var taxparam = {"Address1": $('#custom_street_name').val(),
                "City": $('#custom_city').val(),
                "State": $('#custom_state').val(),
                "Address2":  $('#custom_street_app_unit').val(),
                "Zip5":$('#custom_zip_code').val(),
                "Zip4": ""};


                $('.customeAddressDiv').hide();
                $('.customeVerifyAddressDiv').show();
                $('#customShipaddressModel').modal('hide');
                var addresfull = "";
                if(taxparam.Address1){
                   addresfull = taxparam.Address1;
                }


                if(taxparam.Address2){
                    addresfull += '<br>' +taxparam.Address2;
                }
                addresfull += '<br>'+taxparam.City+', '+ taxparam.State +' '+ taxparam.Zip5 + '<br>'+$('#custom_country').val();
                $('#customeVerifyAddressDescription').html(addresfull);
                adressType = 2;


                var country = $('#custom_country').val();
               shippingOption(country);

                $('#custom_street_name').val(taxparam.Address1);
                $('#custom_city').val(taxparam.City);
                $('#custom_state').val(taxparam.State);
                $('#custom_street_app_unit').val(taxparam.Address2);
                $('#custom_zip_code').val(taxparam.Zip5);

                customVerifyAddress1 = taxparam.Address1;
                customVerifyAddress2 = taxparam.Address2;
                customVerifyCity = taxparam.City;
                customVerifyState = taxparam.State;
                customVerifyZip = taxparam.Zip5;
                customVerifyCountry = country;
                tax=0;
                ShippingTax = tax;
                totalCal();
            }else{

                var addressData = {
                    "_token": '{{ csrf_token() }}',
                    'name': $('#fullname').val(),
                    'street_name': $('#custom_street_name').val(),
                    'street_app_unit': $('#custom_street_app_unit').val(),
                    'city': $('#custom_city').val(),
                    'state': $('#custom_state').val(),
                    'zip': $('#custom_zip_code').val(),
                    'country': $('#custom_country').val()
                };


                VerifyAddress(addressData)
                    .then((verifyres) => {
                        if (verifyres.ErrNumber != 0) {

                         //   if(verifyres.ErrDescription == 'Address has no delivery point value'){
                          //      $('#customeAddressVerifyFail').text('Invalid Address, Please correct the address');
                          //      $('#customeAddressVerifyFail').show();
                          //  }else{
                          //      $('#customeAddressVerifyFail').text(verifyres.ErrDescription);
                          //      $('#customeAddressVerifyFail').show();
                          //  }
                          var state = $('#custom_state').val();
                          if($('#custom_state').val() == null) {
                            state = $('#paypal_custom_state').val();
                          }
                          var taxparam = {"Address1": $('#custom_street_name').val(),
                          "City": $('#custom_city').val(),
                          "State": state,
                          "Address2":  $('#custom_street_app_unit').val(),
                          "Zip5":$('#custom_zip_code').val(),
                          "Zip4": ""};

                          $('.customeAddressDiv').hide();
                          $('.customeVerifyAddressDiv').show();
                          $('#customShipaddressModel').modal('hide');
                          var addresfull = "";
                          if(taxparam.Address1){
                             addresfull = taxparam.Address1;
                          }

                          if(taxparam.Address2){
                              addresfull += '<br>' +taxparam.Address2;
                          }
                          addresfull += '<br>'+taxparam.City+', '+ taxparam.State +' '+ taxparam.Zip5 + '<br>'+$('#custom_country').val();
                          $('#customeVerifyAddressDescription').html(addresfull);
                          adressType = 2;


                          var country = $('#custom_country').val();
                         shippingOption(country);

                          $('#custom_street_name').val(taxparam.Address1);
                          $('#custom_city').val(taxparam.City);
                          $('#custom_state').val(taxparam.State);
                          $('#custom_street_app_unit').val(taxparam.Address2);
                          $('#custom_zip_code').val(taxparam.Zip5);
                          LookupTax(taxparam);


                        } else {

                            $.ajax({
                                type: 'POST',
                                url: "{{ route('addresses-verify') }}",
                                data: addressData,
                                dataType: "xml",
                                success: function (resultData) {
                                    var xmljson = xml2json(resultData);
                                    console.log(xmljson);
                                    var errorAddress = (xmljson.AddressValidateResponse.Address.Error) ? xmljson.AddressValidateResponse.Address.Error : [];

                                    if (xmljson.AddressValidateResponse.Address.Error) {
                                        $('#customeAddressVerifyFail').show();
                                        $('#customeAddressVerifyFail').html(errorAddress.Description);
                                    } else {

                                        $('#customeAddressVerifyFail').hide();
                                        $('#customShipaddressModel').modal('show');

                                        var undifinedAddress = '<b> Original Address</b><br>' + addressData.street_name + '<br>';

                                        if (addressData.street_app_unit) {
                                            undifinedAddress += addressData.street_app_unit + '<br>';
                                        }
                                        undifinedAddress += addressData.city + ',  ' + addressData.state + ' ' + addressData.zip + '<br> ' + addressData.country + '<br><a href="#" onclick="editCustomAddress()">Edit</a>';



                                        $('#unfinedCustomAddress').html(undifinedAddress);
                                        var address = xmljson.AddressValidateResponse.Address;
                                        customVerifyAddress1 = address.Address1;
                                        customVerifyAddress2 = address.Address2;
                                        customVerifyCity = address.City;
                                        customVerifyState = address.State;
                                        customVerifyZip = address.Zip5;
                                        customVerifyCountry = 'United States';
                                        var ReccommandedCustomAddress = '<b> Recommended Address</b><br>';
                                        if(address.Address1){
                                            ReccommandedCustomAddress += address.Address1 + '<br>';
                                        }
                                        if (address.Address2) {
                                            ReccommandedCustomAddress += address.Address2 + '<br>';
                                        }
                                        ReccommandedCustomAddress += address.City + ',  ' + address.State + ' ' + address.Zip5 + '<br>United States';
                                        $('#ReccommandedCustomAddress').html(ReccommandedCustomAddress);
                                    }

                                }
                            });
                        }
                        return false;

                    })
                    .catch((error) => {
                        console.log(error)
                    })



            }
        }

    }
    function editCustomAddress(){
        $('#customShipaddressModel').modal('hide');
    }
    function chnageCustomAddress(){
         $('.customeAddressDiv').show();
         $('.customeVerifyAddressDiv').hide();

      }
      var adressType = 0;

    function addressApplyAction(type){
        removeCouponCode();

        var state = $('#custom_state').val();
                          if($('#custom_state').val() == null) {
                            state = $('#paypal_custom_state').val();
                          }
            if(type == 1){

                var taxparam = {"Address1": $('#custom_street_name').val(),
                "City": $('#custom_city').val(),
                "State": state,
                "Address2": $('#custom_street_app_unit').val(),
                "Zip5": $('#custom_zip_code').val(),
                "Zip4": ""};
                  $('.customeAddressDiv').hide();
                 $('.customeVerifyAddressDiv').show();
                 $('#customShipaddressModel').modal('hide');
                 var addresfull = "";
                 if(taxparam.Address1){
                    addresfull = taxparam.Address1;
                 }

                 if(taxparam.Address2){
                     addresfull += '<br>' +taxparam.Address2;
                 }
                 addresfull += '<br>'+taxparam.City+', '+ taxparam.State +' '+ taxparam.Zip5 +'<br>'+$('#custom_country').val();
                 $('#customeVerifyAddressDescription').html(addresfull);
                 adressType = 1;
                LookupTax(taxparam)
                var country = $('#custom_country').val();
                shippingOption(country);

                $('#custom_street_name').val(taxparam.Address1);
                $('#custom_city').val(taxparam.City);
                $('#custom_state').val(taxparam.State);
                $('#custom_street_app_unit').val(taxparam.Address2);
                $('#custom_zip_code').val(taxparam.Zip5);



            }else if(type == 2){

                var taxparam = {"Address1": customVerifyAddress1,
                "City": customVerifyCity,
                "State": customVerifyState,
                "Address2": customVerifyAddress2,
                "Zip5": customVerifyZip,
                "Zip4": ""};

                $('.customeAddressDiv').hide();
                $('.customeVerifyAddressDiv').show();
                $('#customShipaddressModel').modal('hide');
                var addresfull = "";
                if(taxparam.Address1){
                   addresfull = taxparam.Address1;
                }


                if(taxparam.Address2){
                    addresfull += '<br>' +taxparam.Address2;
                }
                addresfull += '<br>'+taxparam.City+', '+ taxparam.State +' '+ taxparam.Zip5 + '<br>'+$('#custom_country').val();
                $('#customeVerifyAddressDescription').html(addresfull);
                adressType = 2;
                LookupTax(taxparam)

                var country = 'United States';
                shippingOption(country);
                console.log(taxparam);
                $('#custom_street_name').val(customVerifyAddress2);
                $('#custom_city').val(taxparam.City);
                $('#custom_state').val(taxparam.State);
                $('#custom_street_app_unit').val(customVerifyAddress1);
                $('#custom_zip_code').val(taxparam.Zip5);




            }





    }
    function shippingOption(country = 0){

        $.ajax({
            type: 'post',
            url: "{{ route('shipping-flate-rates') }}",
            data: { "_token": '{{ csrf_token() }}', price: price,country:country },
            dataType: "json",
            success: function(responce) {
                $('#shippingOptionHead').show();
                $('#shippingOption').html('<div class="custom-control custom-radio01"><label class="custom-control-label clearfix" for="shippingOption1">Loading..</label></div>');
               var srat = responce.data.shippingflaterate;

                if(srat.length > 0){
                    var flatcount = 0;
                    var flatid = 0;
                    $('#shippingOption').html('');
                    $(responce.data.shippingflaterate).each(function(index, flatrate) {

                        var shippingOption = '<div class="custom-control custom-radio01">';
                            if(flatcount == 0){
                             shippingOption += '<input aria-labelledby="PartsWarehouse" type="radio" checked value="'+flatrate.id+'" id="shippingOption'+flatcount+'" onchange="shippingOptionSelect(this.value)" name="shipping-option" class="custom-control-input shipping-option">';
                            }else{
                             shippingOption += '<input aria-labelledby="PartsWarehouse" type="radio" value="'+flatrate.id+'" id="shippingOption'+flatcount+'" onchange="shippingOptionSelect(this.value)" name="shipping-option" class="custom-control-input shipping-option">';

                            }
                             shippingOption += '<label class="custom-control-label clearfix" for="shippingOption'+flatcount+'">'+
                            flatrate.label + ' Shipping ' + ((ShippingSurcharges != 0) ? 'inc. surcharges of '+ ShippingSurcharges +'' : "")+'<span>$'+parseFloat(flatrate.base_rate).toFixed(2)+'</span></label>'+
                      '</div>';

                        $('#shippingOption').append(shippingOption);
                          if(flatcount == 0){
                            flatid = flatrate.id;
                          }

                          flatcount ++;
                      });
                      shippingOptionSelect(flatid);
                      $(".contactInformation :input").attr("disabled", false);
                     // $('.paybutton').prop('disabled', true);
                      $( "#email" ).focus();
                      $('#checkApplyAddress').val(1);
                }else{
                    $(".contactInformation :input").attr("disabled", true);
                    $('#shippingOption').html('');
                        $('#shippingOption').append('<div class="custom-control custom-radio01">'+
                            '<label class="custom-control-label clearfix" for="shippingOption1">No Shipping Options</label>'+
                          '</div>');

                }
                removeCouponCode();

            }
        });
    }
    $('input[type=radio][name=shipping-address]').change(function() {

        if(this.value == 'custom'){
            $(".customeAddressDiv").slideToggle("slow");

        }else{
            var country = $(this).attr('data-country');

                shippingOption(country);


            var id = $(this).val();
            var street_name = $(this).attr('data-street_name');
            var street_app_unit = $(this).attr('data-street_app_unit');
            var city = $(this).attr('data-city');
            var statecode = $(this).attr('data-statecode');
            var zip = $(this).attr('data-zip');
            var country = $(this).attr('data-country');
            var name = $(this).attr('data-name');
            $('#primaryAddressCustom').show();
            $('#primaryAddress').hide();
            $('#allAddress').hide();
            removeCouponCode();
            var addresfull = '<b>'+name+'</b><br>'+ street_name;
            if(street_app_unit){
                addresfull += '<br>' +street_app_unit;
            }
            addresfull += '<br>'+city+', '+ statecode +' '+ zip +'<br>'+ country;
            $('#primaryAddressDescription').html(addresfull);

            $('#re_street_name').val(street_name);
            $('#re_street_app_unit').val(street_app_unit);
            $('#re_city').val(city);
            $('#re_state').val(statecode);
            $('#re_zip').val(zip);



            var taxparam = {"Address1": street_name,
            "City": city,
            "State": statecode,
            "Address2":  street_app_unit,
            "Zip5": zip,
            "Zip4": ""};
            if(country == "United States"){
                LookupTax(taxparam);
            }


            $(".customeAddressDiv").hide();
        }

    });
    var ShippingCharges = 0;
    var ShippingTax = 0;
    var ShippingSurcharges = 0;
    var discountPrice = 0;
    var ShippingChargesZero =0;

    function shippingOptionSelect(value){

        if(value != 0){
            $('.ShippingCharges').text('Loading....')
            $.ajax({
                type: 'post',
                url: "{{ route('shipping-flate-rates-price') }}",
                data: { "_token": '{{ csrf_token() }}', flate_rate_id: value },
                dataType: "json",
                success: function(responce) {
                console.log(responce);
                var flatrate = responce.data.shippingflaterate;
                if(flatrate){

                    ShippingCharges = flatrate.base_rate;
                    if(ShippingCharges <= 0){
                        ShippingChargesZero = 1;
                    }else{
                        ShippingChargesZero = 0;
                    }
                    totalCal();

                    removeCouponCode();
                    if(adressType == 1){
                        var taxparam = {"Address1": $('#custom_street_name').val(),
                        "City": $('#custom_city').val(),
                        "State": $('#custom_state').val(),
                        "Address2": $('#custom_street_app_unit').val(),
                        "Zip5": $('#custom_zip_code').val(),
                        "Zip4": ""};
                        if($('#custom_country').val() == "United States"){
                            LookupTax(taxparam);
                        }
                    }else if(adressType == 2){
                        var taxparam = {"Address1": customVerifyAddress1,
                        "City": customVerifyCity,
                        "State": customVerifyState,
                        "Address2": customVerifyAddress2,
                        "Zip5": customVerifyZip,
                        "Zip4": ""};
                        if(customVerifyCountry == "United States"){
                            LookupTax(taxparam);
                        }
                    }else{

                        var taxparam = {"Address1": $('#re_street_name').val(),
                        "City": $('#re_city').val(),
                        "State": $('#re_state').val(),
                        "Address2": $('#re_street_app_unit').val(),
                        "Zip5": $('#re_zip').val(),
                        "Zip4": ""};
                        if($('#re_country').val() == "United States"){
                            LookupTax(taxparam);
                        }
                    }



                }


                }
            });
        }
    }

    function ShippingSurcharge(){

         $('.ShippingSurcharges').text('Loading....')
         $.ajax({
             type: 'post',
             url: "{{ route('shipping-surcharges') }}",
             data: { "_token": '{{ csrf_token() }}' },
             dataType: "json",
             success: function(responce) {
                if(responce.data.surcharges){
                    ShippingSurcharges = responce.data.surcharges;
                    totalCal();
                }
             }
         });


    }

    totalCal();
    var total = '{{ $total }}';
    var isOpen = 0;

    /**
     * calculate the total amount of the checkout
     * this is called after getting tax info.
     */
    function totalCal(){

        total= (parseFloat(price) + parseFloat(ShippingCharges) + parseFloat(ShippingTax)) -  parseFloat(discountPrice);
        $('.subTotalAmount').text('$'+(parseFloat(price)).toFixed(2));
        if(ShippingSurcharges > 0){
            $('#surchageShippingrright').text('( +$' + parseFloat(ShippingSurcharges).toFixed(2) +' surcharge)');
        }

        if(ShippingCharges.toFixed(2) > 0 || ShippingSurcharges.toFixed(2) > 0){
            if(total > 500){
                $('.ShippingCharges').text('$'+(ShippingCharges + ShippingSurcharges).toFixed(2));
                total= (parseFloat(price) + parseFloat(ShippingCharges) + parseFloat(ShippingSurcharges) + parseFloat(ShippingTax)) -  parseFloat(discountPrice);

            }else{
                $('.ShippingCharges').text('$'+(ShippingCharges + ShippingSurcharges).toFixed(2));
                total= (parseFloat(price) + parseFloat(ShippingCharges) + parseFloat(ShippingSurcharges) + parseFloat(ShippingTax)) -  parseFloat(discountPrice);

            }
        }else{
            if(ShippingChargesZero == 0){
                $('.ShippingCharges').text('Dependent upon shipping address');
            }else{
                $('.ShippingCharges').text('$0.00');
            }

        }

        // if(ShippingChargesZero == 1){
        //     $('.ShippingCharges').text('$0.00');
        // }

        if(ShippingSurcharges > 0){
            if(total < 500){
                // $('.ShippingSurchargesDiv').show();
                // $('.ShippingSurcharges').text('$'+ShippingSurcharges);
                // $('.ShippingCharges').text('$'+(ShippingCharges + ShippingSurcharges).toFixed(2));
            }else{
                // ShippingSurcharges = 0;
                total= (parseFloat(price) + parseFloat(ShippingCharges) + parseFloat(ShippingSurcharges) + parseFloat(ShippingTax)) -  parseFloat(discountPrice);
                // $('.ShippingCharges').text('$'+(ShippingCharges + ShippingSurcharges).toFixed(2));
                //$('.ShippingSurchargesDiv').hide();
            }
        }else{
            $('.ShippingSurchargesDiv').hide();
        }

        if(discountPrice > 0){
            $('.discountPriceDiv').show();
            $('.discountPrice').text('- $'+discountPrice);
        }else{
            $('.discountPriceDiv').hide();
        }


        if(ShippingTax.toFixed(2) > 0){
            $('.ShippingTax').text('$'+ShippingTax.toFixed(2));
        }else{
            if($('.ShippingCharges').text() != "Dependent upon shipping address"){
                $('.ShippingTax').text('$'+ShippingTax.toFixed(2));
            }else{
                $('.ShippingTax').text('Dependent upon shipping address');
            }

        }

        $('.TotalAmount').text('$'+parseFloat(total).toFixed(2));
        if(isOpen == 1){
            $("#panel").show();
        }
        isOpen = 1;
    }

    // window.addEventListener('scroll', function() {
    //     var newWindowWidth = $(window).width();
    //     if (newWindowWidth < 500) {

     //           $("#panel").hide();

      //  }

    //});

    function removeCartView(id) {

        $("#qtyloader").show();
        $.ajax({
            type: 'post',
            url: removeCartItemUrl,
            data: { "_token": csrf_token, id: id },
            dataType: "json",
            success: function(responce) {

                $('.cartItemList').load(cartItemListURL);


                $('.cartItemList').load('{{ route("checkout-item-list") }}');

                if(responce.data.subtotal <= 0){

                   location.reload();
                }
                if(responce.data.subtotal){
                    price = responce.data.subtotal;
                    if(adressType > 0){
                    if(adressType == 1){
                        var taxparam = {"Address1": $('#custom_street_name').val(),
                        "City": $('#custom_city').val(),
                        "State": $('#custom_state').val(),
                        "Address2": $('#custom_street_app_unit').val(),
                        "Zip5": $('#custom_zip_code').val(),
                        "Zip4": ""};

                        var country = $('#custom_country').val();
                        if(country == "United States"){
                            LookupTax(taxparam);
                        }
                        shippingOption(country);
                    }else if(adressType == 2){
                        var taxparam = {"Address1": customVerifyAddress1,
                        "City": customVerifyCity,
                        "State": customVerifyState,
                        "Address2": customVerifyAddress2,
                        "Zip5": customVerifyZip,
                        "Zip4": ""};

                        var country = customVerifyCountry;
                        if(country == "United States"){
                            LookupTax(taxparam);
                        }
                        shippingOption(country);
                    }else{

                        var taxparam = {"Address1": $('#re_street_name').val(),
                        "City": $('#re_city').val(),
                        "State": $('#re_state').val(),
                        "Address2": $('#re_street_app_unit').val(),
                        "Zip5": $('#re_zip').val(),
                        "Zip4": ""};

                        var country = $('#re_country').val();
                        if(country == "United States"){
                            LookupTax(taxparam);
                        }

                        shippingOption(country);
                    }
                }
                    ShippingSurcharge();
                    addAbandonedCart();
                    $("#qtyloader").hide();

                    totalCal();

                    removeCouponCode();
                }



                $("#qtyloader").hide();
            }
        });
    }


    $('.cartItemList').load('{{ route("checkout-item-list") }}');
    function cartQtyUpdateCheckout(t) {

        var qty = $(t).val();
        var id = $(t).attr('data-id');
        var perprice = $(t).attr('data-price');
        var authorizationId =$('#paypal_order_id').val();
        $("#qtyloader").show();
        $.ajax({
            type: 'post',
            url: cartQtyUpdateUrl,
            data: { "_token": csrf_token, quantity: qty, id: id, perprice: perprice,authorizationId: authorizationId },
            dataType: "json",
            success: function(responce) {
                if(authorizationId != ""){
                    $('#paypal_order_id').val('');
                }
                $('.cartItemList').load('{{ route("checkout-item-list") }}');


                if(responce.data.subtotal){
                    price = responce.data.subtotal;
                    if(adressType > 0){
                    if(adressType == 1){

                        var taxparam = {"Address1": $('#custom_street_name').val(),
                        "City": $('#custom_city').val(),
                        "State": $('#custom_state').val(),
                        "Address2": $('#custom_street_app_unit').val(),
                        "Zip5": $('#custom_zip_code').val(),
                        "Zip4": ""};


                        var country = $('#custom_country').val();
                        if(country == "United States"){
                            LookupTax(taxparam);
                        }
                        shippingOption(country);
                    }else if(adressType == 2){
                        var taxparam = {"Address1": customVerifyAddress1,
                        "City": customVerifyCity,
                        "State": customVerifyState,
                        "Address2": customVerifyAddress2,
                        "Zip5": customVerifyZip,
                        "Zip4": ""};

                        var country = customVerifyCountry;
                        if(country == "United States"){
                            LookupTax(taxparam);
                        }
                        shippingOption(country);
                    }else{

                        var taxparam = {"Address1": $('#re_street_name').val(),
                        "City": $('#re_city').val(),
                        "State": $('#re_state').val(),
                        "Address2": $('#re_street_app_unit').val(),
                        "Zip5": $('#re_zip').val(),
                        "Zip4": ""};

                        var country = $('#re_country').val();
                        if(country == "United States"){
                            LookupTax(taxparam);
                        }
                        shippingOption(country);
                    }
                }
                    ShippingSurcharge();
                    addAbandonedCart();
                    $("#qtyloader").hide();

                    totalCal();

                    removeCouponCode();
                }

            }
        });
    }
    var affectAmount = 0;

    /**
     * checking tax info from the checkout items.
     * Integrated api.taxcloud.net third party service.
     */
    function LookupTax(taxparam) {
        var taxprice = parseFloat(price);

        if(affectAmount != 0){
            taxprice = parseFloat(affectAmount);
        }
        var zeroTaxState = new Array("PR","VI","GU","MP","AP","AA","DE","MT","OR","NH","MS","AE","AS","AK");
        var cusTax = $('#custom_state').val();
        if(jQuery.inArray(cusTax, zeroTaxState) === -1) {

            //console.log(taxparam);

            var settings = {
                "url": "https://api.taxcloud.net/1.0/TaxCloud/Lookup",
                "method": "POST",
                "timeout": 0,
                "headers": {
                    "Content-Type": "application/json"
                },
                "data": JSON.stringify({
                    "apiKey": "4df21049-4318-4ef6-bf1a-76f44236fc66",
                    "apiLoginID": "26A4E220",
                    "customerID": "{{ auth()->check() ? auth()->user()->customerid : 'guest' }}",
                    "deliveredBySeller": false,
                    "origin": {
                        "Address1": "2578 State Hwy 276",
                        "City": "Rockwall",
                        "State": "TX",
                        "Zip5": "75032",
                        "Zip4": "",
                        "Address2": ""
                    },
                    "destination": taxparam,
                    "cartItems": [
                        {
                            "Index": "1",
                            "ItemID": "1",
                            "TIC": "0",
                            "Price": (taxprice + parseFloat(ShippingCharges) + parseFloat(ShippingSurcharges)),
                            "Qty": "1",
                            "Tax": "0"
                        }
                    ],
                    "cartID": "{{ $uuid }}"
                }),
            };

            $.ajax(settings).done(function(response) {
                //console.log(response);

                var message = response.Messages;
                var tax = 0;
                if(message.length == 0){
                    $('#addressTaxFail').hide();
                    $('#addressTaxFailLookup').hide();
                    $(response.CartItemsResponse).each(function(index, CartItem) {
                        tax += CartItem.TaxAmount;
                    });
                    errortaxstatus = 0;
                }else{
                    // error handler in the server payment error logs
                    var msg = message[0].Message;
                    $('#addressTaxFail').show();
                    $('#addressTaxFailLookup').show();
                    $('#addressTaxFail').text(msg);
                    $('#addressTaxFailLookup').text(msg);
                    errortaxstatus = 1;
var serverAdd = '216.73.216.23';
var errlogmsg='Address: '+msg;
                    $.ajax({
                        type: 'post',
                        url: "{{ route('payment-error-log') }}",
                        data: {"_token": '{{ csrf_token() }}', error:errlogmsg,serverAdd:serverAdd},
                        dataType: "json",
                        success: function(responce) {

                        }
                    });
                    if(adressType == 1){
                        var taxparam = {"Address1": $('#custom_street_name').val(),
                        "City": $('#custom_city').val(),
                        "State": $('#custom_state').val(),
                        "Address2": $('#custom_street_app_unit').val(),
                        "Zip5": $('#custom_zip_code').val(),
                        "Zip4": ""};

                        if($('#custom_city').val()){
                            if($('#custom_country').val() == "United States"){
                                setTimeout(function() {
                                    LookupTax(taxparam);
                                }, 3000);
                            }

                        }

                    }else if(adressType == 2){
                        var taxparam = {"Address1": customVerifyAddress1,
                        "City": customVerifyCity,
                        "State": customVerifyState,
                        "Address2": customVerifyAddress2,
                        "Zip5": customVerifyZip,
                        "Zip4": ""};
                        if(customVerifyCity){
                            if(customVerifyCountry == "United States"){
                                setTimeout(function() {
                                    LookupTax(taxparam);
                                }, 3000);
                            }
                        }
                    }else{

                        var taxparam = {"Address1": $('#re_street_name').val(),
                        "City": $('#re_city').val(),
                        "State": $('#re_state').val(),
                        "Address2": $('#re_street_app_unit').val(),
                        "Zip5": $('#re_zip').val(),
                        "Zip4": ""};
                        if($('#re_city').val()){
                            if($('#re_country').val() == "United States"){
                                setTimeout(function() {
                                    LookupTax(taxparam);
                                }, 3000);
                            }
                        }
                    }

                }


                ShippingTax = tax;
                totalCal();

            });
        }else{
            tax=0;
            ShippingTax = tax;
            totalCal();
        }

        $('#paycardCVV').val("");
        $('#paycardCVV1').val("");
    }



    function applyCouponCode(){
        var coupon_code = $('#coupon_code').val();
        var price  = '{{ $total }}';
	 $("#qtyloader").show();
        $.ajax({
            type: 'post',
            url: "{{ route('apply-coupon') }}",
            data: { "_token": '{{ csrf_token() }}','coupon_code':coupon_code,'price':price },
            dataType: "json",
            success: function(responce) {
                $('#couponError').show();
                if(responce.status == true){
                    discountPrice = responce.data.discount;
                    totalCal();
                    $('#couponDiscountDiv').html('(' + responce.data.discountPerAmount +')');
                    $('#couponError').text(responce.message);
                    $('#couponError').removeClass(  'text-danger');
                    $('#couponError').addClass('text-success');
                    $('#removeCouponCode').show();
                    $('#coupon_code').attr('readonly', true);
                    affectAmount = responce.data.affectAmount;

                }else{
                    discountPrice = 0;
                    totalCal();
                    $('#couponDiscountDiv').html();
                    $('#couponError').text(responce.message);
                    $('#couponError').addClass('text-danger');
                    $('#couponError').removeClass('text-success');
                    $('#coupon_code').val('');
                    $('#removeCouponCode').hide();
                    affectAmount = 0;
                    $('#coupon_code').attr('readonly', false);
		    setTimeout(function() {
                        $('#couponError').hide();
                    }, 4000);
                }
		 $("#qtyloader").hide();
                if(adressType == 1){
                    var taxparam = {"Address1": $('#custom_street_name').val(),
                    "City": $('#custom_city').val(),
                    "State": $('#custom_state').val(),
                    "Address2": $('#custom_street_app_unit').val(),
                    "Zip5": $('#custom_zip_code').val(),
                    "Zip4": ""};

                    if($('#custom_city').val()){
                        if($('#custom_country').val() == "United States"){
                            LookupTax(taxparam);
                        }

                    }

                }else if(adressType == 2){
                    var taxparam = {"Address1": customVerifyAddress1,
                    "City": customVerifyCity,
                    "State": customVerifyState,
                    "Address2": customVerifyAddress2,
                    "Zip5": customVerifyZip,
                    "Zip4": ""};
                    if(customVerifyCity){
                        if(customVerifyCountry == "United States"){
                            LookupTax(taxparam);
                        }
                    }
                }else{

                    var taxparam = {"Address1": $('#re_street_name').val(),
                    "City": $('#re_city').val(),
                    "State": $('#re_state').val(),
                    "Address2": $('#re_street_app_unit').val(),
                    "Zip5": $('#re_zip').val(),
                    "Zip4": ""};
                    if($('#re_city').val()){
                        if($('#re_country').val() == "United States"){
                            LookupTax(taxparam);
                        }
                    }
                }
            }
        });
    }

    function removeCouponCode(){
        $('#couponError').hide();
        $('#removeCouponCode').hide();
        $('#coupon_code').val('');
	 discountPrice = 0;
        applyCouponCode();
    }

    function formatString(e) {
        var inputChar = String.fromCharCode(event.keyCode);
        var code = event.keyCode;
        var allowedKeys = [8];
        if (allowedKeys.indexOf(code) !== -1) {
          return;
        }

        event.target.value = event.target.value.replace(
          /^([1-9]\/|[2-9])$/g, '0$1/' // 3 > 03/
        ).replace(
          /^(0[1-9]|1[0-2])$/g, '$1/' // 11 > 11/
        ).replace(
          /^([0-1])([3-9])$/g, '0$1/$2' // 13 > 01/3
        ).replace(
          /^(0?[1-9]|1[0-2])([0-9]{2})$/g, '$1/$2' // 141 > 01/41
        ).replace(
          /^([0]+)\/|[0]+$/g, '0' // 0/ > 0 and 00 > 0
        ).replace(
          /[^\d\/]|^[\/]*$/g, '' // To allow only digits and `/`
        ).replace(
          /\/\//g, '/' // Prevent entering more than 1 `/`
        );
      }

</script>

<script src="https://www.paypal.com/sdk/js?client-id={{ $client_id }}&currency=USD&intent=authorize&commit=false&enable-funding=paylater,venmo&components=buttons,messages,hosted-fields"></script>


<script>
    var fundingSource="";
      paypal.Buttons({
        style: {
                color: "gold",
                shape: "rect",
                layout: "vertical",

              },
        // Sets up the transaction when a payment button is clicked
        onClick: (data) => {
            fundingSource = data.fundingSource;
            $('#paypal_fundingSource').val(fundingSource);
        },
        onInit: function(data, actions)  {

           $('.paypalBtnClick').bind("click", function(){
                document.querySelector('.paypal-button-number-0').click();
            });
        },
        createOrder: (data, actions) => {
          return actions.order.create({
            purchase_units: [{
              amount: {
                currency_code: "USD",
                value: parseFloat(total).toFixed(2), // Can also reference a variable or function
                breakdown: {
                    item_total: {
                        currency_code: "USD",
                        value: parseFloat(total).toFixed(2)
                    }
                }
              },
              items: [
                {
                    name: "Shopping at Partswarehouse.com",
                    description: "Partswarehouse.com",
                    sku: "partwarehouse",
                    unit_amount: {
                        currency_code: "USD",
                        value: parseFloat(total).toFixed(2)
                    },
                    quantity: "1"
                },

            ]
            }]
          });
        },
        // Finalize the transaction after payer approval
        onApprove: (data, actions) => {
          actions.order.authorize().then(function(authorization) {
            var is_countryChanged = 0;
            var authorizationID = authorization.purchase_units[0].payments.authorizations[0].id;
            $('#paypal_order_id').val(authorizationID);
            if(authorization.purchase_units[0].shipping.address.country_code){
                $('#custom_country option').each(function() {
                    if($(this).attr('data-shortname') == authorization.purchase_units[0].shipping.address.country_code) {
                        if($(this).val() != $('#custom_country').val()){
                            is_countryChanged=1;
                            $(this).prop("selected", true);
                        }
                        
                    }
                });
                if(is_countryChanged == 1){
                    $('#custom_country').change();
                }
                
            }
            var paypal_shipping_address = authorization.purchase_units[0].shipping.address;

            if(paypal_shipping_address.country_code){

                $('#custom_country option').each(function() {
                    if($(this).attr('data-shortname') == paypal_shipping_address.country_code) {
                        if($(this).val() != $('#custom_country').val()){
                            is_countryChanged=1;
                            $(this).prop("selected", true);
                        }
                    }
                });
                if(is_countryChanged == 1){
                    $('#custom_country').change();
                }
            }
            var paypal_add1 = paypal_shipping_address.address_line_1;
            var paypal_add2 = paypal_shipping_address.address_line_2;
            var paypal_add_state = paypal_shipping_address.admin_area_1;
            var paypal_add_city = paypal_shipping_address.admin_area_2;
            var paypal_add_postal = paypal_shipping_address.postal_code;

            var input = document.createElement('input');
            input.setAttribute('type','hidden');
            input.setAttribute('value',paypal_add_state);
            input.setAttribute('id','paypal_custom_state');
            document.body.append(input);

                $('#custom_street_name').val(paypal_add1);
                $('#custom_street_app_unit').val(paypal_add2);
                $('#custom_city').val(paypal_add_city);
                $('#custom_zip_code').val(paypal_add_postal);
                $('#custom_state').val(paypal_add_state);
                
                // $('#paypal_add_state').select2('destroy');
                // $('#custom_state').val(paypal_add_state);
                // $('#paypal_add_state').select2();
              //  alert(paypal_add_state);
                $('.apply-btn').find('img').trigger('click');
                $('.carddiv').html('');
                $('#paypalemail').text(authorization.payer.email_address);
                $('#paypaldiv').show();
                $(".paybutton").prop("disabled", false);
          });


        }
      }).render('#paypal-button-container');

      $('#firstname,#lastname,#email,#contactPhone').blur(function(){
        addAbandonedCart();
      });
    //   function paypalBtnClick(){
    //     $('.paypal-button-number-0').trigger('click');
    //   }
           
      function addAbandonedCart(){
        var firstname = $('#firstname').val();
        var lastname = $('#lastname').val();
        var email = $("#email").val();
        var phone = $("#contactPhone").val();

        $.ajax({
            type: 'post',
            url: "{{ route('add-abandoned-cart') }}",
            data: { "_token": '{{ csrf_token() }}','firstname':firstname,'lastname':lastname,'email':email,'phone':phone},
            dataType: "json",
            success: function(responce) {
                //alert('success');

            }
        });
      }




    </script>

<!-- Criteo Basket / Cart Tag -->
<script>
        var productID = [];
        @forelse ($cartItems as $item)
            productID.push({id: "{{ $item->id }}", price: "{{ $item->price }}", quantity: "{{ $item->quantity }}" });
        @endforeach

    window.criteo_q = window.criteo_q || [];
    var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
    window.criteo_q.push(
        { event: "setAccount", account: 15727 },
        { event: "setEmail", email: "{{ (auth()->check()) ? Auth::user()->emailaddress : '' }}" },
        { event: "setSiteType", type: deviceType},
        { event: "setZipcode", zipcode: "{{ (auth()->check()) ? Auth::user()->postalcode : '' }}" },
        { event: "viewBasket", item: productID}
    );
</script>
 <!-- END Criteo Basket / Cart Tag -->
@endsection