{# Affichage des anciens/prochains évènements #}
<div class="oka-flex -vrt">
    {% set prev = null %}
    {% set next = null %}
    
    {# Identifier les rencontres passées et futures #}
    {% for rencontre in rencontres %}
        {% if rencontre.date < seance.date %}
            {% set prev = rencontre %}
        {% else %}
            {% set next = rencontre %}
        {% endif %}
    {% endfor %}

    {# Affichage pour une rencontre passée #}
    {% if prev is not null %}
        <label class="oka-label-sm" style="border-radius: 3px; background-color: var(--oka-color-warning-bg-medium); color: var(--oka-color-warning-fg-on-medium); width: 100%; padding: 0.75rem;">
            J+{{ prev.nbDays }} après : 
            {% if prev.stade == "Extérieur" %}
                {{ prev.adversaire }} / {{ seance.saison.club.nom }}
            {% else %}
                {{ seance.saison.club.nom }} / {{ prev.adversaire }}
            {% endif %}
        </label>
    {% endif %}

    <div class="oka-data -sm -crop" style="margin-top: 0.5rem;">
        <div>   
            Sem W : {{ weeksSinceStart }} / Sem Cal. : {{ weekNumber }}
        </div>
    </div>

    {# Affichage pour une rencontre future #}
    {% if next is not null %}
        <label class="oka-label-sm" style="border-radius: 3px; background-color: var(--oka-color-info-bg-medium); color: var(--oka-color-info-fg-on-medium); width: 100%; padding: 0.75rem;">
            {# Vérification si la rencontre est le même jour que la séance #}
            {% if next.date == seance.date %}
                J-{{ next.nbDays }} avant :
            {% else %}
                J-{{ next.nbDays + 1 }} avant :
            {% endif %}
            {% if next.stade == "Extérieur" %}
                {{ next.adversaire }} / {{ seance.saison.club.nom }}
            {% else %}
                {{ seance.saison.club.nom }} / {{ next.adversaire }}
            {% endif %}
        </label>
    {% endif %}
</div>



<div class="oka-spacer -md"></div>

<div class="tgo-seance__gardiens">

        <div class="oka-h -xs">Gardiens : {{ seance.gardiens|length }}</div>

        {% for gardien in seance.gardiens %}
        
        <div class="tgo-joueur">
                <div class="tgo-joueur_portrait " style="background-image: url({{ asset('visuels/gardien/photo/' ~ gardien.photo) }});">
                
                </div>
                <div class="oka-data -md -strong">
                {{ gardien.prenom }} {{ gardien.nom }}
                </div>
        </div>
        {% endfor %}
</div>
<div class="oka-spacer"></div>

<div class="tgo-exo_commentaires" style="position: relative;">
        <label class="oka-label">Commentaires du coach</label>
        <textarea 
                name="commentaire" 
                data-idseance="{{seance.id}}" 
                data-valuecommentaire="{{ seance.commentaire}}" 
                id="textareaCommentaire" 
                data-controller="planning--showSeance"
                data-action="input->planning--showSeance#editCommentaire"
                style="max-width: 100%;"
        >{{ seance.commentaire }}</textarea>

        <button type="submit" id="submitCommentBtn" class="oka-bt -outlined tgo-seance__btnSave" style="display: none;" data-valueurl="{{ url }}">
                <span class="oka-bt__lbl">Enregistrer</span>
        </button>
</div>

<div class="oka-spacer"></div>

{# <div class="oka-tabs -accordion">
        <!-- tab head -->
    <input type="radio" class="oka-pilot noVerifForm" name="tabsaccordion" id="displayTabaccordion0" checked="checked" >
    <label id="tabaccordion0"   class="oka-tab__button" onclick="if(document.getElementById('displayTabaccordion0').checked == true ) {  document.getElementById('displayTabaccordion0').checked = false  }else{ document.getElementById('displayTabaccordion0').checked = true }">
        <div class="oka-tab__head">
            <div class="oka-tab__lbl">Matériel</div>
            <div class="oka-tab__indic"></div>
        </div>
    </label>
    <!-- tab body -->
    <div class="oka-tab__body">
        <div class="oka-spacer"></div>
        {% include ('seance/_fragments/tab-materiels.html.twig') %}
    </div>
</div> #}