@extends('web.layouts.container')

@section('content')
    <section class="products-pg">
        @if(count($products))
            @foreach($products as $product)
                @if($loop->even)
                    <div class="item">
                        <div class="container">
                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="text-box center-vr wow text-focus-in">
                                        <h6 class="h6 text-uppercase">{{$product->category_name}}</h6>
                                        <h4 class="h4 text-uppercase">{{$product->name}}</h4>
                                        <div class="colors-available mt-5">
                                            @if(count($product->colors))
                                                <p class="label text-uppercase">{{__('products.colors')}}</p>
                                                @foreach($product->colors as $color)
                                                    <span class="circle" style="background-color: {{$color}}"></span>
                                                @endforeach
                                            @endif
                                        </div>
                                        <div class="btns-wrapper mt-5">
                                            <a href="{{route('product.show', $product->id)}}" class="btn ">{{__('products.learn_more')}} <i class="fas fa-angle-right"></i></a>
                                            {{--                                            <a href="{{route('getProductDetails')}}" data-product="{{$product->id}}"  data-target="#buy_now_modal" class="btn active buy_now_modal_button">{{__('products.buy_now')}} <i class="fas fa-angle-right"></i></a>--}}

                                        </div>
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="img-box">
                                        <img src="{{count($product->images) ? getAgentPhotos($product->images[0]) : ''}}" alt="" class="main-img wow tilt-in-fwd-tr">
                                        <img src="{{asset('assets/web/images/pattern-1.png')}}" alt="" class="pattern wow fadeInUp">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                @endif
                @if($loop->odd)
                    <div class="item dark-item">
                        <div class="container">
                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="img-box">
                                        <img src="{{count($product->images) ? getAgentPhotos($product->images[0]) : ''}}" alt="" class="main-img wow tilt-in-fwd-tl">
                                        <img src="{{asset('assets/web/images/pattern-1.png')}}" alt="" class="pattern wow fadeInUp">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="text-box center-vr  wow text-focus-in">
                                        <h4 class="h4 text-uppercase">{{$product->name}}</h4>
                                        <h6 class="h6 text-uppercase">{{$product->category_name}}</h6>
                                        <div class="colors-available mt-5">
                                            @if(count($product->colors))
                                                <p class="label text-uppercase">{{__('products.colors')}}</p>
                                                @foreach($product->colors as $color)
                                                    <span class="circle" style="background-color: {{$color}}"></span>
                                                @endforeach
                                            @endif
                                        </div>
                                        <div class="btns-wrapper mt-5">
                                            @if(!in_array($product->id, [3,4]))
                                                <a href="{{route('product.show', $product->id)}}" class="btn ">{{__('products.learn_more')}} <i class="fas fa-angle-right"></i></a>
                                                {{--                                                <a href="{{route('getProductDetails')}}" data-product="{{$product->id}}"  data-target="#buy_now_modal" class="btn active buy_now_modal_button">{{__('products.buy_now')}} <i class="fas fa-angle-right"></i></a>--}}
                                            @endif
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                @endif

            @endforeach
        @else
            <div class="container mt-5 mb-4">
                <div class="row">
                    <div class="alert alert-secondary text-center text-danger col-lg-12">{{__('products.no_data')}}</div>
                </div>
            </div>
        @endif

    </section>
@endsection

@section('inner_js')

@endsection