@extends('layouts.public')

@section('content')
<main class="inner-page">
    <section class="inner-hero compact-hero">
        <div>
            <span class="section-badge">Products</span>
            <h1>Quote-ready products for education, medical training and labs.</h1>
            <p>Browse structured demo products across educational charts, maps, GIS solutions, nursing models and laboratory equipment.</p>
        </div>
    </section>

    <section class="inner-section catalog-browser">
        <div class="product-domain-switcher">
            @foreach($categories as $parent)
                <a @class(['active' => $parentSlug === $parent->slug]) href="{{ route('products', array_filter(['parent' => $parent->slug, 'sort' => $sort !== 'name' ? $sort : null])) }}">
                    <span>{{ str_pad((string) $loop->iteration, 2, '0', STR_PAD_LEFT) }}</span>
                    <strong>{{ $parent->name }}</strong>
                    <small>{{ $parent->description }}</small>
                </a>
            @endforeach
        </div>

        @php
            $advancedOpen = $type !== '' || $sort !== 'name' || $featured;
            $typeOptions = ['type1' => 'E-commerce', 'type2' => 'Inquiry', 'type3' => 'Catalog Grid'];
            $sortOptions = ['name' => 'Name', 'latest' => 'Latest updated', 'price-low' => 'Price low to high', 'price-high' => 'Price high to low'];
        @endphp

        <form @class(['advanced-product-filter', 'is-advanced-open' => $advancedOpen]) method="get" data-public-product-filter>
            <div class="filter-main-row">
                <label>
                    Search
                    <input name="q" value="{{ $q }}" placeholder="Search products">
                </label>

                <label>
                    Parent Category
                    <select name="parent" data-public-parent-select>
                        <option value="">All parent categories</option>
                        @foreach($categories as $parent)
                            <option value="{{ $parent->slug }}" @selected($parentSlug === $parent->slug)>{{ $parent->name }}</option>
                        @endforeach
                    </select>
                </label>

                <label>
                    Child Category
                    <select name="category" data-public-child-select>
                        <option value="">All child categories</option>
                        @foreach($allCategories->whereNotNull('parent_id') as $category)
                            <option value="{{ $category->slug }}" @selected($categorySlug === $category->slug) data-parent="{{ optional($category->parent)->slug }}" data-name="{{ \Illuminate\Support\Str::lower($category->name) }}">
                                {{ optional($category->parent)->name }} / {{ $category->name }}
                            </option>
                        @endforeach
                    </select>
                </label>

                <div class="filter-actions">
                    <button class="button primary" type="submit">Apply</button>
                    <button class="button secondary" type="button" data-advanced-filter-toggle aria-expanded="{{ $advancedOpen ? 'true' : 'false' }}">Advanced Filters</button>
                    <a class="button secondary" href="{{ route('products') }}">Reset</a>
                </div>
            </div>

            <div class="filter-advanced-row" data-advanced-filter-panel>
                <label>
                    Product Type
                    <select name="type">
                        <option value="">All layouts</option>
                        @foreach($typeOptions as $value => $label)
                            <option value="{{ $value }}" @selected($type === $value)>{{ $label }}</option>
                        @endforeach
                    </select>
                </label>

                <label>
                    Sort
                    <select name="sort">
                        @foreach($sortOptions as $value => $label)
                            <option value="{{ $value }}" @selected($sort === $value)>{{ $label }}</option>
                        @endforeach
                    </select>
                </label>

                <label class="filter-check">
                    <input type="checkbox" name="featured" value="1" @checked($featured)>
                    Featured only
                </label>
            </div>
        </form>

        <div class="catalog-summary">
            <strong>{{ $products->total() }}</strong>
            <span>{{ \Illuminate\Support\Str::plural('product', $products->total()) }} found</span>
        </div>

        <div class="product-grid refined-product-grid">
            @forelse($products as $product)
                @include('partials.product-card', ['product' => $product])
            @empty
                <article class="info-card">
                    <h2>No products found</h2>
                    <p>Try removing a filter or searching a broader term.</p>
                </article>
            @endforelse
        </div>

        @if($products->hasPages())
            @php
                $currentPage = $products->currentPage();
                $lastPage = $products->lastPage();
                $pageNumbers = [];
                foreach ([1, 2, 3, $currentPage - 1, $currentPage, $currentPage + 1, $lastPage - 1, $lastPage] as $pageCandidate) {
                    if ($pageCandidate >= 1 && $pageCandidate <= $lastPage && ! in_array($pageCandidate, $pageNumbers, true)) {
                        $pageNumbers[] = $pageCandidate;
                    }
                }
                sort($pageNumbers);
                $previousPage = 0;
            @endphp

            <nav class="catalog-pagination" aria-label="Product pagination">
                @if($products->onFirstPage())
                    <span class="page-control disabled">Previous</span>
                @else
                    <a class="page-control" href="{{ $products->previousPageUrl() }}">Previous</a>
                @endif

                <div class="page-numbers">
                    @foreach($pageNumbers as $page)
                        @if($previousPage && $page > $previousPage + 1)
                            <span class="page-ellipsis">...</span>
                        @endif

                        @if($page === $currentPage)
                            <span class="active">{{ $page }}</span>
                        @else
                            <a href="{{ $products->url($page) }}">{{ $page }}</a>
                        @endif

                        @php
                            $previousPage = $page;
                        @endphp
                    @endforeach
                </div>

                @if($products->hasMorePages())
                    <a class="page-control" href="{{ $products->nextPageUrl() }}">Next</a>
                @else
                    <span class="page-control disabled">Next</span>
                @endif
            </nav>
        @endif
    </section>
</main>
@endsection