<div class="checkout-address-form">
    <div id="sylius-billing-address" {{ sylius_test_html_attribute('billing-address') }}>
        <h3 class="h3">{{ 'sylius.ui.billing_address'|trans }}</h3>

        {% include '@SyliusShop/Checkout/Address/_addressBookSelect.html.twig' %}

        {% if form.customer is defined %}
            {% include '@SyliusShop/Common/Form/_login.html.twig' with {'form': form.customer} %}
        {% endif %}
        {% include '@SyliusShop/Common/Form/_address.html.twig' with {'form': form.billingAddress, 'order': order, 'type': 'billing'} %}
        {{ form_row(form.differentShippingAddress, sylius_test_form_attribute('different-shipping-address')|sylius_merge_recursive({
            'attr': {
                'data-toggles': 'sylius-shipping-address'
            },
            'label_attr': {
                'data-test-different-shipping-address-label': '',
                'class': 'custom-switch'
            }
        } )) }}

        {{ sylius_template_event('sylius.shop.checkout.address.billing_address_form', {'order': order}) }}
    </div>

    <div id="sylius-shipping-address" class="checkout-address-shipping" {{ sylius_test_html_attribute('shipping-address') }}>
        <h3 class="h3">{{ 'sylius.ui.shipping_address'|trans }}</h3>

        {% include '@SyliusShop/Checkout/Address/_addressBookSelect.html.twig' %}

        {% include '@SyliusShop/Common/Form/_address.html.twig' with {'form': form.shippingAddress, 'order': order, 'type': 'shipping'} %}

        {{ sylius_template_event('sylius.shop.checkout.address.shipping_address_form', {'order': order}) }}
    </div>
</div>
