{{ define "content" }}
<a href="/account/tickets/add_ticket">+ Add Ticket</a>
<h2>My Tickets</h2>

{{ if eq (len .Tickets) 0 }}
  <p>You haven’t logged any tickets yet.</p>
{{ else }}
  <table>
    <thead>
      <tr>
        <th>Game</th>
        <th>Draw Date</th>
        <th>Numbers</th>
        <th>Bonus</th>
        <th>Purchased</th>
        <th>Via</th>
        <th>Image</th>
        <th>Prize</th>
      </tr>
    </thead>
    <tbody>
      {{ range .Tickets }}
      {{ $ticket := . }}
      <tr>
        <td>{{ $ticket.GameType }}</td>
        <td>{{ $ticket.DrawDate }}</td>
        <td>
          <div class="flex flex-wrap gap-1">
            {{ range $i, $ball := $ticket.Balls }}
            <div class="ball game-{{lower $ticket.GameType}} {{ if eq $ticket.GameType "Lotto" }}lotto-range-{{rangeClass $ball}} {{ end }}{{ if inSlice $ball $ticket.MatchedDraw.Balls }}matched pulse{{ end }}">
              {{ $ball }}
            </div>
          {{ end }}
          </div>
          {{ if or (gt $ticket.MatchedMain 0) (gt $ticket.MatchedBonus 0) }}
          <div class="text-xs text-gray-500 mt-1">
            {{ $ticket.MatchedMain }} match{{ if ne $ticket.MatchedMain 1 }}es{{ end }}
            {{ if gt $ticket.MatchedBonus 0 }}, {{ $ticket.MatchedBonus }} bonus{{ end }}
          </div>
          {{ end }}
        </td>
        <td>
          {{ if eq $ticket.GameType "Lotto" }}
          <span style="color: lightgray; font-style: italic;">–</span>
        {{ else if gt (intVal $ticket.Bonus2) 0 }}
          <div class="flex flex-wrap gap-1">
            {{ if gt (intVal $ticket.Bonus1) 0 }}
              {{ $b1 := intVal $ticket.Bonus1 }}
              <div class="ball game-{{lower $ticket.GameType}} bonus{{ if inSlice $b1 $ticket.MatchedDraw.BonusBalls }} matched-bonus{{ end }}">
                {{ $b1 }}
              </div>
            {{ end }}
            {{ $b2 := intVal $ticket.Bonus2 }}
            <div class="ball game-{{lower $ticket.GameType}} bonus{{ if inSlice $b2 $ticket.MatchedDraw.BonusBalls }} matched-bonus{{ end }}">
              {{ $b2 }}
            </div>
          </div>
        {{ else if gt (intVal $ticket.Bonus1) 0 }}
          {{ $b := intVal $ticket.Bonus1 }}
          <div class="ball game-{{lower $ticket.GameType}} bonus{{ if inSlice $b $ticket.MatchedDraw.BonusBalls }} matched-bonus{{ end }}">
            {{ $b }}
          </div>
        {{ else }}
          <span style="color: lightgray;">–</span>
        {{ end }}
        </td>
        <td>{{ .PurchaseDate }}</td>
        <td>{{ .PurchaseMethod }}</td>
        <td>
          {{ if .ImagePath }}
            <a href="/{{ .ImagePath }}" target="_blank">View</a>
          {{ else }}–{{ end }}
        </td>
        <td>
          {{ if $ticket.IsWinner }}
          {{ if eq $ticket.PrizeLabel "" }}
            <span class="text-yellow-500 italic">pending</span>
          {{ else if eq $ticket.PrizeLabel "Free Ticket" }}
            🎟️ {{ $ticket.PrizeLabel }}
          {{ else }}
            💷 {{ $ticket.PrizeLabel }}
          {{ end }}
        {{ else }}
          –
        {{ end }}        
        </td>
      </tr>
      {{ end }}
    </tbody>
  </table>
{{ end }}
{{ end }}