<form action="" method="post" title="La meilleure formule">
    <div class="row">
        <div class="col-lg-6 col-xl-7 ">
            <fieldset>

                <legend>1/ Votre profil</legend>
                <div class="row">
                    {% for prof in profiles %}
                        <div class="col-sm-6 mb-3 order-{{ prof.id }}">
                            <div class="custom-control custom-radio">
                                <input type="radio" id="prof_{{ prof.id }}" name="profile" value="{{ prof.id }}" {% if profile == prof.id %}checked="checked"{% endif %} required class="custom-control-input">
                                <label class="custom-control-label" for="prof_{{ prof.id }}">{{ prof.name }}</label>
                            </div>
                        </div>
                    {% endfor %}
                </div>
            </fieldset>
        </div>
        <div class="col-lg-6 col-xl-5 d-md-flex flex-md-column">
            <fieldset class="flex-grow-1 d-flex">
                <legend>2/ Vous voyagez</legend>
                <div class="row align-items-md-center w-100">
                    <div class="col-sm-6 col-lg-12 col-xl-12 mb-3 mb-sm-0 mb-lg-3 mb-xl-0">
                        <div class="custom-control custom-radio">
                            <input type="radio" id="formulePref1" name="pref" value="Occasionnel" {% if pref == 'Occasionnel' %}checked="checked"{% endif %} required class="custom-control-input">
                            <label class="custom-control-label" for="formulePref1">Occasionnellement</label>
                        </div>
                    </div>
                    <div class="col-sm-6 col-lg-12 col-xl-12">
                        <div class="custom-control custom-radio">
                            <input type="radio" id="formulePref2" name="pref" value="Régulier" {% if pref == 'Régulier' %}checked="checked"{% endif %} required class="custom-control-input">
                            <label class="custom-control-label" for="formulePref2">Régulièrement</label>
                        </div>
                    </div>
                </div>
            </fieldset>
        </div>
    </div>

    <button type="submit" class="btn btn-lg btn-dark d-flex mx-auto">Rechercher la meilleure formule</button>

</form>
<div class="formuleResults">

    {% if app.request.method == 'POST' and formules|length == 0 %}
        <div class="well"><p class="mb-0 text-center">Pas de résultats</p></div>
    {% endif %}
    <h2><span></span></h2>
    {% if formules|length != 0 %}
        <table class="table table-bordered">
            <thead>
            <tr>
                <th>Nom du titre</th>
                <th class="text-center">Prix</th>
                <th>Descriptif</th>
                {% if formuleSells|length != 0 %}
                    <th>Lieux de vente</th>
                {% endif %}
            </tr>
            </thead>
            <tbody>
            {% for formule in formules|sort((a, b) => a.order > b.order) %}
                <tr>
                    <td><strong>{{ formule.name }}</strong></td>
                    <td class="text-center"><span class="badge badge-dark h1">{% if formule.price == 0 %}Gratuit{% else %}{{ formule.price|number_format(2, ',', ' ')}} €{% endif %}</span></td>
                    <td><small>{{ formule.description }} {% if formule.url != null and formule.url != '' and formule.url != 'https://' %}
                                <a href="{{ formule.url }}">Lire la suite…</a>
                            {% endif %}</small></td>
                    {% if formuleSells|length != 0 %}
                        <td>
                            <div class="row">
                                {% for pos in formuleSells %}
                                    {% if pos.id in formule.pointsOfSales %}
                                        <div class="col-md-6 mb-2 btn p-0" >
                                            <a href="{{ pos.url }}" title="{{ pos.title }}" data-toggle="tooltip">
                                                <img src="{{ pos.img }}" alt="{{ pos.title }}" class="imgFormule">
                                            </a>
                                        </div>
                                    {% endif %}
                                {% endfor %}
                            </div>
                        </td>
                    {% endif %}
                </tr>
            {% endfor %}
            </tbody>
        </table>
    {% endif %}
</div>
