{% extends 'base.html.twig' %}

{% set seo_title = 'Plan du site — Jardin de Bohème' %}
{% set seo_description = 'Toutes les pages du site : familles de plantes, sélections, prestations de paysagiste, conseils de culture et pages de la pépinière.' %}

{% block body %}
    <div class="mx-auto max-w-7xl px-4 py-16 sm:px-6 lg:px-8">
        <p class="eyebrow">Plan du site</p>
        <h1 class="mt-4 font-serif text-[2.4rem] leading-tight text-ink">Toutes nos pages</h1>

        <div class="mt-12 grid gap-12 md:grid-cols-2 lg:grid-cols-3">
            <section>
                <h2 class="font-serif text-xl text-ink">Les plantes</h2>
                <ul class="mt-4 space-y-2 font-sans text-[0.9rem]">
                    <li><a href="{{ path('plant_index') }}" class="text-brand-ink hover:underline underline-offset-4">Le catalogue</a></li>
                    {% for category in categories %}
                        <li>
                            <a href="{{ path('category_show', { slug: category.slug }) }}" class="text-body hover:text-brand-ink">{{ category.name }}</a>
                            {% set children = category.children|filter(c => c.published) %}
                            {% if children|length %}
                                <ul class="mt-1 space-y-1 pl-4">
                                    {% for child in children %}
                                        <li><a href="{{ path('category_show', { slug: child.slug }) }}" class="text-muted hover:text-brand-ink">{{ child.name }}</a></li>
                                    {% endfor %}
                                </ul>
                            {% endif %}
                        </li>
                    {% endfor %}
                </ul>
            </section>

            <section>
                <h2 class="font-serif text-xl text-ink">Les sélections</h2>
                <ul class="mt-4 space-y-2 font-sans text-[0.9rem]">
                    {% for trait in traits %}
                        <li><a href="{{ path('trait_show', { slug: trait.slug }) }}" class="text-body hover:text-brand-ink">{{ trait.name }}</a></li>
                    {% endfor %}
                </ul>
            </section>

            <section>
                <h2 class="font-serif text-xl text-ink">Le paysagiste</h2>
                <ul class="mt-4 space-y-2 font-sans text-[0.9rem]">
                    <li><a href="{{ path('service_index') }}" class="text-brand-ink hover:underline underline-offset-4">Nos prestations</a></li>
                    {% for service in services %}
                        <li><a href="{{ path('service_show', { slug: service.slug }) }}" class="text-body hover:text-brand-ink">{{ service.name }}</a></li>
                    {% endfor %}
                </ul>
            </section>

            <section>
                <h2 class="font-serif text-xl text-ink">Les conseils</h2>
                <ul class="mt-4 space-y-2 font-sans text-[0.9rem]">
                    {% for article in advice %}
                        <li><a href="{{ path('advice_show', { slug: article.slug }) }}" class="text-body hover:text-brand-ink">{{ article.name }}</a></li>
                    {% endfor %}
                </ul>
            </section>

            <section>
                <h2 class="font-serif text-xl text-ink">Les actualités</h2>
                <ul class="mt-4 space-y-2 font-sans text-[0.9rem]">
                    {% for article in news %}
                        <li><a href="{{ path('news_show', { slug: article.slug }) }}" class="text-body hover:text-brand-ink">{{ article.name }}</a></li>
                    {% endfor %}
                </ul>
            </section>

            <section>
                <h2 class="font-serif text-xl text-ink">La pépinière</h2>
                <ul class="mt-4 space-y-2 font-sans text-[0.9rem]">
                    <li><a href="{{ path('nursery_index') }}" class="text-brand-ink hover:underline underline-offset-4">Qui nous sommes</a></li>
                    {% for page in pages %}
                        <li><a href="{{ path('page_show', { slug: page.slug }) }}" class="text-body hover:text-brand-ink">{{ page.name }}</a></li>
                    {% endfor %}
                    <li><a href="{{ path('contact') }}" class="text-body hover:text-brand-ink">Contact</a></li>
                </ul>
            </section>
        </div>
    </div>
{% endblock %}