@extends('shared.front')
@section('content')
    <div class="container cart">
        <div class="cart__content">
            <!-- cart col left -->
            <div class="cart__col-left">
                <h2 class="page-title">{{ __('messages.cart.cart') }}</h2>
                <div class="cart__head">
                    <div class="check">
                        <input type="checkbox" name="cart-check-all" id="check-cart-all" />
                        <label for="check-cart-all" class="checkmark"></label>
                    </div>
                    <div class="product">{{ __('messages.cart.all') }}
                        <span>(<span class="cart-total-quantity">0</span> {{ __('messages.cart.product') }})</span>
                    </div>
                    <div class="price mb-hide">{{ __('messages.cart.price') }}</div>
                    <div class="quantity mb-hide">{{ __('messages.cart.quantity') }}</div>
                    <div class="total mb-hide">{{ __('messages.cart.total') }}</div>
                    <div class="delete">
                        <button class="default-btn" id="btnDeleteAll">
                            <img src="{{ asset('front/app/assets/img/icon-delete.svg') }}" alt="" />
                        </button>
                    </div>
                </div>
                <ul class="cart__body"></ul>
            </div>
            <!-- cart col right -->
            <div class="cart__col-right">
                <!-- cart note -->
                <div class="cart__note">
                    <div class="cart__note__row">
                        <span class="icon">
                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
                                fill="none">
                                <path
                                    d="M22.44 12.4575L20.19 7.2075C20.1326 7.07194 20.0365 6.95627 19.9138 6.87492C19.7911 6.79356 19.6472 6.75012 19.5 6.75H17.25V5.25C17.25 5.05109 17.171 4.86032 17.0303 4.71967C16.8897 4.57902 16.6989 4.5 16.5 4.5H2.25C2.05109 4.5 1.86032 4.57902 1.71967 4.71967C1.57902 4.86032 1.5 5.05109 1.5 5.25V18C1.5 18.1989 1.57902 18.3897 1.71967 18.5303C1.86032 18.671 2.05109 18.75 2.25 18.75H3.855C4.02771 19.3855 4.40475 19.9466 4.92795 20.3465C5.45114 20.7465 6.09142 20.9632 6.75 20.9632C7.40858 20.9632 8.04886 20.7465 8.57205 20.3465C9.09525 19.9466 9.47229 19.3855 9.645 18.75H14.355C14.5277 19.3855 14.9048 19.9466 15.4279 20.3465C15.9511 20.7465 16.5914 20.9632 17.25 20.9632C17.9086 20.9632 18.5489 20.7465 19.0721 20.3465C19.5952 19.9466 19.9723 19.3855 20.145 18.75H21.75C21.9489 18.75 22.1397 18.671 22.2803 18.5303C22.421 18.3897 22.5 18.1989 22.5 18V12.75C22.4998 12.6495 22.4794 12.55 22.44 12.4575ZM17.25 8.25H19.005L20.61 12H17.25V8.25ZM6.75 19.5C6.45333 19.5 6.16332 19.412 5.91665 19.2472C5.66997 19.0824 5.47771 18.8481 5.36418 18.574C5.25065 18.2999 5.22094 17.9983 5.27882 17.7074C5.3367 17.4164 5.47956 17.1491 5.68934 16.9393C5.89912 16.7296 6.16639 16.5867 6.45736 16.5288C6.74834 16.4709 7.04994 16.5006 7.32403 16.6142C7.59811 16.7277 7.83238 16.92 7.9972 17.1666C8.16203 17.4133 8.25 17.7033 8.25 18C8.25 18.3978 8.09196 18.7794 7.81066 19.0607C7.52936 19.342 7.14782 19.5 6.75 19.5ZM14.355 17.25H9.645C9.47229 16.6145 9.09525 16.0534 8.57205 15.6534C8.04886 15.2535 7.40858 15.0367 6.75 15.0367C6.09142 15.0367 5.45114 15.2535 4.92795 15.6534C4.40475 16.0534 4.02771 16.6145 3.855 17.25H3V6H15.75V15.42C15.4085 15.6182 15.1095 15.8819 14.8701 16.1959C14.6307 16.51 14.4556 16.8682 14.355 17.25ZM17.25 19.5C16.9533 19.5 16.6633 19.412 16.4166 19.2472C16.17 19.0824 15.9777 18.8481 15.8642 18.574C15.7506 18.2999 15.7209 17.9983 15.7788 17.7074C15.8367 17.4164 15.9796 17.1491 16.1893 16.9393C16.3991 16.7296 16.6664 16.5867 16.9574 16.5288C17.2483 16.4709 17.5499 16.5006 17.824 16.6142C18.0981 16.7277 18.3324 16.92 18.4972 17.1666C18.662 17.4133 18.75 17.7033 18.75 18C18.75 18.3978 18.592 18.7794 18.3107 19.0607C18.0294 19.342 17.6478 19.5 17.25 19.5ZM21 17.25H20.145C19.9791 16.6076 19.6051 16.0384 19.0812 15.6313C18.5574 15.2242 17.9134 15.0022 17.25 15V13.5H21V17.25Z"
                                    fill="#6C6C6C" />
                            </svg>
                        </span>
                        <span class="context">
                            {{ __('messages.cart.note-delivery') }}
                        </span>
                    </div>

                    <span class="icon">
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"
                            fill="none">
                            <path
                                d="M10.8494 8.15039L5.84941 3.15039L5.14941 3.85039L9.44941 8.15039L5.14941 12.4504L5.84941 13.1504L10.8494 8.15039Z"
                                fill="#6C6C6C" />
                        </svg>
                    </span>
                </div>
                <!-- cart coupon -->
{{--                <div class="cart__coupon">--}}
{{--                    <span class="icon">--}}
{{--                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"--}}
{{--                            fill="none">--}}
{{--                            <path--}}
{{--                                d="M21.75 10.5C21.9489 10.5 22.1397 10.421 22.2803 10.2803C22.421 10.1397 22.5 9.94891 22.5 9.75V6C22.5 5.60218 22.342 5.22064 22.0607 4.93934C21.7794 4.65804 21.3978 4.5 21 4.5H3C2.60218 4.5 2.22064 4.65804 1.93934 4.93934C1.65804 5.22064 1.5 5.60218 1.5 6V9.75C1.5 9.94891 1.57902 10.1397 1.71967 10.2803C1.86032 10.421 2.05109 10.5 2.25 10.5C2.64782 10.5 3.02936 10.658 3.31066 10.9393C3.59196 11.2206 3.75 11.6022 3.75 12C3.75 12.3978 3.59196 12.7794 3.31066 13.0607C3.02936 13.342 2.64782 13.5 2.25 13.5C2.05109 13.5 1.86032 13.579 1.71967 13.7197C1.57902 13.8603 1.5 14.0511 1.5 14.25V18C1.5 18.3978 1.65804 18.7794 1.93934 19.0607C2.22064 19.342 2.60218 19.5 3 19.5H21C21.3978 19.5 21.7794 19.342 22.0607 19.0607C22.342 18.7794 22.5 18.3978 22.5 18V14.25C22.5 14.0511 22.421 13.8603 22.2803 13.7197C22.1397 13.579 21.9489 13.5 21.75 13.5C21.3522 13.5 20.9706 13.342 20.6893 13.0607C20.408 12.7794 20.25 12.3978 20.25 12C20.25 11.6022 20.408 11.2206 20.6893 10.9393C20.9706 10.658 21.3522 10.5 21.75 10.5ZM21 14.9025V18H15.75V15.75H14.25V18H3V14.9025C3.642 14.7347 4.21025 14.3588 4.61582 13.8336C5.02139 13.3084 5.24139 12.6636 5.24139 12C5.24139 11.3364 5.02139 10.6916 4.61582 10.1664C4.21025 9.64121 3.642 9.2653 3 9.0975V6H14.25V8.25H15.75V6H21V9.0975C20.358 9.2653 19.7898 9.64121 19.3842 10.1664C18.9786 10.6916 18.7586 11.3364 18.7586 12C18.7586 12.6636 18.9786 13.3084 19.3842 13.8336C19.7898 14.3588 20.358 14.7347 21 14.9025Z"--}}
{{--                                fill="#FAAD4B" />--}}
{{--                            <path d="M14.25 9.75H15.75V14.25H14.25V9.75Z" fill="#FAAD4B" />--}}
{{--                        </svg>--}}
{{--                    </span>--}}
{{--                    <span class="cart__coupon-value"><b>{{ __('messages.cart.enter_promotion_code') }}</b></span>--}}
{{--                </div>--}}
                <!-- line -->
                <div class="line"></div>
                <!-- cart total -->
                <div class="cart__total">
                    <ul>
                        <li>
                            {{ __('messages.cart.sub_total') }}
                            <b><span class="cart__total-temp-value"></span> VNĐ</b>
                        </li>
                        <li>
                            {{ __('messages.cart.discount') }}
                            <b><span class="cart__discount-value">0</span> VNĐ</b>
                        </li>
                    </ul>

                    <div class="line"></div>

                    <div class="cart__total-final">
                        <div class="row">
                            <span class="label">
                                {{ __('messages.cart.total_bill') }}
                            </span>
                            <span class="value">
                                <b class="cart__total-final">
                                    <span class="cart__total-value"></span> VNĐ
                                </b>
                            </span>
                        </div>
                        <div class="cart__total-vat">{{ __('messages.cart.include_vat') }}</div>
                    </div>
                </div>
                <button class="btn submit-btn payment-btn mb-hide" id="btnPaymentCart"
                    data-redirect="{{ action('HomeController@checkout') }}"
                >
                    {{ __('messages.cart.payment') }}
                </button>
            </div>
            <!-- cart floating bottom -->
            <div class="cart-floating-bottom mb-show">
                <div class="wrapper">
                    <div class="left-col">
                        <div class="label">{{ __('messages.cart.selected') }} 
                            (<span class="cart-total-quantity">0</span> {{ __('messages.cart.product') }})
                        </div>
                        <div class="value">
                            <span class="cart__total-value"></span> VNĐ
                        </div>
                    </div>
                    <div class="right-col">
                        <button class="btn submit-btn payment-btn" id="btnPaymentCart-mb"
                            data-redirect="{{ action('HomeController@checkout') }}">{{ __('messages.cart.payment') }}</button>
                    </div>
                </div>
            </div>
        </div>
        {{-- Modal Confirm Delete Product --}}
        @include('home.elements.confirmation-delete-product')
        {{-- Modal Confirm Delete Product --}}
        @include('home.elements.shipment-note')
        {{-- Modal Promotion --}}
{{--        @include('home.elements.promotion-modal')--}}
    </div>
@endsection