<?php
/** @var ?string $error @var string $csrf @var string $next */
$warnIcon = '<svg class="icon" width="16" height="16" viewBox="0 0 16 16" aria-hidden="true">'
    . '<path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM8 1.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13Z"></path>'
    . '<rect x="7.25" y="4" width="1.5" height="5.5" rx="0.75"></rect><circle cx="8" cy="11.75" r="0.9"></circle></svg>';
?>
<div class="auth-page">
  <h1>Log in</h1>

  <?php if ($error !== null): ?>
  <div class="msg-error"><?= $warnIcon ?><div><?= h($error) ?></div></div>
  <?php endif; ?>

  <div class="box">
    <form class="form" method="post" action="?a=login">
      <input type="hidden" name="csrf" value="<?= h($csrf) ?>">
      <?php if ($next !== ''): ?>
      <input type="hidden" name="next" value="<?= h($next) ?>">
      <?php endif; ?>
      <div class="form-row">
        <label for="username">Username</label>
        <input type="text" id="username" name="username" autocomplete="username" required autofocus>
      </div>
      <div class="form-row">
        <label for="password">Password</label>
        <input type="password" id="password" name="password" autocomplete="current-password" required>
      </div>
      <button type="submit" class="primary">Log in</button>
    </form>
  </div>
</div>