{% sw_extends '@Storefront/storefront/page/account/_page.html.twig' %}

{% block page_account_main_content %}
    {% block page_account_overview %}
        <div class="account-overview">
            {% block page_account_overview_shipping_warning %}
                {% set ableToShipToShippingCountry = context.customer.defaultShippingAddress.country.shippingAvailable %}

                {% if not ableToShipToShippingCountry %}
                    {% sw_include '@Storefront/storefront/utilities/alert.html.twig' with {
                        type: 'warning',
                        content: 'account.overviewNotAbleToShip'|trans|sw_sanitize
                    } %}
                {% endif %}
            {% endblock %}

            {% block page_account_overview_request_group_info %}
                {% if page.customer.requestedGroup %}
                    {% sw_include '@Storefront/storefront/utilities/alert.html.twig' with {
                        type: 'info',
                        content: 'account.overviewCustomerGroupRequest'|trans({
                            '%group%': page.customer.requestedGroup.translated.name
                        })
                    } %}
                {% endif %}
            {% endblock %}

            {% block page_account_overview_welcome %}
                <div class="account-welcome">
                    <h1>{{ 'account.overviewTitle'|trans|sw_sanitize }}</h1>

                    {% block page_account_overview_welcome_intro %}
                        <p>{{ 'account.overviewInfo'|trans|sw_sanitize }}</p>
                    {% endblock %}
                </div>
            {% endblock %}

            {% block page_account_overview_main %}
                <div class="row">
                    {% block page_account_overview_profile %}
                        <div class="col-lg-6 card-col account-overview-card account-overview-profile">
                            {% block page_account_overview_profile_card %}
                                <div class="card">
                                    <div class="card-body">
                                        {% block page_account_overview_profile_title %}
                                            <h2 class="card-title">
                                                {{ 'account.overviewProfileHeader'|trans|sw_sanitize }}
                                            </h2>
                                        {% endblock %}

                                        {% block page_account_overview_profile_content %}
                                            <p>
                                                {% if context.customer.salutation and context.customer.salutation.salutationKey != 'not_specified' %}
                                                    {{ context.customer.salutation.translated.displayName }}
                                                {% endif %}
                                                {% if context.customer.title %}
                                                    {{ context.customer.title }}<br>
                                                {% endif %}
                                                {{ context.customer.firstName }} {{ context.customer.lastName }}
                                            </p>
                                        {% endblock %}

                                        {% block page_account_overview_profile_company %}
                                            {% sw_include '@Storefront/storefront/component/account/customer-overview-personal-company.html.twig' with {
                                                customer: context.customer,
                                            } %}
                                        {% endblock %}

                                        {% block page_account_overview_profile_email %}
                                            <p>
                                                {{ context.customer.email|decodeIdnEmail }}
                                            </p>
                                        {% endblock %}

                                        {% block page_account_overview_profile_actions %}
                                            <div class="card-actions">
                                                {% block page_account_overview_profile_actions_content %}{% endblock %}
                                            </div>
                                        {% endblock %}
                                    </div>
                                </div>
                            {% endblock %}
                        </div>
                    {% endblock %}
                </div>
            {% endblock %}

            {% block page_account_overview_newsletter %}
                <div class="account-overview-card account-overview-newsletter">
                    <div class="card">
                        <div class="card-body">
                            {% block page_account_overview_newsletter_title %}
                                <h2 class="card-title">
                                    {{ 'account.newsletterTitle'|trans|sw_sanitize }}
                                </h2>
                            {% endblock %}

                            {% block page_account_overview_newsletter_content %}
                                <div class="js-newsletter-wrapper">
                                    {% sw_include '@Storefront/storefront/page/account/newsletter.html.twig' with { newsletterAccountPagelet: page.getNewsletterAccountPagelet() } %}
                                </div>
                            {% endblock %}
                        </div>
                    </div>
                </div>
            {% endblock %}

            {% block page_account_overview_addresses_include %}
                {% sw_include '@Storefront/storefront/page/account/address.html.twig' %}
            {% endblock %}

            {% block page_account_overview_newest_order %}
                {% if page.newestOrder %}
                    <div class="account-overview-card account-overview-newest-order">
                        <div class="card">
                            <div class="card-body">
                                {% block page_account_overview_newest_order_title %}
                                    <h2 class="card-title">
                                        {{ 'account.overviewNewestOrderHeader'|trans|sw_sanitize }}
                                    </h2>
                                {% endblock %}

                                {% block page_account_overview_newest_order_content %}
                                    {% block page_account_overview_newest_order_table %}
                                        <div class="order-table">
                                            {% block page_account_overview_newest_order_table_body %}
                                                <div class="order-table-body"
                                                     data-order-detail-loader="true">
                                                    {% sw_include '@Storefront/storefront/page/account/order-history/order-item.html.twig' with {
                                                        order: page.newestOrder
                                                    } %}
                                                </div>
                                            {% endblock %}
                                        </div>
                                    {% endblock %}
                                {% endblock %}
                            </div>
                        </div>
                    </div>
                {% endif %}
            {% endblock %}
        </div>
    {% endblock %}
{% endblock %}