<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Sign-in</title>
    <style type="text/css">
     <%- include('main.css', {}); %>
    </style>
  </head>
  <body>
    <header role="navigation" class="header header__desktop fixed">
      <section class="header-wrap">
        <div class="logo-block">
          <img src="https://design.inrupt.com/atomic-core/img/solid.svg" />
        </div>
      </section>
    </header>
    <div class="main-content">
      <section class="main-content-section">
        <div class="wrapper">
          <h1 class="title--white">Sign In</h1>
          <div class="login-panel">
            <div class="panel-body">
              <form autocomplete="off" action="<%= details.pathPrefix %>/interaction/<%= details.uid %>/login" method="post">

                <%if (errorMessage) { %>
                  <div class="input-wrap">
                    <label style="color: #D0021B">
                      <%= errorMessage %>
                    </label>
                  </div>
                <% } %>

                <div class="input-wrap">
                  <label>Username:</label>
                  <input type="text" name="username" autofocus="on" <% if (prefilled.username) { %> value="<%= prefilled.username %>" <% } %>>
                </div>

                <div class="input-wrap">
                  <label>Password:</label>
                  <input type="password" name="password">
                </div>

                <div class="input-wrap">
                  <label class="checkbox"><input type="checkbox" name="remember" value="yes" checked="yes">Stay signed in</label>
                </div>

                <button type="submit" name="submit" class="ids-link-filled">Sign In</button>

                <hr />
                <div class="space-between">
                  
                  <a href="<%= details.pathPrefix %>/interaction/<%= details.uid %>/register" class="link">Register</a>
                  <a href="<%= details.pathPrefix %>/interaction/<%= details.uid %>/forgotpassword" class="link">Forgot Password</a>
                </div>
              </form>
            </div>
          </div>
        </div>
      </section>
    </div>
  </body>
</html>
