{# @param precomp_checklist array #}
{% set account = precomp_checklist.account %}
{% set buteur = precomp_checklist.buteur %}
{% set favorite = precomp_checklist.favorite %}
{% set notifications = precomp_checklist.notifications %}
{% if not precomp_checklist.all_done or not cotisation_payee %}
<section class="precomp-dashboard" aria-labelledby="precomp-dashboard-title">
    <header class="precomp-dashboard__header">
        <h2 id="precomp-dashboard-title" class="precomp-dashboard__title">Avant la compétition</h2>
        <p class="precomp-dashboard__intro">Préparez votre compte, votre équipe et vos choix de jeu avant le coup d’envoi.</p>
    </header>

    <div class="precomp-dashboard__grid">
        {% if not cotisation_payee %}
            {% include 'home/_dashboard_cotisation_block.html.twig' %}
        {% endif %}

        {% if not precomp_checklist.all_done %}
        {% if not account.done %}
        <article class="precomp-card ta-card precomp-card--pending">
            {% include 'home/_precomp_card_status_mark.html.twig' with { done: false } only %}
            <div class="precomp-card__head">
                <h3 class="precomp-card__title">Finaliser son compte et son équipe</h3>
                <p class="precomp-card__desc">Avatar, inviter son partenaire, slogan et image d’équipe.</p>
            </div>
            <ul class="precomp-checklist">
                {% for check in account.checks %}
                    <li class="precomp-checklist__item {{ check.done ? 'precomp-checklist__item--done' : '' }}">
                        {{ check.label }}
                    </li>
                {% endfor %}
            </ul>
            <a href="{{ path('app_account') }}#{{ account.hash }}" class="btn btn-primary btn-sm precomp-card__cta">Compléter mon équipe</a>
        </article>
        {% endif %}

        {% if not buteur.done %}
        <article class="precomp-card ta-card precomp-card--pending">
            {% include 'home/_precomp_card_status_mark.html.twig' with { done: false } only %}
            <div class="precomp-card__head">
                <h3 class="precomp-card__title">Choisir son buteur</h3>
                <p class="precomp-card__desc">Sélectionnez le buteur qui comptera pour votre score.</p>
            </div>
            {% if buteur.blocked_by_cotisation %}
                <p class="precomp-card__hint">Réglez votre cotisation pour pouvoir enregistrer un buteur.</p>
            {% endif %}
            <a href="{{ path('app_account') }}#{{ buteur.hash }}" class="btn btn-primary btn-sm precomp-card__cta">Choisir mon buteur</a>
        </article>
        {% endif %}

        {% if not favorite.done %}
        <article class="precomp-card ta-card precomp-card--pending">
            {% include 'home/_precomp_card_status_mark.html.twig' with { done: false } only %}
            <div class="precomp-card__head">
                <h3 class="precomp-card__title">Choisir son équipe favorite</h3>
                <p class="precomp-card__desc">Joker « équipe favorite » : protège votre équipe sur les matchs de ce pays.</p>
            </div>
            <a href="{{ path('app_account') }}#{{ favorite.hash }}" class="btn btn-primary btn-sm precomp-card__cta">
                {{ favorite.available ? 'Choisir mon équipe favorite' : 'Configurer mon équipe' }}
            </a>
        </article>
        {% endif %}

        {% if not notifications.done %}
        <article class="precomp-card ta-card precomp-card--pending">
            {% include 'home/_precomp_card_status_mark.html.twig' with { done: false } only %}
            <div class="precomp-card__head">
                <h3 class="precomp-card__title">Configurer les notifications</h3>
                <p class="precomp-card__desc">
                    Relances pronostic, but de votre buteur, mentions forum et messages organisateur :
                    choisissez ce que vous recevez par e-mail et par push.
                </p>
            </div>
            <p class="precomp-card__hint">
                Choisissez vos e-mails et, si vous le souhaitez, activez aussi les push sur votre téléphone ou ordinateur.
            </p>
            <a href="{{ path('app_account') }}#{{ notifications.hash }}" class="btn btn-primary btn-sm precomp-card__cta">
                Gérer mes notifications
            </a>
        </article>
        {% endif %}
        {% endif %}
    </div>
</section>
{% endif %}