@extends('layout')
@section('title', $title)

@section('content')
<div class="sap_tabs">
    <div class="container">
        <label class="line"> </label>
        <h1 style="text-align: center">Savremeni sistemi spavanja</h1>
        <div id="horizontalTab" style="display: block; width: 100%; margin: 0px;">
            <ul class="resp-tabs-list">
                <li style="display: none;" class="resp-tab-item" aria-controls="tab_item-0" role="tab"><span>Latoflex 1</span></li>
                <div class="clearfix"></div>
            </ul>				  	 
            <div class="resp-tabs-container">
                <div class="tab-1 resp-tab-content" aria-labelledby="tab_item-0">
                    <div class="tab_img">
                        <a href="{{ url('/') }}/kategorija/latoflex">
                            <div class="img-top simpleCart_shelfItem">

                                <img src="{{asset('images/velikaSlika2.jpg')}}" class="img-responsive" alt=""/>
                                <div class="tab_desc">
                                    <h2 style="color: white;">Latoflex <br><small style="color: #fff">krevetne podloge</small></h2>
                                    <div class="agency ">
                                        <div class="agency-left">
                                            <h6 class="jean"></h6>
                                            <span class="dollor item_price"></span>
                                            <div class="clearfix"> </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </a>
                        <a href="{{ url('/') }}/kategorija/duseci">
                        <div class="img-top simpleCart_shelfItem">

                           <img src="{{asset('images/duseci-najnovije-generacije.jpg')}}" class="img-responsive" alt=""/>
                            <div class="tab_desc">
                                <h2 style="color: white;">Dušeci <br><small style="color: #fff">najnovije generacije</small></h2>

                                <div class="agency ">
                                     <div class="agency-left">
                                             <h6 class="jean"></h6>
                                             <span class="dollor item_price"></span>
                                             <div class="clearfix"> </div>
                                     </div>
                                 </div>
                            </div>
                                  <div class="col-in">
                                        <p>NEW</p>
                                  </div>-->
                        </div>
                        </a>
                        
                        <a href="{{ url('/') }}/kategorija/elementi">
                        <div class="img-top simpleCart_shelfItem">

                            <img src="{{asset('images/prateci-elementi.png')}}" class="img-responsive" alt=""/>
                            <div class="tab_desc">
                                <h2 style="color: white;">Prateći <br><small style="color: #fff">elementi</small></h2>

                                   <div class="agency ">
                                        <div class="agency-left">
                                            <h6 class="jean"></h6>
                                            <span class="dollor item_price"></span>
                                            <div class="clearfix"> </div>
                                        </div>
                                   </div>
                            </div>
                            <div class="col-in col-in-1">
                                   <p>SALE <span>30%</span></p>
                             </div> -->
                        </div>
                        </a>
                    <div class="clearfix"></div>
                </div> 	        					 
                </div>
                                   
                           		
            </div>
    </div>
    </div>
</div>

        <div class="goggles"> 
            <div class="container"> 
                <h2>Najnoviji proizvodi</h2>
                @foreach ($popular as $key => $pop)
                @if ($key % 4 == 0)
                <div class="product-one">
                @endif
                    <div class="col-md-3 product-left"> 
                        <div class="p-one simpleCart_shelfItem">							
                            <a href="{{ url('proizvod/' . $pop->slug) }}">
                                <div class="1122 home-popular">
                                    <img src="{{ (!empty($pop->img->toArray())) ? url('/') . '/product_uploads/' . $pop->img->toArray()[0]['image'] : '' }}" alt="" />
                                </div>
                                <div class="mask">
                                    <span>Detaljnije</span>
                                </div>
                            </a>
                            <h4>{{ $pop->name }}</h4>
                            <p><a class="item_add" href="#"><i></i> <span class=" item_price">RSD {{ number_format(intval($pop->price),2) }} RSD</span></a></p>
                        </div>
                    </div>
                    
                @if ($key % 4 == 3 || count($popular) == $key + 1)
                    <div class="clearfix"> </div>
                </div>
                @endif
                @endforeach
                 <div class="mobile-icon" style="display:none;">
                     <button type="button" class="btn btn-primary">
                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-telephone" viewBox="0 0 16 16">
  <path d="M3.654 1.328a.678.678 0 0 0-1.015-.063L1.605 2.3c-.483.484-.661 1.169-.45 1.77a17.6 17.6 0 0 0 4.168 6.608 17.6 17.6 0 0 0 6.608 4.168c.601.211 1.286.033 1.77-.45l1.034-1.034a.678.678 0 0 0-.063-1.015l-2.307-1.794a.68.68 0 0 0-.58-.122l-2.19.547a1.75 1.75 0 0 1-1.657-.459L5.482 8.062a1.75 1.75 0 0 1-.46-1.657l.548-2.19a.68.68 0 0 0-.122-.58zM1.884.511a1.745 1.745 0 0 1 2.612.163L6.29 2.98c.329.423.445.974.315 1.494l-.547 2.19a.68.68 0 0 0 .178.643l2.457 2.457a.68.68 0 0 0 .644.178l2.189-.547a1.75 1.75 0 0 1 1.494.315l2.306 1.794c.829.645.905 1.87.163 2.611l-1.034 1.034c-.74.74-1.846 1.065-2.877.702a18.6 18.6 0 0 1-7.01-4.42 18.6 18.6 0 0 1-4.42-7.009c-.362-1.03-.037-2.137.703-2.877z"></path>
</svg>
                063/282-739
              </button>
                 </div>
            </div>
	</div>
@endsection