<!-- Project card -->
<div class="group flex items-center gap-3 px-3 py-2 rounded-lg hover:bg-slate-50/80 transition-colors">
    <div class="w-2 h-2 rounded-full shrink-0
        {{if eq .StatusDetail "clean"}}bg-emerald-400
        {{else if .StatusDetail}}bg-amber-400
        {{else if eq .Status "missing"}}bg-red-400
        {{else}}bg-slate-300{{end}}"
        title="{{if .StatusDetail}}{{.StatusDetail}}{{else}}{{.Status}}{{end}}"></div>
    <a href="/repos/{{.ID}}" class="text-[13px] font-medium text-slate-700 truncate flex-1 hover:text-indigo-600 transition-colors">{{.Name}}</a>
    <span class="text-[10px] font-mono text-slate-400 bg-slate-100 px-1.5 py-0.5 rounded">{{.Branch}}</span>
    <div class="flex items-center gap-0.5 opacity-0 group-hover:opacity-100 transition-opacity shrink-0">
        {{if ne .Status "missing"}}
        <a href="/repos/{{.ID}}/files" hx-boost="true"
           class="w-6 h-6 inline-flex items-center justify-center rounded text-slate-300 hover:text-slate-500 hover:bg-slate-100 transition-colors" title="Browse files">
            <svg xmlns="http://www.w3.org/2000/svg" class="w-3.5 h-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5"><path stroke-linecap="round" stroke-linejoin="round" d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"/></svg>
        </a>
        <a href="/coder/?folder=/home/coder/repos/{{.Name}}" target="_blank"
           class="w-6 h-6 inline-flex items-center justify-center rounded text-indigo-400 hover:text-indigo-600 hover:bg-indigo-50 transition-colors" title="Code">
            <svg xmlns="http://www.w3.org/2000/svg" class="w-3.5 h-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M8 9l3 3-3 3m5 0h3M5 20h14a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" /></svg>
        </a>
        <button class="w-6 h-6 inline-flex items-center justify-center rounded text-slate-300 hover:text-slate-500 hover:bg-slate-100 transition-colors"
            hx-post="/repos/{{.ID}}/pull" hx-target="body" title="Pull">
            <svg xmlns="http://www.w3.org/2000/svg" class="w-3.5 h-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" /></svg>
        </button>
        <button class="w-6 h-6 inline-flex items-center justify-center rounded text-slate-300 hover:text-violet-500 hover:bg-violet-50 transition-colors"
            hx-post="/services/deploy" hx-vals='{"repo_id": "{{.ID}}"}' hx-target="body" title="Deploy">
            <svg xmlns="http://www.w3.org/2000/svg" class="w-3.5 h-3.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M5 10l7-7m0 0l7 7m-7-7v18" /></svg>
        </button>
        {{end}}
        <button class="w-6 h-6 inline-flex items-center justify-center rounded text-slate-200 hover:text-red-400 hover:bg-red-50 transition-colors"
            hx-post="/repos/{{.ID}}/delete" hx-confirm="Delete {{.Name}}?" hx-target="body" title="Delete">
            <svg xmlns="http://www.w3.org/2000/svg" class="w-3 h-3" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" /></svg>
        </button>
    </div>
</div>