{% set footerSections = footerSections|default([]) %}
{% set mainFooterSections = footerSections|filter(section => section.area == 'main') %}
{% set socialFooterSections = footerSections|filter(section => section.area == 'social') %}
{% set legalFooterSections = footerSections|filter(section => section.area == 'legal') %}

<footer class="site-footer bg-bleu text-white">
    <div class="container px-4 py-4 py-lg-5">
        <div class="col-12">
            <div class="row">
                <div class="col-12 p-0">
                    <div class="row">
                        <div class="col-12 col-lg-4 px-0 pe-lg-5">
                            <img src="{{ asset('/uploads/logo_yfimo_all_white.png') }}" alt="Logo YFIMO blanc" class="footer-logo">
                        </div>
                        <div class="col-12 col-lg-7 px-0 pb-4">
                            <p class="footer-baseline">Votre spécialiste de l'immobilier d'entreprise dans les Yvelines et le Val d'Oise</p>
                        </div>
                    </div>
                    <div class="row mb-5">
                        <div class="col-12 col-lg-4 px-0 pe-lg-5">
                            <div class="d-flex flex-column gap-4">
                                <div class="d-flex flex-column gap-2 mb-5">
                                    <p class="footer-baseline">Ne loupez rien des actualités et exclusivités de YFIMO</p>
                                    <form class="f_newsletter bg-white br-6 w-100 p-1 d-flex gap-2" id="f_newsletter">
                                        <input type="email" placeholder="votre@email.com" class="form-control border-0">
                                        <button type="submit" class="btn btn-picto bg-orange" aria-label="S'inscrire">
                                            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5 12H19M12 19L19 12L12 5" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
                                        </button>
                                    </form>
                                </div>
                                {% for section in socialFooterSections %}
                                    <div class="d-flex gap-2">
                                        {% for link in section.links %}
                                            {% if link.enabled %}
                                                <a href="{{ link.url }}" class="btn btn-picto-40 bg-orange" title="{{ link.label }}"{% if link.openInNewTab %} target="_blank" rel="noopener noreferrer"{% endif %}>
                                                    {% if link.icon == 'instagram' %}
                                                        <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.85 1.5H12.15C14.55 1.5 16.5 3.45 16.5 5.85V12.15C16.5 13.3037 16.0417 14.4101 15.2259 15.2259C14.4101 16.0417 13.3037 16.5 12.15 16.5H5.85C3.45 16.5 1.5 14.55 1.5 12.15V5.85C1.5 4.69631 1.9583 3.58987 2.77409 2.77409C3.58987 1.9583 4.69631 1.5 5.85 1.5ZM5.7 3C4.98392 3 4.29716 3.28446 3.79081 3.79081C3.28446 4.29716 3 4.98392 3 5.7V12.3C3 13.7925 4.2075 15 5.7 15H12.3C13.0161 15 13.7028 14.7155 14.2092 14.2092C14.7155 13.7028 15 13.0161 15 12.3V5.7C15 4.2075 13.7925 3 12.3 3H5.7ZM12.9375 4.125C13.1861 4.125 13.4246 4.22377 13.6004 4.39959C13.7762 4.5754 13.875 4.81386 13.875 5.0625C13.875 5.31114 13.7762 5.5496 13.6004 5.72541C13.4246 5.90123 13.1861 6 12.9375 6C12.6889 6 12.4504 5.90123 12.2746 5.72541C12.0988 5.5496 12 5.31114 12 5.0625C12 4.81386 12.0988 4.5754 12.2746 4.39959C12.4504 4.22377 12.6889 4.125 12.9375 4.125ZM9 5.25C9.99456 5.25 10.9484 5.64509 11.6517 6.34835C12.3549 7.05161 12.75 8.00544 12.75 9C12.75 9.99456 12.3549 10.9484 11.6517 11.6517C10.9484 12.3549 9.99456 12.75 9 12.75C8.00544 12.75 7.05161 12.3549 6.34835 11.6517C5.64509 10.9484 5.25 9.99456 5.25 9C5.25 8.00544 5.64509 7.05161 6.34835 6.34835C7.05161 5.64509 8.00544 5.25 9 5.25ZM9 6.75C8.40326 6.75 7.83097 6.98705 7.40901 7.40901C6.98705 7.83097 6.75 8.40326 6.75 9C6.75 9.59674 6.98705 10.169 7.40901 10.591C7.83097 11.0129 8.40326 11.25 9 11.25C9.59674 11.25 10.169 11.0129 10.591 10.591C11.0129 10.169 11.25 9.59674 11.25 9C11.25 8.40326 11.0129 7.83097 10.591 7.40901C10.169 6.98705 9.59674 6.75 9 6.75Z" fill="white"/></svg>
                                                    {% elseif link.icon == 'linkedin' %}
                                                        <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.20496 3.74977C5.20476 4.1476 5.04653 4.52905 4.76509 4.81021C4.48364 5.09138 4.10203 5.24922 3.70421 5.24902C3.30638 5.24882 2.92493 5.0906 2.64377 4.80915C2.3626 4.52771 2.20476 4.1461 2.20496 3.74827C2.20516 3.35045 2.36338 2.969 2.64483 2.68783C2.92627 2.40667 3.30788 2.24882 3.70571 2.24902C4.10353 2.24922 4.48498 2.40745 4.76615 2.68889C5.04731 2.97034 5.20516 3.35195 5.20496 3.74977ZM5.24996 6.35977H2.24996V15.7498H5.24996V6.35977ZM9.98996 6.35977H7.00496V15.7498H9.95996V10.8223C9.95996 8.07727 13.5375 7.82227 13.5375 10.8223V15.7498H16.5V9.80227C16.5 5.17477 11.205 5.34727 9.95996 7.61977L9.98996 6.35977Z" fill="white"/></svg>
                                                    {% elseif link.icon == 'youtube' %}
                                                        <svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.5 11.25L11.3925 9L7.5 6.75V11.25ZM16.17 5.3775C16.2675 5.73 16.335 6.2025 16.38 6.8025C16.4325 7.4025 16.455 7.92 16.455 8.37L16.5 9C16.5 10.6425 16.38 11.85 16.17 12.6225C15.9825 13.2975 15.5475 13.7325 14.8725 13.92C14.52 14.0175 13.875 14.085 12.885 14.13C11.91 14.1825 11.0175 14.205 10.1925 14.205L9 14.25C5.8575 14.25 3.9 14.13 3.1275 13.92C2.4525 13.7325 2.0175 13.2975 1.83 12.6225C1.7325 12.27 1.665 11.7975 1.62 11.1975C1.5675 10.5975 1.545 10.08 1.545 9.63L1.5 9C1.5 7.3575 1.62 6.15 1.83 5.3775C2.0175 4.7025 2.4525 4.2675 3.1275 4.08C3.48 3.9825 4.125 3.915 5.115 3.87C6.09 3.8175 6.9825 3.795 7.8075 3.795L9 3.75C12.1425 3.75 14.1 3.87 14.8725 4.08C15.5475 4.2675 15.9825 4.7025 16.17 5.3775Z" fill="white"/></svg>
                                                    {% else %}
                                                        <span>{{ link.label|slice(0, 1) }}</span>
                                                    {% endif %}
                                                </a>
                                            {% endif %}
                                        {% endfor %}
                                    </div>
                                {% endfor %}
                            </div>
                        </div>
                        <div class="col-12 col-lg-8 px-0">
                            <div class="row">
                                {% for section in mainFooterSections %}
                                    <div class="col-12 col-lg-4">
                                        <p class="maillage_titre">{{ section.title }}</p>
                                        <ul class="maillage pe-lg-5">
                                            {% for link in section.links %}
                                                {% if link.enabled %}
                                                    <li>
                                                        <a href="{{ link.url }}"{% if link.openInNewTab %} target="_blank" rel="noopener noreferrer"{% endif %}>{{ link.label }}</a>
                                                    </li>
                                                {% endif %}
                                            {% endfor %}
                                        </ul>
                                    </div>
                                {% endfor %}
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-12 col-lg-6 px-0">
                            <p class="last_text">&copy; {{ 'now'|date('Y') }} YFIMO</p>
                        </div>
                        <div class="col-12 col-lg-6 px-0">
                            <ul class="last_links">
                                {% for section in legalFooterSections %}
                                    {% for link in section.links %}
                                        {% if link.enabled %}
                                            <li>
                                                <a href="{{ link.url }}" title="{{ link.label }}"{% if link.openInNewTab %} target="_blank" rel="noopener noreferrer"{% endif %}>{{ link.label }}</a>
                                            </li>
                                        {% endif %}
                                    {% endfor %}
                                {% endfor %}
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</footer>