{{ define "content" }}
<h2>Create your account</h2>
{{ if .Flash }}<div class="flash">{{ .Flash }}</div>{{ end }}

<form method="POST" action="/account/signup" class="form">
  <input type="hidden" name="csrf_token" value="{{ .CSRFToken }}">

  <div class="mb-3">
    <label for="username">Username</label>
    <input type="text" name="username" id="username" required class="form-control"
           value="{{ with .Form }}{{ .Username }}{{ end }}">
    {{ with .Errors }}{{ with index . "username" }}<div class="error">{{ . }}</div>{{ end }}{{ end }}
  </div>

  <div class="mb-3">
    <label for="email">Email</label>
    <input type="email" name="email" id="email" required class="form-control"
           value="{{ with .Form }}{{ .Email }}{{ end }}">
    {{ with .Errors }}{{ with index . "email" }}<div class="error">{{ . }}</div>{{ end }}{{ end }}
  </div>

  <div class="mb-3">
    <label for="password">Password</label>
    <input type="password" name="password" id="password" required class="form-control">
    {{ with .Errors }}{{ with index . "password" }}<div class="error">{{ . }}</div>{{ end }}{{ end }}
  </div>

  <div class="mb-3">
    <label for="password_confirm">Confirm Password</label>
    <input type="password" name="password_confirm" id="password_confirm" required class="form-control">
    {{ with .Errors }}{{ with index . "password_confirm" }}<div class="error">{{ . }}</div>{{ end }}{{ end }}
  </div>

  <div class="form-check mb-3">
    <input type="checkbox" name="accept_terms" id="accept_terms" class="form-check-input"
           {{ with .Form }}{{ if .AcceptTerms }}checked{{ end }}{{ end }}>
    <label for="accept_terms" class="form-check-label">I accept the terms</label>
    {{ with .Errors }}{{ with index . "accept_terms" }}<div class="error">{{ . }}</div>{{ end }}{{ end }}
  </div>

  <button type="submit" class="btn btn-primary">Create account</button>
</form>
{{ end }}