@extends('layouts.web') @section('content')
    @include('front.commons.inner-banner')
    @php
    $flavors = $product->flavors !== '' && $product->flavors !== null ? explode("," ,$product->flavors) : null;
    $sizes = $product->sizes !== '' && $product->sizes !== null ? explode("," ,$product->sizes) : null;
    $weights = $product->weights !== '' && $product->weights !== null ? explode("," ,$product->weights) : null;
    $extras = $product->extras !== '' && $product->extras !== null ? explode("," ,$product->extras) : null;

    @endphp

    <!--================Single Product Area =================-->
    <div class="product_image_area">
        <div class="container">
            <div class="row s_product_inner">
                <div class="col-lg-6">
                    <div class="s_Product_carousel">
                        <div class="single-prd-item">
                            <img class="img-fluid" src="{{ asset('storage/' . $product->image) }}" alt="" />
                        </div>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="s_product_text">
                        <h2>{{ $product->title }}</h2>
                        <ul class="list">
                            @if ($product->flavors != null)
                            <li class="mt-3">
                                <div class="row">
                                    <div class="col-4">
                                        <span style="font-weight: bold">Available Flavors</span>
                                        :
                                    </div>
                                    <div class="col-8 d-flex flex-wrap">
                                        @foreach($flavors as $flavor)
                                        @php
                                        $flavorStr = trim($flavor, ' ');
                                        $flavorStr = str_replace(" ","-",$flavorStr);
                                        @endphp
                                        <div class="form-check ml-3">
                                            <input class="form-check-input flavor-checkbox" type="checkbox" value="{{$flavor}}" id="{{$flavorStr}}">
                                            <label class="form-check-label" for="{{$flavorStr}}">
                                                {{$flavor}}
                                            </label>
                                        </div>
                                        @endforeach
                                    </div>
                                </div>
                            </li>
                            @endif
                            @if ($sizes != null)
                            <li class="mt-3">
                                <div class="row">
                                    <div class="col-4">
                                        <span style="font-weight: bold">
                                            Available Sizes</span>
                                        :
                                    </div>
                                    <div class="col-8 d-flex flex-wrap">
                                        @foreach($sizes as $size)
                                        @php
                                        $sizeStr = trim($size, ' ');
                                        $sizeStr = str_replace(" ","-",$sizeStr);
                                        @endphp
                                        <div class="form-check ml-3">
                                            <input class="form-check-input size-checkbox" type="checkbox" value="{{$size}}" id="{{$sizeStr}}">
                                            <label class="form-check-label" for="{{$sizeStr}}">
                                                {{$size}}
                                            </label>
                                        </div>
                                        @endforeach
                                    </div>
                                </div>
                            </li>
                            @endif
                            @if ($weights != null)
                            <li class="mt-3">
                                <div class="row">
                                    <div class="col-4">
                                        <span style="font-weight: bold">
                                            Available Weights</span>
                                        :
                                    </div>
                                    <div class="col-8 d-flex flex-wrap">
                                        @foreach($weights as $weight)
                                        @php
                                        $weightStr = trim($weight, ' ');
                                        $weightStr = str_replace(" ","-",$weightStr);
                                        @endphp
                                        <div class="form-check ml-3">
                                            <input class="form-check-input weight-checkbox" type="checkbox" value="{{$weight}}" id="{{$weightStr}}">
                                            <label class="form-check-label" for="{{$weightStr}}">
                                                {{$weight}}
                                            </label>
                                        </div>
                                        @endforeach
                                    </div>
                                </div>
                            </li>
                            @endif
                            @if ($extras != null)
                            <li class="mt-3">
                                <div class="row">
                                    <div class="col-4">
                                        <span style="font-weight: bold">
                                            Extra</span>
                                        :
                                    </div>
                                    <div class="col-8 d-flex flex-wrap">
                                        @foreach($extras as $extra)
                                        @php
                                        $extraStr = trim($extra, ' ');
                                        $extraStr = str_replace(" ","-",$extraStr);
                                        @endphp
                                        <div class="form-check ml-3">
                                            <input class="form-check-input extra-checkbox" type="radio" name="flexRadioDefault" value="{{$extra}}" id="{{$extraStr}}">
                                            <label class="form-check-label" for="{{$extraStr}}">
                                                {{$extra}}
                                            </label>
                                        </div>
                                        @endforeach
                                    </div>
                                </div>
                            </li>
                            @endif
                            <div style="height: 50px"></div>
                            <li class="">
                                <div class="row">
                                    <div class="col-4">
                                        <span style="font-weight: bold">
                                            Quantity</span>
                                        :
                                    </div>
                                    <div class="col-8 d-flex flex-wrap">
                                        <input type="number" min="1" name="" id="" value="1" class="quantity">
                                    </div>
                                </div>
                            </li>
                            <li class="mt-5">
                                <div class="row">
                                    <div class="col-4">
                                        <span style="font-weight: bold">
                                            Price</span>
                                        :
                                    </div>
                                    <div class="col-8 d-flex flex-wrap">
                                        @if($product->lower_price != 0)
                                        <span class="price-detail">${{$product->lower_price}}-</span>
                                        @endif<span class="price-detail">${{$product->price}}</span>
                                    </div>
                                </div>
                            </li>
                        </ul>

                        <div style="height: 50px"></div>
                        <h1>Description</h1>
                        {!! $product->body !!} {{--
                        <div class="product_count">
                            <label for="qty">Quantity:</label>
                            <input
                                type="text"
                                name="qty"
                                id="sst"
                                maxlength="12"
                                value="1"
                                title="Quantity:"
                                class="input-text qty"
                            />
                            <button
                                onclick="var result = document.getElementById('sst'); var sst = result.value; if( !isNaN( sst )) result.value++;return false;"
                                class="increase items-count"
                                type="button"
                            >
                                <i class="lnr lnr-chevron-up"></i>
                            </button>
                            <button
                                onclick="var result = document.getElementById('sst'); var sst = result.value; if( !isNaN( sst ) &amp;&amp; sst > 0 ) result.value--;return false;"
                                class="reduced items-count"
                                type="button"
                            >
                                <i class="lnr lnr-chevron-down"></i>
                            </button>
                        </div>
                        --}}
                        @if($product->in_stock == 1)
                            <img src="{{asset('img/sold.jpeg')}}" />
                        @else
                        <div class="card_area d-flex align-items-center mb-5">
                            <a class="primary-btn add-to-cart" data-id="{{ $product->id }}" data-price="{{ $product->price }}" href="add" onclick="return false;">Add to Cart</a>
                            {{--<a class="icon_btn" href="#"
                                ><i class="lnr lnr lnr-diamond"></i
                            ></a>
                            <a class="icon_btn" href="#"
                                ><i class="lnr lnr lnr-heart"></i></a
                            >--}}
                        </div>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--================End Single Product Area =================-->
    @endsection