e-cosplay/templates/legal/cgv.twig

{% extends 'base.twig' %}

{% block title %}{{'cgv_page_title'|trans}}{% endblock %}
{% block meta_description %}{{'cgv_page_title'|trans}} {% endblock %}

{% block canonical_url %}<link rel="canonical" href="{{ url('app_cgv') }}" />
{% endblock %}

{% block breadcrumb_schema %}
    <script type="application/ld+json">
        {
          "@context": "https://schema.org",
          "@type": "BreadcrumbList",
          "itemListElement": [
            {
              "@type": "ListItem",
              "position": 1,
              "name": "{{'home_title'|trans }}",
              "item": "{{ app.request.schemeAndHttpHost }}"
            },
            {
              "@type": "ListItem",
              "position": 2,
              "name": "{{'cgv_short_title'|trans}}",
              "item": "{{ app.request.schemeAndHttpHost }}{{ app.request.pathInfo }}"
          }
        ]
      }
    </script>
{% endblock %}

{% block body %}
    <div class="max-w-4xl mx-auto py-12 px-4 sm:px-6 lg:px-8 bg-white shadow-lg rounded-lg">
        <h1 class="text-3xl font-extrabold text-gray-900 border-b-2 border-red-600 pb-4 mb-8">{{'cgv_page_title'|trans}}</h1>

        <p class="text-sm text-red-600 mb-6 italic">{{'cgv_intro_disclaimer'|trans}}</p>

        {# SECTION 1 : OBJET ET CHAMP D'APPLICATION #}
        <section class="mb-8">
            <h2 class="text-2xl font-semibold text-gray-800 mb-3">{{'cgv_section1_title'|trans}}</h2>
            <p class="text-gray-700">
                {{'cgv_section1_p1'|trans({
                    '%link%': '<a href="' ~ app.request.schemeAndHttpHost ~ '" class="text-red-600 hover:underline">e-cosplay.fr</a>'
                })|raw}}
            </p>
            <p class="text-gray-700 mt-2">{{'cgv_section1_p2'|trans}}</p>
        </section>

        <hr class="my-8 border-gray-200">

        {# SECTION 2 : IDENTIFICATION DE L'ASSOCIATION #}
        <section class="mb-8">
            <h2 class="text-2xl font-semibold text-gray-800 mb-3">{{'cgv_section2_title'|trans}}</h2>
            <p class="text-gray-700">
                {{'cgv_section2_p1'|trans({
                    '%link%': '<a href="' ~ url('app_legal') ~ '" class="text-red-600 hover:underline">' ~ 'cgv_legal_link_text'|trans ~ '</a>'
                })|raw}}
            </p>
            <ul class="list-disc list-inside ml-4 mt-2 text-gray-700 space-y-1">
                <li><strong>{{'cgv_section2_list1_label'|trans}} :</strong> E-Cosplay</li>
                <li><strong>{{'cgv_section2_list2_label'|trans}} :</strong> 42 rue de Saint-Quentin, 02800 Beautor, FRANCE</li>
                <li><strong>{{'cgv_section2_list3_label'|trans}} :</strong> <a href="mailto:contact@e-cosplay.fr" class="text-red-600 hover:underline">contact@e-cosplay.fr</a></li>
            </ul>
        </section>

        <hr class="my-8 border-gray-200">

        {# SECTION 3 : PRIX ET PRODUITS #}
        <section class="mb-8">
            <h2 class="text-2xl font-semibold text-gray-800 mb-3">{{'cgv_section3_title'|trans}}</h2>

            <h3 class="text-xl font-medium text-gray-800 mt-4">{{'cgv_section3_subtitle1'|trans}}</h3>
            <p class="text-gray-700">{{'cgv_section3_p1'|trans}}</p>

            <h3 class="text-xl font-medium text-gray-800 mt-4">{{'cgv_section3_subtitle2'|trans}}</h3>
            <p class="text-gray-700">{{'cgv_section3_p2'|trans}}</p>
        </section>

        <hr class="my-8 border-gray-200">

        {# SECTION 4 : COMMANDE ET PAIEMENT #}
        <section class="mb-8">
            <h2 class="text-2xl font-semibold text-gray-800 mb-3">{{'cgv_section4_title'|trans}}</h2>

            <h3 class="text-xl font-medium text-gray-800 mt-4">{{'cgv_section4_subtitle1'|trans}}</h3>
            <p class="text-gray-700">{{'cgv_section4_p1'|trans}}</p>

            <h3 class="text-xl font-medium text-gray-800 mt-4">{{'cgv_section4_subtitle2'|trans}}</h3>
            <p class="text-gray-700">{{'cgv_section4_p2'|trans}}</p>
        </section>

        <hr class="my-8 border-gray-200">

        {# SECTION 5 : LIVRAISON #}
        <section class="mb-8">
            <h2 class="text-2xl font-semibold text-gray-800 mb-3">{{'cgv_section5_title'|trans}}</h2>
            <p class="text-gray-700">{{'cgv_section5_p1'|trans}}</p>

            <h3 class="text-xl font-medium text-gray-800 mt-4">{{'cgv_section5_subtitle1'|trans}}</h3>
            <p class="text-gray-700">{{'cgv_section5_p2'|trans}}</p>
            <p class="text-gray-700 mt-2 font-bold">{{'cgv_section5_p3'|trans}}</p>

            <h3 class="text-xl font-medium text-gray-800 mt-4">{{'cgv_section5_subtitle2'|trans}}</h3>
            <p class="text-gray-700">{{'cgv_section5_p4'|trans}}</p>
        </section>

        <hr class="my-8 border-gray-200">

        {# SECTION 6 : DROIT DE RÉTRACTATION #}
        <section class="mb-8 bg-red-50 p-6 rounded-lg border border-red-200 p-2">
            <h2 class="text-2xl font-semibold text-red-800 mb-3"><i class="fas fa-undo mr-2"></i>{{'cgv_section6_title'|trans}}</h2>

            <h3 class="text-xl font-medium text-red-800 mt-4">{{'cgv_section6_subtitle1'|trans}}</h3>
            <p class="text-red-700">{{'cgv_section6_p1'|trans}}</p>
            <p class="text-red-700 mt-2">{{'cgv_section6_p2'|trans}}</p>

            <h3 class="text-xl font-medium text-red-800 mt-4">{{'cgv_section6_subtitle2'|trans}}</h3>
            <p class="text-red-700">{{'cgv_section6_p3'|trans}}</p>
            <ul class="list-disc list-inside ml-4 mt-2 text-red-700 space-y-1">
                <li>
                    {{'cgv_section6_list1'|trans({
                        '%personalized%': '<strong class="font-bold">' ~ 'cgv_section6_list1_personalized'|trans ~ '</strong>'
                    })|raw}}
                </li>
                <li>{{'cgv_section6_list2'|trans}}</li>
            </ul>

            <h3 class="text-xl font-medium text-red-800 mt-4">{{'cgv_section6_subtitle3'|trans}}</h3>
            <p class="text-red-700">
                {{'cgv_section6_p4'|trans({
                    '%email_link%': '<a href="mailto:contact@e-cosplay.fr" class="text-red-600 hover:underline">contact@e-cosplay.fr</a>'
                })|raw}}
            </p>
        </section>

        <hr class="my-8 border-gray-200">

        {# SECTION 7 : RESPONSABILITÉ ET GARANTIES #}
        <section class="mb-8">
            <h2 class="text-2xl font-semibold text-gray-800 mb-3">{{'cgv_section7_title'|trans}}</h2>
            <p class="text-gray-700">{{'cgv_section7_p1'|trans}}</p>
            <p class="text-gray-700 mt-2">{{'cgv_section7_p2'|trans}}</p>
        </section>

        <hr class="my-8 border-gray-200">

        {# SECTION 8 : DROIT APPLICABLE #}
        <section>
            <h2 class="text-2xl font-semibold text-gray-800 mb-3">{{'cgv_section8_title'|trans}}</h2>
            <p class="text-gray-700">{{'cgv_section8_p1'|trans}}</p>
            <p class="text-gray-700 mt-2">{{'cgv_section8_p2'|trans}}</p>
        </section>

    </div>
{% endblock %}