<div class="tabs-container" id="tabs-agencies">
    <div class="tabs">
        {% for entity in entities %}
            <button
                    class="tab-button"
                    data-fulladdress="<h4>{{ entity.i18n(locale).name }}</h4><p>{{ entity.i18n(locale).address }}</p><p>{{ entity.i18n(locale).regularAddress }}</p><p>{{ entity.i18n(locale).hours }}</p><p>{{ entity.phoneNumber }}</p>"
                    {% if entity.email is not null and entity.email|length %}
                        data-email="{{ 'request.agencies.email'|trans({}, 'app') }}: <a href='mailto:{{ entity.email }}'>{{ entity.email }}</a>"
                    {% endif %}
                    {% if entity.customerService is not null and entity.customerService|length %}
                        data-customerService="{{ 'request.agencies.customer_service'|trans({}, 'app') }}: <a href='tel:{{ entity.customerService }}'> {{ entity.customerService }}</a>"
                    {% endif %}
                    {% if entity.zipCode is not null and entity.zipCode|length %}
                        data-zipCode="{{ 'request.agencies.po_box'|trans({}, 'app') }}: <span>{{ entity.zipCode }}</span> "
                    {% endif %}
                    {% if entity.swiftCode is not null and entity.swiftCode|length %}
                        data-swiftCode="{{ 'request.agencies.swift_code'|trans({}, 'app') }}: <span>{{ entity.swiftCode }}</span>"
                    {% endif %}
                    data-phone="{{ entity.phoneNumber }}"
                    data-hours="{{ entity.i18n(locale).hours }}"
                    data-address="{{ entity.i18n(locale).address }}"
                    data-regularAddress="{{ entity.i18n(locale).regularAddress }}"
                    data-lat="{{ entity.latitude }}"
                    data-lng="{{ entity.longitude }}">
                {{ entity.i18n(locale).name }}
            </button>
        {% endfor %}
    </div>
    <div class="tab-content active">
        <div class="tab-content-agency">
            <div class="tab-agency-infos">
                <div class="agency-location agency-location-off">
                    <p class="m-0"></p>
                </div>
                <div class="agency-location regular d-none">
                    <p class="m-0"></p>
                </div>
                <div class="agency-hours">
                    <p class="m-0"></p>
                </div>
                <div class="agency-mail">
                    <p class="m-0"></p>
                </div>
                <div class="agency-tel p-0">
                    <p class="m-0"></p>
                </div>
                <div class="agency-crc">
                    <p class="m-0"></p>
                </div>
                <div class="agency-swift">
                    <p class="m-0"> </p>
                </div>
                <div class="agency-bp">
                    <p class="m-0"></p>
                </div>
                <a href="tel:+229" title="{{ 'request.agencies.call_us'|trans({}, 'app') }}" class="agency-phone">{{ 'form.phone_number'|trans({}, 'app') }}</a>
                <a href="#" class="agency-road" target="_blank">{{ 'request.agencies.directions'|trans({}, 'app') }}</a>
            </div>
            <div class="tab-agency-map" id="googleMap" style="min-height: 600px;">
            </div>
        </div>
    </div>
</div>