UI: Agregar iconos a expandir/colapsar y notificacion al copiar

app/components/debug/WebhookReceiverSection.vue

@@ -109,8 +109,12 @@
         <div class="relative">
           <button
             @click="toggleExpand(event.id)"
-            class="text-xs text-[var(--wa-text-muted)] hover:text-[var(--wa-text)] mb-1"
+            class="flex items-center gap-1 text-xs text-[var(--wa-text-muted)] hover:text-[var(--wa-text)] mb-1"
           >
+            <UIcon
+              :name="expandedEvents.has(event.id) ? 'i-lucide-chevron-up' : 'i-lucide-chevron-down'"
+              class="w-3 h-3"
+            />
             {{ expandedEvents.has(event.id) ? 'Colapsar' : 'Expandir' }} datos
           </button>
           <pre
@@ -253,11 +257,25 @@ const formatTime = (dateStr: string) => {
   })
 }
 
+const toast = useToast()
+
 const copyToClipboard = async (text: string) => {
   try {
     await navigator.clipboard.writeText(text)
+    toast.add({
+      title: 'Copiado al portapapeles',
+      icon: 'i-lucide-check',
+      color: 'success',
+      timeout: 2000
+    })
   } catch (err) {
     console.error('Failed to copy:', err)
+    toast.add({
+      title: 'Error al copiar',
+      icon: 'i-lucide-x',
+      color: 'error',
+      timeout: 2000
+    })
   }
 }