{{template "layout" .}}

{{define "title"}}Players · Estus Shots{{end}}

{{define "content"}}
<fieldset class="tui-fieldset" style="padding: 2rem;">
  <legend>Players Management</legend>
  <p class="tui-text-white">
    Manage players who participate in the drinking game.
  </p>

  <section style="margin-top: 1.5rem;">
    <h2 class="tui-text-green">Player List</h2>
    <div 
      id="player-list"
      hx-get="/players/list"
      hx-trigger="load"
      hx-swap="innerHTML"
    >
      <div class="tui-panel">Loading players...</div>
    </div>
  </section>

  <section style="margin-top: 1.5rem;">
    <h2 class="tui-text-green">Add New Player</h2>
    <form hx-post="/players" hx-target="#player-list" hx-swap="innerHTML">
      <div class="tui-fieldset">
        <label for="player-name">Name:</label>
        <input type="text" id="player-name" name="name" required class="tui-input" />
        <button type="submit" class="tui-button" style="margin-top: 1rem;">Add Player</button>
      </div>
    </form>
  </section>
</fieldset>
{{end}}