{{define "account-panel"}}
<div id="account-panel">
  {{if .AddError}}<p class="mt-4 rounded border border-red-200 bg-red-50 px-4 py-2 text-sm text-red-700">{{.AddError}}</p>{{end}}

  <div class="mt-4 rounded-xl border border-stone-200 bg-white p-4 shadow-sm">
    <form hx-post="/account/tags" hx-target="#account-panel" hx-swap="outerHTML" class="flex gap-2">
      <input name="tag_code" type="text" placeholder="Enter tag code (e.g. TEST000001)" class="flex-1 rounded border border-stone-300 px-3 py-2 text-sm" required>
      <button type="submit" class="rounded bg-stone-900 px-4 py-2 text-sm font-semibold text-white hover:bg-stone-700">Add tag</button>
    </form>
  </div>

  <div id="tag-list">
    {{template "tag-list" .Tags}}
  </div>
</div>
{{end}}