feat: WhatsApp Nucleo con Nuxt 4 + Baileys v7

Reemplazo completo de Evolution API por implementación directa con Baileys.

Características:
- Dashboard completo con Nuxt UI v4
- Soporte para múltiples instancias de WhatsApp
- Conexión via QR code o pairing code
- Persistencia de mensajes en PostgreSQL
- API REST para integraciones externas
- Webhooks con firma HMAC
- SSE para actualizaciones en tiempo real
- Autenticación con Authentik

app/components/messages/MessageBubble.vue

@@ -0,0 +1,85 @@
+<template>
+  <div
+    class="flex"
+    :class="message.fromMe ? 'justify-end' : 'justify-start'"
+  >
+    <div
+      class="max-w-[70%] rounded-lg px-3 py-2"
+      :class="message.fromMe ? 'bubble-out' : 'bubble-in'"
+    >
+      <!-- Message content -->
+      <p class="text-[var(--wa-text)] whitespace-pre-wrap break-words">{{ message.content }}</p>
+
+      <!-- Image -->
+      <img
+        v-if="message.mediaUrl && message.type === 'image'"
+        :src="message.mediaUrl"
+        class="rounded-lg max-w-full mt-2"
+      />
+
+      <!-- Caption for media -->
+      <p
+        v-if="message.caption"
+        class="text-[var(--wa-text)] mt-2"
+      >
+        {{ message.caption }}
+      </p>
+
+      <!-- Footer -->
+      <div class="flex items-center justify-end gap-1 mt-1">
+        <span class="text-xs text-[var(--wa-text-muted)]">
+          {{ formatTime(message.timestamp) }}
+        </span>
+        <UIcon
+          v-if="message.fromMe"
+          :name="statusIcon"
+          class="w-4 h-4"
+          :class="statusColor"
+        />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+interface Message {
+  id: string
+  content: string
+  type: 'text' | 'image' | 'video' | 'document' | 'audio'
+  mediaUrl?: string
+  caption?: string
+  fromMe: boolean
+  timestamp: Date
+  status: 'pending' | 'sent' | 'delivered' | 'read' | 'failed'
+}
+
+interface Props {
+  message: Message
+}
+
+const props = defineProps<Props>()
+
+const formatTime = (date: Date) => {
+  return new Date(date).toLocaleTimeString('es-AR', {
+    hour: '2-digit',
+    minute: '2-digit'
+  })
+}
+
+const statusIcon = computed(() => {
+  const icons: Record<string, string> = {
+    pending: 'i-lucide-clock',
+    sent: 'i-lucide-check',
+    delivered: 'i-lucide-check-check',
+    read: 'i-lucide-check-check',
+    failed: 'i-lucide-alert-circle'
+  }
+  return icons[props.message.status] || 'i-lucide-check'
+})
+
+const statusColor = computed(() => {
+  if (props.message.status === 'read') return 'text-[var(--wa-blue)]'
+  if (props.message.status === 'failed') return 'text-red-500'
+  return 'text-[var(--wa-text-muted)]'
+})
+</script>