@extends('front.layouts.app')
@section('title', isset($category) ? $category->name : (isset($query) ? 'Search: '.$query : 'Shop'))
@section('content')
<div class="page-header">
    <h1><span>{{ isset($category) ? $category->name : (isset($query) ? 'Search Results' : 'Our') }}</span> {{ isset($category) ? '' : (isset($query) ? '' : 'Shop') }}</h1>
</div>
<div class="section">
    <div class="section-inner">
        <div class="breadcrumb">
            <a href="{{ route('home') }}">Home</a>
            <span>/</span>
            <a href="{{ route('shop') }}">Shop</a>
            @if(isset($category))
            <span>/</span>
            <span>{{ $category->name }}</span>
            @endif
        </div>

        <div class="shop-layout">
            <div class="filter-sidebar">
                <h3>Categories</h3>
                <a href="{{ route('shop') }}" class="{{ !isset($category) ? 'active' : '' }}">All Products</a>
                @foreach($categories as $cat)
                <a href="{{ route('shop.category', $cat->slug) }}" class="{{ isset($category) && $category->id == $cat->id ? 'active' : '' }}">{{ $cat->name }}</a>
                @if($cat->children && $cat->children->count())
                    @foreach($cat->children as $child)
                    <a href="{{ route('shop.category', $child->slug) }}" style="padding-left:20px" class="{{ isset($category) && $category->id == $child->id ? 'active' : '' }}">{{ $child->name }}</a>
                    @endforeach
                @endif
                @endforeach
            </div>

            <div>
                @if($products->count())
                <div class="products-grid">
                    @foreach($products as $product)
                    <a href="{{ route('product.show', $product->slug) }}" class="product-card" style="text-decoration:none">
                        <img src="{{ $product->primaryImage ? asset('storage/'.$product->primaryImage->image) : 'https://placehold.co/400x300/1a1a2e/f0c040?text='.$product->name }}" class="product-image" alt="{{ $product->name }}">
                        <div class="product-info">
                            <div class="category">{{ $product->category->name ?? 'General' }}</div>
                            <h3>{{ $product->name }}</h3>
                            <div class="price">
                                ${{ number_format($product->displayPrice, 2) }}
                                @if($product->sale_price) <s>${{ number_format($product->price, 2) }}</s> @endif
                            </div>
                        </div>
                    </a>
                    @endforeach
                </div>
                <div class="pagination">{{ $products->links() }}</div>
                @else
                <div class="empty-state">
                    <div class="icon">&#128230;</div>
                    <h2>No Products Found</h2>
                    <p>@isset($query) No products match "{{ $query }}". Try different keywords. @else No products available in this category yet. Check back soon! @endisset</p>
                    <a href="{{ route('shop') }}" class="btn btn-primary">View All Products</a>
                </div>
                @endif
            </div>
        </div>
    </div>
</div>
@endsection
