<section class="auth-shell auth-shell--reset">
    <aside class="auth-shell__intro dashboard-panel">
        <div class="auth-shell__brand">
            {include file="$template/includes/hostique-logo-lockup.tpl" hostiqueLogoClass="hostique-logo-lockup--auth" hostiqueLogoAlt=$brandName|default:'Nebulix'|cat:' Cloud Hosting Platform'}
        </div>
        <h2 class="auth-shell__title">{lang key='pwreset'}</h2>
        <p class="auth-shell__copy">{lang key='pwresetemailneeded'}</p>

        <div class="auth-shell__hero-art auth-shell__hero-art--reset" aria-hidden="true">
            <span class="auth-shell__hero-orbit auth-shell__hero-orbit--one"></span>
            <span class="auth-shell__hero-orbit auth-shell__hero-orbit--two"></span>
            <span class="auth-shell__hero-node auth-shell__hero-node--one"></span>
            <span class="auth-shell__hero-node auth-shell__hero-node--two"></span>
            <span class="auth-shell__hero-node auth-shell__hero-node--three"></span>
            <span class="auth-shell__hero-cloud"><i class="fas fa-cloud"></i></span>
            <span class="auth-shell__hero-server auth-shell__hero-server--one"><i class="fas fa-server"></i></span>
            <span class="auth-shell__hero-server auth-shell__hero-server--two"><i class="fas fa-server"></i></span>
            <span class="auth-shell__hero-shield auth-shell__hero-shield--large"><i class="fas fa-lock"></i></span>
        </div>

        <div class="auth-shell__features">
            <div class="auth-shell__feature">
                <span class="auth-shell__feature-icon"><i class="fas fa-envelope-open-text"></i></span>
                <div>
                    <strong>{lang key='pwreset'}</strong>
                    <p>{lang key='pwresetdesc'}</p>
                </div>
            </div>
            <div class="auth-shell__feature">
                <span class="auth-shell__feature-icon"><i class="fas fa-bolt"></i></span>
                <div>
                    <strong>{lang key='supportticketspagetitle'}</strong>
                    <p>{lang key='supportticketssystemdescription'}</p>
                </div>
            </div>
            <div class="auth-shell__feature">
                <span class="auth-shell__feature-icon"><i class="fas fa-shield-alt"></i></span>
                <div>
                    <strong>{lang key='knowledgebasetitle'}</strong>
                    <p>{lang key='knowledgebasedescription'}</p>
                </div>
            </div>
        </div>

    </aside>

    <div class="dashboard-panel auth-form">
        <div class="auth-form__header">
            <h3 class="auth-form__title">{lang key='pwreset'}</h3>
            <p class="auth-form__subtitle">{lang key='pwresetdesc'}</p>
        </div>

        {if $loggedin && $innerTemplate}
            {include file="$template/includes/alert.tpl" type="error" msg="{lang key='noPasswordResetWhenLoggedIn'}" textcenter=true}
        {else}
            {if $successMessage}
                {include file="$template/includes/alert.tpl" type="success" msg=$successTitle textcenter=true}
                <div class="auth-security-note">
                    <span class="auth-security-note__icon"><i class="fas fa-shield-alt"></i></span>
                    <div>
                        <h4>{lang key='pwresetvalidationsuccess'}</h4>
                        <p>{$successMessage}</p>
                    </div>
                </div>
            {else}
                {if $innerTemplate}
                    {include file="$template/password-reset-$innerTemplate.tpl"}
                {/if}
            {/if}
        {/if}
    </div>
</section>
