@section('page_slug', 'category')
@section('page_title', $category->name)
@extends('layout')
@section('content')
    <div class="container mx-auto pt-20 mb-4">
        <div class="max-w-full mx-0 mb-10 mt-5">
            <a href="{{route('home')}}">Accueil</a> >
            @foreach($category->ancestors as $parentCategory)
                <a href="{{route('categoryOrProduct',['url' => $parentCategory->url ] )}}">{{$parentCategory->name}}</a> >
            @endforeach <a href="{{route('categoryOrProduct',['url' => $category->url ] )}}">{{$category->name}}</a>

        </div>
        <h1 class="w-full px-4 md:px-6 text-fcgrey text-4xl font-bold mb-5 text-center">
            {{$category->name}}
        </h1>
        <div class="row gx-5">
            @foreach($category->childrenWithProducts as $subCategory)
                <a class="col-12 md:col-4 lg:col-3 mb-1 mb-5 flex" href="{{route('categoryOrProduct', ['url'=> $subCategory->url])}}">
                    @if($subCategory->file)
                    <span class="text-center w-full inline-flex text-4xl shadow-md items-center justify-center" style="word-wrap: anywhere;">
                            <img class=" w-full" src="{{$subCategory->file->url}}" alt="{{$subCategory->name}}"/>
                    </span>
                        @else
                            <span class="text-center w-full min-h-32 inline-flex text-4xl shadow-md items-center text-fcgrey font-bold justify-center p-5 bg-white" style="word-wrap: anywhere;">
                            {{$subCategory->name}}
                            </span>
                    @endif
                </a>
            @endforeach
        </div>
        @if(!empty($filters))
        <form class="filter row" method="get">

            @if(!empty($filters['criterionsWithOffer']['size']))
            <div class="col-12 md:col-3 lg:col-3 mb-5">
                {{Form::select('filters[criterionsWithOffer][size]', $filters['criterionsWithOffer']['size'], Arr::get($selectedFilters, 'criterionsWithOffer.size'), ['class'=> 'w-full p-2', 'placeholder'=>__('randoloc.product.attribute.size')])}}
            </div>
            @endif
            @if(!empty($filters['criterions']['size']))
            <div class="col-12 md:col-3 lg:col-3 mb-5">
                {{Form::select('filters[criterions][size]', $filters['criterions']['size'], Arr::get($selectedFilters, 'criterions.size'), ['class'=> 'w-full p-2', 'placeholder'=>__('randoloc.product.attribute.size')])}}
            </div>
            @endif

            @if(!empty($filters['attributes']['color']))
            <div class="col-12 md:col-3 lg:col-3 mb-5">
                {{Form::select('filters[attributes][color]', $filters['attributes']['color'], Arr::get($selectedFilters, 'attributes.color'), ['class'=> 'w-full p-2','placeholder'=> __('randoloc.product.attribute.color')])}}
            </div>
            @endif

            @if(!empty($filters['attributes']['model']))
                <div class="col-12 md:col-3 lg:col-3 mb-5">
                    {{Form::select('filters[attributes][model]', $filters['attributes']['model'], Arr::get($selectedFilters, 'attributes.model'), ['class'=> 'w-full p-2','placeholder'=> __('randoloc.product.attribute.model')])}}
                </div>
            @endif
            <div class="col-12 md:col-3">
                <button class="btn btn--fc">Filtrer</button>
            </div>
        </form>
        @endif

        @if(!empty($products))
            @if($products->count() > 0)
             <div>
                @include('shop.product-list', ['products' => $products,'listAlign' => 'text-left'])
            </div>
            @else
                <div class="text-4xl text-fcgrey-dark mt-10 text-center mb-40">Aucun produit ne correspond à votre recherche</div>
            @endif
        @endif
    </div>
@endsection