{% set contact = this.getContact() %}

<section {{ attributes.defaults({ class: 'legal-page' }) }}>
    <div class="mx-4 lg:mx-8 large:mx-auto max-w-large pb-20 pt-16 sm:pb-28 sm:pt-20">
        <article class="mx-auto max-w-4xl space-y-6">
            {% if contact %}
                <header class="text-center">
                    <h1 class="flex flex-col items-center font-serif text-3xl uppercase tracking-label text-foreground sm:text-4xl lg:text-5xl after:mt-5 after:h-0.5 after:w-14 after:bg-accent">
                        {{ this.titleKey|trans|raw }}
                    </h1>
                    <p class="mt-5 text-sm leading-7 text-foreground/70 sm:text-base">
                        {{ this.introKey|trans|raw }}
                    </p>
                </header>

                {% if this.legal %}
                    {% set legalNoticeContent = this.legalNoticeContent %}
                    {% if legalNoticeContent|trim is not empty %}
                        <section class="border border-accent/20 bg-surface p-6 shadow-card sm:p-8">
                            <div class="prose prose-sm max-w-none prose-headings:font-serif prose-headings:uppercase prose-headings:tracking-card-title prose-headings:text-foreground prose-p:text-foreground/80 prose-li:text-foreground/80 prose-strong:text-foreground prose-a:text-accent">
                                {{ legalNoticeContent|raw }}
                            </div>
                        </section>
                    {% else %}
                        <section class="border border-accent/20 bg-surface p-6 shadow-card sm:p-8">
                            <p class="text-sm leading-7 text-foreground/80">{{ 'legal_pages.legal.empty'|trans }}</p>
                        </section>
                    {% endif %}

                    {% include '@components/legal/_agec.html.twig' with { contact: contact } only %}

                    <section class="border border-accent/20 bg-surface p-6 shadow-card sm:p-8">
                        <h2 class="font-serif text-2xl uppercase tracking-card-title text-foreground">{{ 'legal_pages.links.title'|trans }}</h2>
                        <div class="mt-6 flex flex-col items-start gap-3 text-sm leading-7">
                            <a href="{{ path('private-policy') }}" title="{{ 'legal.button'|trans }}" class="text-accent underline underline-offset-4 transition hover:opacity-80">
                                {{ 'legal.sections.personal_data.link'|trans }}
                            </a>
                            <a href="{{ path('cgv') }}" title="{{ 'cgv.button'|trans }}" class="text-accent underline underline-offset-4 transition hover:opacity-80">
                                {{ 'legal_pages.links.cgv'|trans }}
                            </a>
                        </div>
                    </section>

                    {% if contact.legalNoticeExtraParagraph|trim is not empty %}
                        <section class="border border-accent/20 bg-surface p-6 shadow-card sm:p-8">
                            <p class="text-sm leading-7 text-foreground/80">{{ contact.legalNoticeExtraParagraph|nl2br }}</p>
                        </section>
                    {% endif %}
                {% elseif this.cgv %}
                    {% set cgvContent = this.cgvContent %}
                    <section class="border border-accent/20 bg-surface p-6 shadow-card sm:p-8">
                        <div class="prose prose-sm max-w-none prose-headings:font-serif prose-headings:uppercase prose-headings:tracking-card-title prose-headings:text-foreground prose-p:text-foreground/80 prose-li:text-foreground/80 prose-strong:text-foreground prose-a:text-accent">
                            {% if cgvContent %}
                                {{ cgvContent|raw }}
                            {% else %}
                                <p>{{ 'legal_pages.cgv.empty'|trans }}</p>
                            {% endif %}
                        </div>
                    </section>

                    {% include '@components/legal/_agec.html.twig' with { contact: contact } only %}
                {% elseif this.privacyPolicy %}
                    {% set privacyPolicyContent = this.privacyPolicyContent %}
                    {% if privacyPolicyContent|trim is not empty %}
                        <section class="border border-accent/20 bg-surface p-6 shadow-card sm:p-8">
                            <div class="prose prose-sm max-w-none prose-headings:font-serif prose-headings:uppercase prose-headings:tracking-card-title prose-headings:text-foreground prose-p:text-foreground/80 prose-li:text-foreground/80 prose-strong:text-foreground prose-a:text-accent">
                                {{ privacyPolicyContent|raw }}
                            </div>
                        </section>
                    {% else %}
                        <section class="border border-accent/20 bg-surface p-6 shadow-card sm:p-8">
                            <p class="text-sm leading-7 text-foreground/80">{{ 'legal_pages.privacy_policy.empty'|trans }}</p>
                        </section>
                    {% endif %}

                    {% if contact.privacyPolicyExtraParagraph|trim is not empty %}
                        <section class="border border-accent/20 bg-surface p-6 shadow-card sm:p-8">
                            <p class="text-sm leading-7 text-foreground/80">{{ contact.privacyPolicyExtraParagraph|nl2br }}</p>
                        </section>
                    {% endif %}
                {% endif %}
            {% else %}
                <p class="text-center text-foreground/70">{{ 'legal_pages.missing_contact'|trans }}</p>
            {% endif %}
        </article>
    </div>
</section>
