<div class="container-forget-password">
    <nav>
        <i class="material-icons" id="goBackLogin">arrow_back</i>
        <span data-i18n="forget-password-nav-title"></span>
    </nav>
    <div class="steps-form active" id="stepEmail">
        <span data-i18n="forget-password-span-email"></span>
        <div>
            <input type="email" id='emailForget' placeholder="" data-i18n="forget-password-span-email">
        </div>
        <button class="next-step">
            <span data-i18n="forget-password-span-next-step"></span>
            <i class="material-icons">arrow_forward</i>
        </button>
    </div>

    <div class="steps-form" id="stepConfirmationCode">
        <p data-i18n="forget-password-p1-info"></p>
        <p data-i18n="forget-password-p2-info"></p>
        <div class="container-confirmation-code">
            <input type="tel" id="codeVerifyPassword" maxlength="4" max="9999">
        </div>
        <button class="next-step">
            <span data-i18n="forget-password-btn-verify"></span>
            <i class="material-icons">arrow_forward</i>
        </button>
    </div>

    <div class="steps-form" id="stepNewPassword">
        <span data-i18n="forget-password-span-text-redefine-password"></span>
        <div>
            <label data-i18n="forget-password-label-new-password"></label>
            <input placeholder="" type="password" id="newPassword" data-i18n="forget-password-label-new-password">
        </div>
        <div>
            <label data-i18n="forget-password-label-new-re-password"></label>
            <input placeholder="" type="password" id="confirmationPassword" data-i18n="forget-password-label-new-re-password">
        </div>
        <button class="next-step">
            <span data-i18n="forget-password-btn-confirm-new-password"></span>
            <i class="material-icons">arrow_forward</i>
        </button>
    </div>
</div>
