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

{% block title %}Calendrier & Classement - Arras 6{% endblock %}

{% block body %}
<div class="container py-5">
    
    {# --- EN-TÊTE --- #}
    <div class="text-center mb-5">
        <span class="badge bg-info text-dark mb-3 px-3 py-2 rounded-pill fs-6 fw-bold shadow-sm">Saison 2025-2026</span>
        <h1 class="fw-bold text-arras display-5">
            <i class="fas fa-calendar-alt me-2"></i> Calendrier & Classement
        </h1>
        <p class="text-muted fs-5">Suivez l'évolution de la poule et les prochains rendez-vous d'Arras 6.</p>
    </div>

    <div class="row g-4">
        {# --- COLONNE GAUCHE : CLASSEMENT --- #}
        <div class="col-lg-5">
            <div class="card card-premium border-0 overflow-hidden h-100">
                <div class="bca-bg-dark text-white fw-bold py-4 px-4 border-bottom border-4 border-info d-flex align-items-center">
                    <i class="fas fa-trophy text-warning fs-4 me-3"></i> 
                    <h5 class="mb-0 fw-bold">Classement de la Poule</h5>
                </div>
                
                <div class="card-body p-0">
                    <div class="table-responsive">
                        <table class="table table-hover align-middle mb-0 border-0">
                            <thead class="table-light small text-muted text-uppercase" style="font-size: 0.8rem;">
                                <tr>
                                    <th class="ps-4 py-3 border-0">#</th>
                                    <th class="py-3 border-0">Équipe</th>
                                    <th class="text-center pe-4 py-3 border-0">Points</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for classement in classements %}
                                    {# On met la ligne en surbrillance Premium si c'est Arras #}
                                    {% set isArras = ('arras' in classement.equipe|lower) %}
                                    
                                    <tr class="border-bottom {{ isArras ? 'bg-light' : '' }}">
                                        
                                        {# Cellule Position avec la petite barre bleue si c'est Arras #}
                                        <td class="ps-4 fw-bold text-muted" style="{{ isArras ? 'border-left: 4px solid #0dcaf0;' : '' }}">
                                            {{ loop.index }}
                                        </td>
                                        
                                        <td class="{{ isArras ? 'fw-bold text-arras fs-6' : 'text-dark' }}">
                                            {{ classement.equipe }}
                                        </td>
                                        
                                        <td class="text-center pe-4 fw-bold fs-6 {{ isArras ? 'text-arras' : 'text-muted' }}">
                                            {{ classement.points }}
                                        </td>
                                    </tr>
                                {% else %}
                                    <tr>
                                        <td colspan="3" class="text-center text-muted py-5">
                                            <i class="fas fa-ghost fs-3 mb-2"></i><br>
                                            Classement non disponible
                                        </td>
                                    </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        {# --- COLONNE DROITE : CALENDRIER --- #}
        <div class="col-lg-7">
            <div class="card card-premium border-0 overflow-hidden h-100">
                <div class="bca-bg-dark text-white fw-bold py-4 px-4 border-bottom border-4 border-info d-flex align-items-center">
                    <i class="fas fa-list-ul text-info fs-4 me-3"></i> 
                    <h5 class="mb-0 fw-bold">Calendrier des rencontres</h5>
                </div>
                
                <div class="card-body p-0">
                    <div class="table-responsive">
                        <table class="table table-hover align-middle mb-0 text-center border-0">
                            <thead class="table-light small text-muted text-uppercase" style="font-size: 0.8rem;">
                                <tr>
                                    <th class="ps-4 text-start py-3 border-0">Journée</th>
                                    <th class="py-3 border-0">Date</th>
                                    <th class="py-3 border-0 text-end">Arras</th>
                                    <th class="py-3 border-0 text-center">-</th>
                                    <th class="py-3 border-0 text-start">Adv.</th>
                                    <th class="pe-4 py-3 border-0"></th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for rencontre in rencontres %}
                                    
                                    {# --- CALCUL AUTOMATIQUE DES SCORES --- #}
                                    {% set scoreArras = 0 %}
                                    {% set scoreAdversaire = 0 %}
                                    {% set hasDetails = rencontre.matchDetails|length > 0 %}

                                    {% if hasDetails %}
                                        {% for match in rencontre.matchDetails %}
                                            {% if match.resultat|lower == 'victoire' %}
                                                {% set scoreArras = scoreArras + 1 %}
                                            {% elseif match.resultat|lower == 'défaite' %}
                                                {% set scoreAdversaire = scoreAdversaire + 1 %}
                                            {% endif %}
                                        {% endfor %}
                                    {% endif %}

                                    <tr class="border-bottom">
                                        {# Journée #}
                                        <td class="ps-4 text-start">
                                            <span class="badge bg-light text-muted border px-2 py-1">J{{ rencontre.journee }}</span>
                                        </td>
                                        
                                        {# Date #}
                                        <td class="text-muted fw-semibold small">
                                            {{ rencontre.dateRencontre ? rencontre.dateRencontre|date('d/m/Y') : '-' }}
                                        </td>
                                        
                                        {# Score Arras #}
                                        <td class="text-end fw-bold fs-5 {{ hasDetails ? (scoreArras > scoreAdversaire ? 'text-success' : (scoreArras < scoreAdversaire ? 'text-danger' : 'text-arras')) : 'text-muted' }}">
                                            {{ hasDetails ? scoreArras : '-' }}
                                        </td>
                                        
                                        <td class="text-muted small px-0">-</td>
                                        
                                        {# Score Adversaire #}
                                        <td class="text-start fw-bold fs-5 {{ hasDetails ? (scoreAdversaire > scoreArras ? 'text-success' : (scoreAdversaire < scoreArras ? 'text-danger' : 'text-secondary')) : 'text-muted' }}">
                                            {{ hasDetails ? scoreAdversaire : '-' }}
                                        </td>
                                        
                                        {# Bouton Détails #}
                                        <td class="pe-4 text-end">
                                            <a href="{{ path('app_rencontre_show', {'id': rencontre.id}) }}" class="btn btn-sm btn-outline-arras rounded-pill px-3 fw-bold">
                                                Détails
                                            </a>
                                        </td>
                                    </tr>
                                {% else %}
                                    <tr>
                                        <td colspan="6" class="text-muted py-5 text-center">
                                            <i class="fas fa-calendar-times fs-3 mb-2"></i><br>
                                            Aucune rencontre planifiée.
                                        </td>
                                    </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}