<?php
// Security headers (may include a CSP that blocks inline scripts)
require __DIR__ . '/../security_headers.php';

session_start();
if (!empty($_SESSION['admin'])) {
  header('Location: /admin/dashboard.php');
  exit;
}

$errors = $_GET['e'] ?? null;
?>
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Admin Login</title>
  <link rel="icon" type="image/svg+xml" href="/public/img/umis_logo.svg">


  <!-- Styles -->
  <link rel="stylesheet" href="/public/css/styles.css">
  <link rel="stylesheet" href="/public/css/admin.css">
</head>
<body>
  <main class="split">
    <!-- Left: form -->
    <section class="panel form-panel">
      <div class="form-wrap">
        <div class="brand">
          <img src="/public/img/umis_logo.svg" alt="logo">
          <div class="brand-sub">Admin Panel</div>
        </div>

        <?php if ($errors): ?>
          <div class="alert"><?php echo htmlspecialchars($errors, ENT_QUOTES, 'UTF-8'); ?></div>
        <?php endif; ?>

        <form action="/admin/login_post.php" method="post" class="login-form" novalidate>
          <label for="email">E-Mail</label>
          <input type="email" id="email" name="email" required autocomplete="username">

          <div class="field" style="margin-top:12px">
            <label for="login_password">Password</label>
            <div class="pw-wrap">
              <input type="password"
                     name="password"
                     id="login_password"
                     required
                     autocomplete="current-password">
              <button type="button"
                      class="pw-eye"
                      aria-label="Show password"
                      data-target="login_password">
                <!-- eye -->
                <svg class="icon-eye" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
                  <path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12Z"/>
                  <circle cx="12" cy="12" r="3"/>
                </svg>
                <!-- eye-off -->
                <svg class="icon-eye-off" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
                  <path d="M17.94 17.94A10.94 10.94 0 0 1 12 19c-7 0-11-7-11-7a21.91 21.91 0 0 1 5.06-5.94M9.9 4.24A10.94 10.94 0 0 1 12 4c7 0 11 7 11 7a21.83 21.83 0 0 1-3.17 4.33"/>
                  <line x1="1" y1="1" x2="23" y2="23"/>
                </svg>
              </button>
            </div>
          </div>

          <button class="btn-primary" type="submit" style="margin-top:16px">Login</button>
        </form>
      </div>
    </section>

    <!-- Right: hero image -->
    <section class="panel hero-panel">
      <img class="hero-img" src="/public/img/hero.jpg" alt="">
    </section>
  </main>

  <!-- Scripts (defer to satisfy CSP; no inline JS) -->
  <!-- If you don't use app.js here, you can remove it -->
  <script src="/public/js/app.js" defer></script>
  <script src="/public/js/pw-toggle.js" defer></script>
</body>
</html>
