@extends('front.layout.master')
@push('css')


    <link
            rel="stylesheet"
            href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css"
    />

    <link rel="stylesheet" href="{{asset('front/cars/css/main.css')}}" />


@endpush
@section('content')
    <!-- -------------------------------------------- -->
    <!-- Start single_pro -->
    <div class="single_pro mt-5">
        <div class="container">

            <div class="row">
                <div class="col-lg-5 mb-lg-0 mb-4 img-box">
                    <!--<div class="all">
                            <div class="slider">
                                <div class="owl-carousel owl-theme one">
                                   <div class="item-box">
                              <img class="zoomLense" src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="" data-zoom-image="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg">
                                    </div>
                                    <div class="item-box">
                       <img class="zoomLense" src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="" data-zoom-image="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg">
                                    </div>
                                    <div class="item-box">
                           <img class="zoomLense" src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="" data-zoom-image="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg">
                                    </div>
                                    <div class="item-box">
                    <img class="zoomLense" src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="" data-zoom-image="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg">
                                    </div>
                                    <div class="item-box">
                            <img class="zoomLense" src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="" data-zoom-image="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg">
                                    </div>
                                      <div class="item-box">
            <img class="zoomLense" src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="" data-zoom-image="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg">
                                    </div>
                                </div>
                                <div class="left-t">
                                    <i class="fa fa-angle-left"></i>
                                </div>
                                <div class="right-t">
                                    <i class="fa fa-angle-right"></i>
                                </div>
                            </div>
                            <div class="slider-two">
                                <div class="owl-carousel owl-theme two">
                                    <div class="item active">
                                        <img src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="">
                                    </div>
                                    <div class="item">
                                        <img src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="">
                                    </div>
                                    <div class="item">
                                        <img src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="">
                                    </div>
                                    <div class="item">
                                        <img src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="">
                                    </div>
                                    <div class="item">
                                        <img src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="">
                                    </div>
                                     <div class="item">
                                        <img src="https://gold.topapp-kw.com/storage/images/mainProduct/2022-12-03-RYKHP152-1.jpg" alt="">
                                    </div>
                                </div>

                            </div>
                        </div>-->


         <div class="gallery-slider">
             @if($products->count() > 0)

                     @foreach($products->files->where('main',0) as $file)
                         <div class="item">
                             <img src="{{asset($file->image)}}" data-zoom-image="{{asset($file->image)}}">
                         </div>
                     @endforeach
                 @endif


          </div>

        <div class="thumbs-slider">
            @if($products->count() > 0)

                @foreach($products->files->where('main',0) as $file)
                    <div class="item">
                        <img src="{{asset($file->image)}}" data-zoom-image="{{asset($file->image)}}">
                    </div>
                @endforeach
            @endif

          </div>
                </div>

                <div class="info col-lg-7 pt-2">