<div name="order">
    <div class="quiqqer-order-ordering-timeline" style="display: none">
        <div class="quiqqer-order-ordering-timeline-container">
            <ul></ul>
        </div>
    </div>

    <div class="quiqqer-order-ordering-nobody"
         data-qui="package/quiqqer/order/bin/frontend/controls/orderProcess/Login"
    >
        {template_event name="quiqqer::order::orderProcess::nobody::begin"}

        {if $nobodyIntroTitle || $nobodyIntroDesc}
        <div class="quiqqer-order-ordering-nobody__intro">
            {if $nobodyIntroTitle}
                <h1 class="quiqqer-order-ordering-nobody__introTitle">{$nobodyIntroTitle}</h1>
            {/if}
            {if $nobodyIntroDesc}
                <div class="quiqqer-order-ordering-nobody__introDesc">
                    {$nobodyIntroDesc}
                </div>
            {/if}
        </div>
        {/if}

        <div class="quiqqer-order-ordering-nobody__tabs">
            <div class="quiqqer-order-ordering-nobody-tabs__aside">
                <ul class="quiqqer-order-ordering-nobody-tabNav">
                    <li class="quiqqer-order-ordering-nobody-tabNav__entry {if $activeEntry == 'login'}active{/if}" data-step-nav="login">
                        <a href="#login">
                            <span class="fa fa-right-to-bracket quiqqer-order-ordering-nobody-tabNav__icon"></span>
                            <div class="quiqqer-order-ordering-nobody-tabNav__label">
                                <span class="quiqqer-order-ordering-nobody-tabNav__title">
                                    {locale group='quiqqer/order' var='ordering.nobody.nav.login.title'}
                                </span>
                                <div class="quiqqer-order-ordering-nobody-tabNav__desc">
                                    {locale group='quiqqer/order' var='ordering.nobody.nav.login.desc'}
                                </div>
                            </div>
                        </a>
                    </li>
                    <li class="quiqqer-order-ordering-nobody-tabNav__entry {if $activeEntry == 'signup'}active{/if}" data-step-nav="signup">
                        <a href="#signup">
                            <span class="fa fa-user-plus quiqqer-order-ordering-nobody-tabNav__icon"></span>
                            <div class="quiqqer-order-ordering-nobody-tabNav__label">
                                <span class="quiqqer-order-ordering-nobody-tabNav__title">
                                    {locale group='quiqqer/order' var='ordering.nobody.nav.signup.title'}
                                </span>
                                <div class="quiqqer-order-ordering-nobody-tabNav__desc">
                                    {locale group='quiqqer/order' var='ordering.nobody.nav.signup.desc'}
                                </div>
                            </div>
                        </a>
                    </li>
    
                    {if $GuestOrder}
                        <li class="quiqqer-order-ordering-nobody-tabNav__entry {if $activeEntry == 'guest'}active{/if}" data-step-nav="guest">
                            <a href="#guest">
                                <span class="fa fa-bag-shopping quiqqer-order-ordering-nobody-tabNav__icon"></span>
                                <div class="quiqqer-order-ordering-nobody-tabNav__label">
                                <span class="quiqqer-order-ordering-nobody-tabNav__title">
                                    {locale group='quiqqer/order' var='ordering.nobody.nav.guest.title'}
                                </span>
                                    <div class="quiqqer-order-ordering-nobody-tabNav__desc">
                                        {locale group='quiqqer/order' var='ordering.nobody.nav.guest.desc'}
                                    </div>
                                </div>
                            </a>
                        </li>
                    {/if}
                </ul>
            </div>
    
            <div class="quiqqer-order-ordering-nobody-tabs__main">
                <ul class="quiqqer-order-ordering-nobody-tabs-main__list">
                    <li class="quiqqer-order-ordering-nobody-tabs-main__item {if $activeEntry == 'login'}active{/if}"
                        {if $activeEntry !== 'login'}style="display: none;"{/if}
                        id="login"
                    >
                        {assign var=text value={locale group='quiqqer/order' var='ordering.nobody.login.text.prefix'}}
                        {if $text|trim != ''}
                            <div class="quiqqer-order-ordering-nobody-login-text quiqqer-order-ordering-nobody-login-text__prefix">
                                {$text}
                            </div>
                        {/if}
    
                        {$Login->create()}
    
                        {assign var=text value={locale group='quiqqer/order' var='ordering.nobody.login.text.suffix'}}
                        {if $text|trim != ''}
                            <div class="quiqqer-order-ordering-nobody-login-text quiqqer-order-ordering-nobody-login-text__suffix">
                                {$text}
                            </div>
                        {/if}

                        <span class="quiqqer-order-ordering-nobody-tabs-main__btnBack">
                            <span class="fa fa-angle-left"></span>
                            {locale group='quiqqer/order' var='ordering.nobody.mainContent.btn.back'}
                        </span>
                    </li>
    
                    <li class="quiqqer-order-ordering-nobody-tabs-main__item {if $activeEntry == 'signup'}active{/if}"
                        {if $activeEntry !== 'signup'}style="display: none;"{/if}
                        id="signup"
                    >
                        {assign var=text value={locale group='quiqqer/order' var='ordering.nobody.registration.text.prefix'}}
                        {if $text|trim != ''}
                            <div class="quiqqer-order-ordering-nobody-registration-text quiqqer-order-ordering-nobody-registration-text__prefix">
                                {$text}
                            </div>
                        {/if}
    
                        {$Registration->create()}
    
                        {locale group='quiqqer/order' var='ordering.nobody.registration.text.suffix' assign=text}
                        {if $text|trim != ''}
                            <div class="quiqqer-order-ordering-nobody-registration-text quiqqer-order-ordering-nobody-registration-text__suffix">
                                {$text}
                            </div>
                        {/if}

                        <span class="quiqqer-order-ordering-nobody-tabs-main__btnBack">
                            <span class="fa fa-angle-left"></span>
                            {locale group='quiqqer/order' var='ordering.nobody.mainContent.btn.back'}
                        </span>
                    </li>
    
                    {if $GuestOrder}
                        <li class="quiqqer-order-ordering-nobody-tabs-main__item {if $activeEntry == 'guest'}active{/if}"
                            {if $activeEntry !== 'guest'}style="display: none;"{/if}
                            id="guest"
                        >
                            {assign var=text value={locale group='quiqqer/order' var='ordering.nobody.guest.text.prefix'}}
                            {if $text|trim != ''}
                                <div class="quiqqer-order-ordering-nobody-registration-text quiqqer-order-ordering-nobody-guest-text__prefix">
                                    {$text}
                                </div>
                            {/if}
    
                            {$GuestOrder->create()}
    
                            {locale group='quiqqer/order' var='ordering.nobody.guest.text.suffix' assign=text}
                            {if $text|trim != ''}
                                <div class="quiqqer-order-ordering-nobody-registration-text quiqqer-order-ordering-nobody-guest-text__suffix">
                                    {$text}
                                </div>
                            {/if}

                            <span class="quiqqer-order-ordering-nobody-tabs-main__btnBack">
                            <span class="fa fa-angle-left"></span>
                            {locale group='quiqqer/order' var='ordering.nobody.mainContent.btn.back'}
                        </span>
                        </li>
                    {/if}
                </ul>
            </div>
        </div>

        {template_event name="quiqqer::order::orderProcess::nobody::end"}
    </div>

    <div class="quiqqer-order-ordering-buttons"></div>
</div>