{{define "content"}}
<div class="container" style="max-width:23rem;padding-top:2rem;">
  <div class="card">
    <div class="card-header">
      <h1 class="text-base font-semibold" style="margin:0;">{{t .Lang "auth.login.title"}}</h1>
    </div>
    <form method="post" action="/login" class="card-body flex flex-col gap-3">
      <input type="hidden" name="_csrf" value="{{.CSRFToken}}">
      {{if .Next}}<input type="hidden" name="next" value="{{.Next}}">{{end}}
      <div>
        <label class="label" for="login">{{t .Lang "auth.username_or_email"}}</label>
        <input id="login" name="login" type="text" class="input" value="{{.FormLogin}}" required autofocus autocomplete="username">
      </div>
      <div>
        <label class="label" for="password">{{t .Lang "auth.password"}}</label>
        <input id="password" name="password" type="password" class="input" required autocomplete="current-password">
      </div>
      <button type="submit" class="btn btn-primary w-full mt-1">
        <span>{{t .Lang "auth.submit_login"}}</span>
      </button>
    </form>
    {{if .RegistrationEnabled}}
      <div class="card-footer text-xs text-muted flex items-center justify-between">
        <span>{{t .Lang "auth.no_account"}}</span>
        <a href="/register" class="font-medium" style="color:hsl(var(--foreground));">{{t .Lang "nav.register"}} →</a>
      </div>
    {{end}}
  </div>
</div>
{{end}}