<div class="container account">

    <h1>{{ 'general.customers.account' | t }}</h1>

    <div class="account-details">
        <div class="account-details-address">
            <h2>{{ 'general.customers.address' | t }}</h2>
            {% if customer.default_address %}
                <p>{{ customer.default_address.address1 }}</p>
                {% if customer.default_address.address2 != "" %}
                    <p>{{ customer.default_address.address2 }}</p>
                {% endif %}
                <p>{{ customer.default_address.city}}, {% if address.province_code %}{{ customer.default_address.province_code }}, {% endif %}{{ customer.default_address.country }}</p>
                <p>{{ customer.default_address.zip }}</p>
                <p>{{ customer.default_address.phone }}</p>
            {% endif %}
        </div>

        <div class="account-details-orders">
            <h2>{{ 'general.customers.orders.title' | t }}</h2>
        
            {%- if customer.orders.size > 0 -%}
                <div class="account-details-orders-head">
                    <div>{{ 'general.customers.orders.order_number' | t }}</div>
                    <div>{{ 'general.customers.orders.date' | t }}</div>
                    <div>{{ 'general.customers.orders.payment_status' | t }}</div>
                    <div>{{ 'general.customers.orders.fulfillment_status' | t }}</div>
                    <div>{{ 'general.customers.orders.total' | t }}</div>
                </div>

                {%- for order in customer.orders -%}
                    <div class="account-details-orders-row">
                        <div>
                            <a href="{{ order.customer_url }}" aria-label="{{ 'general.customers.orders.order_number_link' | t: number: order.name }}">{{ order.name }}</a>
                        </div>
                        <div>{{ order.created_at | time_tag: format: 'date' }}</div>
                        <div>{{ order.financial_status_label }}</div>
                        <div>{{ order.fulfillment_status_label }}</div>
                        <div>{{ order.total_price | money_with_currency }}</div>
                    </div>
                {%- endfor -%}
            {%- else -%}
                <p>{{ 'general.customers.orders.none' | t }}</p>
            {%- endif -%}
        </div>
    </div>

</div>