{% extends '@App/app.html.twig' %}
{% block title %}Tableau de bord entretiens{% endblock %}
{% block page_header %}{% endblock %}
{% block content %}
<div class="data-page interview-page">
    <div class="data-page__header"><div><nav class="data-breadcrumb"><span>Ressources humaines</span><i class="ti ti-chevron-right"></i><strong>Entretiens</strong></nav><h1>Tableau de bord entretiens</h1><p>EPP, performance, campagnes et objectifs.</p></div><a class="data-button data-button--primary" href="{{ path('interview_new') }}">Nouvel entretien</a></div>
    <div class="metric-grid">
        <article class="metric-card"><span class="metric-card__label">À venir</span><strong class="metric-card__value">{{ stats.upcoming }}</strong></article>
        <article class="metric-card"><span class="metric-card__label">En retard</span><strong class="metric-card__value">{{ stats.overdue }}</strong></article>
        <article class="metric-card"><span class="metric-card__label">EPP à planifier</span><strong class="metric-card__value">{{ stats.due_professional_path }}</strong></article>
        <article class="metric-card"><span class="metric-card__label">Campagnes</span><strong class="metric-card__value">{{ stats.campaigns }}</strong></article>
    </div>
    <section class="data-card"><div class="interview-panel-head"><h2>Entretiens à venir</h2><a href="{{ path('interview_index') }}">Tout voir</a></div>{% include '@Interview/interview/_table.html.twig' with {interviews: upcoming} %}</section>
</div>
{% endblock %}