<?php
declare(strict_types=1);
require_once __DIR__ . '/auth_helper.php';
require_login();
require_role(['Admin', 'Adviser', 'Officer']);

$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? 'Online Election System';
?>
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>Create Election | <?= htmlspecialchars($projectDescription) ?></title>
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="assets/css/style.css?v=<?= time() ?>">
</head>
<body>
  <nav class="navbar">
    <a href="index.php" class="brand">Click to Vote</a>
    <div>
      <a href="index.php" class="btn btn-outline">Back to Dashboard</a>
    </div>
  </nav>

  <div class="container" style="max-width: 600px;">
    <div class="card">
      <h1 style="margin-top: 0; font-size: 1.25rem;">New Election</h1>
      <p style="color: var(--text-muted); margin-bottom: 2rem;">Fill in the details to schedule a new election.</p>

      <form action="api/create_election.php" method="POST">
        <div class="form-group">
          <label class="form-label">Election Title</label>
          <input type="text" name="title" class="form-control" placeholder="e.g. SSG General Election 2026" required>
        </div>

        <div class="form-group">
          <label class="form-label">Description</label>
          <textarea name="description" class="form-control" rows="3" placeholder="Briefly describe the purpose of this election..."></textarea>
        </div>

        <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;">
          <div class="form-group">
            <label class="form-label">Start Date & Time</label>
            <input type="datetime-local" name="start_date" class="form-control" required>
          </div>
          <div class="form-group">
            <label class="form-label">End Date & Time</label>
            <input type="datetime-local" name="end_date" class="form-control" required>
          </div>
        </div>

        <div style="margin-top: 2rem; display: flex; gap: 1rem;">
          <button type="submit" class="btn btn-primary" style="flex: 1;">Create Election</button>
          <a href="index.php" class="btn btn-outline" style="flex: 1;">Cancel</a>
        </div>
      </form>
    </div>
  </div>
</body>
</html>
