feat(settings): adiciona opção de remover foto de perfil

- Adiciona endpoint DELETE em /api/profile/avatar
- Mostra dois botões ao hover: câmera (upload) e lixeira (remover)
- Lixeira só aparece quando há uma foto definida

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

src/components/settings/settings-content.tsx

@@ -22,6 +22,7 @@ import {
   Clock,
   Camera,
   Loader2,
+  Trash2,
 } from "lucide-react"
 
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
@@ -384,6 +385,30 @@ function ProfileEditCard({
     }
   }
 
+  async function handleRemoveAvatar() {
+    if (!localAvatarUrl) return
+
+    setIsUploadingAvatar(true)
+    try {
+      const res = await fetch("/api/profile/avatar", {
+        method: "DELETE",
+      })
+
+      if (!res.ok) {
+        const data = await res.json().catch(() => ({ error: "Erro ao remover foto" }))
+        throw new Error(data.error || "Erro ao remover foto")
+      }
+
+      setLocalAvatarUrl(null)
+      toast.success("Foto removida com sucesso!")
+    } catch (error) {
+      console.error("Erro ao remover foto:", error)
+      toast.error(error instanceof Error ? error.message : "Erro ao remover foto")
+    } finally {
+      setIsUploadingAvatar(false)
+    }
+  }
+
   const hasChanges = useMemo(() => {
     const nameChanged = editName.trim() !== name
     const emailChanged = editEmail.trim().toLowerCase() !== email.toLowerCase()
@@ -465,18 +490,32 @@ function ProfileEditCard({
               onChange={handleAvatarUpload}
               className="hidden"
             />
-            <button
-              type="button"
-              className="absolute inset-0 flex items-center justify-center rounded-full bg-black/50 opacity-0 transition-opacity group-hover:opacity-100 disabled:cursor-not-allowed"
-              onClick={() => fileInputRef.current?.click()}
-              disabled={isUploadingAvatar}
-            >
+            <div className="absolute inset-0 flex items-center justify-center rounded-full bg-black/50 opacity-0 transition-opacity group-hover:opacity-100">
               {isUploadingAvatar ? (
                 <Loader2 className="size-5 text-white animate-spin" />
               ) : (
-                <Camera className="size-5 text-white" />
+                <div className="flex items-center gap-2">
+                  <button
+                    type="button"
+                    className="flex items-center justify-center size-8 rounded-full bg-white/20 hover:bg-white/30 transition-colors"
+                    onClick={() => fileInputRef.current?.click()}
+                    title="Alterar foto"
+                  >
+                    <Camera className="size-4 text-white" />
+                  </button>
+                  {localAvatarUrl && (
+                    <button
+                      type="button"
+                      className="flex items-center justify-center size-8 rounded-full bg-red-500/80 hover:bg-red-500 transition-colors"
+                      onClick={handleRemoveAvatar}
+                      title="Remover foto"
+                    >
+                      <Trash2 className="size-4 text-white" />
+                    </button>
+                  )}
+                </div>
               )}
-            </button>
+            </div>
           </div>
           <div className="flex-1 pb-1">
             <CardTitle className="text-lg font-semibold text-neutral-900">{name || "Usuário"}</CardTitle>