{{template "main.html" .}}
{{define "title"}}Plans — Congo Dev{{end}}
{{define "content"}}
<div class="max-w-3xl mx-auto px-6 py-8">
    <h1 class="text-2xl font-bold mb-6">Plans</h1>
    {{range $plan := work.Plans}}
    <div class="bg-white rounded-lg p-5 mb-3" style="border: 1px solid rgba(100,130,180,0.08); box-shadow: 0 2px 8px rgba(79,142,247,0.05);">
        <div class="flex items-center justify-between mb-2">
            <h2 class="text-sm font-semibold" style="color: #1a1a2e;">{{$plan.Name}}</h2>
            <span class="text-xs px-2 py-0.5 rounded" style="background: {{if eq $plan.Status "proposed"}}rgba(79,142,247,0.1){{else if eq $plan.Status "approved"}}#dcfce7{{else if eq $plan.Status "rejected"}}#fef2f2{{else}}#f1f5f9{{end}}; color: {{if eq $plan.Status "proposed"}}#4f8ef7{{else if eq $plan.Status "approved"}}#16a34a{{else if eq $plan.Status "rejected"}}#ef4444{{else}}#8b95a8{{end}};">{{$plan.Status}}</span>
        </div>
        <p class="text-xs mb-3" style="color: #4a5568; white-space: pre-wrap;">{{$plan.Description}}</p>
        {{if eq $plan.Status "proposed"}}
        <div class="flex gap-2">
            <form method="POST" action="/work/plans/{{$plan.ID}}/approve"><button class="text-xs px-3 py-1 rounded" style="background: #dcfce7; color: #16a34a; border: none; cursor: pointer;">Approve</button></form>
            <form method="POST" action="/work/plans/{{$plan.ID}}/reject"><button class="text-xs px-3 py-1 rounded" style="background: #fef2f2; color: #ef4444; border: none; cursor: pointer;">Reject</button></form>
        </div>
        {{end}}
    </div>
    {{end}}
    {{if not work.Plans}}
    <div class="bg-white rounded-lg p-8 text-center" style="border: 1px solid rgba(100,130,180,0.08);">
        <p class="text-sm" style="color: #8b95a8;">No plans yet. The twin will propose plans here.</p>
    </div>
    {{end}}
</div>
{{end}}