@extends('layouts.listings')
@section('content')
    <div class="single-page" id="app">
        <div class="single-page-row" id="detail-21">
            <div class="col-md-6 single-top-left">
                <div class="flexslider">
                    <ul class="slides">
                        <li data-thumb="{{ Storage::url($stock->picture_path) }}">
                            <div class="thumb-image detail_images">
                                <img src="{{ Storage::url($stock->picture_path) }}" data-imagezoom="true" class="img-responsive"
                                alt="{{ $stock->name }}">
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="col-md-6 single-top-right">
                <div class="simpleCart_shelfItem">
                <h3 class="item_name">{{ $stock->name }}</h3>
                <p>
                    <strong>
                        @if ($stock->company->delivery_info == null)
                            Same day delivery on orders before 4pm in Lagos. You can contact us or place an order via
                            WhatsApp 08060801979 or by clicking <a href="https://wa.me/2348060801979" target="_blank">this link</a>.
                        @else
                            {!! $stock->company->delivery_info !!}
                        @endif
                    </strong>
                </p>
                <div class="single-price">
                    <ul>
                        <li><span class="item_price">{{ $stock->outputPrice() }}</span></li>
                    </ul>
                </div>
                {{--<p class="text-muted">Price of this item may be higher or lower by the time your order is being confirmed</p>--}}
                <br>
                <a href="javascript:;" @click="addToCart" class="btn btn-danger" data-product="{{ $stock->id }}"><i class="fa fa-cart"></i> Add to Cart</a>
                </div>
            </div>
           <div class="clearfix"> </div>
        </div>
    </div>

    <!-- collapse-tabs -->
    <div class="collpse tabs">
        {{-- <h3 class="w3ls-title">About this item</h3> --}}
        <div class="panel-group collpse" id="accordion" role="tablist" aria-multiselectable="true">
            <div class="panel panel-default" style="border:none;">
                <div class="panel-heading" role="tab" id="headingOne">
                    <h4 class="panel-title">
                        <a class="pa_italic" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                            <i class="fa fa-file-text-o fa-icon" aria-hidden="true"></i> Description <span class="fa fa-angle-down fa-arrow" aria-hidden="true"></span> <i class="fa fa-angle-up fa-arrow" aria-hidden="true"></i>
                        </a>
                    </h4>
                </div>
                <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
                    <div class="panel-body">
                        {!! $stock->description !!}
                    </div>
                </div>
            </div>

        </div>
    </div>

    <!-- //collapse -->
@endsection
@section('after_scripts')

@endsection