@extends(get_view('index'))
@section('title')
@endsection
@section('header')
@endsection
@section('content')
<main class="main-wrapper">


    @include(get_view('components.slider.slider'))


    @php
    $showroom_products = get_products_showroom();
    $showroom_products = $showroom_products->chunk(4);
    @endphp
    @if($showroom_products && $showroom_products->count() > 0)
    <div class="axil-product-area bg-color-white axil-section-gapcommon">
        <div class="container">
            <div class="section-title-border slider-section-title">
                <h2 class="title">{{ __('Öne Çıkan Ürünler') }} 💥</h2>
            </div>
            <div
                class="popular-product-activation slick-layout-wrapper slick-layout-wrapper--15 axil-slick-angle angle-top-slide">
                @foreach ($showroom_products as $showroom_product)
                <div class="slick-single-layout">
                    <div class="row gy-5">
                        @foreach ($showroom_product as $product)
                        <div class="col-md-6 col-12">
                            <div class="axil-product product-style-eight product-list-style-3  h-100 m-0 p-4">
                                <div class="row w-100">
                                    <div class=" col-6 d-flex align-items-center justify-content-center">
                                        <a href="{{ route('product.detail.old', ['permalink' => $product->content->permalink ?? '']) }}"
                                            class="m-3">
                                            <img class="main-img"
                                                src="{{ Common::get_product_small_image($product->id, $product->first_image->name ?? '') }}"
                                                alt="{{ $product->content->name ?? '' }}">
                                        </a>
                                    </div>
                                    <div class="product-content col-6">
                                        <div class="inner">
                                            <div class="product-cate"><a
                                                    href="{{ route('category.detail', ['url' => $product->category->content->url ?? '']) }}">
                                                    {{ $product->category->content->name ?? '' }}</a></div>
                                            <h5 class="title"><a
                                                    href="{{ route('product.detail.old', ['permalink' => $product->content->permalink ?? '']) }}">
                                                    {{ $product->content->name ?? '' }}</a></h5>
                                            <div class="product-rating">
                                                <span class="icon">
                                                    @php
                                                    $reviewaverage = $product->rate;
                                                    @endphp
                                                    <!-- can be .5 .3 -->
                                                    @foreach (range(1, 5) as $i)
                                                    @if ($reviewaverage > 0)
                                                    @if ($reviewaverage > 0.5)
                                                    <i class="fas fa-star"></i>
                                                    @elseif ($reviewaverage <= 0.5 && $reviewaverage> 0)
                                                        <i class="fas fa-star-half-alt"></i>
                                                        @endif
                                                        @else
                                                        <i class="far fa-star"></i>
                                                        @endif
                                                        @php
                                                        $reviewaverage--;
                                                        @endphp
                                                        @endforeach
                                                </span>
                                                <span class="rating-number">{{ $product->review_count }}</span>
                                            </div>
                                            <div class="product-price-variant">
                                                <span class="price-text">{{__('Fiyat')}}</span>
                                                <span class="price current-price">{{ $product->get_price(false)
                                                    }}</span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        @endforeach
                    </div>
                </div>
                @endforeach
            </div>
        </div>
    </div>
    @endif




    @php
    $categories_with_images = Site::mainCategoriesWithImages();
    @endphp
    @if (count($categories_with_images) > 0)
    <!-- Start Categorie Area  -->
    <div class="bg-color-white axil-section-gapcommon">
        <div class="container">
            <div class="slider-section-title section-title-border">
                <h2 class="title">{{ __('Öne Çıkan Kategoriler') }}💥</h2>
            </div>
            <div class="categrie-product-activation-4 slick-layout-wrapper--15 axil-slick-angle angle-top-slide">
                <div class="slick-single-layout">
                    <div class="row row-cols-lg-5 row-cols-sm-3 row-cols-2">
                        @foreach ($categories_with_images as $category)
                        <div class="col">
                            <div class="categrie-product categrie-product-4" data-sal="zoom-out" data-sal-delay="100"
                                data-sal-duration="500">
                                <a href="{{ route('category.detail', ['url' => $category->content->url ?? '']) }}"
                                    class="cate-thumb">
                                    <img
                                        src="{{ asset('uploads/category_images/' . $category->id . '/' . $category->image) }}" />
                                    <h5 class="cat-title">{{ $category->content->name ?? '' }}</h5>
                                </a>
                            </div>
                        </div>
                        @endforeach
                    </div>
                </div>

            </div>
        </div>
    </div>
    <!-- End Categorie Area  -->
    @endif




    @php
    $last_products = get_products(5);
    $first_product = $last_products->first();
    $last_products = $last_products->slice(1);
    @endphp
    @if (count($last_products) > 0)
    <div class="bg-lighter axil-section-gapcommon">

        <div class="product-collection-area mt--80">
            <div class="container">
                <div class="section-title-border">
                    <h2 class="title">{{ __('Son Eklenen Ürünler') }}💥</h2>
                    <div class="view-btn"><a href="{{ route('products.list') }}">{{ __('Tümünü Gör') }}</a></div>
                </div>
                <div class="row">
                    <div class="col-xl-5">
                        <div
                            class="product-collection product-collection-two position-relative h-100 d-flex align-items-center justify-content-center">
                            <div class="collection-content top-0 start-0 w-100 h-100 p-5 d-flex flex-column justify-content-center"
                                style="background-color: #ffffffb6;transform: unset;">
                                <h3 class="title"><a
                                        href="{{ route('product.detail.old', ['permalink' => $first_product->content->permalink ?? '']) }}">{{
                                        $first_product->content->name ?? '' }}</a>
                                </h3>
                                <div class="price-warp">
                                    {{-- <span class="price-text">Starting From</span> --}}
                                    <span class="price">{{ $first_product->get_price(false) }}</span>
                                </div>
                                <div class="shop-btn">
                                    <a href="{{ route('products.list') }}"
                                        class="axil-btn btn-bg-primary btn-size-md"><i class="far fa-shopping-cart"></i>
                                        {{ __('Ürünleri Gör') }}</a>
                                </div>
                            </div>
                            <div class="collection-thumbnail">
                                <img src="{{ Common::get_product_small_image($first_product->id, $first_product->first_image->name ?? '') }}"
                                    alt="{{ $first_product->content->name ?? __('Ürün') }}">
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-7">
                        <div class="row g-4">
                            @foreach ($last_products as $last_product)
                            <div class="col-md-6">
                                <div class="product-collection-three h-100">
                                    <div class="collection-content">
                                        <h6 class="title"><a
                                                href="{{ route('product.detail.old', ['permalink' => $last_product->content->permalink ?? '']) }}">{{
                                                $last_product->content->name ?? '' }}</a>
                                        </h6>
                                        <div class="price-warp">
                                            {{-- <span class="price-text">Starting From</span> --}}
                                            <span class="price">{{ $last_product->get_price(false) }}</span>
                                        </div>
                                    </div>
                                    <div class="collection-thumbnail">
                                        <img src="{{ Common::get_product_small_image($last_product->id, $last_product->first_image->name ?? '') }}"
                                            alt="{{ $last_product->content->name ?? __('Ürün') }}">
                                    </div>
                                </div>
                            </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif

    <div class="axil-testimoial-area-two axil-section-gapBottom pt-5">
        <div class="container">
            <div class="testimonial-container-box">
                <div class="row">
                    <div class="col-lg-7">
                        <div class="testimonial-video-box">
                            <div class="thumbnail">
                                <img src="/images/musteri-21.png" alt="Image">
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-5">
                        <div class="testimonial-style-three-wrapper">
                            <div class="heading-title">
                                <h2 class="title">{{ __('Müşterilerimizin') }} <br>{{ __('Düşünceleri') }}</h2>
                            </div>
                            <div class="testimonial-slick-activation-three slick-initialized slick-slider">
                                <div class="slick-list draggable">
                                    <div class="slick-track"
                                        style="opacity: 1; width: 2100px; transform: translate3d(-420px, 0px, 0px);">
                                        <div class="slick-single-layout testimonial-style-three slick-slide slick-cloned"
                                            data-slick-index="0" aria-hidden="true" style="width: 420px;"
                                            tabindex="-1">
                                            <p> {{ __('Tekrardan alışveriş yapacağım bir marka.') }}</p>
                                            <div class="author-info">
                                                <h6 class="author-name"> {{ __('AH** AY**') }} </h6>
                                                <span class="author-desg"> {{ __('Müşteri') }} </span>
                                            </div>
                                        </div>
                                        <div class="slick-single-layout testimonial-style-three slick-slide slick-current slick-active"
                                            data-slick-index="1" aria-hidden="false" style="width: 420px;" tabindex="0">
                                            <p>{{ __('Ürünüm çok özenli ve kırılmadan geldi, cidden çok memnunum.') }}</p>
                                            <div class="author-info">
                                                <h6 class="author-name"> {{ __('BU** KA**') }} </h6>
                                                <span class="author-desg"> {{ __('Müşteri') }} </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                            <div class="testimonial-custom-nav">
                                <div class="row align-items-center">
                                    <div class="col-6">
                                        <div class="slick-slide-count">1/2</div>
                                    </div>
                                    <div class="col-6">
                                        <div class="slide-custom-nav">
                                            <button class="prev-custom-nav slick-arrow" style="">
                                                <i class="fal fa-angle-left"></i> Önceki
                                            </button>
                                            <button class="next-custom-nav slick-arrow" style="">
                                                Sonraki <i class="fal fa-angle-right"></i>
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


</main>
@endsection
@section('footer')
@endsection