@extends('layouts.front')

@section('title'){{$product->meta_title ? $product->meta_title : $product->name." - ".config('app.name')}}@endsection
@section('meta-tags')<meta name="description" content="{{$product->meta_desc ? $product->meta_desc : StringHelper::truncate(trim(strip_tags($product->description)), 160)}}">
@if($product->meta_keywords)<meta name="keywords" content="{{$product->meta_keywords}}">@endif
@endsection
@section('meta-tags-og')<meta property="og:url" content="{{url()->current()}}" />
    <meta property="og:type" content="website" />
    <meta property="og:title" content="{{$product->meta_title ? $product->meta_title : $product->name.' - '.config('app.name')}}" />
    <meta property="og:description" content="{{$product->meta_desc ? $product->meta_desc : StringHelper::truncate(trim(strip_tags($product->description)), 160)}}" />
    @if($product->photo)<meta property="og:image" content="{{$product->photo->name}}" />@endif
@endsection

@section('styles')
       
    <link rel="stylesheet" href="{{asset('assets/css/defined.css')}}">
    <link rel="stylesheet" href="{{asset('assets/css/base.css')}}">
    <link rel="stylesheet" href="{{asset('assets/css/style.css')}}">
    <link rel="stylesheet" href="{{asset('assets/css/font-icon.min.css')}}">

    <link href="{{asset('css/bootstrap-social.css')}}" rel="stylesheet">
    <style>
        body {
            background-color: #f1f3f6;
        }
        .spec-type {
            margin-bottom: 0.5rem;
            margin-top: 0.5rem;
        }
        .spec-radio {
            margin-right: 1.4rem;
        }
        .spec-radio input[type="radio"] {
          position: absolute;
          opacity: 0;
        }
        .spec-radio input[type="radio"] + .spec-radio-label:before {
          content: '';
          background: #fff7fe;
          border-radius: 100%;
          border: 1px solid #a02a8b;
          display: inline-block;
          /* width: 1.2em;
          height: 1.2em; */
          width: 1em;
          height: 1em;
          position: relative;
          /* top: .2rem; */
          top: .3rem;
          margin-right: .75rem;
          vertical-align: top;
          cursor: pointer;
          text-align: center;
          transition: all 250ms ease;
        }
        .spec-radio input[type="radio"]:checked + .spec-radio-label:before {
          background-color: var(--main-color);
          box-shadow: inset 0 0 0 4px #f4f4f4;
        }
        .spec-radio input[type="radio"]:focus + .spec-radio-label:before {
          outline: none;
          border-color: #3197EE;
        }
        .spec-radio input[type="radio"]:disabled + .spec-radio-label:before {
          box-shadow: inset 0 0 0 4px #f4f4f4;
          border-color: #b4b4b4;
          background: #b4b4b4;
        }
        .spec-radio input[type="radio"] + .spec-radio-label:empty:before {
          margin-right: 0;
        }
        ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
            color: #c9c9c9;
            font-size: 14px;
        }
        :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
            color:  #c9c9c9;
            opacity:  1;
            font-size: 14px;
        }
        ::-moz-placeholder { /* Mozilla Firefox 19+ */
            color: #c9c9c9;
            opacity:  1;
            font-size: 14px;
        }
        :-ms-input-placeholder { /* Internet Explorer 10-11 */
            color: #c9c9c9;
            font-size: 14px;
        }
        ::-ms-input-placeholder { /* Microsoft Edge */
            color: #c9c9c9;
            font-size: 14px;
        }

        ::placeholder { /* Most modern browsers support this now. */
            color: #c9c9c9;
            font-size: 14px;
        }
        .btn-instagram {
            color: #e4405f;
            background-color: #ffffff;
            border: 1px solid silver;
            border-radius: 5px;
        }
        .btn-pinterest {
            color: #9f191f;
            background-color: #ffffff;
            border: 1px solid silver;
            border-radius: 5px;
        }
        .btn-facebook {
            color: #5d82d1;
            background-color: #ffffff;
            border: 1px solid silver;
            border-radius: 5px;
        }
        .btn-twitter {
            color: #40bff5;
            background-color: #ffffff;
            border: 1px solid silver;
            border-radius: 5px;
        }
        .btn-social-icon.btn-sm>:first-child {
            line-height: 35px;
            width: 28px;
            font-size: 1em;
        }
 
        /* Fixed Scrollbar */
    
        .wrapper-sidebar {
            display: flex;
            justify-content: space-between;
        }
        .left-sidebar {
            width: 25%;
            height: 25vh; 
            min-height: 570px;
            /* overflow: auto; */
            position: -webkit-sticky;
            position: sticky;
            top: 5%;
            z-index: 99;
        }      
        .right-scrollbar {
            width: 60%;
            height: 200vh;
            min-height: 1000px;
            display: flex;
            flex-direction: column;
        }
    </style>
@endsection

@section('content')
    <div class="container">
            @if($product->category)
        <ul class="breadcrumb">
            <li><a href="{{url('/')}}">@lang('Home')</a></li>
            @if($product->category->category)
                @include('partials.front.parent-category-product', ['category'=>$product->category->category])
            @endif
            <li><a href="{{route('front.category.show', [$product->category->slug])}}">{{$product->category->name}}</a></li>
            <li class="active">{{$product->name}}</li>
        </ul>
        @endif
    </div>

	<div class="container product-container">
        @if($product)
        <div class="cart-message">
        </div>

        <div class="row clearfix">
            <div class="col-md-12">
                <div class="xzoom-container col-md-12 wrapper-sidebar" style="padding-left: 0px;">
                    <div class="col-md-6 col-xs-12 col-sm-12 left-sidebar">
                        @if(Auth::check())
                            @if(!$product->favouritedBy(Auth::user()))
                                <a href="javascript:void(0)" class="prod-detail-wishlist-icon wishlistStatus" id="wishlist-{{$product->id}}" data-product="{{$product->id}}" data-route="{{ route('front.product.favourite.status', $product) }}" style="font-size: 16px;" >
                                    <i class="fa fa-heart-o"></i>
                                </a>
                            @else
                                <a href="javascript:void(0)" class="prod-detail-wishlist-icon wishlistStatus" id="wishlist-{{$product->id}}" data-product="{{$product->id}}" data-route="{{ route('front.product.favourite.status', $product) }}" style="font-size: 16px;" >
                                    <i class="fa fa-heart"></i>
                                </a>
                            @endif
                        @else
                            <a href="{{url('/login')}}" class="prod-detail-wishlist-icon" style="font-size: 16px;" >
                                <i class="fa fa-heart-o"></i>
                            </a>
                        @endif
                        
                        <div class="kalles-template single-product-template zoom_tp_2 header_full_true des_header_3 css_scrollbar lazy_icons btnt4_style_2 css_scrollbar template-index kalles_toolbar_true hover_img2 swatch_style_rounded swatch_list_size_small label_style_rounded wrapper_full_width header_full_true hide_scrolld_true lazyload ml-27 mob-ml-0">
                            <div class="sp-single sp-single-4 des_pr_layout_1">
                                @php
                                $photos = $product->photos;
                                if (!empty($variant_spec)) {
                                    $photos  = $variant_spec->images ?? [];
                                }
                                @endphp
                                <div class="container container_cat cat_default">
                                    <div class="row product">
                                        <div class="col-md-12 col-12 thumb_left">
                                            <div class="row mb__50 pr_sticky_content">                                                    
                    
                                                <!-- product thumbnails -->
                                                <div class="col-md-12 col-12 pr product-images img_action_zoom pr_sticky_img kalles_product_thumnb_slide">
                                                    @if(count($photos) > 0 || $product->photo)
                                                    <div class="row theiaStickySidebar">
                                                        <div class="col-12 col-lg col_thumb">
                                                            <div class="p-thumb p-thumb_ppr images sp-pr-gallery equal_nt nt_contain ratio_imgtrue position_8 nt_slider pr_carousel" data-flickity='{"initialIndex": ".media_id_001","fade":true,"draggable":">1","cellAlign": "center","wrapAround": true,"autoPlay": false,"prevNextButtons":true,"adaptiveHeight": true,"imagesLoaded": false, "lazyLoad": 0,"dragThreshold" : 6,"pageDots": false,"rightToLeft": false }'>
                                                                @if($product->photo && empty($variant_spec))
                                                                <div class="img_ptw p_ptw p-item sp-pr-gallery__img w__100 nt_bg_lz lazyload padding-top__127_66 media_id_000" data-mdid="001" data-height="1440" data-width="1128" data-ratio="0.7833333333333333" data-mdtype="image" data-src="{{ $product->photo->name}}" data-bgset="{{ $product->photo->name}}" data-cap="{{ $product->name}}"></div>
                                                                @endif
                                                                @foreach($photos as $key=>$photo)
                                                                <div class="img_ptw p_ptw p-item sp-pr-gallery__img w__100 nt_bg_lz lazyload padding-top__127_66 media_id_00{{$loop->iteration}}" data-mdid="{{$loop->iteration}}" data-height="1440" data-width="1128" data-ratio="0.7833333333333333" data-mdtype="image" data-src="{{ $photo->name}}" data-bgset="{{ $photo->name}}" data-cap="{{ $product->name}}"></div>
                                                                @endforeach
                                                            </div>
                                                            <div class="p_group_btns pa flex">
                                                                <button class="br__40 tc flex al_center fl_center show_btn_pr_gallery ttip_nt tooltip_top_left">
                                                                    <i class="las la-expand-arrows-alt"></i><span class="tt_txt">Click to enlarge</span>
                                                                </button>
                                                            </div>
                                                        </div>
                                                        <div class="col-12 col-lg-auto col_nav nav_medium t4_show">
                                                            <div class="p-nav ratio_imgtrue row equal_nt nt_cover position_8 nt_slider pr_carousel" data-flickityjs='{"initialIndex": ".media_id_001","cellSelector": ".n-item:not(.is_varhide)","cellAlign": "left","asNavFor": ".p-thumb","wrapAround": true,"draggable": ">1","autoPlay": 0,"prevNextButtons": 0,"percentPosition": 1,"imagesLoaded": 0,"pageDots": 0,"groupCells": 3,"rightToLeft": false,"contain":  1,"freeScroll": 0}'></div>
                                                            <button type="button" aria-label="Previous" class="btn_pnav_prev pe_none">
                                                                <i class="las la-angle-up"></i>
                                                            </button>
                                                            <button type="button" aria-label="Next" class="btn_pnav_next pe_none">
                                                                <i class="las la-angle-down"></i>
                                                            </button>
                                                        </div>
                                                        <div class="dt_img_zoom pa t__0 r__0 dib"></div>
                                                    </div>
                                                    @endif
                                                </div>
                                                <!-- end product thumbnails -->
                                            
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 col-xs-12 col-sm-12 right-scrollbar">
                        <h2 class="mt-0 mb-0 product-title-h2">{{$product->name}}</h2>
                        @if($variant_spec)
                            @if($variant_spec->product_code)
                                <p class="product_desc">Product Code {{ $variant_spec->product_code }}</p>
                            @endif
                        @else
                            @if($product->model)
                                <p class="product_desc">Product Code {{ $product->model }}</p>
                            @endif
                        @endif
                        
                        @if($product->virtual && $product->downloadable && $product->file)
                            <small class="text-muted">@lang('Download access will be given after payment is done.')</small>
                        @endif
                                        
                        <div class="row category mb-0">
                            <div class="col-xs-8">
                                @if($product->brand)
                                <a href="{{route('front.brand.show', [$product->brand->slug])}}"><span class="label label-success">{{$product->brand->name}}</span></a>
                                @endif
                                @if(count($product->reviews->where('approved', 1)) > 0)
                                    <p class="mb-0"><span class="label label-primary review-bg label-sm">{{$product->reviews->where('approved', 1)->where('rating', '!=', null)->avg('rating')}} <span class="glyphicon glyphicon-star" aria-hidden="true"></span></span>
                                        &nbsp;<a href="#reviews" class="f-size-13">{{count($product->reviews->where('approved', 1)->where('rating', '!=', null))}} @lang('Ratings &') {{count($product->reviews->where('approved', 1)->where('comment', '!=', null))}} @lang('Reviews')</a>
                                    </p>
                                @endif

                            </div>
                        
                        </div>
                        <div class="product-price-box label_product">
                            @if($product->price_with_discount() < $product->price)
                            <span class="product-price">{{currency_format($product->price_with_discount() + $variant_price )}}</span>
                            <del class="product-price-discount text-muted">{{currency_format($product->price)}}</del>
                            @if(round($product->discount_percentage()) > 0)
                                <span class="product-price-discount label_sale1">{{round($product->discount_percentage())}}@lang('% off')</span>
                            @endif
                            @else
                            @if($product->old_price && ($product->price < $product->old_price))
                            <span class="product-price">{{currency_format($product->price  + $variant_price)}}</span>
                            <del class="product-price-discount text-muted">{{currency_format($product->old_price)}}</del>
                                @if(round(100 * ($product->old_price - $product->price) / $product->old_price) > 0)
                                    <span class="product-price-discount label_sale1">{{round(100 * ($product->old_price - $product->price) / $product->old_price)}}@lang('% off')</span>
                                @endif
                            
                            @else
                            <span class="product-price">{{currency_format($product->price  + $variant_price)}}</span>
                            @endif
                            @endif

                        </div>
                                
                        @if($product->in_stock < 1)
                            <h3 class='text-danger'>@lang('Out of Stock!')</h3>
                        @elseif($product->in_stock < 4)
                            <h4 class='text-danger'>@lang('Only') {{$product->in_stock}} @lang('left in Stock!')</h4>
                        @else
                            <h4 class='text-muted'>@lang('In Stock')</h4>
                        @endif
                        
                        @if($product->in_stock > 0)
                        <div class="row">
                            <div class="col-md-12">
                                {!! Form::open(['method'=>'patch', 'route'=>['front.cart.add', $product->id], 'id'=>'cart-form', 'name' => 'addToCartForm']) !!}
                                    <input type="hidden" name="variant_code" id="variant_code" value="{{request()->variant_code}}">
                                    <input type="hidden" name="variant_option_code" id="variant_option_code" value="{{request()->variant_option_code}}">
                                    @if(count($product->variant_colors))
                                    <div class="variations mb__20 style__circle size_medium style_color des_color_1">
                                        <div class="swatch is-color kalles_swatch_js mb-0">
                                            @if (request()->color)
                                            <h4 class="swatch__title mt-0 mb-0">Color:
                                                <span class="nt_name_current user_choose_js">{{ request()->color}}</span>
                                            </h4>
                                            @else
                                            <h4 class="swatch__title mt-0 mb-0">Select Color</h4>
                                            @endif
                                            <ul class="swatches-select swatch__list_pr d-flex">
                                                @foreach($product->variant_colors as $variant_color)
                                                    @php
                                                        $colorSelected = '';
                                                        if(request()->color == $variant_color->name) {
                                                            $colorSelected = 'is_choosen';
                                                        }
                                                    @endphp
                                                <a href="{{url('product/'.$product->slug.'?variant_code='.$variant_color->id.'&color='.$variant_color->name)}}">
                                                    <li class="ttip_nt tooltip_top_right nt-swatch" data-escape="{{$variant_color->name}}">
                                                        <span class="tt_txt">{{$variant_color->name}}</span>
                                                        <div class="{{ $colorSelected }} bc-white"><span class="swatch__value_pr pr lazyloaded " style="background-color: {{$variant_color->code}};"></span></div>
                                                    </li>
                                                </a>
                                                @endforeach
                                            </ul>
                                            <label id="variant_code-error" class="error" for="variant_code"></label>
                                        </div>
                                        @php
                                        
                                        $option_input_value = '';
                                        if (empty($variant_spec)) {
                                            $variant_color_options  = $product->variant_color->options ?? [];
                                        }
                                        @endphp
                                        @if ($variant_color_options)
                                        <div class="swatch is-label kalles_swatch_js">
                                            @if(request()->size)
                                            <h4 class="swatch__title mt-0 mb-0">Size:
                                                <span class="nt_name_current user_choose_js">{{request()->size ?? 'Please select a Size.'}} </span>
                                            </h4>
                                            @else
                                            <h4 class="swatch__title mt-0 mb-0">Select Size</h4>
                                            @endif
                                            <ul class="swatches-select swatch__list_pr d-flex">
                                                @foreach ($variant_color_options as $variant_color_option)
                                                    @php
                                                        $sizeSelected = '';
                                                        if(request()->size == $variant_color_option->size) {
                                                            $sizeSelected = 'is-selected';
                                                        }
                                                        if ($variant_color_option->qty == 0) {
                                                            $sizeSelected = 'no-size-disable';
                                                        }
                                                    @endphp
                                                    @if($variant_color_option->qty == 0)
                                                        <li class="nt-swatch swatch_pr_item_size pr no-size-disable" data-escape="{{$variant_color_option->size}}">
                                                        <span class="swatch__value_pr">{{$variant_color_option->size}}</span>
                                                        </li>
                                                    @else
                                                        <a href="{{url('product/'.$product->slug.'?variant_code='.$variant_color_option->variant_color->id.'&color='.$variant_color_option->variant_color->name.'&variant_option_code='.$variant_color_option->id.'&size='.$variant_color_option->size)}}">
                                                            <li class="nt-swatch swatch_pr_item_size pr {{$sizeSelected}}" data-escape="{{$variant_color_option->size}}">
                                                            <span class="swatch__value_pr">{{$variant_color_option->size}}</span>
                                                            </li> 
                                                        </a>
                                                    @endif
                                                @endforeach
                                            </ul>
                                            <label id="variant_option_code-error" class="error" for="variant_option_code"></label>
                                        </div>
                                        @endif
                                    </div>
                                    @endif
                                    @if(!empty($request_variant_options) && $request_variant_options->qty == 0)
                                        <button class="btn btn-default" data-cart-submit="" type="button" disabled>
                                            <span class="primary-text" >Sold out</span>
                                        </button>
                                    @else
                                    <input type="hidden" name="variant_color" id="variant_color" value="{{request()->color}}">
                                    <input type="hidden" name="variant_size" id="variant_size" value="{{request()->size}}">
                                    {!! Form::label('quantity', __('Quantity:')) !!}
                                    
                                    {!! Form::number('quantity', 1, ['class'=>'quantity-pro', 'step'=>'1', 'min'=>'1', 'max'=>$product->qty_per_order]) !!}
                                    <div class="mt-14 display-inline mob-display-inline ml-20">
                                        <button class="add-to-cart-de btn btn-success" name="submit_button" type="submit"> <i class="linearicons-cart"></i> @lang('Add To Cart') </button> &nbsp;&nbsp;
                                        @if ($product->variant_colors->count()) 
                                        <a class="buy-now-de btn btn-success" href="{{url('buynow/add/'.$product->id.'?variant_code='.request()->variant_code.'&color='.request()->color.'&variant_option_code='.request()->variant_option_code.'&size='.request()->size)}}" class="btn btn-success">@lang('Buy Now') </a>
                                        @else
                                        <a class="buy-now-de btn btn-success" href="{{route('front.buynow.add', $product->id)}}" class="btn btn-success">@lang('Buy Now') </a>
                                        @endif
                                    </div>
                                    <label id="quantity-error" class="error" for="quantity"></label>
                                    @endif
                                {!! Form::close() !!}
                            </div>
                        </div>
                        @endif
                    
                        @if($product->vendor)
                        <br>
                        <div class="row">
                            <div class="col-md-12 well">
                                @lang('Sold By:') <a class="text-primary" href="{{url('/shop')}}/{{$product->vendor->slug}}"><strong>{{$product->vendor->shop_name}}</strong></a>
                            </div>
                        </div>
                        @endif
                        <div class="box_details">
                            @if(count($custom_fields = unserialize($product->custom_fields)) > 0 && is_array($custom_fields))
                            <div class="row">
                                <div class="col-xs-12">
                                    <div class="product-details-table text-justify">
                                        <div class="product data items">
                                            <div class="product-title">Highlights</div> 
                                            <div class="row"> 
                                                <div class="col-md-6"> 
                                                    <ul>
                                                        @foreach($custom_fields as $key => $field)
                                                        <li>{{$field}}.</li>
                                                        @if(ceil(count($custom_fields) / 2) == $loop->iteration)
                                                    </ul>
                                                </div>
                                                <div class="col-md-6"> 
                                                    <ul>
                                                        @endif
                                                        @endforeach
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            @endif
                            <div class="short-desc-in-details col-xs-12">
                                <ul class="product_return">
                                    <li><img class="feat" src="{{ asset('img/certified.png')}}"/><span> 100% Certified</span></li>
                                    <li><img class="feat" src="{{ asset('img/life-time.png')}}"/><span> Life Time Exchange</span></li>
                                    <li><img class="feat" src="{{ asset('img/return.png')}}"/><span> 30 days Return</span></li>
                                </ul>
                            </div>
                        </div>
                        <!-- Right Column Start -->
                        <div class="location mt-0">
                            <img src="{{ asset('img/location.png')}}">
                            <input type="text" id="pincodetext" placeholder="Enter Delivery Pincode">
                            <span id="delivery_check">
                                <a href="javascript:void(0);"> Check</a>
                            </span> 
                            <div class="delivery-date">
                                <span itemprop="name" content="Drop shape shimmering Gold Ring"></span> 
                                <span></span>
                            </div>
                        </div>
                        <!-- Right Column End -->
                        @if(config('settings.social_share_enable'))
                            <div class="left-zero left-zero-share col-xs-12">
                                <span class="mob-mr-10">Share: </span><a href="https://www.facebook.com/sharer/sharer.php?u={{ urlencode(Request::fullUrl()) }}" target="_blank" class="btn btn-sm btn-social-icon btn-facebook social-share">
                                            <span class="fa fa-facebook"></span>
                                        </a>
                                        <a href="https://twitter.com/intent/tweet?url={{ urlencode(Request::fullUrl()) }}" target="_blank" class="btn btn-sm btn-social-icon btn-twitter social-share">
                                            <span class="fa fa-twitter"></span>
                                        </a>
                                        <a href="https://www.instagram.com//share?url={{ urlencode(Request::fullUrl()) }}" target="_blank" class="btn btn-sm btn-social-icon btn-instagram social-share">
                                            <span class="fa fa-instagram"></span>
                                        </a>
                                        <a href="https://www.pinterest.com//share?url={{ urlencode(Request::fullUrl()) }}" target="_blank" class="btn btn-sm btn-social-icon btn-pinterest social-share">
                                            <span class="fa fa-pinterest"></span>
                                        </a>
                                </div>                         
                            @endif
                        
                            <h3>Product Information</h3>
                            <div class="accordion">
                                <!-- span to target fix closing accordion -->
                                <span class="target-fix" id="accordion"></span>
                                
                                <!-- First Accoridon Option -->
                                <div>
                                    <!-- span to target fix accordion -->
                                    <span class="target-fix" id="accordion1"></span>
                                    
                                    <!-- Link to open accordion, hidden when open --> 
                                    <a href="#accordion1" id="open-accordion1" title="open"><i class="ti-package"></i> Product Details</a>
                                    
                                    <!-- Link to close accordion, hidden when closed -->
                                    <a href="#accordion" id="close-accordion1" title="close"><i class="ti-package"></i> Product Details</a> 
                                    
                                    <!-- Accorion content goes in this div -->
                                    <div class="accordion-content">
                                        <div class="row">
                                            @foreach($product->specificationTypes as $product_specification_type)
                                            <div class="col-md-4">
                                                <h5>{{$product_specification_type->name}}</h5>
                                                <p>{{$product_specification_type->pivot->value}}</p>
                                            </div>
                                            @endforeach
                                        </div>
                                        
                                        <div class="row bt-border">
                                            <div class="col-md-12">
                                                <h5>Overview</h5>
                                                {!! $product->description !!}
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Second Accoridon Option -->
                                @if ($product->fabric_details)
                                <div>
                                    <span class="target-fix" id="accordion2"></span>
                                    <a href="#accordion2" id="open-accordion2" title="open"><i class="ti-layers-alt"></i> Fabric Details</a>
                                    <a href="#accordion" id="close-accordion2" title="close"><i class="ti-layers-alt"></i> Fabric Details</a>
                                    <div class="accordion-content">
                                        {!! $product->fabric_details !!}
                                    </div>
                                </div>
                                @endif
                                <!-- Third Accoridon Option -->
                                @if ($product->return_exchange_policy)
                                <div>
                                    <span class="target-fix" id="accordion3"></span>
                                    <a href="#accordion3" id="open-accordion3" title="open"><i class="ti-reload"></i> Return and exchange policy</a>
                                    <a href="#accordion" id="close-accordion3" title="close"><i class="ti-reload"></i> Return and exchange policy</a>
                                    <div class="accordion-content">
                                        {!! $product->return_exchange_policy !!}
                                    </div>
                                </div>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>

                @if($product->template_photo)
                <div class="row">
                    <div class="col-md-12">
                        <img src="{{ $product->template_photo->name}}" class="img-responsive" alt="">
                    </div>
                </div>
                @endif
                
                @include('partials.front.description-reviews')
                
                @include('partials.front.related-products')

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

@section('scripts')
    <script src="{{asset('assets/js/jquery.hoverIntent.min.js')}}"></script>
    <script src="{{asset('assets/js/flickity.pkgd.min.js')}}"></script>
    <script src="{{asset('assets/js/lazysizes.min.js')}}"></script>
    <script src="{{asset('assets/js/js-cookie.min.js')}}"></script>
    <script src="{{asset('assets/js/photoswipe.min.js')}}"></script>
    <script src="{{asset('assets/js/photoswipe-ui-default.min.js')}}"></script>
    <script src="{{asset('assets/js/drift.min.js')}}"></script>
    <script src="{{asset('assets/js/interface.js')}}"></script>
    @if ($product->variant_colors->count())
    <script src="{{asset('js/form-validation-with-variant.js')}}"></script>
    @else
    <script src="{{asset('js/form-validation-without-variant.js')}}"></script>
    @endif

    <script>
        (function ($) {

            $('input#pincodetext').attr('maxLength','6').keypress();
            jQuery('#pincodetext').keypress(function (e) {
                var regex = new RegExp("^[0-9-]+$");
                var str = String.fromCharCode(!e.charCode ? e.which : e.charCode);
                if (regex.test(str)) {
                    return true;
                }

                e.preventDefault();
                return false;
            });

            jQuery( "#delivery_check" ).click(function() {
                    var pincode = jQuery( ".location input:text" ).val();
                    if (pincode.length == 0 ) {
                        jQuery('.delivery-date').html('Please Enter Delivery Pincode');
                        jQuery(".delivery-date").css("color", "red");
                    } else {
                        var productId = "{{ $product->id }}";
                        jQuery.ajax({
                            url: APP_URL + '/ajax/pincode/delivery/' + productId + '/' + pincode,
                            cache: false
                        })
                        .done(function( response ) {
                            if (response.availability.available) {
                                if (response.availability.delivery_delay_status == 1) {
                                    jQuery(".delivery-date").html(response.availability.delivery_delay_message);
                                } else {
                                    jQuery(".delivery-date").html("Expected Delivery Date : " + response.availability.delivery_date);
                                }
                                jQuery(".delivery-date").css("color", "#05a189");
                            } else {
                                jQuery(".delivery-date").html("Sorry, currently we are not servicing your area");
                                jQuery(".delivery-date").css("color", "red");
                            }
                        });
                    }
            });
        })(jQuery);
    </script>
    <script type="text/javascript">
        $(document).ready(function(){
            $('.add-to-cart-de').on('click',function(){
                //Scroll to top if cart icon is hidden on top
                $('html, body').animate({
                    'scrollTop' : $(".linearicons-cart-empty").position().top
                });
            });
        });
    </script>
    @include('includes.reviews-submit-script')
    @include('includes.reviews-pagination-script')
    @include('includes.cart-submit-script')
@endsection