<%- include('partials/header') %>

<main class="app-shell">
  <div class="container" style="max-width: 520px;">
    <div class="content-panel">
      <div class="eyebrow">Welcome back</div>
      <h2>Login to RestRight</h2>

      <% if (error) { %>
        <div class="alert alert-error"><%= error %></div>
      <% } %>
      <% if (success) { %>
        <div class="alert alert-success"><%= success %></div>
      <% } %>

      <form action="/login" method="POST" class="form-grid">
        <div class="form-group">
          <label for="email">Email</label>
          <input id="email" name="email" type="email" placeholder="you@example.com" required />
        </div>

        <div class="form-group">
          <label for="password">Password</label>
          <input id="password" name="password" type="password" placeholder="Enter your password" required />
        </div>

        <div class="form-group">
          <label for="captchaAnswer">What is <%= captchaQuestion %>?</label>
          <input
            id="captchaAnswer"
            name="captchaAnswer"
            type="number"
            inputmode="numeric"
            step="1"
            autocomplete="off"
            aria-describedby="captcha-help"
            placeholder="Enter the answer"
            required
          />
          <small id="captcha-help" style="color: var(--muted);">Complete this check to continue signing in.</small>
        </div>

        <button class="btn btn-primary" type="submit">Log In</button>
      </form>

      <p style="margin-top: 18px; color: var(--muted); text-align: center;">
        Need an account? <a href="/register" style="color: var(--primary);">Create one</a>
      </p>
      <p style="color: var(--muted); font-size: 0.9rem; text-align: center;">
        Demo login: demo@restright.com / restright123
      </p>
      <p style="color: var(--muted); font-size: 0.9rem; text-align: center;">
        Administrator? <a href="/admin/login" style="color: var(--primary);">Admin sign in</a>
      </p>
    </div>
  </div>
</main>

<%- include('partials/footer') %>
