{{define "content"}}
<div class="container">
  {{template "repo_header" .}}

  <div class="flex items-center justify-between flex-wrap gap-2 mb-3">
    <div class="flex items-center gap-1.5">
      <a href="/{{.Repo.OwnerUsername}}/{{.Repo.Name}}/issues?state=open" class="btn {{if not .ShowClosed}}btn-secondary{{else}}btn-ghost{{end}} btn-sm">
        {{icon "alert-circle" "size-3.5"}}
        <span>{{t .Lang "issue.open"}} ({{.OpenCount}})</span>
      </a>
      <a href="/{{.Repo.OwnerUsername}}/{{.Repo.Name}}/issues?state=closed" class="btn {{if .ShowClosed}}btn-secondary{{else}}btn-ghost{{end}} btn-sm">
        {{icon "check" "size-3.5"}}
        <span>{{t .Lang "issue.closed"}} ({{.ClosedCount}})</span>
      </a>
    </div>

    {{if .CurrentUser}}
      <a href="/{{.Repo.OwnerUsername}}/{{.Repo.Name}}/issues/new" class="btn btn-primary btn-sm">
        {{icon "plus" "size-3.5"}}
        <span>{{t .Lang "issue.new"}}</span>
      </a>
    {{end}}
  </div>

  {{if .Issues}}
    <div class="card">
      <div class="dense-list">
        {{range .Issues}}
          <div class="dense-row" style="min-height:2.75rem;padding:0.5rem 0.85rem;">
            <div class="flex items-center gap-2.5 min-w-0">
              {{if .IsClosed}}
                <span class="text-muted">{{icon "check" "size-4"}}</span>
              {{else}}
                <span style="color:hsl(var(--primary));">{{icon "alert-circle" "size-4"}}</span>
              {{end}}
              <div class="flex flex-col min-w-0">
                <div class="flex items-center gap-2 min-w-0">
                  <a href="/{{$.Repo.OwnerUsername}}/{{$.Repo.Name}}/issues/{{.Number}}" class="font-semibold text-sm truncate">{{.Title}}</a>
                  <span class="font-mono text-xs text-muted">#{{.Number}}</span>
                </div>
                <div class="text-xs text-muted flex items-center gap-1.5">
                  <span>@{{.AuthorUsername}}</span>
                  <span>·</span>
                  <span>{{timeAgo .CreatedAt $.Lang}}</span>
                </div>
              </div>
            </div>
            <div class="flex items-center gap-2 text-xs text-muted flex-shrink-0">
              {{if gt .CommentCount 0}}
                <span class="flex items-center gap-1 font-mono">
                  {{icon "message" "size-3.5"}}
                  <span>{{.CommentCount}}</span>
                </span>
              {{end}}
            </div>
          </div>
        {{end}}
      </div>
    </div>
  {{else}}
    {{if .CurrentUser}}
      {{template "ui_empty_state" (dict "Icon" "alert-circle" "Title" (t .Lang "issue.empty") "ActionHref" (printf "/%s/%s/issues/new" .Repo.OwnerUsername .Repo.Name) "ActionLabel" (t .Lang "issue.new") "ActionIcon" "plus")}}
    {{else}}
      {{template "ui_empty_state" (dict "Icon" "alert-circle" "Title" (t .Lang "issue.empty"))}}
    {{end}}
  {{end}}
</div>
{{end}}