@extends('LandingPage.Layouts.master')

@section('content')



<div class="breadcrumb-block style-shared">
    <div class="breadcrumb-main bg-linear overflow-hidden">
        <div class="container lg:pt-[134px] pt-24 pb-10 relative">
            <div class="main-content w-full h-full flex flex-col items-center justify-center relative z-[1]">
                <div class="text-content">
                    <div class="heading2 text-center">{{translate('Search Result')}}</div>
                    <div class="link flex items-center justify-center gap-1 caption1 mt-3">
                        <a href='{{route('Landing.index')}}'>{{translate('Homepage')}}</a>
                        <i class="ph ph-caret-right text-sm text-secondary2"></i>
                        <div class='text-secondary2 capitalize'>{{translate('Search Result')}}</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="shop-product search-result-block lg:py-20 md:py-14 py-10">
    <div class="container">
        <div class="heading flex flex-col items-center">
            <div class="heading4 text-center">
                {{translate('Found')}} <span class="result-quantity">{{ count($products) + count($blogPosts) + count($categories) }}</span> {{translate('results for')}} "<span class="result">{{ request('query') }}</span>"
            </div>
        </div>

        <div class="list-product grid lg:grid-cols-4 sm:grid-cols-3 grid-cols-2 sm:gap-6 gap-4 mt-5">
            @foreach($products as $product)
            <div class="product-item bg-white rounded-lg shadow-lg overflow-hidden hover:scale-105 transition-transform border border-gray-200">
                <img class="w-full h-56 object-cover" src="{{ uploaded_asset($product->thumbnail_img) }}" alt="{{ $product->getTranslation('name') }}">
                <div class="p-4 text-center">
                    <h3 class="text-lg font-semibold text-gray-800">{{ $product->getTranslation('name') }}</h3>

                    <!-- Price Section -->
                    <div class="mt-2">
                        @if($product->discount > 0)
                        <p class="text-gray-500 text-sm line-through">${{ number_format($product->unit_price, 2) }}</p>
                        <p class="text-red-500 text-lg font-bold">${{ number_format($product->unit_price - ($product->discount_type == 'percent' ? ($product->unit_price * $product->discount / 100) : $product->discount), 2) }}</p>
                        @else
                        <p class="text-green-600 text-lg font-bold">${{ number_format($product->unit_price, 2) }}</p>
                        @endif
                    </div>

                    <!-- Rating Section -->
                    <div class="flex justify-center items-center mt-2 text-yellow-500">
                        @for ($i = 1; $i <= 5; $i++) @if ($i <=floor($product->rating))
                            <svg class="w-5 h-5 fill-current" viewBox="0 0 20 20">
                                <path d="M10 15l-5.878 3.09 1.122-6.545-4.756-4.635 6.573-.955L10 .5l2.939 5.455 6.573.955-4.756 4.635 1.122 6.545z" /></svg>
                            @elseif ($i - 0.5 == $product->rating)
                            <svg class="w-5 h-5 fill-current" viewBox="0 0 20 20">
                                <path d="M10 15l-5.878 3.09 1.122-6.545-4.756-4.635 6.573-.955L10 .5v14.5z" /></svg>
                            @else
                            <svg class="w-5 h-5 text-gray-300" viewBox="0 0 20 20">
                                <path d="M10 15l-5.878 3.09 1.122-6.545-4.756-4.635 6.573-.955L10 .5l2.939 5.455 6.573.955-4.756 4.635 1.122 6.545z" /></svg>
                            @endif
                            @endfor
                    </div>
                </div>
            </div>
            @endforeach

            @foreach($categories as $category)
            <div class="category-item bg-white rounded-lg shadow-lg overflow-hidden hover:scale-105 transition-transform border border-gray-200">
                <!-- Category Image -->
                <img class="w-full h-40 object-cover" src="{{ $category->banner ? uploaded_asset($category->banner) : asset('landing/assets/images/banner/1.png') }}" alt="{{ $category->getTranslation('name') }}">

                <div class="p-4 text-center">
                    <h3 class="text-lg font-semibold text-gray-800">{{ $category->getTranslation('name') }}</h3>
                    <p class="text-sm text-gray-600">{{translate('Products')}}: {{ $category->products()->count() }}</p>
                </div>
            </div>
            @endforeach


            @foreach($blogPosts as $blog)
            <div class="blog-item bg-white rounded-lg shadow-lg overflow-hidden hover:scale-105 transition-transform border border-gray-200">
                <img class="w-full h-36 object-cover" src="{{ uploaded_asset($blog->banner) }}" alt="{{ $blog->getTranslation('name') }}">
                <div class="p-4">
                    <h3 class="text-lg font-semibold text-gray-800">{{ $blog->getTranslation('name') }}</h3>
                    <p class="text-sm text-gray-600">{{translate('Category')}}: {{ $blog->category->getTranslation('name') }}</p>
                </div>
            </div>
            @endforeach
        </div>

    </div>
</div>

@endsection