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

{% block title %}{{ etudiant.nomComplet }} | SALSABIL Madrassas{% endblock %}

{% block content %}
    <style>
        .registration-program-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
        .registration-program-card{border:1px solid rgba(15,92,69,.12);border-radius:16px;padding:1rem;background:linear-gradient(180deg,#fff,#fbfcfd);box-shadow:0 16px 40px rgba(20,30,44,.08)}
        .registration-program-card.is-muted{opacity:.68}
        .registration-program-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem}
        .registration-program-card-head span{display:block;font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#64748b}
        .registration-program-card-head strong{display:block;color:#102033}
        .registration-program-badges{display:flex;flex-wrap:wrap;gap:.35rem;justify-content:flex-end}
        .registration-program-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
        .registration-program-details div{border-radius:12px;background:#f8fafc;padding:.7rem}
        .registration-program-details span{display:block;font-size:.72rem;font-weight:800;color:#64748b;text-transform:uppercase}
        .registration-program-details strong{display:block;margin-top:.15rem;color:#1f2937}
        .registration-program-note{margin:.9rem 0 0;padding:.75rem;border-radius:12px;background:#fff7ed;color:#7c2d12}
        @media (max-width:640px){.registration-program-details{grid-template-columns:1fr}.registration-program-card-head{flex-direction:column}}
    </style>
    <div class="admin-page-stack">
        <section class="admin-page-header">
            <div>
                <p class="admin-eyebrow">{{ etudiant.matricule ?: 'ÉTUDIANT' }}</p>
                <h1 class="admin-page-title">{{ etudiant.nomComplet }}</h1>
                <p>Fiche administrative de l’apprenant.</p>
            </div>
            <div class="admin-hero-actions">
                <a class="admin-btn admin-btn-light" href="{{ path('school_etudiant_index') }}">Retour</a>
                <a class="admin-btn admin-btn-light" href="{{ path('school_etudiant_finance', {id: etudiant.id}) }}">Finance</a>
                <a class="admin-btn admin-btn-primary" href="{{ path('school_etudiant_edit', {id: etudiant.id}) }}">Modifier</a>
                <form method="post" action="{{ path('school_etudiant_delete', {id: etudiant.id}) }}" onsubmit="return confirm('Supprimer définitivement cet étudiant ? Les dossiers d’inscription liés seront conservés mais détachés.');">
                    <input type="hidden" name="_token" value="{{ csrf_token('delete_etudiant_' ~ etudiant.id) }}">
                    <button class="admin-btn admin-btn-light admin-action-danger" type="submit">Supprimer</button>
                </form>
            </div>
        </section>

        <section class="admin-grid admin-grid-school">
            <div class="admin-card">
                <div class="admin-card-head"><div><h2>Identité</h2><p>Informations principales.</p></div></div>
                <div class="admin-mini-list">
                    <div class="admin-mini-item"><div><strong>Matricule</strong><small>{{ etudiant.matricule ?: '-' }}</small></div></div>
                    <div class="admin-mini-item"><div><strong>Matricule temporaire</strong><small>{{ etudiant.matriculeTemporaire ?: '-' }}</small></div></div>
                    <div class="admin-mini-item"><div><strong>Année</strong><small>{{ etudiant.anneeScolaire ? etudiant.anneeScolaire.libelle : 'Non liée' }}</small></div></div>
                    <div class="admin-mini-item"><div><strong>Sexe</strong><small>{{ etudiant.sexe ?: '-' }}</small></div></div>
                    <div class="admin-mini-item"><div><strong>Naissance</strong><small>{{ etudiant.dateNaissance ? etudiant.dateNaissance|date('d/m/Y') : '-' }}{% if etudiant.lieuNaissance %} à {{ etudiant.lieuNaissance }}{% endif %}</small></div></div>
                    <div class="admin-mini-item"><div><strong>Enfants</strong><small>{{ etudiant.hasEnfants ? 'Oui' : 'Non' }}</small></div></div>
                </div>
            </div>
            <div class="admin-card">
                <div class="admin-card-head"><div><h2>Contacts et affectation</h2><p>Coordonnées et classe actuelle.</p></div></div>
                <div class="admin-mini-list">
                    <div class="admin-mini-item"><div><strong>Téléphone</strong><small>{{ etudiant.telephonePrincipal ?: '-' }}</small></div></div>
                    <div class="admin-mini-item"><div><strong>WhatsApp</strong><small>{{ etudiant.telephoneWhatsapp ?: '-' }}</small></div></div>
                    <div class="admin-mini-item"><div><strong>Section</strong><small>{{ etudiant.section ? etudiant.section.nom : '-' }}</small></div></div>
                    <div class="admin-mini-item"><div><strong>Classe</strong><small>{{ etudiant.classe ? etudiant.classe.nom : '-' }}</small></div></div>
                    <div class="admin-mini-item"><div><strong>Disponibilités</strong><small>{{ etudiant.joursDisponibles ?: '-' }}{% if etudiant.plageHoraireSouhaitee %} · {{ etudiant.plageHoraireSouhaitee }}{% endif %}</small></div></div>
                </div>
            </div>
        </section>

        <section class="admin-card">
            <div class="admin-card-head">
                <div>
                    <h2>Parcours et classes</h2>
                    <p>Ensemble des affectations actives ou historiques de l’apprenant.</p>
                </div>
            </div>
            <div class="registration-program-grid">
                {% if etudiant.parcours|length > 0 %}
                    {% for parcours in etudiant.parcours %}
                        <article class="registration-program-card {{ parcours.actif ? '' : 'is-muted' }}">
                            <div class="registration-program-card-head">
                                <div>
                                    <span>{{ parcours.anneeScolaire ? parcours.anneeScolaire.libelle : 'Année non liée' }}</span>
                                    <strong>{{ parcours.classe ? parcours.classe.nom : (parcours.section ? parcours.section.nom : 'Classe non précisée') }}</strong>
                                </div>
                                <div class="registration-program-badges">
                                    {% if parcours.principal %}{% include 'components/admin/status_badge.html.twig' with {label: 'Principal', tone: 'success'} only %}{% endif %}
                                    {% include 'components/admin/status_badge.html.twig' with {label: parcours.statut, tone: parcours.actif ? 'info' : 'neutral'} only %}
                                </div>
                            </div>
                            <div class="registration-program-details">
                                <div><span>Section</span><strong>{{ parcours.section ? parcours.section.nom : '-' }}</strong></div>
                                <div><span>Niveau</span><strong>{{ parcours.niveau ? parcours.niveau.nom : '-' }}</strong></div>
                                <div><span>Classe</span><strong>{{ parcours.classe ? parcours.classe.nom : '-' }}</strong></div>
                                <div><span>Langue</span><strong>{{ parcours.langue ?: '-' }}</strong></div>
                                <div><span>Mode</span><strong>{{ parcours.mode ?: '-' }}</strong></div>
                                <div><span>Tarif appliqué</span><strong>{{ parcours.tarifApplique ? parcours.tarifApplique|number_format(0, ',', ' ') ~ ' FCFA' : '-' }}</strong></div>
                                <div><span>Date début</span><strong>{{ parcours.dateDebut ? parcours.dateDebut|date('d/m/Y') : '-' }}</strong></div>
                                <div><span>Date fin</span><strong>{{ parcours.dateFin ? parcours.dateFin|date('d/m/Y') : '-' }}</strong></div>
                            </div>
                            {% if parcours.observation %}
                                <p class="registration-program-note">{{ parcours.observation }}</p>
                            {% endif %}
                        </article>
                    {% endfor %}
                {% else %}
                    <article class="registration-program-card">
                        <div class="registration-program-card-head">
                            <div>
                                <span>{{ etudiant.anneeScolaire ? etudiant.anneeScolaire.libelle : 'Année non liée' }}</span>
                                <strong>{{ etudiant.classe ? etudiant.classe.nom : (etudiant.section ? etudiant.section.nom : 'Classe non précisée') }}</strong>
                            </div>
                            {% include 'components/admin/status_badge.html.twig' with {label: 'Principal', tone: 'success'} only %}
                        </div>
                        <div class="registration-program-details">
                            <div><span>Section</span><strong>{{ etudiant.section ? etudiant.section.nom : '-' }}</strong></div>
                            <div><span>Niveau</span><strong>{{ etudiant.niveau ? etudiant.niveau.nom : '-' }}</strong></div>
                            <div><span>Classe</span><strong>{{ etudiant.classe ? etudiant.classe.nom : '-' }}</strong></div>
                            <div><span>Langue</span><strong>-</strong></div>
                            <div><span>Mode</span><strong>-</strong></div>
                            <div><span>Tarif appliqué</span><strong>-</strong></div>
                            <div><span>Date début</span><strong>-</strong></div>
                            <div><span>Date fin</span><strong>-</strong></div>
                        </div>
                    </article>
                {% endif %}
            </div>
        </section>
    </div>
{% endblock %}
