<%- include('../shared/_head', { title: title, portalCss: '/platform/payer/css/portal.css', bodyClass: 'payer-portal auth-page' }) %>

<div class="auth-shell">
  <div class="auth-card verify-card verify-card--<%= state %>">
    <div class="auth-header">
      <a href="/" class="back-link">← BeezifiPay</a>
      <div class="portal-badge portal-badge--payer">Payer</div>
    </div>

    <% if (state === 'success') { %>
    <div class="verify-icon verify-icon--success" aria-hidden="true">✓</div>
    <h1 class="auth-title">Email verified</h1>
    <p class="auth-sub"><%= message %></p>
    <a href="/payer/login" class="btn btn-primary btn-block">Continue to sign in</a>

    <% } else if (state === 'expired') { %>
    <div class="verify-icon verify-icon--warn" aria-hidden="true">⏱</div>
    <h1 class="auth-title">Link expired</h1>
    <p class="auth-sub"><%= message %></p>
    <p class="auth-sub">Sign in and request a new verification email.</p>
    <a href="/payer/login" class="btn btn-primary btn-block">Sign in</a>

    <% } else { %>
    <div class="verify-icon verify-icon--error" aria-hidden="true">✕</div>
    <h1 class="auth-title">Verification failed</h1>
    <p class="auth-sub"><%= message %></p>
    <a href="/payer/login" class="btn btn-ghost btn-block">Return to sign in</a>
    <% } %>
  </div>
</div>

<%- include('../shared/_foot', {}) %>
