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

  <!-- General Settings -->
  <section class="card mb-4">
    <div class="card-header">
      <span class="font-semibold flex items-center gap-2">{{icon "settings" "size-4"}} {{t .Lang "repo.tab.settings"}}</span>
    </div>
    <form method="post" action="/{{.Repo.OwnerUsername}}/{{.Repo.Name}}/settings" class="card-body flex flex-col gap-3">
      <input type="hidden" name="_csrf" value="{{.CSRFToken}}">

      <div>
        <label class="label" for="description">{{t .Lang "repo.description"}}</label>
        <input id="description" name="description" type="text" class="input" value="{{.Repo.Description}}" maxlength="500" placeholder="{{t .Lang "repo.description_ph"}}">
      </div>

      <div class="grid-2">
        <div>
          <label class="label" for="default_branch">{{t .Lang "repo.default_branch"}}</label>
          <select id="default_branch" name="default_branch" class="select font-mono">
            {{if .Branches}}
              {{range .Branches}}
                <option value="{{.}}" {{if eq . $.Repo.DefaultBranch}}selected{{end}}>{{.}}</option>
              {{end}}
            {{else}}
              <option value="{{.Repo.DefaultBranch}}" selected>{{.Repo.DefaultBranch}}</option>
            {{end}}
          </select>
        </div>

        <div>
          <label class="label" for="visibility">{{t .Lang "repo.visibility"}}</label>
          <select id="visibility" name="visibility" class="select">
            <option value="public" {{if not .Repo.IsPrivate}}selected{{end}}>{{t .Lang "repo.public"}}</option>
            <option value="private" {{if .Repo.IsPrivate}}selected{{end}}>{{t .Lang "repo.private"}}</option>
          </select>
        </div>
      </div>

      <!-- Feature Toggles for Repository -->
      <div class="card p-3 mt-1" style="background:hsl(var(--muted) / 0.25);">
        <div class="font-semibold text-xs text-muted mb-2 uppercase" style="letter-spacing:0.04em;">{{t .Lang "repo.features"}}</div>
        <div class="flex flex-col gap-2.5">
          <label class="flex items-center justify-between cursor-pointer">
            <span class="flex items-center gap-2 text-sm font-medium">
              {{icon "issue" "size-4"}}
              <span>{{t .Lang "repo.tab.issues"}}</span>
            </span>
            <input type="checkbox" name="enable_issues" value="true" class="switch" {{if .Repo.EnableIssues}}checked{{end}}>
          </label>
          <label class="flex items-center justify-between cursor-pointer">
            <span class="flex items-center gap-2 text-sm font-medium">
              {{icon "git-pull-request" "size-4"}}
              <span>{{t .Lang "repo.tab.pulls"}}</span>
            </span>
            <input type="checkbox" name="enable_pulls" value="true" class="switch" {{if .Repo.EnablePulls}}checked{{end}}>
          </label>
          <label class="flex items-center justify-between cursor-pointer">
            <span class="flex items-center gap-2 text-sm font-medium">
              {{icon "tag" "size-4"}}
              <span>{{t .Lang "repo.tab.releases"}}</span>
            </span>
            <input type="checkbox" name="enable_releases" value="true" class="switch" {{if .Repo.EnableReleases}}checked{{end}}>
          </label>
          <label class="flex items-center justify-between cursor-pointer">
            <span class="flex items-center gap-2 text-sm font-medium">
              {{icon "activity" "size-4"}}
              <span>{{t .Lang "repo.tab.activity"}}</span>
            </span>
            <input type="checkbox" name="enable_activity" value="true" class="switch" {{if .Repo.EnableActivity}}checked{{end}}>
          </label>
        </div>
      </div>

      <div class="flex items-center justify-end">
        <button type="submit" class="btn btn-primary btn-sm">{{t .Lang "repo.save"}}</button>
      </div>
    </form>
  </section>

  <!-- Collaborators -->
  <section class="card mb-4" id="collaborators">
    <div class="card-header">
      <span class="font-semibold flex items-center gap-2">{{icon "users" "size-4"}} {{t .Lang "collab.title"}}</span>
      <span class="text-xs text-muted">{{t .Lang "collab.desc"}}</span>
    </div>

    <div class="dense-list" style="border-bottom:1px solid hsl(var(--border));">
      <div class="dense-row" style="min-height:2.6rem;padding:0.45rem 0.85rem;">
        <div class="flex items-center gap-2.5 min-w-0">
          {{avatar .Repo.OwnerUsername .Repo.OwnerAvatarURL}}
          <div class="min-w-0">
            <a href="/{{.Repo.OwnerUsername}}" class="font-semibold text-sm">{{.Repo.OwnerUsername}}</a>
          </div>
        </div>
        <span class="badge badge-outline">{{t .Lang "collab.owner"}}</span>
      </div>
      {{range .Collaborators}}
        <div class="dense-row" style="min-height:2.6rem;padding:0.45rem 0.85rem;">
          <div class="flex items-center gap-2.5 min-w-0">
            {{avatar .Username .AvatarURL}}
            <div class="min-w-0">
              <a href="/{{.Username}}" class="font-semibold text-sm">{{.Username}}</a>
              {{if .FullName}}<div class="text-xs text-muted truncate">{{.FullName}}</div>{{end}}
            </div>
          </div>
          <div class="flex items-center gap-2">
            <span class="badge badge-outline font-mono">{{if eq .Role "read"}}{{t $.Lang "collab.role_read"}}{{else}}{{t $.Lang "collab.role_write"}}{{end}}</span>
            {{if $.CanManageCollab}}
              <form method="post" action="/{{$.Repo.OwnerUsername}}/{{$.Repo.Name}}/settings/collaborators/remove" style="margin:0;">
                <input type="hidden" name="_csrf" value="{{$.CSRFToken}}">
                <input type="hidden" name="user_id" value="{{.UserID}}">
                <button type="submit" class="btn btn-ghost btn-icon" style="width:1.75rem;height:1.75rem;" title="{{t $.Lang "collab.remove"}}">
                  {{icon "close" "size-3.5"}}
                </button>
              </form>
            {{end}}
          </div>
        </div>
      {{else}}
        <div class="card-body text-xs text-muted">{{t .Lang "collab.empty"}}</div>
      {{end}}
    </div>

    {{if .CanManageCollab}}
      <form method="post" action="/{{.Repo.OwnerUsername}}/{{.Repo.Name}}/settings/collaborators/add" class="card-body flex items-end gap-2 flex-wrap">
        <input type="hidden" name="_csrf" value="{{.CSRFToken}}">
        <div style="flex:1 1 12rem;">
          <label class="label" for="collab_username">{{t .Lang "collab.username"}}</label>
          <input id="collab_username" name="username" type="text" class="input font-mono" placeholder="{{t .Lang "collab.username_ph"}}" required>
        </div>
        <div>
          <label class="label" for="collab_role">{{t .Lang "collab.role"}}</label>
          <select id="collab_role" name="role" class="select">
            <option value="write">{{t .Lang "collab.role_write"}}</option>
            <option value="read">{{t .Lang "collab.role_read"}}</option>
          </select>
        </div>
        <button type="submit" class="btn btn-primary btn-sm">
          {{icon "plus" "size-3.5"}}
          <span>{{t .Lang "collab.add"}}</span>
        </button>
      </form>
    {{end}}
  </section>

  <!-- Rename Repository -->  <section class="card mb-4">
    <div class="card-header">
      <span class="font-semibold flex items-center gap-2">{{icon "edit" "size-4"}} {{t .Lang "repo.rename"}}</span>
    </div>
    <form method="post" action="/{{.Repo.OwnerUsername}}/{{.Repo.Name}}/settings/rename" class="card-body flex items-center gap-2">
      <input type="hidden" name="_csrf" value="{{.CSRFToken}}">
      <input name="new_name" type="text" class="input font-mono" value="{{.Repo.Name}}" required pattern="^[a-zA-Z0-9][a-zA-Z0-9._-]{0,63}$">
      <button type="submit" class="btn btn-outline">{{t .Lang "repo.rename"}}</button>
    </form>
  </section>

  <!-- Danger Zone -->
  <section class="card" style="border-color:hsl(var(--destructive) / 0.45);">
    <div class="card-header" style="border-bottom-color:hsl(var(--destructive) / 0.2);">
      <span class="font-semibold text-destructive flex items-center gap-2">{{icon "alert-circle" "size-4"}} {{t .Lang "repo.danger_zone"}}</span>
    </div>
    <div class="card-body flex items-center justify-between flex-wrap gap-3">
      <div>
        <div class="font-medium text-sm">{{t .Lang "repo.delete"}}</div>
        <div class="text-xs text-muted">{{t .Lang "repo.delete_desc"}}</div>
      </div>
      <button type="button" class="btn btn-destructive btn-sm" data-dialog-open="delete-repo-dialog">
        {{icon "trash" "size-3.5"}}
        <span>{{t .Lang "repo.delete"}}</span>
      </button>
    </div>
  </section>
</div>

<!-- Delete Confirmation Modal -->
<div id="delete-repo-dialog" class="backdrop" role="dialog" aria-modal="true" aria-label="{{t .Lang "repo.delete"}}" aria-hidden="true">
  <div class="dialog-box">
    <div class="card-header">
      <span class="font-semibold text-destructive flex items-center gap-2">{{icon "trash" "size-4"}} {{t .Lang "repo.delete"}}</span>
      <button type="button" class="btn btn-ghost btn-icon" data-dialog-close aria-label="{{t .Lang "common.close"}}">{{icon "close" "size-4"}}</button>
    </div>
    <form method="post" action="/{{.Repo.OwnerUsername}}/{{.Repo.Name}}/settings/delete">
      <input type="hidden" name="_csrf" value="{{.CSRFToken}}">
      <div class="card-body flex flex-col gap-3">
        <p class="text-sm text-muted" style="margin:0;">
          {{t .Lang "repo.delete_confirm"}}: <strong class="font-mono" style="color:hsl(var(--foreground));">{{.Repo.Name}}</strong>
        </p>
        <input
          type="text"
          name="confirm_name"
          class="input font-mono"
          placeholder="{{.Repo.Name}}"
          autocomplete="off"
          required
          data-confirm-input="{{.Repo.Name}}"
          data-confirm-button="confirm-delete-btn">
      </div>
      <div class="card-footer flex items-center justify-end gap-2">
        <button type="button" class="btn btn-outline btn-sm" data-dialog-close>{{t .Lang "common.cancel"}}</button>
        <button id="confirm-delete-btn" type="submit" class="btn btn-destructive btn-sm" disabled>
          {{icon "trash" "size-3.5"}}
          <span>{{t .Lang "repo.delete"}}</span>
        </button>
      </div>
    </form>
  </div>
</div>
{{end}}