@extends('layouts.app')
@php use App\Support\Taxonomy; use App\Support\Content; @endphp

@section('content')

<div class="container">@include('partials.breadcrumb', ['current' => 'Toutes les catégories'])</div>

<section class="section" style="padding-top:0">
    <div class="container">
        <div class="section-head">
            <div>
                <span class="eyebrow"><x-icon name="grid" size="14"/> Arborescence complète</span>
                <h1 style="margin-top:10px">Toutes les catégories CityMag</h1>
                <p>{{ number_format(Taxonomy::count(), 0, ',', ' ') }} entrées réparties en 4 rubriques, {{ count(Taxonomy::tree()) }} univers, catégories et sous-catégories.</p>
            </div>
            <div class="input-icon" style="min-width:280px">
                <x-icon name="search"/>
                <input class="input" type="search" data-filtre-categories autocomplete="off"
                       placeholder="Filtrer une catégorie…">
            </div>
        </div>

        <p class="muted small" data-categories-vide hidden>
            Aucune catégorie ne correspond à votre recherche.
        </p>

        @foreach(Taxonomy::rubriques() as $key => $r)
            <div class="panel" data-cat-panel style="margin-bottom:22px">
                <div class="panel-head">
                    <div class="row-center" style="gap:12px">
                        <span class="tile-icon"><x-icon :name="$r['icon']"/></span>
                        <div>
                            <h2 style="font-size:1.2rem">{{ $r['label'] }}</h2>
                            <span class="small muted">{{ $r['baseline'] }}</span>
                        </div>
                    </div>
                    <a href="{{ url('/'.$key) }}" class="btn btn-soft btn-sm">Parcourir <x-icon name="arrow-right"/></a>
                </div>

                <div class="grid grid-3" style="gap:22px">
                    @foreach(Taxonomy::tree($key) as $u)
                        <div data-cat-groupe="{{ $u['name'] }}">
                            <a href="{{ $u['url'] }}" class="row-center" style="gap:8px;font-weight:700;color:var(--ink-900);margin-bottom:6px">
                                <x-icon :name="$u['icon']" size="16" style="color:var(--orange-600)"/> {{ $u['name'] }}
                            </a>
                            @if($u['children'])
                                <div class="cat-tree">
                                    @foreach($u['children'] as $c)
                                        <a href="{{ $c['url'] }}" data-cat-feuille="{{ $c['name'] }}">
                                            <span>{{ $c['name'] }}</span>
                                            <span class="n">{{ number_format(Content::countFor($c), 0, ',', ' ') }}</span>
                                        </a>
                                    @endforeach
                                </div>
                            @endif
                        </div>
                    @endforeach
                </div>
            </div>
        @endforeach
    </div>
</section>

@endsection