<!doctype html>
<html lang="vi">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title><%= title %> | Robot Installer</title>
  <link rel="stylesheet" href="/vendor/montserrat/index.css">
  <link rel="stylesheet" href="/vendor/notiflix/notiflix-<%= notiflixVersion %>.min.css">
  <link rel="stylesheet" href="/css/styles.css">
</head>
<body class="auth-shell" <% if (notice) { %>data-notice-type="<%= notice.type %>" data-notice="<%= notice.message %>"<% } %>>
  <main class="auth-page">
    <section class="auth-panel">
      <div class="auth-brand">
        <div class="brand-mark">
          <span class="material-symbols-outlined">precision_manufacturing</span>
        </div>
        <div class="brand-copy">
          <strong>Robot Installer</strong>
          <span>Email Confirmation</span>
        </div>
      </div>

      <div class="auth-confirm-icon">
        <span class="material-symbols-outlined">mark_email_unread</span>
      </div>

      <div class="auth-heading">
        <h1>Kiểm tra email</h1>
        <p>Chúng tôi đã gửi link xác nhận tới email đăng ký. Tài khoản chỉ được kích hoạt sau khi bạn bấm link confirm.</p>
      </div>

      <form class="auth-form" method="post" action="/resend-confirmation">
        <label class="form-field">
          <span>Email đăng ký</span>
          <input type="email" name="email" value="<%= email %>" autocomplete="email" required>
        </label>
        <button class="btn btn-secondary auth-submit" type="submit">
          <span class="material-symbols-outlined">forward_to_inbox</span>
          Gửi lại email xác nhận
        </button>
      </form>

      <p class="auth-switch">Đã xác nhận? <a href="/login">Đăng nhập</a></p>
    </section>
  </main>

  <script src="/vendor/notiflix/notiflix-<%= notiflixVersion %>.min.js"></script>
  <script src="/js/app.js"></script>
</body>
</html>
