{{define "content"}}
<div class="container">
  {{if .ProfileUser}}
    <div class="card p-4 mb-4 flex items-center justify-between flex-wrap gap-3">
      <div class="flex items-center gap-3">
        <span class="avatar avatar-lg">{{avatarInitial .ProfileUser.Username}}</span>
        <div>
          <div class="flex items-center gap-2">
            <h1 class="text-lg font-semibold" style="margin:0;">{{.ProfileUser.Username}}</h1>
            {{if .ProfileUser.IsAdmin}}
              <span class="badge">{{t .Lang "admin.role.admin"}}</span>
            {{end}}
          </div>
          {{if .ProfileUser.Bio}}
            <p class="text-sm text-muted mt-1" style="margin-bottom:0;">{{.ProfileUser.Bio}}</p>
          {{end}}
        </div>
      </div>
      {{if .CurrentUser}}
        {{if eq .CurrentUser.ID .ProfileUser.ID}}
          <a href="/settings" class="btn btn-outline btn-sm">{{icon "settings" "size-3.5"}} {{t .Lang "nav.settings"}}</a>
        {{end}}
      {{end}}
    </div>
  {{end}}

  <div class="flex items-center justify-between flex-wrap gap-3 mb-4">
    <h2 class="text-lg font-semibold" style="margin:0;">{{.PageHeading}}</h2>
    <div class="flex items-center gap-2">
      <div class="flex items-center" style="position:relative;">
        <input type="text" class="input" style="height:1.9rem;width:14rem;padding-right:1.8rem;" placeholder="{{t .Lang "repo.filter_ph"}}" data-search-input data-file-filter>
        <kbd class="kbd" style="position:absolute;right:0.4rem;pointer-events:none;">/</kbd>
      </div>
      {{if .CurrentUser}}
        <a href="/new" class="btn btn-primary">
          {{icon "plus" "size-4"}}
          <span>{{t .Lang "nav.new_repo"}}</span>
        </a>
      {{end}}
    </div>
  </div>

  {{if .Repos}}
    <div class="card">
      {{range .Repos}}
        <div class="dense-row" style="min-height:2.5rem;padding:0.4rem 0.85rem;" data-tree-row data-tree-name="{{.OwnerUsername}}/{{.Name}} {{.Description}}">
          <div class="flex items-center gap-2 min-w-0">
            {{if .IsPrivate}}
              {{icon "lock" "size-4"}}
            {{else}}
              {{icon "git-branch" "size-4"}}
            {{end}}
            <a href="/{{.OwnerUsername}}/{{.Name}}" class="font-medium text-sm">
              <span class="text-muted">{{.OwnerUsername}} /</span> <strong>{{.Name}}</strong>
            </a>
            {{if .IsPrivate}}
              <span class="badge badge-outline">{{t $.Lang "repo.private"}}</span>
            {{end}}
            {{if .Description}}
              <span class="text-xs text-muted truncate">— {{.Description}}</span>
            {{end}}
          </div>
          <div class="flex items-center gap-2.5 text-xs text-muted">
            <span class="font-mono">{{.DefaultBranch}}</span>
            <span>{{timeAgo .UpdatedAt $.Lang}}</span>
          </div>
        </div>
      {{end}}
    </div>
  {{else}}
    {{if .CurrentUser}}
      {{template "ui_empty_state" (dict "Icon" "git-branch" "Title" (t .Lang "repo.empty_list") "Subtitle" (t .Lang "repo.empty_list_sub") "ActionHref" "/new" "ActionLabel" (t .Lang "repo.new.title") "ActionIcon" "plus")}}
    {{else}}
      {{template "ui_empty_state" (dict "Icon" "git-branch" "Title" (t .Lang "repo.empty_list"))}}
    {{end}}
  {{end}}
</div>
{{end}}