{{define "content"}}
<div class="container">
  <!-- Profile header -->
  <div class="card p-4 mb-4">
    <div class="flex items-start gap-4 flex-wrap">
      {{avatar .ProfileUser.Username .ProfileUser.AvatarURL "avatar-xl"}}
      <div class="min-w-0 flex-1">
        <div class="flex items-center gap-2 flex-wrap">
          <h1 class="text-xl font-bold" style="margin:0;line-height:1.2;">{{if .ProfileUser.FullName}}{{.ProfileUser.FullName}}{{else}}{{.ProfileUser.Username}}{{end}}</h1>
          {{if .ProfileUser.IsAdmin}}
            <span class="badge badge-primary">{{t .Lang "admin.role.admin"}}</span>
          {{end}}
        </div>
        <div class="text-sm text-muted font-mono">@{{.ProfileUser.Username}}</div>

        {{if .ProfileUser.Bio}}
          <p class="text-sm" style="margin:0.45rem 0 0;max-width:38rem;">{{.ProfileUser.Bio}}</p>
        {{end}}

        <div class="flex items-center flex-wrap gap-3 text-xs text-muted mt-2">
          {{if .ProfileUser.Location}}
            <span class="flex items-center gap-1">
              {{icon "map-pin" "size-3.5"}}
              <span>{{.ProfileUser.Location}}</span>
            </span>
          {{end}}
          {{if .ProfileUser.Website}}
            <a href="{{.ProfileUser.Website}}" target="_blank" rel="noopener noreferrer" class="flex items-center gap-1" style="color:hsl(var(--foreground));">
              {{icon "link" "size-3.5"}}
              <span>{{.ProfileUser.Website}}</span>
            </a>
          {{end}}
          <span class="flex items-center gap-1">
            {{icon "calendar" "size-3.5"}}
            <span>{{t .Lang "profile.joined"}}: {{formatShortDate .ProfileUser.CreatedAt}}</span>
          </span>
        </div>
      </div>

      <div class="flex items-center gap-2">
        {{if .CurrentUser}}
          {{if eq .CurrentUser.ID .ProfileUser.ID}}
            <a href="/settings" class="btn btn-outline btn-sm">
              {{icon "edit" "size-3.5"}}
              <span>{{t .Lang "profile.edit"}}</span>
            </a>
          {{end}}
        {{end}}
      </div>
    </div>
  </div>

  <!-- Repositories -->
  <div class="flex items-center justify-between flex-wrap gap-2 mb-3">
    <h2 class="text-base font-semibold" style="margin:0;">
      {{t .Lang "nav.repositories"}}
      <span class="text-muted font-mono text-sm" style="font-weight:400;">{{len .Repos}}</span>
    </h2>
    <div class="flex items-center gap-2">
      <div class="flex items-center" style="position:relative;">
        <input type="text" class="input" style="height:1.85rem;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}}
        {{if eq .CurrentUser.ID .ProfileUser.ID}}
          <a href="/new" class="btn btn-primary btn-sm" style="height:1.85rem;">
            {{icon "plus" "size-3.5"}}
            <span>{{t .Lang "nav.new_repo"}}</span>
          </a>
        {{end}}
      {{end}}
    </div>
  </div>

  {{if .Repos}}
    <div class="grid-2">
      {{range .Repos}}
        <div class="card p-3 flex flex-col gap-2" data-tree-row data-tree-name="{{.Name}} {{.Description}}">
          <div class="flex items-center justify-between gap-2">
            <a href="/{{.OwnerUsername}}/{{.Name}}" class="font-semibold text-sm flex items-center gap-1.5 truncate">
              {{if .IsPrivate}}
                {{icon "lock" "size-3.5"}}
              {{else}}
                {{icon "git-branch" "size-3.5"}}
              {{end}}
              <span class="truncate">{{.Name}}</span>
            </a>
            <span class="text-xs text-muted flex-shrink-0">{{timeAgo .UpdatedAt $.Lang}}</span>
          </div>
          {{if .Description}}
            <p class="text-xs text-muted" style="margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;">{{.Description}}</p>
          {{end}}
          <div class="text-xs text-muted font-mono flex items-center gap-1.5">
            {{icon "git-branch" "size-3.5"}}
            <span>{{.DefaultBranch}}</span>
          </div>
        </div>
      {{end}}
    </div>
  {{else}}
    {{if and .CurrentUser (eq .CurrentUser.ID .ProfileUser.ID)}}
      {{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}}