@extends('layouts.website_layout')
@section('meta_title', $meta_data->meta_title)
@section('meta_description', $meta_data->meta_description)
@section('banner_image', "banners/".$banner_data->banner_image)
@section('canonical_tag', $meta_data->canonical_tag)
@section('content')
<main>
    <div class="container-fluid checkout">
        <div class="row checkout__address"> 
            <div class="col-12 col-sm-12 col-md-12 col-lg-6 checkout__address__billing address">
                <div class="row">
                    <div class="col-12 address__title">
                        <h2 class="bold-heading">Billing address</h2>
                    </div>
                </div>
                <form id="billing_address">
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="billing_address_first_name">First Name</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="billing_address_first_name" name="billing_address_first_name" value="{{$billing_address_array['billing_address_first_name']}}">
                            <div class="error">
                                <span id="billing_address_first_name_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="billing_address_last_name">Last Name</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="billing_address_last_name" name="billing_address_last_name" value="{{$billing_address_array['billing_address_last_name']}}">
                            <div class="error">
                                <span id="billing_address_last_name_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="billing_address_mobile_number">Mobile Number</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" inputmode="numeric" pattern="[0-9]*" class="form-control" id="billing_address_mobile_number" name="billing_address_mobile_number" value="{{$billing_address_array['billing_address_mobile_number']}}">
                            <div class="error">
                                <span id="billing_address_mobile_number_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="billing_address_line_one">Address Line 1</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="billing_address_line_one" name="billing_address_line_one" value="{{$billing_address_array['billing_address_line_one']}}">
                            <div class="error">
                                <span id="billing_address_line_one_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="billing_address_line_two">Address Line 2</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="billing_address_line_two" name="billing_address_line_two" value="{{$billing_address_array['billing_address_line_two']}}">
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="billing_address_pin_code">PIN Code</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="billing_address_pin_code" name="billing_address_pin_code" value="{{$billing_address_array['billing_address_pin_code']}}">
                            <div class="error">
                                <span id="billing_address_pin_code_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="billing_address_city">City</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="billing_address_city" name="billing_address_city" value="{{$billing_address_array['billing_address_city']}}">
                            <div class="error">
                                <span id="billing_address_city_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="billing_address_state">State</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="billing_address_state" name="billing_address_state" value="{{$billing_address_array['billing_address_state']}}">
                            <div class="error">
                                <span id="billing_address_state_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="billing_address_pin_code">GST</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="billing_address_gst_number" name="billing_address_gst_number" value="{{$billing_address_array['billing_address_gst_number']}}">
                            <div class="error">
                                <span id="billing_address_gst_number_err"></span>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="col-12 col-sm-12 col-md-12 col-lg-6 checkout__address__delivery address">
                <div class="row">
                    <div class="col-12 address__title">
                        <h2 class="bold-heading">Delivery address</h2>
                    </div> 
                </div>
                <div class="row address__selection mb-3">
                    <div class="col-12 col-md-6 address__selection__block">
                        <input type="radio" name="same_address_shipping" class="same_address_shipping" id="keep_billing_same" value="1" @if($order->billing_address_id == $order->shipping_address_id) checked @endif>
                        <label for="keep_billing_same">Same as billing address</label>
                    </div>
                    <div class="col-12 col-md-6 address__selection__block form-group">
                        <input type="radio" name="same_address_shipping" class="same_address_shipping" id="keep_billing_different" value="0" @if($order->billing_address_id != $order->shipping_address_id) checked @endif>
                        <label for="keep_billing_different">Add an alternative address</label>
                    </div>
                </div>
                <form id="shipping_address" @if($order->billing_address_id == $order->shipping_address_id) class="d-none" @endif>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="shipping_address_first_name">First Name</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="shipping_address_first_name" name="shipping_address_first_name" value="{{$shipping_address_array['shipping_address_first_name']}}">
                            <div class="error">
                                <span id="shipping_address_first_name_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="shipping_address_last_name">Last Name</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="shipping_address_last_name" name="shipping_address_last_name" value="{{$shipping_address_array['shipping_address_last_name']}}">
                            <div class="error">
                                <span id="shipping_address_last_name_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="shipping_address_mobile_number">Mobile Number</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" inputmode="numeric" pattern="[0-9]*" class="form-control" id="shipping_address_mobile_number" name="shipping_address_mobile_number" maxlength="10" value="{{$shipping_address_array['shipping_address_mobile_number']}}">
                            <div class="error">
                                <span id="shipping_address_mobile_number_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="shipping_address_line_one">Address Line 1</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="shipping_address_line_one" name="shipping_address_line_one" value="{{$shipping_address_array['shipping_address_line_one']}}">
                            <div class="error">
                                <span id="shipping_address_line_one_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="shipping_address_line_two">Address Line 2</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="shipping_address_line_two" name="shipping_address_line_two" value="{{$shipping_address_array['shipping_address_line_two']}}">
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="shipping_address_pin_code">PIN Code</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <input type="text" class="form-control" id="shipping_address_pin_code" name="shipping_address_pin_code" value="{{$shipping_address_array['shipping_address_pin_code']}}" maxlength="6" inputmode="numeric" pattern="[0-9]*">
                            <div class="error">
                                <span id="shipping_address_pin_code_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="shipping_address_city">City</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <select class="form-control" id="shipping_address_city" name="shipping_address_city">
                                @if(!empty($shipping_address_array['shipping_address_city']))
                                <option value="{{$shipping_address_array['shipping_address_city']}}">{{$shipping_address_array['shipping_address_city']}}</option>
                                @else
                                <option value="">Select City</option>
                                @endif
                            </select>
                            <div class="error">
                                <span id="shipping_address_city_err"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row address__field form-group">
                        <div class="col-12 col-sm-12 col-md-4 col-3 address__field__label">
                            <label for="shipping_address_state">State</label>
                        </div>
                        <div class="col-12 col-sm-12 col-md-8 col-9 address__field__input">
                            <select class="form-control" id="shipping_address_state" name="shipping_address_state">
                                @if(!empty($shipping_address_array['shipping_address_state']))
                                <option value="{{$shipping_address_array['shipping_address_state']}}">{{$shipping_address_array['shipping_address_state']}}</option>
                                @else
                                <option value="">Select State</option>
                                @endif
                            </select>
                            <div class="error">
                                <span id="shipping_address_state_err"></span>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <div class="row checkout__concierge">
            <div class="col-12 checkout__concierge__text">
                <h2 class="bold-heading">Concierge</h2>
                <p>We would like to send you personalised plants care instruction to keep your plant healthy and pretty. How would you like to keep in touch?</p>
            </div>
            @foreach($notifications as $notification_row)
            <div class="col-12 col-sm-12 col-md-6 col-lg-3 checkout__concierge__options">
                <div class="checkout__concierge__options__block">
                    <input type="radio" class="notification_method_id" name="notification_method_id" value="{{$notification_row->id}}" id="notification_method_{{Str::slug($notification_row->notification_title, '_')}}" @if($notification_method_id == $notification_row->id) checked @endif>
                    <label for="notification_method_{{Str::slug($notification_row->notification_title, '_')}}">{{$notification_row->notification_title}}</label>
                </div>
            </div>
            @endforeach
            <div class="error">
                <span id="notification_method_id_err"></span>
            </div>
        </div>
        <div class="row checkout__postcard">
            <div class="col-12 checkout__postcard__text">
                <h2 class="bold-heading">Send a postcard</h2>
                <p>Would you like us to send a card?</p>
            </div>
            @foreach($post_cards as $post_card_row)
            <div class="col-12 col-sm-12 col-md-6 col-lg-4 checkout__postcard__options post_card_selection">
                <div class="checkout__postcard__options__block ">
                    <img loading="lazy" src="{{url('/')}}/assets/images/post-cards/{{$post_card_row->post_card_image}}" alt="Post Card" class="img-fluid">
                    <div class="checkout__postcard__options__block__selected" data-id="{{$post_card_row->id}}">
                        <i class="fa fa-check" aria-hidden="true"></i>
                    </div>
                </div>
            </div>
            @endforeach
            <div class="error">
                <span id="post_card_id_err"></span>
            </div>
        </div>
        <div class="col-12 checkout__postcard__remove">
            <div class="col-12  col-md-6 p-0 checkout__postcard__remove__block">
                <input type="radio" checked name="no_postcard" id="no_postcard">
                <label for="no_postcard">No thank you</label>
            </div>
            <div class="form-group col-12 p-0 col-md-6 post_card_message_block" style="display:none;">
                <label for="post_card_message" class="post_card_message_characters">Post Card Message</label>
                <input class="form-control" type="text" name="post_card_message" id="post_card_message">
                <div class="error">
                    <span id="post_card_message_err"></span>
                </div>
            </div>
        </div>
        <div class="row checkout__payment"> 
            <div class="col-12 col-sm-12 col-md-12 col-lg-6 checkout__payment__block address">
                <div class="row">
                    <div class="col-12 address__title mb-0">
                        <h2 class="bold-heading">Payment</h2>
                        <p>How would you like to pay?</p>
                    </div>
                </div>
                <div class="row address__selection">
                    <form id="payment_selection_form">
                        @foreach($payment_methods as $payment_method_row)
                        <div class="col-12 address__selection__block">
                            <input type="radio" name="payment_method_id" id="{{Str::slug($payment_method_row->payment_method_title, '_')}}" value="{{$payment_method_row->id}}" @if($payment_method_row->id == 1) checked @endif>
                            <label for="{{Str::slug($payment_method_row->payment_method_title, '_')}}">{{$payment_method_row->payment_method_title}}</label>
                        </div>
                        @endforeach
                        <div class="error">
                            <span id="payment_method_id_err"></span>
                        </div>
                        <div class="col-12 address__selection__block terms_conditions form-group">
                            <input type="checkbox" id="accept_terms" name="accept_terms" value="1" checked>
                            <label for="accept_terms">I accept the <a href="{{url('/')}}/terms-and-conditions" target="_blank"> Terms & Conditions</a></label>
                            <div class="error">
                                <span id="accept_terms_err"></span>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="row checkout__payment__block__pay">
                    <div class="col-12 checkout__payment__block__pay__btn">
                        <a class="show_pointer proceed_to_payment">Pay</a>
                    </div>
                </div>
            </div>
            <div class="col-12 col-sm-12 col-md-12 col-lg-6 checkout__payment__block address">
                <div class="row">
                    <div class="col-12 address__title">
                        <h2 class="bold-heading">Bill</h2>
                    </div> 
                    <div class="col-12 checkout__payment__block__bill">
                        <div class="checkout__payment__block__bill__table">
                            <table class="table">
                                <tbody>
                                    <tr>
                                        <td class="checkout_total_block">
                                            <h2 class="checkout-heading">Items Total</h2>
                                        </td>
                                        <td class="checkout_total_amt_block text-right">
                                            <h2 class="cart-heading">₹ {{bcadd(array_sum($product_value_array), 0, 2)}}</h2>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="checkout_gst_block">
                                            <h2 class="cart-heading">C-GST</h2>
                                        </td>
                                        <td class="checkout_gst_amt_block text-right">
                                            <h2 class="cart-heading">₹ {{bcadd((array_sum($gst_value_array)/2), 0, 2)}}</h2>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td class="checkout_gst_block">
                                            <h2 class="cart-heading">S-GST</h2>
                                        </td>
                                        <td class="checkout_gst_amt_block text-right">
                                            <h2 class="cart-heading">₹ {{bcadd((array_sum($gst_value_array)/2), 0, 2)}}</h2>
                                        </td>
                                    </tr>
                                    @if($order->discount_amount != "0.00")
                                    <tr>
                                        <td class="checkout_gst_block">
                                            <h2 class="cart-heading">Discount</h2>
                                        </td>
                                        <td class="checkout_shipping_amt_block text-right">
                                            <h2 class="cart-heading">- ₹ {{$order->discount_amount}}</h2>
                                        </td>
                                    </tr>
                                    @endif
                                    <tr>
                                        <td class="checkout_grant_total_block">
                                            <h2 class="cart-heading">Grand Total</h2>
                                        </td>
                                        <td class="checkout_grant_total_amt_block text-right">
                                            <h2 class="cart-heading">₹ {{$order->grand_total}}</h2>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>
@endsection