<?php $title = 'Acesso — '.h($event['name']); ?>

<div style="min-height:70vh;display:flex;align-items:center;justify-content:center;padding:24px;">
  <div style="width:100%;max-width:380px;">

    <!-- Ícone -->
    <div style="text-align:center;margin-bottom:28px;">
      <div style="width:64px;height:64px;background:#1f2937;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:28px;margin:0 auto 16px;">
        🔒
      </div>
      <h1 style="font-size:22px;font-weight:700;color:#fff;margin-bottom:6px;"><?= h($event['name']) ?></h1>
      <p style="font-size:14px;color:#6b7280;">Este evento está protegido. Introduz a password para ver as fotografias.</p>
    </div>

    <!-- Erro -->
    <?php if(!empty($blocked)): ?>
    <div style="background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.3);color:#f87171;padding:11px 14px;border-radius:10px;margin-bottom:16px;font-size:13px;text-align:center;">
      🔒 Demasiadas tentativas. Aguarda 15 minutos.
    </div>
    <?php elseif($error): ?>
    <div style="background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.3);color:#f87171;padding:11px 14px;border-radius:10px;margin-bottom:16px;font-size:13px;text-align:center;">
      ✕ Password incorreta. Tens <?= max(0, 5 - ($_SESSION['event_pw_'.$event['id'].'_'.md5($_SERVER['REMOTE_ADDR']??'')]['count'] ?? 0)) ?> tentativas restantes.
    </div>
    <?php endif; ?>

    <!-- Formulário -->
    <form method="post" action="<?= base_url('evento/'.h($event['slug'])) ?>">
      <?= csrf_field() ?>
      <div style="margin-bottom:14px;">
        <label style="display:block;font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:#9ca3af;margin-bottom:7px;">
          Password
        </label>
        <input type="password" name="event_password" required autofocus
               style="width:100%;background:#1f2937;border:1px solid rgba(255,255,255,.12);border-radius:8px;
                      padding:12px 14px;font-size:16px;color:#f9fafb;outline:none;font-family:inherit;
                      transition:border-color .15s;"
               onfocus="this.style.borderColor='rgba(255,255,255,.4)'"
               onblur="this.style.borderColor='rgba(255,255,255,.12)'"
               placeholder="••••••••">
      </div>
      <button type="submit"
              style="width:100%;background:#fff;color:#111827;border:none;border-radius:10px;padding:13px;
                     font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;transition:background .15s;"
              onmouseover="this.style.background='#f3f4f6'" onmouseout="this.style.background='#fff'">
        Entrar →
      </button>
    </form>

    <div style="text-align:center;margin-top:20px;">
      <a href="<?= base_url() ?>" style="font-size:13px;color:#4b5563;transition:color .15s;"
         onmouseover="this.style.color='#9ca3af'" onmouseout="this.style.color='#4b5563'">
        ← Voltar aos eventos
      </a>
    </div>
  </div>
</div>
