<div class="modal-header align-items-start justify-content-between gap-2">
    <div class="d-flex">
        <span id="item_type_image"><img class="item-type-image mt-1" src="{{ $getitem['item_type_image'] }}"></span>
        <div class="d-grid ms-2">
            <p class="modal-title color-changer fs-5 fw-bold item_name mb-1">{{ $getitem['item_name'] }}</p>
            @php
                if ($getitem['variation']->count() > 0) {
                    if (!request()->is('admin/pos/show-item')) {
                        if ($getitem['top_deals'] == 1) {
                            if (@$topdeals['offer_type'] == 1) {
                                $price = $getitem['variation'][0]->price - @$topdeals->offer_amount;
                            } else {
                                $price =
                                    $getitem['variation'][0]->price -
                                    $getitem['variation'][0]->price * (@$topdeals->offer_amount / 100);
                            }
                            $original_price = $getitem['variation'][0]->price;
                        } else {
                            $price = $getitem['variation'][0]->price;
                            $original_price = $getitem['variation'][0]->original_price;
                        }
                    } else {
                        $price = $getitem['variation'][0]->price;
                        $original_price = $getitem['variation'][0]->original_price;
                    }
                } else {
                    if (!request()->is('admin/pos/show-item')) {
                        if ($getitem['top_deals'] == 1) {
                            if (@$topdeals->offer_type == 1) {
                                $price = $getitem['price'] - @$topdeals->offer_amount;
                            } else {
                                $price = $getitem['price'] - $getitem['price'] * (@$topdeals->offer_amount / 100);
                            }

                            $original_price = $getitem['price'];
                        } else {
                            $price = $getitem['price'];
                            $original_price = $getitem['original_price'];
                        }
                    } else {
                        $price = $getitem['price'];
                        $original_price = $getitem['original_price'];
                    }
                }
                $off = $original_price > 0 ? number_format(100 - ($price * 100) / $original_price, 1) : 0;
            @endphp


            @if ($getitem['item_status'] != 2 && $getitem['is_deleted'] != 1)
                <div class="d-flex" id="price_section">
                    <p class="text-dark color-changer fw-bold item_price mb-0">
                        {{ helper::currency_format($getitem['price']) }}</p>

                    <span><del class="text-muted fw-bold fs-7 mx-1 {{ $original_price > $price ? '' : 'd-none' }}"
                            id="original_price">{{ helper::currency_format($getitem['original_price']) }}</del></span>
                    <span
                        class="badge d-flex align-items-center bg-secondary fw-600 fs-8 text-dark  {{ $original_price > $price ? '' : 'd-none' }}"
                        id="off">{{ $off }}% {{ trans('labels.off') }}</span>

                </div>
            @endif
            @if ($getitem['item_status'] != 2 && $getitem['is_deleted'] == 1)
                <p id="tax" class="responcive-tax text-left border-0 m-0"><span class="text-muted fs-7">
                        @if ($getitem['tax'] != null && $getitem['tax'] != '')
                            <span class="text-danger fs-7"> {{ trans('labels.exclusive_taxes') }}</span>
                        @else
                            <span class="text-success fs-7"> {{ trans('labels.inclusive_taxes') }}</span>
                        @endif
                    </span></p>
            @endif
            @if ($getitem['has_variation'] == 2)
                @if ($getitem['item_status'] == 2 || $getitem['is_deleted'] == 1)
                    <h3 class="text-danger">{{ trans('labels.not_available') }}</h3>
                @endif
            @else
                <span class="text-danger" id="not_available"></span>
            @endif


        </div>
    </div>
    <button type="button" class="bg-transparent border-0 m-0" data-bs-dismiss="modal" aria-label="Close">
        <i class="fa-regular fa-xmark fs-5 color-changer"></i>
    </button>
</div>
<div class="modal-body">
    <div class="row align-items-center">
        <div class="col-12 m-auto">
            <div class="border-bottom pb-3 mb-3 {{ $getitem['sku'] != null || $getitem['stock_management'] == 1 ? 'd-block' : 'd-none' }}"
                id="sku_stock">
                <div class="card border px-3 py-2 rounded-2">
                    @if ($getitem['sku'] != '' && $getitem['sku'] != null)
                        <div class="sku-wrapper product_meta">
                            <span class="fs-7" id="sku_lable">
                                <span class="fw-bold text-muted">{{ trans('labels.sku') }}</span>
                                <span class="text-muted fs-7" id="sku_value">: {{ $getitem['sku'] }}</span>
                            </span>
                        </div>
                    @endif

                    <div class="meta-content rounded-2">
                        @if ($getitem['has_variation'] == 2 && $getitem['stock_management'] == 1)
                            <div class="sku-wrapper product_meta">
                                <span class="fs-7"><span
                                        class="fw-bold text-muted">{{ trans('labels.stock') }}:</span>
                                </span>
                                @if ($getitem['qty'] > 0)
                                    <span class="text-success fs-7">{{ $getitem['qty'] }}
                                        {{ trans('labels.in_stock') }}</span>
                                @else
                                    <span class="text-danger fs-7">{{ trans('labels.out_of_stock') }}</span>
                                @endif
                            </div>
                        @elseif ($getitem['has_variation'] == 1)
                            <div class="sku-wrapper product_meta" id="stock">
                                <span class="fs-7">
                                    <span class="fw-bold text-muted">{{ trans('labels.stock') }}:</span>
                                </span>
                                <span class="fs-7" id="detail_out_of_stock"></span>
                            </div>
                        @endif
                    </div>
                    @if (helper::otherappdata()->estimated_delivery_on_off == 1)
                        <div class="sku-wrapper product_meta ">
                            <span class="fs-7" id="sku_lable">
                                <span class="fw-bold text-muted">{{ trans('labels.estimated_delivery') }}</span>
                                <span class="text-muted fs-7">:
                                    {{ helper::otherappdata()->days_of_estimated_delivery }}
                                    {{ trans('labels.days') }}
                                </span>
                            </span>
                        </div>
                    @endif
                </div>
            </div>
            <div class="item-details">
                @if ($getitem['has_variation'] == 1 && $getitem['variants_json'] != null)
                    <div class="product-variations-wrapper">
                        <div class="size-variation" id="newvariation">
                            @for ($i = 0; $i < count($getitem['variants_json']); $i++)
                                <label class="fw-semibold mb-2 color-changer"
                                    for="">{{ $getitem['variants_json'][$i]['variant_name'] }}</label><br>
                                <div class="d-flex flex-wrap gap-2 border-bottom pb-3 mb-3">
                                    @for ($t = 0; $t < count($getitem['variants_json'][$i]['variant_options']); $t++)
                                        <label
                                            class="checkbox-inline check{{ str_replace(' ', '_', $getitem['variants_json'][$i]['variant_name']) }}{{ $getitem['id'] }} {{ $t == 0 ? 'active' : '' }}"
                                            id="check_{{ str_replace(' ', '_', $getitem['variants_json'][$i]['variant_name']) }}{{ $getitem['id'] }}-{{ str_replace(' ', '_', $getitem['variants_json'][$i]['variant_options'][$t]) }}"
                                            for="{{ str_replace(' ', '_', $getitem['variants_json'][$i]['variant_name']) }}{{ $getitem['id'] }}-{{ str_replace(' ', '_', $getitem['variants_json'][$i]['variant_options'][$t]) }}">
                                            <input type="checkbox" class="" name="skills"
                                                {{ $t == 0 ? 'checked' : '' }}
                                                value="{{ str_replace(' ', '_', $getitem['variants_json'][$i]['variant_options'][$t]) }}"
                                                id="{{ str_replace(' ', '_', $getitem['variants_json'][$i]['variant_name']) }}{{ $getitem['id'] }}-{{ str_replace(' ', '_', $getitem['variants_json'][$i]['variant_options'][$t]) }}">
                                            {{ $getitem['variants_json'][$i]['variant_options'][$t] }}
                                        </label>
                                    @endfor
                                </div>
                            @endfor
                        </div>
                    </div>
                @endif
                @if (count($getitem['extras']) > 0)
                    <div class="woo_pr_color flex_inline_center my-3 border-bottom pb-3">
                        <div class="woo_colors_list text-left">
                            <span id="extras">
                                <h6 class="extra-title color-changer fw-semibold">{{ trans('labels.extras') }}</h6>
                                <ul class="list-unstyled extra-food m-0">
                                    <div id="pricelist">
                                        @foreach ($getitem['extras'] as $key => $extras)
                                            <li>
                                                <div class="form-check w-100 m-0 p-0 d-flex align-items-center gap-2">
                                                    <input class="form-check-input Checkbox m-0 p-0" type="checkbox"
                                                        value="{{ $extras->id }}" id="addons_{{ $key }}"
                                                        name="addons[]" price="{{ $extras->price }}"
                                                        extras_name="{{ $extras->name }}">
                                                    <label
                                                        class="form-check-label m-0 cursor-pointer p-0 w-100 d-flex justify-content-between gap-2 align-items-center"
                                                        for="addons_{{ $key }}">
                                                        <p class="fs-7 m-0 color-changer">
                                                            {{ $extras->name }}
                                                        </p>
                                                        <span class="fs-7">
                                                            {{ helper::currency_format($extras->price) }}
                                                        </span>
                                                    </label>
                                                </div>
                                            </li>
                                        @endforeach
                                    </div>
                                </ul>
                            </span>
                        </div>
                    </div>
                @endif

                <input type="hidden" name="slug" id="slug" value="{{ $getitem['slug'] }}">
                <input type="hidden" name="item_name" id="item_name" value="{{ $getitem['item_name'] }}">
                <input type="hidden" name="item_id" id="item_id" value="{{ $getitem['id'] }}">
                <input type="hidden" name="item_type" id="item_type" value="{{ $getitem['item_type'] }}">
                <input type="hidden" name="image_name" id="image_name" value="{{ $getitem['image_name'] }}">
                <input type="hidden" name="tax" id="item_tax" value="{{ $getitem['tax'] }}">
                <input type="hidden" name="item_price" id="item_price" value="{{ @$price }}">
                <input type="hidden" name="variant_name" id="variant_name" value="">
                <input type="hidden" name="variant_id" id="variant_id" value="">
                <input type="hidden" name="addonstotal" id="addonstotal" value="0">
                <input type="hidden" name="subtotal" id="subtotal" value="">
                <input type="hidden" name="login_required" id="login_required"
                    value="{{ helper::appdata()->login_required }}">
                <input type="hidden" name="checklogin" id="checklogin"
                    value="{{ Auth::user() && Auth::user()->type == 2 }}">
                <input type="hidden" name="customer_login" id="customer_login"
                    value="{{ App\Models\SystemAddons::where('unique_identifier', 'customer_login')->first() }}">

                @if (@helper::appdata()->online_order == 1)
                    <div class="mb-3">
                        <div class="row g-3 justify-content-center px-0">
                            <div class="col-4">
                                <div class="btn item-quantity py-1 w-100 rounded-3" id="detail_plus-minus">
                                    <button class="btn btn-sm item-quantity-minus color-changer mb-0 item_quantity"
                                        id="minus" data-type="minus" data-item_id="{{ $getitem['id'] }}"
                                        onclick="changeqty($(this).attr('data-item_id'),'minus')"
                                        value="minus value">-</button>
                                    <input class="item-quantity-input color-changer mb-0" value="1"
                                        id="item_qty" readonly="">
                                    <button class="btn btn-sm item-quantity-plus color-changer mb-0 item_quantity"
                                        id="plus" data-item_id="{{ $getitem['id'] }}"
                                        onclick="changeqty($(this).attr('data-item_id'),'plus')" data-type="plus"
                                        value="plus value">+</button>
                                </div>
                            </div>
                            <div class="{{ !request()->is('admin/pos/show-item') ? 'col-4' : 'col-8' }}">
                                <button
                                    class="btn btn-outline-primary btn-lg w-100 m-0 fs-6 p-2 d-flex gap-3 justify-content-center align-items-center modal_add_to_cart"
                                    id="addcart"
                                    @if (request()->is('admin/pos/show-item')) onclick="addtocart('{{ URL::to('admin/pos/addtocart') }}')" @else onclick="addtocart('{{ URL::to('addtocart') }}','0')" @endif>{{ trans('labels.add_to_cart') }}
                                    <div class="loader d-none modal_add_to_cart_loader"></div>
                                </button>
                            </div>
                            @if (!request()->is('admin/pos/show-item'))
                                <div class="col-4">
                                    @if (@helper::checkaddons('customer_login'))
                                        @if (helper::appdata()->login_required == 1)
                                            <button
                                                class="btn btn-primary btn-lg w-100 m-0 fs-6 p-2 d-flex gap-3 justify-content-center align-items-center modal_buy_now"
                                                id="buynow"
                                                @if (helper::appdata()->is_checkout_login_required == 1) onclick="showlogin()" @else onclick="addtocart('{{ URL::to('addtocart') }}','1')" @endif>
                                                {{ trans('labels.buy_now') }}
                                                <div class="loader d-none modal_buy_now_loader"></div>
                                            </button>
                                        @else
                                            <button
                                                class="btn btn-primary btn-lg w-100 m-0 fs-6 p-2 d-flex gap-3 justify-content-center align-items-center modal_buy_now"
                                                id="buynow"
                                                onclick="addtocart('{{ URL::to('addtocart') }}','1')">{{ trans('labels.buy_now') }}
                                                <div class="loader d-none modal_buy_now_loader"></div>
                                            </button>
                                        @endif
                                    @else
                                        <button
                                            class="btn btn-primary btn-lg w-100 m-0 fs-6 p-2 d-flex gap-3 justify-content-center align-items-center modal_buy_now"
                                            id="buynow"
                                            onclick="addtocart('{{ URL::to('addtocart') }}','1')">{{ trans('labels.buy_now') }}
                                            <div class="loader d-none modal_buy_now_loader"></div>
                                        </button>
                                    @endif
                                </div>
                            @endif
                        </div>
                    </div>
                @endif
                @if (!request()->is('admin/pos/show-item'))
                    <div class="d-flex flex-wrap gap-sm-2 gap-3 justify-content-between w-100 border-top pt-3">
                        <div
                            class="d-flex gap-sm-5 gap-2 justify-content-between align-items-center col-sm-auto col-12">
                            <div>
                                @if (@helper::checkaddons('customer_login'))
                                    @if (helper::appdata()->login_required == 1)
                                        <p class="fs-7 d-flex align-items-center mb-0">
                                            @if ($getitem['is_favorite'] == 1)
                                                <a class="text-dark color-changer fs-7 fw-600 d-flex gap-1 align-items-center"
                                                    @if (Auth::user() && Auth::user()->type == 2) href="javascript:void(0)" onclick="managefavorite('{{ $getitem['id'] }}',0,'{{ URL::to('/managefavorite') }}')" @else href="{{ URL::to('/login') }}" @endif>
                                                    <i class="fa-solid fa-heart fs-5"></i>
                                                    {{ trans('labels.remove_wishlist') }}
                                                </a>
                                            @else
                                                <a class="text-dark color-changer fs-7 fw-600 d-flex gap-1 align-items-center"
                                                    @if (Auth::user() && Auth::user()->type == 2) href="javascript:void(0)" onclick="managefavorite('{{ $getitem['id'] }}',1,'{{ URL::to('/managefavorite') }}')" @else href="{{ URL::to('/login') }}" @endif>
                                                    <i class="fa-regular fa-heart fs-5"></i>
                                                    {{ trans('labels.add_wishlist') }}
                                                </a>
                                            @endif
                                        </p>
                                    @endif
                                @endif
                            </div>
                        </div>
                        <div class="d-flex align-items-center justify-content-center gap-2">
                            @if (@helper::appdata()->google_review != '' && @helper::appdata()->google_review != null)
                                <a href="{{ @helper::appdata()->google_review }}" target="_blank" tooltip="Review"
                                    class=" rounded-circle prod-social fs-7"><i
                                        class="fa-regular fa-star fs-7 text-white"></i></a>
                            @endif
                            <a href="tel:{{ @helper::appdata()->mobile }}" class="rounded-circle prod-social"
                                tooltip="Phone">
                                <i class="fa-solid fa-phone text-white fs-7"></i>
                            </a>
                            @if ($getitem['video_url'] != '' && $getitem['video_url'] != null)
                                <a href="{{ $getitem['video_url'] }}" tooltip="Video"
                                    class="rounded-circle prod-social fs-7" id="btn-video" target="_blank">
                                    <i class="fa-regular fa-video fs-7 text-white"></i></a>
                            @endif
                            @if (@helper::checkaddons('whatsapp_message'))
                                @if (
                                    @whatsapp_helper::whatsapp_message_config()->whatsapp_number != '' &&
                                        @whatsapp_helper::whatsapp_message_config()->whatsapp_number != null)
                                    <a href="https://api.whatsapp.com/send?phone={{ @whatsapp_helper::whatsapp_message_config()->whatsapp_number }}&text={{ trans('labels.item_inquiry_msg') }} {{ $getitem['item_name'] }}"
                                        class=" rounded-circle prod-social" id="enquiries" tooltip="Whatsapp"
                                        target="_blank"><i class="fa-brands fa-whatsapp fs-7 text-white"></i></a>
                                @endif
                            @endif
                        </div>
                    </div>
                @endif
            </div>
        </div>
    </div>
</div>
<script>
    $(document).ready(function($) {
        var selected = [];
        $('.size-variation input:checked').each(function() {
            var label = $("#newvariation label[for='" + $(this).attr('id') + "']").attr('id');
            $('#newvariation' + '#' + label).addClass('active');
            selected.push($(this).attr('value'));
        });
        set_variant_price(selected);
    });
    $('#newvariation input:checkbox').click(function() {

        var selected = [];
        var divselected = [];
        const myArray = this.id.split("-");
        var id = this.id;
        $('#newvariation .check' + myArray[0] + ' input:checked').each(function() {
            divselected.push($(this).attr('value'));
        });
        if (divselected.length == 0) {
            $(this).prop('checked', true);
        }
        $('#newvariation .check' + myArray[0] + ' input:checkbox').not(this).prop('checked', false);
        $('#newvariation .check' + myArray[0]).removeClass('active');
        var label = $("#newvariation label[for='" + $(this).attr('id') + "']").attr('id');
        $("#newvariation [id='" + 'check_' + this.id + "']").addClass('active');
        $('#newvariation' + '#' + label).addClass('active');
        $('.size-variation input:checked').each(function() {
            $('.product-detail-price').addClass('d-none');
            $('#laodertext').removeClass('d-none');
            $('#laodertext').html(
                '<span class="loader"></span>'
            );
            selected.push($(this).attr('value'));
        });
        set_variant_price(selected);
    });


    function set_variant_price(variants) {

        $.ajax({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            url: variation_route,
            data: {
                name: variants,
                item_id: $('#item_id').val(),

            },
            success: function(data) {

                if (data.status == 1) {
                    $('.item_price').html(data.price);
                    $('#variant_name').val(variants);
                    $('#variation_price').html(data.price);
                    $('#item_price').val(data.item_price);
                    $('#original_price').html(data.original_price);
                    $('#variant_id').val(data.variant_id);
                    var off = data.off;

                    if (data.qty <= 0) {
                        $('.modal-btn-add-to-cart').addClass("disabled").html(product_out_of_stock);
                        $('.modal-btn-add-to-cart').addClass("disabled").html(product_out_of_stock);
                    } else {
                        $('.modal-btn-add-to-cart').removeClass("disabled").html(add_to_cart);
                    }

                    if (data.item_original_price > data.item_price) {
                        $('#original_price').removeClass('d-none');
                        $('#off').removeClass('d-none');
                        $('#original_price').text(data.original_price);
                        $('#off').text('' + $.number(off, 1) + '% OFF');
                    } else {
                        $('#original_price').addClass('d-none');
                        $('#off').addClass('d-none');
                        $('#original_price').text('');
                        $('#off').text('');
                    }
                    if (data.is_available == 2) {

                        $('#variation_price').addClass('d-none');
                        $('#price_section').addClass('d-none');
                        $('.item_price').addClass('d-none');
                        $('#tax').addClass('d-none');
                        $('#not_available').removeClass('d-none');
                        $('#not_available').html(not_available);
                        $('#sku_stock').addClass('d-none');
                        $('#stock').addClass('d-none');
                        $('#addcart').addClass('d-none');
                        $('#buynow').addClass('d-none');
                    } else {
                        $('#variation_price').removeClass('d-none');
                        $('#price_section').removeClass('d-none');
                        $('.item_price').removeClass('d-none');
                        $('#not_available').addClass('d-none');
                        $('#tax').removeClass('d-none');
                        $('#sku_stock').removeClass('d-none');
                        $('#stock').removeClass('d-none');
                        $('#not_available').html('');
                        if (data.stock_management == 1) {
                            $('#stock').removeClass('d-none');
                            $('#detail_out_of_stock').removeClass('d-none');
                            if (data.quantity > 0) {
                                $('#detail_out_of_stock').removeClass('text-danger');
                                $('#detail_out_of_stock').addClass('text-success');
                                $('#detail_out_of_stock').html(data.quantity + ' ' + in_stock);
                            } else {
                                $('#detail_out_of_stock').removeClass('text-dark');
                                $('#detail_out_of_stock').addClass('text-danger');
                                $('#detail_out_of_stock').html(out_of_stock);
                            }
                        } else {
                            $('#detail_out_of_stock').addClass('d-none');
                            $('#sku_stock').addClass('d-none');
                        }
                        $('#addcart').removeClass('d-none');
                        $('#buynow').removeClass('d-none');
                    }
                }
            }
        });
    }
</script>