<div class="admin-page">
  <div class="admin-page-head">
    <h1><%= mode === 'create' ? 'Nouveau pronostic' : 'Modifier le pronostic' %></h1>
    <a href="/admin/pronostics" class="btn btn-ghost">← Retour</a>
  </div>

  <div class="admin-panel admin-form-panel">
    <%- include('../partials/form-errors', { errors: errors }) %>

    <form action="<%= mode === 'create' ? '/admin/pronostics' : '/admin/pronostics/' + pronostic.id %>"
          method="post" class="form">
      <input type="hidden" name="_csrf" value="<%= csrfToken %>" />

      <div class="form-row">
        <div class="field">
          <label for="palier_number">Palier n°</label>
          <input type="number" id="palier_number" name="palier_number" min="1" max="999" required
                 value="<%= pronostic.palier_number || '' %>" />
        </div>
        <div class="field">
          <label for="status">Statut</label>
          <select id="status" name="status" required>
            <% statuses.forEach(function(s){ %>
              <option value="<%= s %>" <%= pronostic.status === s ? 'selected' : '' %>><%= statusLabels[s] %></option>
            <% }) %>
          </select>
        </div>
      </div>

      <div class="field">
        <label for="match_name">Match</label>
        <input type="text" id="match_name" name="match_name" required maxlength="190"
               placeholder="France - Espagne" value="<%= pronostic.match_name || '' %>" />
      </div>

      <div class="field">
        <label for="event_datetime">Date et heure de l'évènement</label>
        <input type="datetime-local" id="event_datetime" name="event_datetime" required
               value="<%= fmtDateTimeLocal(pronostic.event_datetime) %>" />
      </div>

      <div class="field">
        <label for="prediction">Pronostic</label>
        <input type="text" id="prediction" name="prediction" required maxlength="255"
               placeholder="France ou nul + plus de 1.5 buts" value="<%= pronostic.prediction || '' %>" />
      </div>

      <div class="form-row">
        <div class="field">
          <label for="odds">Cote</label>
          <input type="number" id="odds" name="odds" step="0.01" min="1" max="1000" required
                 placeholder="1.72" value="<%= pronostic.odds || '' %>" />
        </div>
        <div class="field">
          <label for="stake">Mise (€)</label>
          <input type="number" id="stake" name="stake" step="0.01" min="0" max="100000" required
                 placeholder="40" value="<%= pronostic.stake || '' %>" />
        </div>
      </div>

      <div class="field">
        <label for="admin_note">Note (optionnelle)</label>
        <textarea id="admin_note" name="admin_note" rows="3" maxlength="1000"
                  placeholder="Analyse, contexte, blessures..."><%= pronostic.admin_note || '' %></textarea>
      </div>

      <div class="field-check">
        <input type="checkbox" id="is_published" name="is_published"
               <%= (pronostic.is_published == 1 || pronostic.is_published === 'on') ? 'checked' : '' %> />
        <label for="is_published">Publier ce pronostic (visible par les membres VIP)</label>
      </div>

      <div class="form-actions">
        <button type="submit" class="btn btn-primary"><%= mode === 'create' ? 'Créer le pronostic' : 'Enregistrer les modifications' %></button>
        <a href="/admin/pronostics" class="btn btn-ghost">Annuler</a>
      </div>
    </form>
  </div>
</div>
