{extends file="layout.tpl"}

{* Body Class *}
{block name="body-class"}page-password{/block}

{* Breadcrumb *}
{block name='no-return-functions' append}
{$breadcrumbs = [
['title' => {intl l="Password"}, 'url'=>{url path="/password"}]
]}
{/block}

{block name="main-content"}

{* This page should not replace the current previous URL *}
{set_previous_url ignore_current="1"}

<div class="main">
    <article class="col-main" role="main" aria-labelledby="main-label">
        <h1 id="main-label" class="page-header">{intl l="Password Forgotten"}</h1>
        {hook name="password.top"}
        {if $password_sent}
            <div id="form-forgotpassword">
                <div class="alert alert-success">
                    <p>{intl l="A new password has been sent to your e-mail address. Please check your mailbox."}</p>
                </div>

                <div class="group-btn">
                    <a href="{url path="/password"}" class="btn btn-default pull-left"><i class="fa fa-refresh"></i> {intl l="Send new password again"}</a>
                    <a href="{url path="/login"}" class="btn btn-primary"><i class="fa fa-sign-in"></i> {intl l="Sign in"}</a>
                </div>
            </div>
        {else}
            {form name="thelia.front.customer.lostpassword"}
            <form id="form-forgotpassword" action="{url path="/password"}" method="post">
                {form_hidden_fields}
                <p>{intl l="Please enter your email address below."} {intl l="You will receive a link to reset your password."}</p>
                {if $form_error}<div class="alert alert-danger">{$form_error_message}</div>{/if}
                {hook name="password.form-top"}
                {form_field field="success_url"}
                    <input type="hidden" name="{$name}" value="{url path='/password-sent'}">
                {/form_field}
                {form_field field="email"}
                <div class="form-group group-email {if $error}has-error{elseif !$error && $value != ""}has-success{/if}">
                    <label for="{$label_attr.for}">{$label}</label>
                    <div class="control-input">
                        <input type="email" name="{$name}" value="{$value}" id="{$label_attr.for}" class="form-control input-sm" maxlength="255" aria-required="true" autofocus required>
                        {if $error}
                        <span class="help-block">{$message}</span>
                        {elseif !$error && $value != ""}
                        <span class="help-block"><span class="fa fa-check"></span> {intl l="You will receive a link to reset your password."}</span>
                        {/if}
                    </div>
                </div>
                {/form_field}
                {hook name="password.form-bottom"}
                <div class="group-btn">
                    <a href="{url path="/login"}" class="btn btn-default pull-left"><i class="fa fa-chevron-left"></i> {intl l="Cancel"}</a>
                    <button type="submit" class="btn btn-primary"><i class="fa fa-chevron-right"></i> {intl l="Send"}</button>
                </div>
            </form>
            {/form}
        {/if}
        {hook name="password.bottom"}
    </article>
</div>
{/block}


{block name="stylesheet"}
{hook name="password.stylesheet"}
{/block}

{block name="after-javascript-include"}
{hook name="password.after-javascript-include"}
{/block}

{block name="javascript-initialization"}
{hook name="password.javascript-initialization"}
{/block}