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

{% block page_title %}Prestations{% endblock %}
{% block page_subtitle %}Les pensions & autres prestations{% endblock %}

{% block sidebar %}
<div id="sidebar">
    <div class="left-content">
        <h4 class="left-content-head-title">Nos Engagements</h4>
        <ul>
            <li>Alimentation incluse dans les pensions (foin, céréales et granulés)</li>
            <li>Surveillance permanente des chevaux</li>
            <li>Boxes nettoyés quotidiennement</li>
            <li>Présentation du cheval au maréchal, au vétérinaire, …</li>
            <li>Sellerie pour le matériel</li>
            <li>Parking van</li>
        </ul>
    </div>
</div>
{% endblock %}

{% block page_content %}
<div data-controller="prestations">

    {# ── Navigation onglets ── #}
    <ul class="nav nav-tabs presta-nav" role="tablist">
        <li class="nav-item" role="presentation">
            <button class="nav-link active" data-bs-toggle="tab" data-bs-target="#pension-pre" type="button" role="tab">Pension Pré</button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" data-bs-toggle="tab" data-bs-target="#pension-box" type="button" role="tab">Pension Box</button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" data-bs-toggle="tab" data-bs-target="#pension-retraite" type="button" role="tab">Pension Retraite</button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" data-bs-toggle="tab" data-bs-target="#pension-travail" type="button" role="tab">Pension Travail</button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" data-bs-toggle="tab" data-bs-target="#services-compris" type="button" role="tab">Services compris</button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" data-bs-toggle="tab" data-bs-target="#options" type="button" role="tab">Options</button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" data-bs-toggle="tab" data-bs-target="#cours-stages" type="button" role="tab">Cours &amp; Stages</button>
        </li>
    </ul>

    {# ── Panneaux ── #}
    <div class="tab-content presta-content">

        <div class="tab-pane fade show active" id="pension-pre" role="tabpanel">
            <h2>Pension Pré</h2>
            <p>Les chevaux restent jour &amp; nuit au pré.</p>
            <ul class="presta-list">
                <li>38 hectares de prairies avec abreuvoirs automatiques</li>
                <li>Foin, granulés et céréales inclus</li>
                <li>Abris individuels dans les prés</li>
            </ul>
        </div>

        <div class="tab-pane fade" id="pension-box" role="tabpanel">
            <h2>Pension Pré/Box</h2>
            <p>Les chevaux ont un box réservé et sont sortis au pré tous les jours.</p>
            <ul class="presta-list">
                <li>Litière paille renouvelée et nettoyée quotidiennement</li>
                <li>Alimentation jusqu'à trois fois par jour</li>
                <li>Sorties au pré selon les conditions météo</li>
            </ul>
        </div>

        <div class="tab-pane fade" id="pension-retraite" role="tabpanel">
            <h2>Pension Retraite / Convalescence</h2>
            <p>Une formule adaptée aux chevaux nécessitant une attention particulière.</p>
            <ul class="presta-list">
                <li>Surveillance quotidienne</li>
                <li>Pansage compris</li>
                <li>Groupes de 4 chevaux maximum, répartis selon leurs affinités</li>
            </ul>
        </div>

        <div class="tab-pane fade" id="pension-travail" role="tabpanel">
            <h2>Pension Travail</h2>
            <p>Débourrage de chevaux et équitation éthologique.</p>
            <ul class="presta-list">
                <li>Prestation personnalisée, sur devis</li>
            </ul>
        </div>

        <div class="tab-pane fade" id="services-compris" role="tabpanel">
            <h2>Services compris</h2>
            <ul class="presta-list">
                <li>Visite quotidienne des chevaux</li>
                <li>Soins d'urgence</li>
                <li>Présentation au vétérinaire et au maréchal</li>
            </ul>
        </div>

        <div class="tab-pane fade" id="options" role="tabpanel">
            <h2>Options</h2>
            <ul class="presta-list">
                <li>Pansage complet et entretien des pieds</li>
                <li>Travail à la longe</li>
            </ul>
        </div>

        <div class="tab-pane fade" id="cours-stages" role="tabpanel">
            <h2>Cours &amp; Stages</h2>
            <h3>Cours d'équitation</h3>
            <p>Reprises individuelles ou collectives, 1 à 2 fois par semaine.</p>
            <ul class="presta-list">
                <li>Enseignement assuré par <strong>Elia Debosschere</strong> (BEES1)</li>
            </ul>
            <h3>Stages d'éthologie</h3>
            <p>Animés par <strong>David Doucinot</strong> selon la méthode Pat Parelli.</p>
            <ul class="presta-list">
                <li>Deux jours, le week-end</li>
                <li>Petits groupes de 5 à 7 personnes</li>
            </ul>
        </div>

    </div>
</div>
{% endblock %}