diff --git a/src/app/(dashboard)/proposals/page.tsx b/src/app/(dashboard)/proposals/page.tsx
index cb00b4a..7558bf1 100644
--- a/src/app/(dashboard)/proposals/page.tsx
+++ b/src/app/(dashboard)/proposals/page.tsx
@@ -7,7 +7,7 @@ import { Input } from "@/components/ui/input"
 import { Button } from "@/components/ui/button"
 import { Badge } from "@/components/ui/badge"
 import { Card } from "@/components/ui/card"
-import { Search, Plus, ArrowRight, FileText, Calendar, User } from "lucide-react"
+import { Search, Plus, ArrowRight, FileText, Calendar, User, Trash2 } from "lucide-react"
 import {
   Select,
   SelectContent,
@@ -42,6 +42,19 @@ export default function ProposalsPage() {
 
   const formatCurrency = (n: number) => n ? `R${Number(n).toLocaleString()}` : "R0"
 
+  const handleDelete = async (id: string, e: React.MouseEvent) => {
+    e.stopPropagation()
+    if (!confirm("Delete this proposal?")) return
+    try {
+      const res = await fetch(`/api/proposals/${id}`, { method: "DELETE" })
+      if (!res.ok) throw new Error()
+      setProposals((prev) => prev.filter((p) => p.id !== id))
+      toast.success("Proposal deleted")
+    } catch {
+      toast.error("Failed to delete proposal")
+    }
+  }
+
   return (
     <div className="space-y-4">
       <PageHeader title="Proposals & Quotes" description="Create and send professional quotes to clients">
@@ -105,6 +118,13 @@ export default function ProposalsPage() {
                     )}
                   </div>
                 </div>
+                <button
+                  onClick={(e) => handleDelete(p.id, e)}
+                  className="p-1.5 rounded-md text-muted-foreground hover:text-destructive hover:bg-destructive/10 transition-colors"
+                  title="Delete proposal"
+                >
+                  <Trash2 className="h-4 w-4" />
+                </button>
                 <ArrowRight className="h-4 w-4 text-muted-foreground shrink-0" />
               </div>
             ))