{% extends '@App/app.html.twig' %}

{% block title %}Mon planning{% endblock %}
{% block page_header %}{% endblock %}

{% block content %}
{% set day_names = ['LUN', 'MAR', 'MER', 'JEU', 'VEN', 'SAM', 'DIM'] %}
{% set full_day_names = ['lundi', 'mardi', 'mercredi', 'jeudi', 'vendredi', 'samedi', 'dimanche'] %}
{% set month_names = ['janvier', 'février', 'mars', 'avril', 'mai', 'juin', 'juillet', 'août', 'septembre', 'octobre', 'novembre', 'décembre'] %}
{% set total_hours = calendar.totalMinutes / 60 %}
{% set contract_hours = calendar.weeklyContractMinutes / 60 %}
{% set pending_count = calendar.assignments|length - calendar.acknowledgedCount %}
{% set next = calendar.nextAssignment %}
{% set schedule = calendar.currentSchedule %}
{% set manager = calendar.manager %}
{% set manager_photo = manager and manager.photo ? manager.photo|trim : null %}
{% set manager_avatar = manager_photo ? (manager_photo starts with 'http://' or manager_photo starts with 'https://' ? manager_photo : asset(manager_photo starts with '/' ? manager_photo|slice(1) : manager_photo)) : null %}
{% set active_tab = active_tab|default('planning') %}
{% set change_requests_enabled = change_requests_enabled|default(true) %}
{% set availability_enabled = availability_enabled|default(true) %}
{% set availability_locked = availability_locked|default(false) %}
{% if active_tab == 'change_requests' and not change_requests_enabled %}
    {% set active_tab = 'planning' %}
{% endif %}
{% if active_tab == 'availability' and not availability_enabled %}
    {% set active_tab = 'planning' %}
{% endif %}
{% set availability_view = availability_view|default({days: {}, slots: {}, selected: {}, exceptions: [], availableMinutes: 0, minimumMinutes: 1500, compliancePercent: 0}) %}
{% set change_request_view = change_request_view|default({requests: [], total: 0, pending: 0, accepted30: 0}) %}
{% set request_type_labels = {swap: 'Échange', time_change: 'Modification', unavailable: 'Indisponibilité', other: 'Autre'} %}
{% set request_type_tones = {swap: 'swap', time_change: 'time', unavailable: 'unavailable', other: 'other'} %}
{% set request_status_labels = {submitted: 'En attente', pending: 'En attente', in_review: 'En cours', approved: 'Acceptée', refused: 'Refusée', cancelled: 'Annulée'} %}
{% set request_status_tones = {submitted: 'pending', pending: 'pending', in_review: 'pending', approved: 'approved', refused: 'refused', cancelled: 'cancelled'} %}

<div class="data-page planning-employee-page" data-controller="planning-employee-availability">
    <div class="planning-employee-topbar">
        <nav class="data-breadcrumb" aria-label="Fil d'Ariane">
            <span>Mon espace</span>
            <i class="ti ti-chevron-right" aria-hidden="true"></i>
            <span class="fw-bold text-primary">{{ active_tab == 'change_requests' ? 'Demandes de changement' : 'Mon planning' }}</span>
        </nav>
        {% if active_tab == 'change_requests' and change_requests_enabled %}
            <a class="data-button data-button--primary" href="{{ path('planning_change_request_new') }}">
                <i class="ti ti-plus" aria-hidden="true"></i>Nouvelle demande
            </a>
        {% elseif active_tab == 'availability' and availability_enabled %}
            {% if availability_locked %}
                <button class="data-button data-button--secondary" type="button" disabled>
                    <i class="ti ti-lock" aria-hidden="true"></i>Disponibilités verrouillées
                </button>
            {% else %}
                <a class="data-button data-button--primary" href="{{ path('planning_availability_new') }}">
                    <i class="ti ti-plus" aria-hidden="true"></i>Ajouter une dispo
                </a>
            {% endif %}
        {% else %}
            <a class="data-button data-button--primary" href="{{ path('app_leave_new') }}">
                <i class="ti ti-send" aria-hidden="true"></i>Demande d'absence
            </a>
        {% endif %}
    </div>

    <div class="planning-employee-hero">
        <div>
            <h1>{{ active_tab == 'change_requests' ? 'Demandes de changement' : 'Mon planning' }}</h1>
            <p>
                {% if active_tab == 'change_requests' and change_requests_enabled %}
                    Consultez et suivez l'état de vos demandes de modification de planning.
                {% elseif active_tab == 'availability' and availability_enabled %}
                    Définissez vos préférences horaires pour aider vos managers à organiser les shifts.
                {% else %}
                    Gérez votre emploi du temps et vos disponibilités hebdomadaires.
                {% endif %}
            </p>
        </div>
        {% if active_tab == 'availability' and availability_enabled %}
            <div class="planning-employee-hero__actions">
                <a class="data-button data-button--secondary" href="{{ path('planning_employee_my', {tab: 'availability'}) }}#historique">
                    <i class="ti ti-history" aria-hidden="true"></i>Historique
                </a>
            </div>
        {% endif %}
    </div>

    {% if active_tab == 'change_requests' and change_requests_enabled %}
        <section class="planning-employee-metrics planning-employee-request-metrics">
            <article>
                <i class="ti ti-send" aria-hidden="true"></i>
                <span>Demandes totales</span>
                <strong>{{ change_request_view.total }}</strong>
            </article>
            <article>
                <i class="ti ti-clock" aria-hidden="true"></i>
                <span>En attente</span>
                <strong>{{ change_request_view.pending }}</strong>
            </article>
            <article>
                <i class="ti ti-checks" aria-hidden="true"></i>
                <span>Acceptées (30j)</span>
                <strong>{{ change_request_view.accepted30 }}</strong>
            </article>
        </section>
    {% elseif active_tab == 'planning' %}
        <section class="planning-employee-metrics">
            <article>
                <span>Prochain shift</span>
                {% if next %}
                    <strong>{{ full_day_names[next.plannedStartAt|date('N') - 1]|capitalize }} {{ next.plannedStartAt|date('d') }} {{ month_names[next.plannedStartAt|date('n') - 1] }}</strong>
                    <b>{{ next.plannedStartAt|date('H:i') }} — {{ next.plannedEndAt|date('H:i') }}</b>
                {% else %}
                    <strong>Aucun shift</strong>
                    <b>Cette semaine</b>
                {% endif %}
                <i class="ti ti-player-skip-forward" aria-hidden="true"></i>
            </article>
            <article>
                <span>Heures prévues</span>
                <strong>{{ total_hours|number_format(total_hours == total_hours|round ? 0 : 1, ',', ' ') }} h <small>{{ total_hours >= contract_hours ? 'Temps plein' : 'Planifié' }}</small></strong>
                <i class="ti ti-hourglass-empty" aria-hidden="true"></i>
            </article>
            <article>
                <span>Shifts à confirmer</span>
                <strong>{{ pending_count }}{% if pending_count > 0 %} <em>Action requise</em>{% endif %}</strong>
                <i class="ti ti-circle-check" aria-hidden="true"></i>
            </article>
            <article>
                <span>Repos hebdomadaire</span>
                <strong class="is-success"><i class="ti ti-check" aria-hidden="true"></i>Conforme</strong>
                <i class="ti ti-battery-automotive" aria-hidden="true"></i>
            </article>
        </section>
    {% endif %}

    <div class="planning-employee-layout {{ active_tab == 'change_requests' ? 'planning-employee-layout--single' : '' }}">
        <main class="planning-employee-main">
            <nav class="planning-employee-tabs" aria-label="Navigation planning salarié">
                <a class="{{ active_tab == 'planning' ? 'is-active' : '' }}" href="{{ path('planning_employee_my', {start: calendar.start|date('Y-m-d')}) }}">Planning</a>
                {% if availability_enabled %}
                    <a class="{{ active_tab == 'availability' ? 'is-active' : '' }}" href="{{ path('planning_employee_my', {tab: 'availability', start: calendar.start|date('Y-m-d')}) }}">Mes disponibilités</a>
                {% endif %}
                {% if change_requests_enabled %}
                    <a class="{{ active_tab == 'change_requests' ? 'is-active' : '' }}" href="{{ path('planning_employee_my', {tab: 'change_requests', start: calendar.start|date('Y-m-d')}) }}">Demandes de changement</a>
                {% endif %}
                <a href="{{ path('planning_employee_my', {start: calendar.start|date('Y-m-d')}) }}#historique">Historique</a>
            </nav>

            {% if active_tab == 'change_requests' and change_requests_enabled %}
                <section class="planning-employee-board planning-employee-requests-board">
                    <div class="planning-employee-request-table-wrap">
                        <table class="planning-employee-request-table">
                            <thead>
                                <tr>
                                    <th>Date demande</th>
                                    <th>Shift concerné</th>
                                    <th>Motif</th>
                                    <th>Type</th>
                                    <th>Statut</th>
                                    <th>Actions</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for request in change_request_view.requests|slice(0, 4) %}
                                    {% set assignment = request.assignment %}
                                    {% set shift = assignment ? assignment.shift : null %}
                                    {% set type_tone = request_type_tones[request.type]|default('other') %}
                                    {% set status_tone = request_status_tones[request.status]|default('pending') %}
                                    <tr>
                                        <td>{{ request.createdAt|date('d/m/Y') }}</td>
                                        <td>
                                            {% if assignment %}
                                                <strong>{{ full_day_names[assignment.plannedStartAt|date('N') - 1]|capitalize|slice(0, 3) }}. {{ assignment.plannedStartAt|date('d') }} {{ month_names[assignment.plannedStartAt|date('n') - 1]|capitalize }}</strong>
                                                <span>{{ assignment.plannedStartAt|date('H:i') }} — {{ assignment.plannedEndAt|date('H:i') }}{% if shift %} ({{ shift.title }}){% endif %}</span>
                                            {% else %}
                                                <strong>Shift non renseigné</strong>
                                            {% endif %}
                                        </td>
                                        <td>{{ request.reason|default('Aucun motif')|length > 52 ? request.reason|slice(0, 52) ~ '...' : request.reason|default('Aucun motif') }}</td>
                                        <td><span class="planning-employee-request-type" data-tone="{{ type_tone }}">{{ request_type_labels[request.type]|default(request.type|capitalize) }}</span></td>
                                        <td><span class="planning-employee-request-status" data-tone="{{ status_tone }}">{{ request_status_labels[request.status]|default(request.status|capitalize) }}</span></td>
                                        <td>
                                            <a class="planning-employee-icon-action" href="{{ path('planning_change_request_show', {id: request.id}) }}" title="Voir"><i class="ti ti-eye" aria-hidden="true"></i></a>
                                            {% if request.status in ['submitted', 'pending'] %}
                                                <button class="planning-employee-icon-action" type="button" disabled title="Annulation bientôt disponible"><i class="ti ti-trash" aria-hidden="true"></i></button>
                                            {% endif %}
                                        </td>
                                    </tr>
                                {% else %}
                                    <tr><td colspan="6" class="planning-employee-empty">Aucune demande de changement.</td></tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                    <footer class="planning-employee-request-footer">
                        <span>Affichage de 1 à {{ change_request_view.total > 4 ? 4 : change_request_view.total }} sur {{ change_request_view.total }} demandes</span>
                        <div>
                            <button class="data-button data-button--secondary" disabled>Précédent</button>
                            <button class="data-button data-button--secondary" type="button">Suivant</button>
                        </div>
                    </footer>
                </section>

                <div class="planning-employee-request-info-grid">
                    <section class="planning-employee-side-card planning-employee-request-info">
                        <header><i class="ti ti-help-circle" aria-hidden="true"></i><h2>Comment ça marche ?</h2></header>
                        <p>Vos demandes sont transmises directement à <strong>{{ manager ? manager : 'votre manager' }}</strong>. Vous recevrez une notification dès qu'une décision sera prise. Pour les échanges, le collègue concerné doit également confirmer.</p>
                    </section>
                    <section class="planning-employee-side-card planning-employee-request-info">
                        <header><i class="ti ti-history" aria-hidden="true"></i><h2>Délais de traitement</h2></header>
                        <p>Les demandes de changement doivent être soumises au moins <strong>48 heures</strong> à l'avance pour être traitées dans les temps. Pour les urgences de dernière minute, veuillez appeler le standard.</p>
                    </section>
                </div>
            {% elseif active_tab == 'availability' and availability_enabled %}
                <form class="planning-employee-board planning-employee-availability-panel" method="post" action="{{ path('planning_employee_availability_preferences') }}">
                    <input type="hidden" name="_token" value="{{ csrf_token('planning_employee_availability_preferences') }}">
                    <header class="planning-employee-board__header">
                        <div>
                            <h2>Préférences hebdomadaires</h2>
                            <p>Cochez vos créneaux de disponibilité souhaités.</p>
                            {% if availability_locked %}
                                <p class="planning-employee-lock-note"><i class="ti ti-lock" aria-hidden="true"></i>Vos disponibilités sont verrouillées par votre manager.</p>
                            {% endif %}
                        </div>
                        <div class="planning-employee-availability-legend">
                            <span data-tone="available">Disponible</span>
                            <span data-tone="unavailable">Indisponible</span>
                        </div>
                    </header>
                    <div class="planning-employee-availability-grid">
                        <div class="planning-employee-availability-head">Jour</div>
                        {% for slot in availability_view.slots %}
                            <div class="planning-employee-availability-head">{{ slot.label }}</div>
                        {% endfor %}
                        {% for day_number, day_label in availability_view.days %}
                            <div class="planning-employee-availability-day">{{ day_label }}</div>
                            {% for slot_key, slot in availability_view.slots %}
                                {% set preference = availability_view.selected[day_number][slot_key]|default(null) %}
                                {% set preference_type = preference ? preference.type : '' %}
                                <div class="planning-employee-availability-choice" data-state="{{ preference_type ?: 'empty' }}">
                                    <input type="hidden" name="availability[{{ day_number }}][{{ slot_key }}]" value="{{ preference_type }}" data-planning-employee-availability-target="input">
                                    <button class="planning-employee-availability-card" type="button" data-action="planning-employee-availability#cycle" {{ availability_locked ? 'disabled' : '' }}>
                                        <strong>{{ preference_type == 'unavailable' ? 'Indisponible' : (preference_type == 'available' ? 'Disponible' : '+') }}</strong>
                                        {% if preference_type == 'unavailable' %}
                                            <small>{{ preference.comment ?: 'Préférence récurrente' }}</small>
                                            <i class="ti ti-x" aria-hidden="true"></i>
                                        {% elseif preference_type == 'available' %}
                                            <i class="ti ti-check" aria-hidden="true"></i>
                                        {% endif %}
                                    </button>
                                </div>
                            {% endfor %}
                        {% endfor %}
                    </div>
                    <footer class="planning-employee-availability-actions">
                        <a class="data-button data-button--secondary" href="{{ path('planning_employee_my', {tab: 'availability'}) }}">Annuler</a>
                        <button class="data-button data-button--primary" type="submit" {{ availability_locked ? 'disabled' : '' }}>Enregistrer mes préférences</button>
                    </footer>
                </form>

                <section class="planning-employee-board planning-employee-exceptions">
                    <header class="planning-employee-board__header">
                        <div>
                            <h2>Indisponibilités exceptionnelles</h2>
                            <p>Ajoutez des dates spécifiques où vous ne serez pas disponible (hors congés).</p>
                        </div>
                        {% if availability_locked %}
                            <span class="planning-employee-link-action is-disabled"><i class="ti ti-lock" aria-hidden="true"></i>Ajout verrouillé</span>
                        {% else %}
                            <a class="planning-employee-link-action" href="{{ path('planning_availability_new', {returnToEmployee: 1}) }}" data-turbo-frame="frame_modal"><i class="ti ti-calendar-plus" aria-hidden="true"></i>Ajouter une exception</a>
                        {% endif %}
                    </header>
                    <div class="planning-employee-exception-list">
                        {% for exception in availability_view.exceptions %}
                            <article>
                                <time datetime="{{ exception.startAt|date('Y-m-d') }}">
                                    <span>{{ month_names[exception.startAt|date('n') - 1]|slice(0, 3)|upper }}</span>
                                    <strong>{{ exception.startAt|date('d') }}</strong>
                                </time>
                                <div>
                                    <strong>{{ exception.comment ?: (exception.type == 'unavailable' ? 'Indisponibilité' : 'Disponibilité') }}</strong>
                                    <span>
                                        {{ full_day_names[exception.startAt|date('N') - 1]|capitalize }} {{ exception.startAt|date('d') }} {{ month_names[exception.startAt|date('n') - 1] }}
                                        {% if exception.startAt|date('Y-m-d') == exception.endAt|date('Y-m-d') %}
                                            · {{ exception.startAt|date('H:i') }} - {{ exception.endAt|date('H:i') }}
                                        {% else %}
                                            · jusqu'au {{ exception.endAt|date('d/m') }}
                                        {% endif %}
                                    </span>
                                </div>
                            </article>
                        {% else %}
                            <p class="planning-employee-empty">Aucune exception à venir.</p>
                        {% endfor %}
                    </div>
                </section>
            {% else %}
            <section class="planning-employee-board">
                <header class="planning-employee-board__header">
                    <div>
                        <h2>Semaine du {{ calendar.start|date('d') }} au {{ calendar.end|date('d') }} {{ month_names[calendar.end|date('n') - 1] }} {{ calendar.end|date('Y') }}</h2>
                    </div>
                    <div class="planning-employee-board__actions">
                        <div class="planning-employee-nav">
                            <a href="{{ path('planning_employee_my', {start: calendar.previousStart|date('Y-m-d')}) }}" aria-label="Semaine précédente"><i class="ti ti-chevron-left" aria-hidden="true"></i></a>
                            <a href="{{ path('planning_employee_my') }}">Aujourd'hui</a>
                            <a href="{{ path('planning_employee_my', {start: calendar.nextStart|date('Y-m-d')}) }}" aria-label="Semaine suivante"><i class="ti ti-chevron-right" aria-hidden="true"></i></a>
                        </div>
                        <button class="data-button data-button--secondary" type="button" onclick="window.print()"><i class="ti ti-printer" aria-hidden="true"></i>Imprimer</button>
                        {% if pending_count > 0 %}
                            <form method="post" action="{{ path('planning_assignment_acknowledge_week') }}">
                                <input type="hidden" name="_token" value="{{ csrf_token('planning_assignment_acknowledge_week') }}">
                                <input type="hidden" name="start" value="{{ calendar.start|date('Y-m-d') }}">
                                <button class="data-button data-button--primary" type="submit">Confirmer tout</button>
                            </form>
                        {% endif %}
                    </div>
                </header>

                <div class="planning-employee-grid">
                    {% for day in calendar.days %}
                        {% set key = day|date('Y-m-d') %}
                        {% set cell = calendar.cells[key] %}
                        <article class="planning-employee-day {{ day|date('N') >= 6 ? 'is-weekend' : '' }}">
                            <header>
                                <span>{{ day_names[day|date('N') - 1] }}</span>
                                <strong>{{ day|date('d') }}</strong>
                            </header>
                            <div class="planning-employee-day__body">
                                {% for assignment in cell.assignments %}
                                    {% set shift = assignment.shift %}
                                    {% set title = shift ? shift.title|lower : '' %}
                                    {% set tone = shift and shift.startTime and shift.startTime|date('H') >= 20 ? 'night' : (title matches '/après|apres|soir/' ? 'afternoon' : 'morning') %}
                                    <div class="planning-employee-shift" data-tone="{{ tone }}">
                                        <div class="planning-employee-shift__top">
                                            <strong>{{ shift ? shift.title : 'Shift' }}</strong>
                                            {% if assignment.employeeAcknowledgedAt %}
                                                <span class="planning-employee-check"><i class="ti ti-check" aria-hidden="true"></i></span>
                                            {% else %}
                                                <span class="planning-employee-action">À confirmer</span>
                                            {% endif %}
                                        </div>
                                        <b>{{ assignment.plannedStartAt|date('H:i') }} — {{ assignment.plannedEndAt|date('H:i') }}</b>
                                        <small>
                                            {% if shift and shift.breakDurationMinutes > 0 %}
                                                <i class="ti ti-coffee" aria-hidden="true"></i> Pause {{ shift.breakDurationMinutes }} min<br>
                                            {% endif %}
                                            {{ shift and shift.etablissement ? shift.etablissement.nom : 'Établissement non renseigné' }}
                                            {% if shift and shift.service %} · {{ shift.service.nom }}{% endif %}
                                        </small>
                                    </div>
                                {% endfor %}

                                {% for interview in cell.interviews %}
                                    <a class="planning-employee-interview" href="{{ path('interview_show', {id: interview.id}) }}">
                                        <span><i class="ti ti-messages" aria-hidden="true"></i> Entretien RH</span>
                                        <strong>{{ interview.type.nom }}</strong>
                                        <b>{{ interview.scheduledAt|date('H:i') }}</b>
                                        <small>{{ interview.location ?: (interview.remoteLink ? 'Visioconférence' : 'Lieu à définir') }}{% if interview.campaign %}<br>{{ interview.campaign.nom }}{% endif %}</small>
                                    </a>
                                {% endfor %}

                                {% for availability in cell.availabilities %}
                                    <div class="planning-employee-availability">
                                        <i class="ti ti-beach" aria-hidden="true"></i>
                                        <span>{{ availability.type == 'unavailable' ? 'Indisponibilité' : 'Disponibilité' }}</span>
                                    </div>
                                {% endfor %}

                                {% if cell.assignments is empty and cell.interviews is empty and cell.availabilities is empty %}
                                    <div class="planning-employee-rest">Repos</div>
                                {% endif %}
                            </div>
                        </article>
                    {% endfor %}
                </div>
            </section>
            {% endif %}
        </main>

        {% if active_tab != 'change_requests' %}
        <aside class="planning-employee-side">
            {% if active_tab == 'availability' and availability_enabled %}
                <section class="planning-employee-side-card planning-employee-compliance">
                    <header><i class="ti ti-rosette-discount-check" aria-hidden="true"></i><h2>Conformité</h2></header>
                    <div class="planning-employee-side-body">
                        <div class="planning-employee-compliance-row">
                            <span>Disponibilité min.</span>
                            <strong>{{ (availability_view.minimumMinutes / 60)|number_format(0, ',', ' ') }} h / sem.</strong>
                        </div>
                        <div class="planning-employee-progress"><span style="width: {{ availability_view.compliancePercent }}%"></span></div>
                        <p>Vous avez déclaré {{ (availability_view.availableMinutes / 60)|number_format(availability_view.availableMinutes % 60 == 0 ? 0 : 1, ',', ' ') }}h de disponibilité. Votre contrat exige un minimum de {{ (availability_view.minimumMinutes / 60)|number_format(0, ',', ' ') }}h de créneaux ouverts.</p>
                    </div>
                </section>

                <section class="planning-employee-side-card planning-employee-rules">
                    <header><i class="ti ti-info-circle" aria-hidden="true"></i><h2>Règles de gestion</h2></header>
                    <ul>
                        <li>Les disponibilités doivent être saisies au moins <strong>2 semaines à l'avance</strong>.</li>
                        <li>Toute modification d'une dispo récurrente nécessite une <strong>validation manager</strong>.</li>
                        <li>Les congés payés approuvés prévalent automatiquement sur vos disponibilités.</li>
                    </ul>
                </section>

                <section class="planning-employee-help planning-employee-help--purple">
                    <h2>Un changement régulier ?</h2>
                    <p>Si vos contraintes personnelles changent durablement, parlez-en à votre manager pour mettre à jour vos horaires contractuels.</p>
                    {% if change_requests_enabled %}
                        <a href="{{ path('planning_change_request_index') }}">En savoir plus sur les types de dispo</a>
                    {% endif %}
                </section>
            {% else %}
            <section class="planning-employee-side-card">
                <header><i class="ti ti-info-circle" aria-hidden="true"></i><h2>Informations</h2></header>
                <div class="planning-employee-info-row">
                    <span><i class="ti ti-speakerphone" aria-hidden="true"></i></span>
                    <div>
                        <small>Statut publication</small>
                        <strong>
                            {% if schedule and schedule.publishedAt %}
                                Publié le {{ schedule.publishedAt|date('d/m/Y') }}
                            {% elseif schedule %}
                                {{ schedule.status|capitalize }}
                            {% else %}
                                Aucun planning publié
                            {% endif %}
                        </strong>
                        {% if schedule and schedule.updatedAt %}<em>Mise à jour le {{ schedule.updatedAt|date('d/m/Y') }}</em>{% endif %}
                    </div>
                </div>
                <div class="planning-employee-info-row">
                    <span><i class="ti ti-user" aria-hidden="true"></i></span>
                    <div>
                        <small>Manager</small>
                        {% if manager %}
                            <strong class="planning-employee-manager">
                                <span class="data-avatar {{ manager_avatar ? '' : 'data-avatar--initials' }}">
                                    {% if manager_avatar %}<img src="{{ manager_avatar }}" alt="{{ manager }}">{% else %}{{ (manager.prenom|first ~ manager.nom|first)|upper }}{% endif %}
                                </span>
                                {{ manager }}
                            </strong>
                        {% else %}
                            <strong>Non renseigné</strong>
                        {% endif %}
                    </div>
                </div>
            </section>

            <section class="planning-employee-side-card">
                <header>
                    <i class="ti ti-beach" aria-hidden="true"></i><h2>Absences à venir</h2>
                    <a href="{{ path('app_leave_my') }}">Voir tout</a>
                </header>
                <div class="planning-employee-leaves">
                    {% for leave in calendar.upcomingLeaves %}
                        <article>
                            <strong>{{ leave.leaveType ? leave.leaveType.nom : 'Absence' }}</strong>
                            <span>Du {{ leave.startDate|date('d/m') }} au {{ leave.endDate|date('d/m') }}</span>
                            {% include '@Planning/planning/_status_badge.html.twig' with {status: leave.status} %}
                        </article>
                    {% else %}
                        <p>Aucune absence à venir.</p>
                    {% endfor %}
                </div>
            </section>

            <section class="planning-employee-help">
                <h2>Besoin d'aide ?</h2>
                <p>Une erreur sur votre planning ou besoin de décaler un shift ? Contactez directement votre manager via le portail.</p>
                {% if manager and manager.emailProfessionnel %}
                    <a href="mailto:{{ manager.emailProfessionnel }}"><i class="ti ti-mail" aria-hidden="true"></i>Contacter {{ manager.prenom }}</a>
                {% elseif change_requests_enabled %}
                    <a href="{{ path('planning_change_request_index') }}"><i class="ti ti-mail" aria-hidden="true"></i>Faire une demande</a>
                {% endif %}
            </section>
            {% endif %}
        </aside>
        {% endif %}
    </div>
</div>
{% endblock %}