<%- include('../partials/head', { pageTitle: 'Lupa Password - ' + settings.storeName }) %>

<div class="auth-page-wrap">
  <div class="auth-card">
    <a href="/login" class="auth-back-home"><i class="fa-solid fa-arrow-left"></i> Kembali ke Login</a>

    <div class="auth-logo-row">
      <img src="<%= settings.logo %>" alt="" onerror="this.style.display='none'">
      <span class="store-name"><%= settings.storeName %></span>
    </div>

    <h1 class="auth-title">Lupa Password</h1>
    <p class="auth-subtitle">Masukkan email kamu, kami akan kirim link reset password</p>

    <% if (error) { %>
      <div class="auth-error"><i class="fa-solid fa-circle-exclamation"></i> <%= error %></div>
    <% } %>

    <% if (sent) { %>
      <div class="auth-success">
        <i class="fa-solid fa-circle-check"></i>
        Kalau email kamu terdaftar, link reset password sudah dikirim. Cek inbox (atau folder spam) kamu.
      </div>
      <a href="/login" class="btn-full-gold" style="display:flex;">
        <i class="fa-solid fa-right-to-bracket"></i> Kembali ke Login
      </a>
    <% } else { %>
      <form action="/forgot-password" method="POST">
        <div class="form-group">
          <label class="form-label"><i class="fa-solid fa-envelope"></i> Email</label>
          <div class="input-with-icon">
            <i class="fa-solid fa-envelope"></i>
            <input type="email" name="email" class="form-input" placeholder="email@example.com" required>
          </div>
        </div>

        <button type="submit" class="btn-full-gold">
          <i class="fa-solid fa-paper-plane"></i> Kirim Link Reset
        </button>
      </form>
    <% } %>
  </div>
</div>
</body>
</html>
