@php
    $isRtl = app()->getLocale() === 'ar';

    $catalogActiveQuery = collect(request()->except(['page']))
        ->filter(static function ($v) {
            if (is_array($v)) {
                return count(array_filter($v, static function ($x) {
                    return $x !== '' && $x !== null;
                })) > 0;
            }

            return $v !== '' && $v !== null;
        })
        ->isNotEmpty();
@endphp

<div class="imt-catalog-filters imt-catalog-filters--simple">

    @includeWhen(! empty($isRewardProducts), 'web.default.products.includes.catalog_reward_hint')

    <div class="imt-catalog-filters__shell"
         role="search"
         aria-label="{{ trans('catalog.simple_filters_bar_aria') }}">

        <div class="imt-catalog-filters__searchtrack">
            <span class="imt-catalog-filters__search-icon" aria-hidden="true">
                <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2">
                    <circle cx="11" cy="11" r="7"/>
                    <path d="m20 20-3.2-3.2"/>
                </svg>
            </span>
            <label class="sr-only" for="imt-shop-q">{{ trans('catalog.hero_search_placeholder') }}</label>
            <input id="imt-shop-q"
                   type="search"
                   name="q"
                   value="{{ request()->get('q', request()->get('search')) }}"
                   class="imt-catalog-filters__q"
                   placeholder="{{ trans('catalog.hero_search_placeholder') }}"
                   autocomplete="off"
                   inputmode="search"
                   enterkeyhint="search"
                   @if($isRtl) dir="rtl"@endif />
            <button type="submit"
                    class="imt-catalog-filters__go"
                    aria-label="{{ trans('catalog.filters_search_submit') }}">
                <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" aria-hidden="true">
                    <circle cx="11" cy="11" r="7"/>
                    <path d="m20 20-3.2-3.2"/>
                </svg>
            </button>
        </div>

        <div class="imt-catalog-filters__rail" role="group" aria-label="{{ trans('catalog.filters_rail_aria') }}">
            <div class="imt-catalog-filters__ctrl imt-catalog-filters__ctrl--with-icon">
                <span class="imt-catalog-filters__mini-ico" aria-hidden="true">
                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                        <path d="M4 6h16M4 12h10M4 18h16"/>
                    </svg>
                </span>
                <label class="sr-only" for="imt-shop-category">{{ trans('categories.categories') }}</label>
                <select id="imt-shop-category"
                        name="category_id"
                        class="imt-catalog-filters__select imt-catalog-filters__select--in-rail"
                        autocomplete="off"
                        onchange="this.form.submit()">
                    <option value="" @if(! request()->filled('category_id')) selected @endif>{{ trans('public.all') }}</option>
                    @foreach(($productCategories ?? []) as $pc)
                        @if(! empty($pc->subCategories) && count($pc->subCategories))
                            @foreach($pc->subCategories as $sub)
                                <option value="{{ $sub->id }}" @if(request()->get('category_id') == $sub->id) selected @endif>
                                    {{ $pc->title }} — {{ $sub->title }}
                                </option>
                            @endforeach
                        @elseif(! empty($pc->id))
                            <option value="{{ $pc->id }}" @if(request()->get('category_id') == $pc->id) selected @endif>{{ $pc->title }}</option>
                        @endif
                    @endforeach
                </select>
            </div>

            <div class="imt-catalog-filters__ctrl imt-catalog-filters__ctrl--with-icon">
                <span class="imt-catalog-filters__mini-ico" aria-hidden="true">
                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                        <path d="M3 6h18M7 12h10M5 18h14"/>
                    </svg>
                </span>
                <label class="sr-only" for="imt-shop-sort">{{ trans('update.catalog_sort_heading') }}</label>
                <select id="imt-shop-sort"
                        name="sort"
                        class="imt-catalog-filters__select imt-catalog-filters__select--in-rail"
                        autocomplete="off"
                        onchange="this.form.submit()">
                    <option value="">{{ trans('public.all') }}</option>
                    <option value="newest" {{ request()->get('sort') == 'newest' ? 'selected' : '' }}>{{ trans('public.newest') }}</option>
                    <option value="expensive" {{ request()->get('sort') == 'expensive' ? 'selected' : '' }}>{{ trans('public.expensive') }}</option>
                    <option value="inexpensive" {{ request()->get('sort') == 'inexpensive' ? 'selected' : '' }}>{{ trans('public.inexpensive') }}</option>
                    <option value="bestsellers" {{ request()->get('sort') == 'bestsellers' ? 'selected' : '' }}>{{ trans('public.bestsellers') }}</option>
                    <option value="best_rates" {{ request()->get('sort') == 'best_rates' ? 'selected' : '' }}>{{ trans('public.best_rates') }}</option>
                </select>
            </div>
        </div>

        @if($catalogActiveQuery)
            <a href="{{ url()->current() }}" class="imt-catalog-filters__clear">{{ trans('catalog.filters_clear') }}</a>
        @endif
    </div>

    @if(! empty($authUser) && ($authUser->isOrganization() || $authUser->isTeacher()))
        <a href="/panel/store/products/new" class="btn btn-outline-primary btn-sm btn-block mt-12">
            {{ trans('update.add_new_product') }}
        </a>
    @endif
</div>
