<!DOCTYPE html>
<html>
  <head>
    <title>Neues Medikament</title>
    <link rel="stylesheet" href="/css/bootstrap.min.css" />
  </head>
  <body class="bg-light">
    <div class="container mt-4">
      <h4>➕ Neues Medikament</h4>

      <% if (error) { %>
      <div class="alert alert-danger"><%= error %></div>
      <% } %>

      <form method="POST" action="/medications/create">
        <div class="mb-3">
          <label class="form-label">Medikament</label>
          <input name="name" class="form-control" required />
        </div>

        <div class="mb-3">
          <label class="form-label">Darreichungsform</label>
          <select name="form_id" class="form-control" required>
            <% forms.forEach(f => { %>
            <option value="<%= f.id %>"><%= f.name %></option>
            <% }) %>
          </select>
        </div>

        <div class="mb-3">
          <label class="form-label">Dosierung</label>
          <input name="dosage" class="form-control" required />
        </div>

        <div class="mb-3">
          <label class="form-label">Packung</label>
          <input name="package" class="form-control" />
        </div>

        <button class="btn btn-success">Speichern</button>
        <a href="/medications" class="btn btn-secondary">Abbrechen</a>
      </form>
    </div>
  </body>
</html>
