{{#if model}}
<div id="root" class="page-unauthorized page-login bg-splash">
    <div class="container-fluid container-sm vh-100">
        <div class="row flex-column h-100 align-items-center justify-content-between">
            <!-- HEADER -->
            <section id="header" class="col text-md-center">
                <div class="logo-hino-wrapper">
                    <img src="{{rootURL}}assets/images/logo.svg" alt="Hino" class="logo" />
                </div>
            </section>
            <!-- MAIN -->
            <section id="main" class="col col-sm-8 col-lg-4">
            <div class="logo-hearts-wrapper mb-10 text-center">
                <img src="{{rootURL}}assets/images/logo-heart-horizontal.svg" class="logo-hearts img-fluid" alt="Hearts">
            </div>
            {{#if errorMessage}}
                <div class="alert on alert-danger alert-dismissible fade show" role="alert">
                    {{ errorMessage }}
                </div>
            {{/if}}
            {{#if errorMessages}}
                <div class="alert on alert-danger alert-dismissible fade show" role="alert">
                    <ul class="mb-0 ml-2">
                    {{#each errorMessages as |item| }}
                        <li>{{ item }}</li>
                    {{/each}}
                    </ul>
                </div>
            {{/if}}
            <form>
                <span style="color: white;"><b>Reset Password</b></span>
                <div class="form-group">
                     <AppInputText @type="password" @model={{ model }} @placeholder="New Password" @valuePath="newPassword" @isEditable={{ if formConfig.emailAddress formConfig.emailAddress.isEditable true }} />
                </div>
                <div class="form-group">
                     <AppInputText @type="password" @model={{ model }} @placeholder="Confirm New Password" @valuePath="confirmNewPassword" @isEditable={{ if formConfig.emailAddress formConfig.emailAddress.isEditable true }} />
                    {{!-- <Input @value={{ model }} type="password" id="confirmnewPassword" name="confirmnewPassword" class="form-control  bg-white mt-2" @valuePath="confirmnewPassword" placeholder="Confirm New Password" required="" /> --}}
                </div>
                <button class="btn btn-block btn-hino-red-darker font-weight-bold rounded-pill" type="submit" {{ action "resetPassword" }}>Reset</button>
            </form>
            <p class="m-0 mt-8 text-center">
                {{!-- <LinkTo @route="forgot-password">Forgot Password?</LinkTo> --}}
                {{!-- <a href="forgot-password.html" class="text-gray-600 text-center font-style-underline">
                <u>Forgot Password?</u>
                </a> --}}
            </p>
            </section>

            <!-- FOOTER -->
            <section id="footer" class="col text-center">
            <p class="text-center small mb-4">
                Copyright 2020 HINO New HEARTS. All Rights Reserved.
            </p>
            </section>
            
        </div>
    </div>
</div>
    {{else}}
<div>Please klik Forgot Password in Login Page to be access Reset Password</div>

{{/if}}