From 148fa6b9f9175212aeb12828d144069070000e60 Mon Sep 17 00:00:00 2001
From: Lizandro Guarnizo <77708265+lizandrogd@users.noreply.github.com>
Date: Fri, 24 Apr 2026 21:40:10 -0500
Subject: [PATCH] up

---
 app/Http/Controllers/WhatsappController.php   |  38 +
 .../Whatsapp/ShowConfiguracionBot.php         |  71 ++
 .../Livewire/Whatsapp/ShowConversaciones.php  | 112 +++
 .../Livewire/Whatsapp/ShowLogsWebhook.php     |  50 +
 app/Http/Livewire/Whatsapp/ShowMenusBot.php   | 194 ++++
 app/Http/Livewire/Whatsapp/ShowPlantillas.php | 113 +++
 .../Livewire/Whatsapp/ShowProgramados.php     | 100 ++
 app/Models/WhatsappConversation.php           |  28 +
 app/Models/WhatsappMenu.php                   |  34 +
 app/Models/WhatsappMenuOption.php             |  25 +
 app/Models/WhatsappMessageTemplate.php        |  20 +
 app/Models/WhatsappScheduledMessage.php       |  28 +
 app/Models/WhatsappSystemConfig.php           |  26 +
 app/Models/WhatsappUser.php                   |  44 +
 app/Models/WhatsappWebhookLog.php             |  17 +
 ..._24_000001_create_whatsapp_users_table.php |  37 +
 ...02_create_whatsapp_conversations_table.php |  41 +
 ..._24_000003_create_whatsapp_menus_table.php |  42 +
 ...reate_whatsapp_message_templates_table.php |  31 +
 ...05_create_whatsapp_system_config_table.php |  39 +
 ...eate_whatsapp_scheduled_and_logs_table.php |  44 +
 public/DOCUMENTACION_BOT_WHATSAPP.md          | 916 ++++++++++++++++++
 resources/views/layouts/navigation.blade.php  |  44 +
 .../whatsapp/show-configuracion-bot.blade.php | 118 +++
 .../whatsapp/show-conversaciones.blade.php    | 166 ++++
 .../whatsapp/show-logs-webhook.blade.php      |  82 ++
 .../whatsapp/show-menus-bot.blade.php         | 250 +++++
 .../whatsapp/show-plantillas.blade.php        | 141 +++
 .../whatsapp/show-programados.blade.php       | 142 +++
 .../views/whatsapp/configuracion.blade.php    |   6 +
 .../views/whatsapp/conversaciones.blade.php   |   3 +
 resources/views/whatsapp/logs.blade.php       |   6 +
 resources/views/whatsapp/menus.blade.php      |   6 +
 resources/views/whatsapp/plantillas.blade.php |   6 +
 .../views/whatsapp/programados.blade.php      |   6 +
 routes/web.php                                |  11 +
 36 files changed, 3037 insertions(+)
 create mode 100644 app/Http/Controllers/WhatsappController.php
 create mode 100644 app/Http/Livewire/Whatsapp/ShowConfiguracionBot.php
 create mode 100644 app/Http/Livewire/Whatsapp/ShowConversaciones.php
 create mode 100644 app/Http/Livewire/Whatsapp/ShowLogsWebhook.php
 create mode 100644 app/Http/Livewire/Whatsapp/ShowMenusBot.php
 create mode 100644 app/Http/Livewire/Whatsapp/ShowPlantillas.php
 create mode 100644 app/Http/Livewire/Whatsapp/ShowProgramados.php
 create mode 100644 app/Models/WhatsappConversation.php
 create mode 100644 app/Models/WhatsappMenu.php
 create mode 100644 app/Models/WhatsappMenuOption.php
 create mode 100644 app/Models/WhatsappMessageTemplate.php
 create mode 100644 app/Models/WhatsappScheduledMessage.php
 create mode 100644 app/Models/WhatsappSystemConfig.php
 create mode 100644 app/Models/WhatsappUser.php
 create mode 100644 app/Models/WhatsappWebhookLog.php
 create mode 100644 database/migrations/2026_04_24_000001_create_whatsapp_users_table.php
 create mode 100644 database/migrations/2026_04_24_000002_create_whatsapp_conversations_table.php
 create mode 100644 database/migrations/2026_04_24_000003_create_whatsapp_menus_table.php
 create mode 100644 database/migrations/2026_04_24_000004_create_whatsapp_message_templates_table.php
 create mode 100644 database/migrations/2026_04_24_000005_create_whatsapp_system_config_table.php
 create mode 100644 database/migrations/2026_04_24_000006_create_whatsapp_scheduled_and_logs_table.php
 create mode 100644 public/DOCUMENTACION_BOT_WHATSAPP.md
 create mode 100644 resources/views/livewire/whatsapp/show-configuracion-bot.blade.php
 create mode 100644 resources/views/livewire/whatsapp/show-conversaciones.blade.php
 create mode 100644 resources/views/livewire/whatsapp/show-logs-webhook.blade.php
 create mode 100644 resources/views/livewire/whatsapp/show-menus-bot.blade.php
 create mode 100644 resources/views/livewire/whatsapp/show-plantillas.blade.php
 create mode 100644 resources/views/livewire/whatsapp/show-programados.blade.php
 create mode 100644 resources/views/whatsapp/configuracion.blade.php
 create mode 100644 resources/views/whatsapp/conversaciones.blade.php
 create mode 100644 resources/views/whatsapp/logs.blade.php
 create mode 100644 resources/views/whatsapp/menus.blade.php
 create mode 100644 resources/views/whatsapp/plantillas.blade.php
 create mode 100644 resources/views/whatsapp/programados.blade.php

diff --git a/app/Http/Controllers/WhatsappController.php b/app/Http/Controllers/WhatsappController.php
new file mode 100644
index 0000000..aaed28e
--- /dev/null
+++ b/app/Http/Controllers/WhatsappController.php
@@ -0,0 +1,38 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+
+class WhatsappController extends Controller
+{
+    public function conversaciones()
+    {
+        return view('whatsapp.conversaciones');
+    }
+
+    public function menus()
+    {
+        return view('whatsapp.menus');
+    }
+
+    public function plantillas()
+    {
+        return view('whatsapp.plantillas');
+    }
+
+    public function programados()
+    {
+        return view('whatsapp.programados');
+    }
+
+    public function configuracion()
+    {
+        return view('whatsapp.configuracion');
+    }
+
+    public function logs()
+    {
+        return view('whatsapp.logs');
+    }
+}
diff --git a/app/Http/Livewire/Whatsapp/ShowConfiguracionBot.php b/app/Http/Livewire/Whatsapp/ShowConfiguracionBot.php
new file mode 100644
index 0000000..0a70601
--- /dev/null
+++ b/app/Http/Livewire/Whatsapp/ShowConfiguracionBot.php
@@ -0,0 +1,71 @@
+<?php
+
+namespace App\Http\Livewire\Whatsapp;
+
+use App\Models\WhatsappSystemConfig;
+use Livewire\Component;
+use Jantinnerezo\LivewireAlert\LivewireAlert;
+
+class ShowConfiguracionBot extends Component
+{
+    use LivewireAlert;
+
+    public string $whatsapp_token         = '';
+    public string $phone_number_id        = '';
+    public string $whatsapp_api_url       = '';
+    public string $webhook_verify_token   = '';
+    public string $bot_enabled            = '1';
+    public string $welcome_message        = '';
+    public string $default_no_match       = '';
+    public string $advisor_message        = '';
+    public string $business_hours_enabled = '0';
+    public string $business_hours_start   = '';
+    public string $business_hours_end     = '';
+
+    protected $rules = [
+        'whatsapp_token'       => 'required|string',
+        'phone_number_id'      => 'required|string',
+        'whatsapp_api_url'     => 'required|url',
+        'webhook_verify_token' => 'required|string',
+        'welcome_message'      => 'required|string|max:1000',
+        'default_no_match'     => 'required|string|max:500',
+        'advisor_message'      => 'required|string|max:500',
+    ];
+
+    public function mount(): void
+    {
+        $keys = [
+            'whatsapp_token', 'phone_number_id', 'whatsapp_api_url',
+            'webhook_verify_token', 'bot_enabled', 'welcome_message',
+            'default_no_match', 'advisor_message', 'business_hours_enabled',
+            'business_hours_start', 'business_hours_end',
+        ];
+
+        foreach ($keys as $key) {
+            $this->{$key} = WhatsappSystemConfig::get($key);
+        }
+    }
+
+    public function save(): void
+    {
+        $this->validate();
+
+        $keys = [
+            'whatsapp_token', 'phone_number_id', 'whatsapp_api_url',
+            'webhook_verify_token', 'bot_enabled', 'welcome_message',
+            'default_no_match', 'advisor_message', 'business_hours_enabled',
+            'business_hours_start', 'business_hours_end',
+        ];
+
+        foreach ($keys as $key) {
+            WhatsappSystemConfig::set($key, $this->{$key});
+        }
+
+        $this->alert('success', 'Configuración guardada correctamente.');
+    }
+
+    public function render()
+    {
+        return view('livewire.whatsapp.show-configuracion-bot');
+    }
+}
diff --git a/app/Http/Livewire/Whatsapp/ShowConversaciones.php b/app/Http/Livewire/Whatsapp/ShowConversaciones.php
new file mode 100644
index 0000000..22d378f
--- /dev/null
+++ b/app/Http/Livewire/Whatsapp/ShowConversaciones.php
@@ -0,0 +1,112 @@
+<?php
+
+namespace App\Http\Livewire\Whatsapp;
+
+use App\Models\WhatsappConversation;
+use App\Models\WhatsappUser;
+use Livewire\Component;
+use Livewire\WithPagination;
+use Illuminate\Support\Facades\Http;
+use App\Models\WhatsappSystemConfig;
+
+class ShowConversaciones extends Component
+{
+    use WithPagination;
+
+    public ?int $selectedUserId = null;
+    public string $search = '';
+    public string $replyText = '';
+    public ?WhatsappUser $selectedUser = null;
+
+    protected $listeners = ['refreshChatList' => '$refresh'];
+
+    public function selectUser(int $userId): void
+    {
+        $this->selectedUserId = $userId;
+        $this->selectedUser   = WhatsappUser::find($userId);
+        $this->replyText      = '';
+
+        // Marcar mensajes como leídos
+        WhatsappConversation::where('user_id', $userId)
+            ->where('direction', 'incoming')
+            ->where('is_read', 0)
+            ->update(['is_read' => 1]);
+    }
+
+    public function sendReply(): void
+    {
+        $this->validate(['replyText' => 'required|string|max:4096']);
+
+        if (! $this->selectedUser) {
+            return;
+        }
+
+        $token         = WhatsappSystemConfig::get('whatsapp_token');
+        $phoneNumberId = WhatsappSystemConfig::get('phone_number_id');
+        $apiUrl        = WhatsappSystemConfig::get('whatsapp_api_url', 'https://graph.facebook.com/v22.0/');
+
+        $response = Http::withToken($token)
+            ->post("{$apiUrl}{$phoneNumberId}/messages", [
+                'messaging_product' => 'whatsapp',
+                'to'                => $this->selectedUser->phone_number,
+                'type'              => 'text',
+                'text'              => ['body' => $this->replyText],
+            ]);
+
+        if ($response->successful()) {
+            WhatsappConversation::create([
+                'user_id'      => $this->selectedUserId,
+                'message_id'   => $response->json('messages.0.id'),
+                'direction'    => 'outgoing',
+                'message_type' => 'text',
+                'content'      => $this->replyText,
+                'status'       => 'sent',
+            ]);
+
+            $this->replyText = '';
+            $this->dispatch('scrollToBottom');
+        } else {
+            session()->flash('error', 'Error al enviar el mensaje: ' . $response->body());
+        }
+    }
+
+    public function toggleBlockUser(): void
+    {
+        if (! $this->selectedUser) {
+            return;
+        }
+
+        $newStatus = $this->selectedUser->status === 'blocked' ? 'active' : 'blocked';
+        $this->selectedUser->update(['status' => $newStatus]);
+        $this->selectedUser->refresh();
+    }
+
+    public function render()
+    {
+        $users = WhatsappUser::when($this->search, function ($q) {
+                $q->where(function ($q2) {
+                    $q2->where('name', 'like', '%' . $this->search . '%')
+                       ->orWhere('phone_number', 'like', '%' . $this->search . '%');
+                });
+            })
+            ->withCount(['conversations as unread_count' => function ($q) {
+                $q->where('direction', 'incoming')->where('is_read', 0);
+            }])
+            ->with('lastMessage')
+            ->orderByDesc(
+                WhatsappConversation::select('created_at')
+                    ->whereColumn('user_id', 'whatsapp_users.id')
+                    ->orderByDesc('created_at')
+                    ->limit(1)
+            )
+            ->paginate(20);
+
+        $messages = $this->selectedUserId
+            ? WhatsappConversation::where('user_id', $this->selectedUserId)
+                ->orderBy('created_at')
+                ->get()
+            : collect();
+
+        return view('livewire.whatsapp.show-conversaciones', compact('users', 'messages'));
+    }
+}
diff --git a/app/Http/Livewire/Whatsapp/ShowLogsWebhook.php b/app/Http/Livewire/Whatsapp/ShowLogsWebhook.php
new file mode 100644
index 0000000..26b44cb
--- /dev/null
+++ b/app/Http/Livewire/Whatsapp/ShowLogsWebhook.php
@@ -0,0 +1,50 @@
+<?php
+
+namespace App\Http\Livewire\Whatsapp;
+
+use App\Models\WhatsappWebhookLog;
+use Livewire\Component;
+use Livewire\WithPagination;
+
+class ShowLogsWebhook extends Component
+{
+    use WithPagination;
+
+    public string $search      = '';
+    public ?int $viewId        = null;
+    public ?string $viewPayload = null;
+
+    public function viewLog(int $id): void
+    {
+        $log = WhatsappWebhookLog::findOrFail($id);
+        $this->viewId      = $id;
+        $decoded = json_decode($log->payload, true);
+        $this->viewPayload = json_encode($decoded, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE);
+    }
+
+    public function clearView(): void
+    {
+        $this->viewId      = null;
+        $this->viewPayload = null;
+    }
+
+    public function deleteLog(int $id): void
+    {
+        WhatsappWebhookLog::findOrFail($id)->delete();
+    }
+
+    public function clearAll(): void
+    {
+        WhatsappWebhookLog::truncate();
+    }
+
+    public function render()
+    {
+        $logs = WhatsappWebhookLog::when($this->search, fn($q) =>
+                $q->where('payload', 'like', "%{$this->search}%"))
+            ->orderByDesc('created_at')
+            ->paginate(25);
+
+        return view('livewire.whatsapp.show-logs-webhook', compact('logs'));
+    }
+}
diff --git a/app/Http/Livewire/Whatsapp/ShowMenusBot.php b/app/Http/Livewire/Whatsapp/ShowMenusBot.php
new file mode 100644
index 0000000..fa54c64
--- /dev/null
+++ b/app/Http/Livewire/Whatsapp/ShowMenusBot.php
@@ -0,0 +1,194 @@
+<?php
+
+namespace App\Http\Livewire\Whatsapp;
+
+use App\Models\WhatsappMenu;
+use App\Models\WhatsappMenuOption;
+use Livewire\Component;
+use Jantinnerezo\LivewireAlert\LivewireAlert;
+
+class ShowMenusBot extends Component
+{
+    use LivewireAlert;
+
+    // Lista
+    public string $search = '';
+
+    // Form menú
+    public bool $showMenuForm = false;
+    public ?int $editMenuId   = null;
+    public string $menuName    = '';
+    public string $menuTitle   = '';
+    public string $menuMessage = '';
+    public ?int $menuParentId  = null;
+    public bool $menuIsMain    = false;
+    public bool $menuIsActive  = true;
+    public int $menuSortOrder  = 0;
+
+    // Form opción
+    public bool $showOptionForm   = false;
+    public ?int $editOptionId     = null;
+    public ?int $optionForMenuId  = null;
+    public int $optionNumber      = 1;
+    public string $optionTitle    = '';
+    public string $optionAction   = 'message';
+    public string $optionValue    = '';
+    public int $optionSort        = 0;
+    public bool $optionIsActive   = true;
+
+    // Vista detalle
+    public ?int $viewMenuId = null;
+
+    protected function rules(): array
+    {
+        return [
+            'menuName'    => 'required|string|max:255',
+            'menuTitle'   => 'required|string|max:255',
+            'menuMessage' => 'required|string',
+        ];
+    }
+
+    public function openMenuForm(?int $id = null): void
+    {
+        $this->resetMenuForm();
+        if ($id) {
+            $menu = WhatsappMenu::findOrFail($id);
+            $this->editMenuId   = $id;
+            $this->menuName     = $menu->name;
+            $this->menuTitle    = $menu->title;
+            $this->menuMessage  = $menu->message;
+            $this->menuParentId = $menu->parent_id;
+            $this->menuIsMain   = (bool) $menu->is_main;
+            $this->menuIsActive = (bool) $menu->is_active;
+            $this->menuSortOrder = $menu->sort_order;
+        }
+        $this->showMenuForm = true;
+    }
+
+    public function saveMenu(): void
+    {
+        $this->validate();
+
+        $data = [
+            'name'       => $this->menuName,
+            'title'      => $this->menuTitle,
+            'message'    => $this->menuMessage,
+            'parent_id'  => $this->menuParentId ?: null,
+            'is_main'    => $this->menuIsMain,
+            'is_active'  => $this->menuIsActive,
+            'sort_order' => $this->menuSortOrder,
+        ];
+
+        if ($this->editMenuId) {
+            WhatsappMenu::findOrFail($this->editMenuId)->update($data);
+            $this->alert('success', 'Menú actualizado correctamente.');
+        } else {
+            WhatsappMenu::create($data);
+            $this->alert('success', 'Menú creado correctamente.');
+        }
+
+        $this->resetMenuForm();
+    }
+
+    public function deleteMenu(int $id): void
+    {
+        WhatsappMenu::findOrFail($id)->delete();
+        $this->alert('success', 'Menú eliminado.');
+        if ($this->viewMenuId === $id) {
+            $this->viewMenuId = null;
+        }
+    }
+
+    public function openOptionForm(?int $optionId = null, ?int $menuId = null): void
+    {
+        $this->resetOptionForm();
+        $this->optionForMenuId = $menuId;
+        if ($optionId) {
+            $opt = WhatsappMenuOption::findOrFail($optionId);
+            $this->editOptionId    = $optionId;
+            $this->optionForMenuId = $opt->menu_id;
+            $this->optionNumber    = $opt->option_number;
+            $this->optionTitle     = $opt->title;
+            $this->optionAction    = $opt->action_type;
+            $this->optionValue     = $opt->action_value ?? '';
+            $this->optionSort      = $opt->sort_order;
+            $this->optionIsActive  = (bool) $opt->is_active;
+        }
+        $this->showOptionForm = true;
+    }
+
+    public function saveOption(): void
+    {
+        $this->validate([
+            'optionTitle'      => 'required|string|max:255',
+            'optionForMenuId'  => 'required|integer',
+            'optionNumber'     => 'required|integer|min:1',
+        ]);
+
+        $data = [
+            'menu_id'       => $this->optionForMenuId,
+            'option_number' => $this->optionNumber,
+            'title'         => $this->optionTitle,
+            'action_type'   => $this->optionAction,
+            'action_value'  => $this->optionValue,
+            'sort_order'    => $this->optionSort,
+            'is_active'     => $this->optionIsActive,
+        ];
+
+        if ($this->editOptionId) {
+            WhatsappMenuOption::findOrFail($this->editOptionId)->update($data);
+            $this->alert('success', 'Opción actualizada.');
+        } else {
+            WhatsappMenuOption::create($data);
+            $this->alert('success', 'Opción creada.');
+        }
+
+        $this->resetOptionForm();
+    }
+
+    public function deleteOption(int $id): void
+    {
+        WhatsappMenuOption::findOrFail($id)->delete();
+        $this->alert('success', 'Opción eliminada.');
+    }
+
+    public function resetMenuForm(): void
+    {
+        $this->showMenuForm   = false;
+        $this->editMenuId     = null;
+        $this->menuName       = '';
+        $this->menuTitle      = '';
+        $this->menuMessage    = '';
+        $this->menuParentId   = null;
+        $this->menuIsMain     = false;
+        $this->menuIsActive   = true;
+        $this->menuSortOrder  = 0;
+    }
+
+    public function resetOptionForm(): void
+    {
+        $this->showOptionForm  = false;
+        $this->editOptionId    = null;
+        $this->optionForMenuId = null;
+        $this->optionNumber    = 1;
+        $this->optionTitle     = '';
+        $this->optionAction    = 'message';
+        $this->optionValue     = '';
+        $this->optionSort      = 0;
+        $this->optionIsActive  = true;
+    }
+
+    public function render()
+    {
+        $menus = WhatsappMenu::when($this->search, fn($q) => $q->where('name', 'like', "%{$this->search}%")
+                ->orWhere('title', 'like', "%{$this->search}%"))
+            ->withCount('options')
+            ->orderBy('sort_order')
+            ->get();
+
+        $viewMenu = $this->viewMenuId ? WhatsappMenu::with('options')->find($this->viewMenuId) : null;
+        $allMenus = WhatsappMenu::orderBy('title')->get();
+
+        return view('livewire.whatsapp.show-menus-bot', compact('menus', 'viewMenu', 'allMenus'));
+    }
+}
diff --git a/app/Http/Livewire/Whatsapp/ShowPlantillas.php b/app/Http/Livewire/Whatsapp/ShowPlantillas.php
new file mode 100644
index 0000000..32a688b
--- /dev/null
+++ b/app/Http/Livewire/Whatsapp/ShowPlantillas.php
@@ -0,0 +1,113 @@
+<?php
+
+namespace App\Http\Livewire\Whatsapp;
+
+use App\Models\WhatsappMessageTemplate;
+use Livewire\Component;
+use Jantinnerezo\LivewireAlert\LivewireAlert;
+
+class ShowPlantillas extends Component
+{
+    use LivewireAlert;
+
+    public string $search = '';
+    public string $filterStatus = '';
+
+    // Formulario
+    public bool $showForm   = false;
+    public ?int $editId     = null;
+    public string $name          = '';
+    public string $templateName  = '';
+    public string $languageCode  = 'es';
+    public string $status        = 'pending';
+    public string $bodyText      = '';
+    public string $headerType    = 'none';
+    public string $headerText    = '';
+    public string $footerText    = '';
+
+    protected function rules(): array
+    {
+        return [
+            'name'         => 'required|string|max:255',
+            'templateName' => 'required|string|max:255|regex:/^[a-z0-9_]+$/',
+            'languageCode' => 'required|string|max:10',
+            'bodyText'     => 'required|string',
+        ];
+    }
+
+    public function openForm(?int $id = null): void
+    {
+        $this->resetForm();
+        if ($id) {
+            $tpl = WhatsappMessageTemplate::findOrFail($id);
+            $this->editId       = $id;
+            $this->name         = $tpl->name;
+            $this->templateName = $tpl->template_name;
+            $this->languageCode = $tpl->language_code;
+            $this->status       = $tpl->status;
+            $this->bodyText     = $tpl->body_text ?? '';
+            $this->headerType   = $tpl->header_type;
+            $this->headerText   = $tpl->header_text ?? '';
+            $this->footerText   = $tpl->footer_text ?? '';
+        }
+        $this->showForm = true;
+    }
+
+    public function save(): void
+    {
+        $this->validate();
+
+        $data = [
+            'name'          => $this->name,
+            'template_name' => $this->templateName,
+            'language_code' => $this->languageCode,
+            'status'        => $this->status,
+            'body_text'     => $this->bodyText,
+            'header_type'   => $this->headerType,
+            'header_text'   => $this->headerText,
+            'footer_text'   => $this->footerText,
+        ];
+
+        if ($this->editId) {
+            WhatsappMessageTemplate::findOrFail($this->editId)->update($data);
+            $this->alert('success', 'Plantilla actualizada.');
+        } else {
+            WhatsappMessageTemplate::create($data);
+            $this->alert('success', 'Plantilla creada.');
+        }
+
+        $this->resetForm();
+    }
+
+    public function delete(int $id): void
+    {
+        WhatsappMessageTemplate::findOrFail($id)->delete();
+        $this->alert('success', 'Plantilla eliminada.');
+    }
+
+    public function resetForm(): void
+    {
+        $this->showForm     = false;
+        $this->editId       = null;
+        $this->name         = '';
+        $this->templateName = '';
+        $this->languageCode = 'es';
+        $this->status       = 'pending';
+        $this->bodyText     = '';
+        $this->headerType   = 'none';
+        $this->headerText   = '';
+        $this->footerText   = '';
+    }
+
+    public function render()
+    {
+        $templates = WhatsappMessageTemplate::when($this->search, fn($q) =>
+                $q->where('name', 'like', "%{$this->search}%")
+                  ->orWhere('template_name', 'like', "%{$this->search}%"))
+            ->when($this->filterStatus, fn($q) => $q->where('status', $this->filterStatus))
+            ->orderByDesc('updated_at')
+            ->paginate(15);
+
+        return view('livewire.whatsapp.show-plantillas', compact('templates'));
+    }
+}
diff --git a/app/Http/Livewire/Whatsapp/ShowProgramados.php b/app/Http/Livewire/Whatsapp/ShowProgramados.php
new file mode 100644
index 0000000..b34f929
--- /dev/null
+++ b/app/Http/Livewire/Whatsapp/ShowProgramados.php
@@ -0,0 +1,100 @@
+<?php
+
+namespace App\Http\Livewire\Whatsapp;
+
+use App\Models\WhatsappScheduledMessage;
+use App\Models\WhatsappMessageTemplate;
+use App\Models\WhatsappUser;
+use Livewire\Component;
+use Jantinnerezo\LivewireAlert\LivewireAlert;
+use Illuminate\Support\Facades\Auth;
+
+class ShowProgramados extends Component
+{
+    use LivewireAlert;
+
+    public string $search      = '';
+    public string $filterStatus = '';
+
+    // Formulario
+    public bool $showForm       = false;
+    public string $phoneNumber  = '';
+    public string $messageType  = 'text';
+    public string $messageContent = '';
+    public ?int $templateId     = null;
+    public string $scheduledDate = '';
+    public string $scheduledTime = '';
+
+    protected function rules(): array
+    {
+        return [
+            'phoneNumber'   => 'required|string|max:20',
+            'scheduledDate' => 'required|date',
+            'scheduledTime' => 'required',
+            'messageType'   => 'required|in:text,template',
+            'messageContent'=> 'required_if:messageType,text|nullable|string',
+            'templateId'    => 'required_if:messageType,template|nullable|integer',
+        ];
+    }
+
+    public function save(): void
+    {
+        $this->validate();
+
+        $template = $this->templateId ? WhatsappMessageTemplate::find($this->templateId) : null;
+
+        WhatsappScheduledMessage::create([
+            'phone_number'    => preg_replace('/\D/', '', $this->phoneNumber),
+            'message_type'    => $this->messageType,
+            'message_content' => $this->messageContent,
+            'template_id'     => $this->templateId,
+            'template_name'   => $template?->template_name,
+            'template_language' => $template?->language_code,
+            'scheduled_date'  => $this->scheduledDate,
+            'scheduled_time'  => $this->scheduledTime,
+            'status'          => 'pending',
+            'created_by'      => Auth::id(),
+        ]);
+
+        $this->alert('success', 'Mensaje programado correctamente.');
+        $this->resetForm();
+    }
+
+    public function cancel(int $id): void
+    {
+        WhatsappScheduledMessage::findOrFail($id)->update(['status' => 'cancelled']);
+        $this->alert('info', 'Mensaje cancelado.');
+    }
+
+    public function delete(int $id): void
+    {
+        WhatsappScheduledMessage::findOrFail($id)->delete();
+        $this->alert('success', 'Registro eliminado.');
+    }
+
+    public function resetForm(): void
+    {
+        $this->showForm       = false;
+        $this->phoneNumber    = '';
+        $this->messageType    = 'text';
+        $this->messageContent = '';
+        $this->templateId     = null;
+        $this->scheduledDate  = '';
+        $this->scheduledTime  = '';
+    }
+
+    public function render()
+    {
+        $messages = WhatsappScheduledMessage::when($this->search, fn($q) =>
+                $q->where('phone_number', 'like', "%{$this->search}%")
+                  ->orWhere('message_content', 'like', "%{$this->search}%"))
+            ->when($this->filterStatus, fn($q) => $q->where('status', $this->filterStatus))
+            ->orderByDesc('scheduled_date')
+            ->orderByDesc('scheduled_time')
+            ->paginate(20);
+
+        $templates = WhatsappMessageTemplate::where('status', 'approved')->get();
+
+        return view('livewire.whatsapp.show-programados', compact('messages', 'templates'));
+    }
+}
diff --git a/app/Models/WhatsappConversation.php b/app/Models/WhatsappConversation.php
new file mode 100644
index 0000000..6180545
--- /dev/null
+++ b/app/Models/WhatsappConversation.php
@@ -0,0 +1,28 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class WhatsappConversation extends Model
+{
+    protected $table = 'whatsapp_conversations';
+    public $updated_at = null;
+
+    protected $fillable = [
+        'user_id', 'message_id', 'reply_to_message_id', 'reaction_to_message_id',
+        'reaction_emoji', 'direction', 'message_type', 'content', 'media_url',
+        'whatsapp_media_id', 'local_file', 'local_thumb', 'media_storage',
+        'status', 'is_read', 'filename', 'mime_type',
+    ];
+
+    protected $casts = [
+        'is_read'    => 'boolean',
+        'created_at' => 'datetime',
+    ];
+
+    public function user()
+    {
+        return $this->belongsTo(WhatsappUser::class, 'user_id');
+    }
+}
diff --git a/app/Models/WhatsappMenu.php b/app/Models/WhatsappMenu.php
new file mode 100644
index 0000000..75b28d2
--- /dev/null
+++ b/app/Models/WhatsappMenu.php
@@ -0,0 +1,34 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class WhatsappMenu extends Model
+{
+    protected $table = 'whatsapp_menus';
+
+    protected $fillable = [
+        'name', 'title', 'message', 'parent_id', 'is_main', 'is_active', 'sort_order',
+    ];
+
+    protected $casts = [
+        'is_main'   => 'boolean',
+        'is_active' => 'boolean',
+    ];
+
+    public function options()
+    {
+        return $this->hasMany(WhatsappMenuOption::class, 'menu_id')->orderBy('sort_order');
+    }
+
+    public function parent()
+    {
+        return $this->belongsTo(WhatsappMenu::class, 'parent_id');
+    }
+
+    public function children()
+    {
+        return $this->hasMany(WhatsappMenu::class, 'parent_id');
+    }
+}
diff --git a/app/Models/WhatsappMenuOption.php b/app/Models/WhatsappMenuOption.php
new file mode 100644
index 0000000..dfb609f
--- /dev/null
+++ b/app/Models/WhatsappMenuOption.php
@@ -0,0 +1,25 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class WhatsappMenuOption extends Model
+{
+    protected $table = 'whatsapp_menu_options';
+    public $timestamps = false;
+
+    protected $fillable = [
+        'menu_id', 'option_number', 'title', 'action_type', 'action_value',
+        'is_active', 'sort_order',
+    ];
+
+    protected $casts = [
+        'is_active' => 'boolean',
+    ];
+
+    public function menu()
+    {
+        return $this->belongsTo(WhatsappMenu::class, 'menu_id');
+    }
+}
diff --git a/app/Models/WhatsappMessageTemplate.php b/app/Models/WhatsappMessageTemplate.php
new file mode 100644
index 0000000..fe46604
--- /dev/null
+++ b/app/Models/WhatsappMessageTemplate.php
@@ -0,0 +1,20 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class WhatsappMessageTemplate extends Model
+{
+    protected $table = 'whatsapp_message_templates';
+
+    protected $fillable = [
+        'name', 'template_name', 'language_code', 'status', 'body_text',
+        'header_type', 'header_text', 'footer_text', 'components', 'example_parameters',
+    ];
+
+    protected $casts = [
+        'components'          => 'array',
+        'example_parameters'  => 'array',
+    ];
+}
diff --git a/app/Models/WhatsappScheduledMessage.php b/app/Models/WhatsappScheduledMessage.php
new file mode 100644
index 0000000..aa01e26
--- /dev/null
+++ b/app/Models/WhatsappScheduledMessage.php
@@ -0,0 +1,28 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class WhatsappScheduledMessage extends Model
+{
+    protected $table = 'whatsapp_scheduled_messages';
+    public $updated_at = null;
+
+    protected $fillable = [
+        'user_id', 'phone_number', 'template_id', 'template_name', 'template_language',
+        'template_parameters', 'message_type', 'message_content', 'scheduled_date',
+        'scheduled_time', 'status', 'sent_at', 'error_message', 'created_by',
+    ];
+
+    protected $casts = [
+        'template_parameters' => 'array',
+        'scheduled_date'      => 'date',
+        'sent_at'             => 'datetime',
+    ];
+
+    public function creator()
+    {
+        return $this->belongsTo(User::class, 'created_by');
+    }
+}
diff --git a/app/Models/WhatsappSystemConfig.php b/app/Models/WhatsappSystemConfig.php
new file mode 100644
index 0000000..0ae0aba
--- /dev/null
+++ b/app/Models/WhatsappSystemConfig.php
@@ -0,0 +1,26 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class WhatsappSystemConfig extends Model
+{
+    protected $table = 'whatsapp_system_config';
+
+    protected $fillable = ['config_key', 'config_value', 'description'];
+
+    public static function get(string $key, string $default = ''): string
+    {
+        $record = static::where('config_key', $key)->first();
+        return $record ? ($record->config_value ?? $default) : $default;
+    }
+
+    public static function set(string $key, string $value): void
+    {
+        static::updateOrCreate(
+            ['config_key' => $key],
+            ['config_value' => $value]
+        );
+    }
+}
diff --git a/app/Models/WhatsappUser.php b/app/Models/WhatsappUser.php
new file mode 100644
index 0000000..3ef5b9a
--- /dev/null
+++ b/app/Models/WhatsappUser.php
@@ -0,0 +1,44 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class WhatsappUser extends Model
+{
+    protected $table = 'whatsapp_users';
+
+    protected $fillable = [
+        'phone_number', 'name', 'status', 'current_menu_id', 'current_step',
+        'session_data', 'welcome_sent_at', 'in_service', 'in_service_by',
+        'on_hold', 'bot_paused_until', 'advisor_requested', 'bot_enabled',
+        'terms_pending', 'terms_accepted_at', 'terms_version_id',
+    ];
+
+    protected $casts = [
+        'session_data'      => 'array',
+        'welcome_sent_at'   => 'datetime',
+        'bot_paused_until'  => 'datetime',
+        'terms_accepted_at' => 'datetime',
+        'in_service'        => 'boolean',
+        'on_hold'           => 'boolean',
+        'advisor_requested' => 'boolean',
+        'bot_enabled'       => 'boolean',
+        'terms_pending'     => 'boolean',
+    ];
+
+    public function conversations()
+    {
+        return $this->hasMany(WhatsappConversation::class, 'user_id');
+    }
+
+    public function lastMessage()
+    {
+        return $this->hasOne(WhatsappConversation::class, 'user_id')->latestOfMany();
+    }
+
+    public function currentMenu()
+    {
+        return $this->belongsTo(WhatsappMenu::class, 'current_menu_id');
+    }
+}
diff --git a/app/Models/WhatsappWebhookLog.php b/app/Models/WhatsappWebhookLog.php
new file mode 100644
index 0000000..475cebd
--- /dev/null
+++ b/app/Models/WhatsappWebhookLog.php
@@ -0,0 +1,17 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class WhatsappWebhookLog extends Model
+{
+    protected $table = 'whatsapp_webhook_logs';
+    public $timestamps = false;
+
+    protected $fillable = ['payload', 'response', 'status_code'];
+
+    protected $casts = [
+        'created_at' => 'datetime',
+    ];
+}
diff --git a/database/migrations/2026_04_24_000001_create_whatsapp_users_table.php b/database/migrations/2026_04_24_000001_create_whatsapp_users_table.php
new file mode 100644
index 0000000..dc195a5
--- /dev/null
+++ b/database/migrations/2026_04_24_000001_create_whatsapp_users_table.php
@@ -0,0 +1,37 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::create('whatsapp_users', function (Blueprint $table) {
+            $table->id();
+            $table->string('phone_number', 20)->unique();
+            $table->string('name', 100)->nullable();
+            $table->enum('status', ['active', 'blocked', 'inactive'])->default('active');
+            $table->unsignedBigInteger('current_menu_id')->nullable();
+            $table->integer('current_step')->default(0);
+            $table->text('session_data')->nullable();
+            $table->datetime('welcome_sent_at')->nullable();
+            $table->tinyInteger('in_service')->default(0);
+            $table->unsignedBigInteger('in_service_by')->nullable();
+            $table->tinyInteger('on_hold')->default(0);
+            $table->datetime('bot_paused_until')->nullable();
+            $table->tinyInteger('advisor_requested')->default(0);
+            $table->tinyInteger('bot_enabled')->default(1);
+            $table->tinyInteger('terms_pending')->default(0);
+            $table->datetime('terms_accepted_at')->nullable();
+            $table->unsignedBigInteger('terms_version_id')->nullable();
+            $table->timestamps();
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::dropIfExists('whatsapp_users');
+    }
+};
diff --git a/database/migrations/2026_04_24_000002_create_whatsapp_conversations_table.php b/database/migrations/2026_04_24_000002_create_whatsapp_conversations_table.php
new file mode 100644
index 0000000..b42e9d1
--- /dev/null
+++ b/database/migrations/2026_04_24_000002_create_whatsapp_conversations_table.php
@@ -0,0 +1,41 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::create('whatsapp_conversations', function (Blueprint $table) {
+            $table->id();
+            $table->unsignedBigInteger('user_id');
+            $table->string('message_id', 255)->nullable()->unique();
+            $table->string('reply_to_message_id', 255)->nullable();
+            $table->string('reaction_to_message_id', 255)->nullable();
+            $table->string('reaction_emoji', 64)->nullable();
+            $table->enum('direction', ['incoming', 'outgoing']);
+            $table->string('message_type', 32)->default('text');
+            $table->text('content')->nullable();
+            $table->text('media_url')->nullable();
+            $table->string('whatsapp_media_id', 255)->nullable();
+            $table->string('local_file', 255)->nullable();
+            $table->string('local_thumb', 255)->nullable();
+            $table->string('media_storage', 50)->nullable();
+            $table->string('status', 32)->default('received');
+            $table->tinyInteger('is_read')->default(0);
+            $table->string('filename', 255)->nullable();
+            $table->string('mime_type', 100)->nullable();
+            $table->timestamp('created_at')->useCurrent();
+
+            $table->foreign('user_id')->references('id')->on('whatsapp_users')->onDelete('cascade');
+            $table->index(['user_id', 'created_at']);
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::dropIfExists('whatsapp_conversations');
+    }
+};
diff --git a/database/migrations/2026_04_24_000003_create_whatsapp_menus_table.php b/database/migrations/2026_04_24_000003_create_whatsapp_menus_table.php
new file mode 100644
index 0000000..848bd05
--- /dev/null
+++ b/database/migrations/2026_04_24_000003_create_whatsapp_menus_table.php
@@ -0,0 +1,42 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::create('whatsapp_menus', function (Blueprint $table) {
+            $table->id();
+            $table->string('name', 255);
+            $table->string('title', 255);
+            $table->text('message');
+            $table->unsignedBigInteger('parent_id')->nullable();
+            $table->tinyInteger('is_main')->default(0);
+            $table->tinyInteger('is_active')->default(1);
+            $table->integer('sort_order')->default(0);
+            $table->timestamps();
+        });
+
+        Schema::create('whatsapp_menu_options', function (Blueprint $table) {
+            $table->id();
+            $table->unsignedBigInteger('menu_id');
+            $table->integer('option_number');
+            $table->string('title', 255);
+            $table->enum('action_type', ['submenu', 'message', 'template', 'url', 'advisor', 'flow']);
+            $table->text('action_value')->nullable();
+            $table->tinyInteger('is_active')->default(1);
+            $table->integer('sort_order')->default(0);
+
+            $table->foreign('menu_id')->references('id')->on('whatsapp_menus')->onDelete('cascade');
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::dropIfExists('whatsapp_menu_options');
+        Schema::dropIfExists('whatsapp_menus');
+    }
+};
diff --git a/database/migrations/2026_04_24_000004_create_whatsapp_message_templates_table.php b/database/migrations/2026_04_24_000004_create_whatsapp_message_templates_table.php
new file mode 100644
index 0000000..16c34c6
--- /dev/null
+++ b/database/migrations/2026_04_24_000004_create_whatsapp_message_templates_table.php
@@ -0,0 +1,31 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::create('whatsapp_message_templates', function (Blueprint $table) {
+            $table->id();
+            $table->string('name', 255);
+            $table->string('template_name', 255);
+            $table->string('language_code', 10)->default('es');
+            $table->enum('status', ['pending', 'approved', 'rejected', 'paused'])->default('pending');
+            $table->text('body_text')->nullable();
+            $table->enum('header_type', ['none', 'text', 'image', 'video', 'document'])->default('none');
+            $table->string('header_text', 255)->nullable();
+            $table->string('footer_text', 255)->nullable();
+            $table->longText('components')->nullable();
+            $table->longText('example_parameters')->nullable();
+            $table->timestamps();
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::dropIfExists('whatsapp_message_templates');
+    }
+};
diff --git a/database/migrations/2026_04_24_000005_create_whatsapp_system_config_table.php b/database/migrations/2026_04_24_000005_create_whatsapp_system_config_table.php
new file mode 100644
index 0000000..3b59b62
--- /dev/null
+++ b/database/migrations/2026_04_24_000005_create_whatsapp_system_config_table.php
@@ -0,0 +1,39 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::create('whatsapp_system_config', function (Blueprint $table) {
+            $table->id();
+            $table->string('config_key', 255)->unique();
+            $table->text('config_value')->nullable();
+            $table->text('description')->nullable();
+            $table->timestamps();
+        });
+
+        // Seed default config keys
+        \DB::table('whatsapp_system_config')->insert([
+            ['config_key' => 'whatsapp_token',          'config_value' => '',    'description' => 'Token de acceso Bearer de Meta', 'created_at' => now(), 'updated_at' => now()],
+            ['config_key' => 'phone_number_id',          'config_value' => '',    'description' => 'ID del número de teléfono en Meta', 'created_at' => now(), 'updated_at' => now()],
+            ['config_key' => 'whatsapp_api_url',         'config_value' => 'https://graph.facebook.com/v22.0/', 'description' => 'URL base de la Graph API', 'created_at' => now(), 'updated_at' => now()],
+            ['config_key' => 'webhook_verify_token',     'config_value' => '',    'description' => 'Token secreto para verificar el webhook', 'created_at' => now(), 'updated_at' => now()],
+            ['config_key' => 'bot_enabled',              'config_value' => '1',   'description' => 'Activar/desactivar el bot (1/0)', 'created_at' => now(), 'updated_at' => now()],
+            ['config_key' => 'welcome_message',          'config_value' => '¡Hola! Bienvenido. ¿En qué te podemos ayudar?', 'description' => 'Mensaje de bienvenida', 'created_at' => now(), 'updated_at' => now()],
+            ['config_key' => 'default_no_match',         'config_value' => 'No entendí tu mensaje. Escribe MENU para ver las opciones.', 'description' => 'Mensaje cuando no se entiende la entrada', 'created_at' => now(), 'updated_at' => now()],
+            ['config_key' => 'advisor_message',          'config_value' => 'Un asesor se comunicará contigo pronto.', 'description' => 'Mensaje al solicitar asesor', 'created_at' => now(), 'updated_at' => now()],
+            ['config_key' => 'business_hours_enabled',   'config_value' => '0',   'description' => 'Validar horarios de atención (1/0)', 'created_at' => now(), 'updated_at' => now()],
+            ['config_key' => 'business_hours_start',     'config_value' => '08:00', 'description' => 'Hora inicio de atención', 'created_at' => now(), 'updated_at' => now()],
+            ['config_key' => 'business_hours_end',       'config_value' => '18:00', 'description' => 'Hora fin de atención', 'created_at' => now(), 'updated_at' => now()],
+        ]);
+    }
+
+    public function down(): void
+    {
+        Schema::dropIfExists('whatsapp_system_config');
+    }
+};
diff --git a/database/migrations/2026_04_24_000006_create_whatsapp_scheduled_and_logs_table.php b/database/migrations/2026_04_24_000006_create_whatsapp_scheduled_and_logs_table.php
new file mode 100644
index 0000000..43cd7f8
--- /dev/null
+++ b/database/migrations/2026_04_24_000006_create_whatsapp_scheduled_and_logs_table.php
@@ -0,0 +1,44 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::create('whatsapp_scheduled_messages', function (Blueprint $table) {
+            $table->id();
+            $table->unsignedBigInteger('user_id')->nullable();
+            $table->string('phone_number', 20);
+            $table->unsignedBigInteger('template_id')->nullable();
+            $table->string('template_name', 100)->nullable();
+            $table->string('template_language', 10)->nullable();
+            $table->longText('template_parameters')->nullable();
+            $table->enum('message_type', ['text', 'template'])->default('text');
+            $table->text('message_content')->nullable();
+            $table->date('scheduled_date');
+            $table->time('scheduled_time');
+            $table->enum('status', ['pending', 'sent', 'failed', 'cancelled'])->default('pending');
+            $table->datetime('sent_at')->nullable();
+            $table->text('error_message')->nullable();
+            $table->unsignedBigInteger('created_by')->nullable();
+            $table->datetime('created_at')->useCurrent();
+        });
+
+        Schema::create('whatsapp_webhook_logs', function (Blueprint $table) {
+            $table->id();
+            $table->longText('payload');
+            $table->text('response')->nullable();
+            $table->integer('status_code')->nullable();
+            $table->timestamp('created_at')->useCurrent();
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::dropIfExists('whatsapp_webhook_logs');
+        Schema::dropIfExists('whatsapp_scheduled_messages');
+    }
+};
diff --git a/public/DOCUMENTACION_BOT_WHATSAPP.md b/public/DOCUMENTACION_BOT_WHATSAPP.md
new file mode 100644
index 0000000..bcd3677
--- /dev/null
+++ b/public/DOCUMENTACION_BOT_WHATSAPP.md
@@ -0,0 +1,916 @@
+# Documentación Técnica — Bot WhatsApp Cloud API
+
+> **Propósito:** Esta documentación está pensada para ser entregada a otra IA o equipo de desarrollo para reimplementar el bot en cualquier lenguaje/plataforma, con toda la información necesaria sobre flujos, APIs, base de datos y contratos de datos.
+
+---
+
+## 1. Resumen del sistema
+
+El sistema es un **bot de WhatsApp** basado en la **WhatsApp Cloud API (Meta/Facebook Graph API v22.0)**. Permite:
+
+- Recibir y procesar mensajes entrantes mediante un **webhook HTTP**.
+- Responder automáticamente con textos, menús, botones interactivos, listas y archivos multimedia.
+- Transferir la conversación a un asesor humano.
+- Enviar **plantillas de mensaje** aprobadas por Meta.
+- Enviar **mensajes programados**.
+- Gestionar **términos y condiciones** (envío y aceptación).
+
+**Lenguaje original:** PHP 8.x  
+**Base de datos:** MySQL / MariaDB  
+**Cola / Workers:** Worker PHP con cron (no RabbitMQ ni Redis, aunque se usa Redis como opción para rate-limit).
+
+---
+
+## 2. Credenciales y configuración requerida
+
+Todas las credenciales se almacenan en la **tabla `system_config`** de la base de datos (no en código duro). También se cargan desde variables de entorno / archivo `.env`.
+    
+### 2.1 Variables de entorno (`.env`)
+
+```
+DB_HOST=mysql              # Host de la base de datos
+DB_PORT=3306
+DB_NAME=usite_whatsapp_bot
+DB_USER=usite_whatsapp_user
+DB_PASS=<password>
+DB_CHARSET=utf8mb4
+```
+
+### 2.2 Configuración de WhatsApp (en tabla `system_config`)
+
+| `config_key`         | Descripción                                                     | Ejemplo                                          |
+|----------------------|-----------------------------------------------------------------|--------------------------------------------------|
+| `whatsapp_token`     | Token de acceso permanente de la App de Meta                   | `EAABz...`                                       |
+| `phone_number_id`    | ID del número de teléfono de la cuenta de WhatsApp Business    | `123456789012345`                                |
+| `whatsapp_api_url`   | URL base de la Graph API                                        | `https://graph.facebook.com/v22.0/`             |
+| `webhook_verify_token` | Token secreto para verificar el webhook (GET de Meta)        | `mi_token_secreto`                               |
+| `bot_enabled`        | Si el bot responde automáticamente (`1`/`0`)                   | `1`                                              |
+| `business_hours_*`   | Horarios de atención (ver sección 8)                            | —                                                |
+| `terms_message`      | Mensaje de términos y condiciones que se envía al usuario       | texto libre                                      |
+
+---
+
+## 3. API de WhatsApp consumida
+
+**Base URL:** `https://graph.facebook.com/v22.0/{phone_number_id}/`
+
+**Autenticación:** Header `Authorization: Bearer {whatsapp_token}`
+
+**Formato:** JSON (Content-Type: `application/json`) salvo para subida de archivos (multipart/form-data).
+
+### 3.1 Enviar mensajes — `POST /{phone_number_id}/messages`
+
+Todos los tipos de mensaje tienen el campo común:
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "to": "57300XXXXXXX"
+}
+```
+
+---
+
+#### 3.1.1 Mensaje de texto
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "to": "57300XXXXXXX",
+  "type": "text",
+  "text": {
+    "body": "Hola, ¿en qué te podemos ayudar?"
+  }
+}
+```
+
+---
+
+#### 3.1.2 Mensaje de plantilla (template)
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "to": "57300XXXXXXX",
+  "type": "template",
+  "template": {
+    "name": "nombre_plantilla",
+    "language": { "code": "es" },
+    "components": [
+      {
+        "type": "header",
+        "parameters": [
+          { "type": "text", "text": "Valor del header" }
+        ]
+      },
+      {
+        "type": "body",
+        "parameters": [
+          { "type": "text", "parameter_name": "nombre", "text": "Juan" },
+          { "type": "text", "parameter_name": "fecha",  "text": "20/04/2026" }
+        ]
+      }
+    ]
+  }
+}
+```
+
+> **Nota sobre parámetros nombrados vs posicionales:**
+> - Si la plantilla usa variables `{{nombre}}` (nombradas): incluir `"parameter_name": "nombre"`.
+> - Si la plantilla usa variables `{{1}}`, `{{2}}` (posicionales): omitir `parameter_name`, usar solo `"type": "text", "text": "valor"` en orden.
+
+---
+
+#### 3.1.3 Mensaje interactivo — Botones
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "recipient_type": "individual",
+  "to": "57300XXXXXXX",
+  "type": "interactive",
+  "interactive": {
+    "type": "button",
+    "header": { "type": "text", "text": "Encabezado opcional" },
+    "body":   { "text": "Selecciona una opción:" },
+    "footer": { "text": "Pie de página opcional" },
+    "action": {
+      "buttons": [
+        { "type": "reply", "reply": { "id": "btn_1", "title": "Opción 1" } },
+        { "type": "reply", "reply": { "id": "btn_2", "title": "Opción 2" } }
+      ]
+    }
+  }
+}
+```
+
+> Máximo **3 botones**. El `title` no puede superar 20 caracteres.
+
+---
+
+#### 3.1.4 Mensaje interactivo — Lista
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "recipient_type": "individual",
+  "to": "57300XXXXXXX",
+  "type": "interactive",
+  "interactive": {
+    "type": "list",
+    "body":   { "text": "Elige una opción de la lista:" },
+    "action": {
+      "button": "Ver opciones",
+      "sections": [
+        {
+          "title": "Sección 1",
+          "rows": [
+            { "id": "row_1", "title": "Opción 1", "description": "Descripción opcional" },
+            { "id": "row_2", "title": "Opción 2" }
+          ]
+        }
+      ]
+    }
+  }
+}
+```
+
+---
+
+#### 3.1.5 Mensaje de imagen
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "to": "57300XXXXXXX",
+  "type": "image",
+  "image": {
+    "link": "https://ejemplo.com/imagen.jpg",
+    "caption": "Pie de foto opcional"
+  }
+}
+```
+
+---
+
+#### 3.1.6 Mensaje de video
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "to": "57300XXXXXXX",
+  "type": "video",
+  "video": {
+    "link": "https://ejemplo.com/video.mp4",
+    "caption": "Descripción del video"
+  }
+}
+```
+
+---
+
+#### 3.1.7 Mensaje de audio
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "to": "57300XXXXXXX",
+  "type": "audio",
+  "audio": {
+    "link": "https://ejemplo.com/audio.mp3"
+  }
+}
+```
+
+> Para notas de voz, el archivo debe ser `.ogg` con códec **OPUS** y subirse primero al media endpoint.
+
+---
+
+#### 3.1.8 Mensaje de documento
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "to": "57300XXXXXXX",
+  "type": "document",
+  "document": {
+    "link": "https://ejemplo.com/archivo.pdf",
+    "filename": "resultados.pdf",
+    "caption": "Tus resultados de laboratorio"
+  }
+}
+```
+
+---
+
+#### 3.1.9 Marcar mensaje como leído — `POST /{phone_number_id}/conversations`
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "status": "read",
+  "message_id": "wamid.XXXXX"
+}
+```
+
+---
+
+#### 3.1.10 Enviar reacción a un mensaje
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "to": "57300XXXXXXX",
+  "type": "reaction",
+  "reaction": {
+    "message_id": "wamid.XXXXX",
+    "emoji": "👍"
+  }
+}
+```
+
+---
+
+### 3.2 Subir archivo multimedia — `POST /{phone_number_id}/media`
+
+**Content-Type:** `multipart/form-data`
+
+Campos del formulario:
+
+| Campo               | Valor                                    |
+|---------------------|------------------------------------------|
+| `messaging_product` | `whatsapp`                               |
+| `file`              | Archivo binario                          |
+| `type`              | MIME type (ej: `image/jpeg`, `video/mp4`) |
+
+**Respuesta exitosa:**
+```json
+{ "id": "1234567890123456" }
+```
+
+Una vez obtenido el `id`, se puede usar en mensajes así:
+
+```json
+{
+  "messaging_product": "whatsapp",
+  "to": "57300XXXXXXX",
+  "type": "image",
+  "image": { "id": "1234567890123456" }
+}
+```
+
+---
+
+### 3.3 Obtener URL de un media — `GET /{media_id}`
+
+**Respuesta:**
+```json
+{
+  "url": "https://lookaside.fbsbx.com/whatsapp_business/attachments/?mid=...",
+  "mime_type": "image/jpeg",
+  "sha256": "...",
+  "file_size": 12345,
+  "id": "1234567890123456",
+  "messaging_product": "whatsapp"
+}
+```
+
+Luego descargar esa URL con el mismo Bearer token.
+
+---
+
+### 3.4 Gestión de plantillas — `GET /{waba_id}/message_templates`
+
+```
+GET https://graph.facebook.com/v22.0/{WABA_ID}/message_templates
+Authorization: Bearer {token}
+```
+
+**Parámetros opcionales:** `?name=nombre_plantilla&status=APPROVED`
+
+---
+
+## 4. Webhook — Recepción de mensajes
+
+### 4.1 Verificación del webhook (GET)
+
+Meta envía un GET para verificar el endpoint:
+
+```
+GET /api/webhook.php?hub.mode=subscribe&hub.verify_token=TOKEN&hub.challenge=CHALLENGE
+```
+
+El sistema debe responder con el valor de `hub.challenge` si `hub.verify_token` coincide con `WEBHOOK_VERIFY_TOKEN`.
+
+---
+
+### 4.2 Payload de mensaje entrante (POST)
+
+```json
+{
+  "object": "whatsapp_business_account",
+  "entry": [
+    {
+      "id": "WABA_ID",
+      "changes": [
+        {
+          "field": "messages",
+          "value": {
+            "messaging_product": "whatsapp",
+            "metadata": {
+              "display_phone_number": "57300XXXXXXX",
+              "phone_number_id": "PHONE_NUMBER_ID"
+            },
+            "contacts": [
+              {
+                "profile": { "name": "Nombre del Contacto" },
+                "wa_id": "57300XXXXXXX"
+              }
+            ],
+            "messages": [
+              {
+                "from": "57300XXXXXXX",
+                "id": "wamid.XXXXXXXXXXXXX",
+                "timestamp": "1713900000",
+                "type": "text",
+                "text": { "body": "Hola" }
+              }
+            ]
+          }
+        }
+      ]
+    }
+  ]
+}
+```
+
+**Tipos de mensaje posibles en el campo `type`:**
+
+| `type`       | Estructura del mensaje                                      |
+|--------------|-------------------------------------------------------------|
+| `text`       | `message.text.body`                                        |
+| `image`      | `message.image.id`, `message.image.mime_type`              |
+| `video`      | `message.video.id`, `message.video.mime_type`              |
+| `audio`      | `message.audio.id`, `message.audio.voice` (bool)           |
+| `document`   | `message.document.id`, `document.filename`, `document.mime_type` |
+| `sticker`    | `message.sticker.id`                                       |
+| `location`   | `message.location.latitude`, `message.location.longitude` |
+| `interactive`| `message.interactive.type` = `list_reply` o `button_reply` |
+| `reaction`   | `message.reaction.emoji`, `message.reaction.message_id`   |
+
+**Respuesta de acceso interactivo:**
+
+```json
+{
+  "interactive": {
+    "type": "list_reply",
+    "list_reply": {
+      "id": "row_1",
+      "title": "Opción 1",
+      "description": "descripción"
+    }
+  }
+}
+```
+
+---
+
+### 4.3 Normalización interna de mensajes interactivos
+
+El webhook normaliza las respuestas de lista/botón a texto plano para que el BotService las procese como si fueran texto:
+
+- Si `title` empieza con un número (`"1. Opción"`), se extrae solo el número.
+- Si no, se usa el `title` completo.
+
+---
+
+## 5. Flujo de procesamiento de mensajes
+
+```
+WhatsApp Cloud API
+       │
+       ▼
+POST /api/webhook.php
+       │
+       ├─ Verificar duplicado (por message_id en conversations)
+       ├─ Obtener/crear usuario en tabla `users`
+       ├─ Guardar nombre del contacto si no tenía
+       │
+       ▼
+WhatsAppWebhook::processConversations()
+       │
+       ├─ Extraer tipo de mensaje y contenido
+       ├─ Guardar mensaje en tabla `conversations` (direction: incoming)
+       │
+       ▼
+BotService::processMessage($user, $messageText, $messageType)
+       │
+       ├─ 1. Adquirir advisory lock por usuario (MySQL GET_LOCK) → evita race conditions
+       ├─ 2. Si usuario bloqueado → descartar
+       ├─ 3. Si usuario in_service (atendido por asesor) → descartar
+       ├─ 4. maybeResetConversationAfterIdle() → reinicia si inactividad > 6h
+       ├─ 5. Flujo de Términos:
+       │      ├─ Si terms_pending → processTermsResponse()
+       │      └─ Si needsTermsAcceptance() → sendTermsMessage()
+       ├─ 6. Si 'isNewUser' → sendWelcomeMessage()
+       ├─ 7. Si usuario escribe "enviado/a/os/as" → requestAdvisor()
+       ├─ 8. processSpecialCommands() (MENU, ATRÁS, ASESOR, etc.)
+       ├─ 9. Si on_hold activo y no expiró → notificar y retornar
+       ├─10. Si advisor_requested activo → solo navegación explícita
+       ├─11. Si bot_paused_until activo → solo navegación explícita
+       ├─12. Si bot_enabled=false → solo comandos explícitos
+       ├─13. Si current_menu_id → processMenuSelection()
+       └─14. Fallback → sendDefaultNoMatch()
+```
+
+---
+
+## 6. Comandos especiales del bot
+
+Los usuarios pueden escribir estas palabras clave en cualquier momento:
+
+| Palabra clave                          | Acción                                     |
+|----------------------------------------|--------------------------------------------|
+| `menu`, `menú`, `inicio`               | Mostrar menú principal                     |
+| `atras`, `atrás`, `volver`, `back`     | Retroceder al menú anterior                |
+| `asesor`, `agente`, `humano`           | Solicitar atención humana                  |
+| `enviado`, `enviada`, `enviados`, `enviadas` | Indicar que se envió documentación — transfiere a asesor |
+| Número (`1`, `2`, `3`…)               | Seleccionar opción de menú activo          |
+
+---
+
+## 7. Base de datos — Tablas principales del bot
+
+### 7.1 `users` — Usuarios (contactos de WhatsApp)
+
+| Campo               | Tipo                  | Descripción                                        |
+|---------------------|-----------------------|----------------------------------------------------|
+| `id`                | INT AUTO_INCREMENT    | Clave primaria                                     |
+| `phone_number`      | VARCHAR(20) UNIQUE    | Número en formato internacional sin `+` (ej: `573001234567`) |
+| `name`              | VARCHAR(100)          | Nombre del contacto (viene del perfil de WhatsApp) |
+| `status`            | ENUM                  | `active`, `blocked`, `inactive`                   |
+| `current_menu_id`   | INT NULL              | FK → `menus.id` — menú donde está el usuario      |
+| `current_step`      | INT DEFAULT 0         | Paso dentro del flujo actual                       |
+| `session_data`      | TEXT (JSON)           | Datos temporales de sesión                         |
+| `welcome_sent_at`   | DATETIME              | Última vez que se envió el mensaje de bienvenida  |
+| `in_service`        | TINYINT(1)            | `1` = está siendo atendido por un asesor           |
+| `in_service_by`     | INT NULL              | FK → `admin_users.id` — asesor que lo atiende     |
+| `on_hold`           | TINYINT(1)            | `1` = el asesor lo puso en espera                 |
+| `bot_paused_until`  | DATETIME NULL         | El bot está pausado hasta esta fecha/hora          |
+| `advisor_requested` | TINYINT(1)            | `1` = el usuario solicitó asesor                  |
+| `bot_enabled`       | TINYINT(1) DEFAULT 1  | Si el bot responde a este usuario                 |
+| `terms_pending`     | TINYINT(1)            | `1` = esperando respuesta de términos             |
+| `terms_accepted_at` | DATETIME              | Cuándo aceptó los términos                        |
+| `terms_version_id`  | INT NULL              | FK → `terms_versions.id`                          |
+| `created_at`        | TIMESTAMP             | Fecha de creación                                  |
+| `updated_at`        | TIMESTAMP             | Última actualización                               |
+
+---
+
+### 7.2 `conversations` — Mensajes
+
+| Campo                    | Tipo            | Descripción                                               |
+|--------------------------|-----------------|-----------------------------------------------------------|
+| `id`                     | INT             | Clave primaria                                            |
+| `user_id`                | INT             | FK → `users.id`                                          |
+| `message_id`             | VARCHAR(255)    | ID único del mensaje en WhatsApp (`wamid.XXX`)           |
+| `reply_to_message_id`    | VARCHAR(255)    | ID del mensaje al que responde                           |
+| `reaction_to_message_id` | VARCHAR(255)    | ID del mensaje al que se reaccionó                        |
+| `reaction_emoji`         | VARCHAR(64)     | Emoji de la reacción                                     |
+| `direction`              | ENUM            | `incoming` (usuario→bot) / `outgoing` (bot→usuario)      |
+| `message_type`           | VARCHAR(32)     | `text`, `image`, `video`, `audio`, `document`, `reaction`|
+| `content`                | TEXT            | Contenido del mensaje (texto o JSON para multimedia/sistema) |
+| `media_url`              | TEXT            | URL pública del archivo                                  |
+| `whatsapp_media_id`      | VARCHAR(255)    | ID del media en WhatsApp                                 |
+| `local_file`             | VARCHAR(255)    | Ruta local del archivo descargado                        |
+| `local_thumb`            | VARCHAR(255)    | Ruta local del thumbnail                                 |
+| `media_storage`          | VARCHAR(50)     | Dónde se almacena (`local`, `whatsapp`, etc.)            |
+| `status`                 | VARCHAR(32)     | `received`, `sent`, `delivered`, `read`, `failed`        |
+| `is_read`                | TINYINT(1)      | Si el admin marcó la conversación como leída             |
+| `filename`               | VARCHAR(255)    | Nombre del archivo adjunto                               |
+| `mime_type`              | VARCHAR(100)    | MIME type del archivo                                    |
+| `created_at`             | TIMESTAMP       | Fecha del mensaje                                        |
+
+---
+
+### 7.3 `menus` — Menús del bot
+
+| Campo           | Tipo          | Descripción                                              |
+|-----------------|---------------|----------------------------------------------------------|
+| `id`            | INT           | Clave primaria                                           |
+| `name`          | VARCHAR(255)  | Nombre interno del menú                                 |
+| `title`         | VARCHAR(255)  | Título que se muestra al usuario                        |
+| `message`       | TEXT          | Texto del menú completo                                 |
+| `parent_id`     | INT NULL      | FK → `menus.id` — menú padre (para navegación ATRÁS)   |
+| `is_main`       | TINYINT(1)    | `1` = es el menú principal                              |
+| `is_active`     | TINYINT(1)    | `1` = activo                                            |
+| `sort_order`    | INT           | Orden de presentación                                   |
+| `created_at`    | TIMESTAMP     |                                                          |
+
+---
+
+### 7.4 `menu_options` — Opciones de menú
+
+| Campo           | Tipo          | Descripción                                                    |
+|-----------------|---------------|----------------------------------------------------------------|
+| `id`            | INT           | Clave primaria                                                  |
+| `menu_id`       | INT           | FK → `menus.id`                                               |
+| `option_number` | INT           | Número que el usuario debe escribir (1, 2, 3…)                |
+| `title`         | VARCHAR(255)  | Texto de la opción                                             |
+| `action_type`   | ENUM          | `submenu`, `message`, `template`, `url`, `advisor`, `flow`    |
+| `action_value`  | TEXT          | Depends en `action_type`: ID de submenú, texto, nombre de plantilla, URL |
+| `is_active`     | TINYINT(1)    | `1` = activa                                                   |
+| `sort_order`    | INT           | Orden                                                           |
+
+---
+
+### 7.5 `message_templates` — Plantillas
+
+| Campo                | Tipo          | Descripción                                                    |
+|----------------------|---------------|----------------------------------------------------------------|
+| `id`                 | INT           | Clave primaria                                                  |
+| `name`               | VARCHAR(255)  | Nombre interno                                                  |
+| `template_name`      | VARCHAR(255)  | Nombre en Meta (slug, sin espacios)                            |
+| `language_code`      | VARCHAR(10)   | Idioma (`es`, `en`, etc.)                                      |
+| `status`             | ENUM          | `pending`, `approved`, `rejected`, `paused`                   |
+| `body_text`          | TEXT          | Cuerpo del template con variables `{{1}}` o `{{nombre}}`      |
+| `header_type`        | ENUM          | `text`, `image`, `video`, `document`                          |
+| `header_text`        | VARCHAR(255)  | Texto del header si aplica                                     |
+| `footer_text`        | VARCHAR(255)  | Pie del mensaje                                                |
+| `components`         | LONGTEXT JSON | Componentes completos del template tal como los devuelve Meta |
+| `example_parameters` | LONGTEXT JSON | Ejemplos de valores para las variables                        |
+| `created_at`         | TIMESTAMP     |                                                                 |
+| `updated_at`         | TIMESTAMP     |                                                                 |
+
+---
+
+### 7.6 `autoresponses` — Respuestas automáticas por keyword
+
+| Campo           | Tipo          | Descripción                                                     |
+|-----------------|-|-----------------------------------------------------------------|
+| `id`            | INT           | Clave primaria                                                   |
+| `trigger_type`  | ENUM          | `keyword`, `contains`, `exact`, `welcome`, `default`           |
+| `trigger_value` | TEXT          | Palabras clave separadas por coma                               |
+| `response_text` | TEXT          | Texto de la respuesta                                           |
+| `response_type` | ENUM          | `text`, `template`, `menu`                                     |
+| `template_name` | VARCHAR(255)  | Nombre de la plantilla si `response_type = template`           |
+| `menu_id`       | INT NULL      | ID del menú si `response_type = menu`                          |
+| `priority`      | INT           | Prioridad (mayor número = mayor prioridad)                     |
+| `is_active`     | TINYINT(1)    | `1` = activa                                                    |
+
+---
+
+### 7.7 `scheduled_messages` — Mensajes programados
+
+| Campo                 | Tipo          | Descripción                                               |
+|-----------------------|---------------|-----------------------------------------------------------|
+| `id`                  | INT           | Clave primaria                                            |
+| `user_id`             | INT           | FK → `users.id`                                          |
+| `template_id`         | INT NULL      | FK → `message_templates.id`                             |
+| `template_name`       | VARCHAR(100)  | Nombre de la plantilla                                    |
+| `template_language`   | VARCHAR(10)   | Idioma de la plantilla                                    |
+| `template_parameters` | LONGTEXT JSON | Parámetros para las variables de la plantilla             |
+| `message_type`        | ENUM          | `text`, `template`                                        |
+| `message_content`     | TEXT          | Texto si `message_type = text`                           |
+| `scheduled_date`      | DATE          | Fecha programada                                          |
+| `scheduled_time`      | TIME          | Hora programada                                           |
+| `status`              | ENUM          | `pending`, `sent`, `failed`, `cancelled`                 |
+| `sent_at`             | DATETIME      | Cuándo se envió efectivamente                            |
+| `error_message`       | TEXT          | Error si falló el envío                                   |
+| `created_by`          | INT NULL      | Admin que creó el recordatorio                           |
+| `created_at`          | DATETIME      |                                                           |
+
+---
+
+### 7.8 `system_config` — Configuración del sistema
+
+| Campo          | Tipo          | Descripción                        |
+|----------------|---------------|------------------------------------|
+| `id`           | INT           | Clave primaria                     |
+| `config_key`   | VARCHAR(255)  | Clave de configuración (UNIQUE)   |
+| `config_value` | TEXT          | Valor de la configuración          |
+| `description`  | TEXT NULL     | Descripción opcional               |
+| `created_at`   | DATETIME      |                                    |
+| `updated_at`   | DATETIME      |                                    |
+
+**Claves relevantes para el bot:**
+
+| `config_key`             | Descripción                                          |
+|--------------------------|------------------------------------------------------|
+| `whatsapp_token`         | Token de acceso Bearer                              |
+| `phone_number_id`        | ID del número de teléfono                           |
+| `whatsapp_api_url`       | URL base del API                                    |
+| `webhook_verify_token`   | Token secreto del webhook                           |
+| `bot_enabled`            | Activar/desactivar el bot (`1`/`0`)                |
+| `welcome_message`        | Texto del mensaje de bienvenida                     |
+| `default_no_match`       | Mensaje cuando no se entiende la entrada del usuario|
+| `advisor_message`        | Mensaje al solicitar asesor                        |
+| `terms_message`          | Texto de los términos y condiciones                 |
+| `business_hours_enabled` | Si se validan horarios de atención                 |
+| `business_hours_start`   | Hora inicio (ej: `06:15`)                          |
+| `business_hours_end`     | Hora fin (ej: `17:00`)                             |
+
+---
+
+### 7.9 `notifications` — Notificaciones internas para asesores
+
+| Campo       | Tipo         | Descripción                              |
+|-------------|--------------|------------------------------------------|
+| `id`        | INT          | Clave primaria                           |
+| `user_id`   | INT          | FK → `users.id`                         |
+| `type`      | VARCHAR(50)  | Tipo de notificación (`new_message`, `advisor_requested`, etc.) |
+| `message`   | TEXT         | Cuerpo de la notificación               |
+| `is_read`   | TINYINT(1)   | Si fue leída                            |
+| `created_at`| TIMESTAMP    |                                          |
+
+---
+
+### 7.10 `terms_versions` — Versiones de términos y condiciones
+
+| Campo              | Tipo          | Descripción                                           |
+|--------------------|---------------|-------------------------------------------------------|
+| `id`               | INT           | Clave primaria                                        |
+| `version`          | VARCHAR(20)   | Versión (ej: `1.0`, `2.0`)                           |
+| `titulo`           | VARCHAR(255)  | Título del documento                                  |
+| `documento_url`    | TEXT          | URL pública del PDF de términos                      |
+| `mensaje_aceptacion` | TEXT        | Mensaje que se envía al usuario solicitando aceptación |
+| `activa`           | TINYINT(1)    | `1` = versión vigente                                |
+| `forzar_reenvio`   | TINYINT(1)    | `1` = forzar que todos los usuarios re-acepten       |
+| `created_at`       | TIMESTAMP     |                                                       |
+
+---
+
+### 7.11 `terms_acceptance` — Aceptación de términos
+
+| Campo              | Tipo          | Descripción                           |
+|--------------------|---------------|---------------------------------------|
+| `id`               | INT           | Clave primaria                        |
+| `user_id`          | INT           | FK → `users.id`                      |
+| `terms_version_id` | INT           | FK → `terms_versions.id`             |
+| `phone_number`     | VARCHAR(20)   | Teléfono del usuario                  |
+| `estado`           | ENUM          | `pendiente`, `aceptado`, `rechazado`  |
+| `fecha_envio`      | DATETIME      | Cuándo se envió la solicitud          |
+| `fecha_respuesta`  | DATETIME NULL | Cuándo respondió el usuario           |
+
+---
+
+### 7.12 `admin_users` — Administradores del sistema
+
+| Campo          | Tipo          | Descripción                      |
+|----------------|---------------|----------------------------------|
+| `id`           | INT           | Clave primaria                   |
+| `username`     | VARCHAR(50)   | Nombre de usuario (UNIQUE)      |
+| `password_hash`| VARCHAR(255)  | Bcrypt hash de la contraseña    |
+| `full_name`    | VARCHAR(100)  | Nombre completo                  |
+| `email`        | VARCHAR(100)  | Correo electrónico               |
+| `is_active`    | TINYINT(1)    | `1` = activo                    |
+| `role_id`      | INT NULL      | FK → `roles.id`                 |
+| `last_login`   | TIMESTAMP     | Último login                    |
+
+---
+
+### 7.13 `webhook_logs` — Logs del webhook
+
+| Campo         | Tipo          | Descripción                           |
+|---------------|---------------|---------------------------------------|
+| `id`          | INT           | Clave primaria                        |
+| `payload`     | LONGTEXT      | Body JSON recibido de WhatsApp        |
+| `response`    | TEXT          | Respuesta devuelta                    |
+| `status_code` | INT           | Código HTTP                           |
+| `created_at`  | TIMESTAMP     | Fecha del evento                      |
+
+---
+
+## 8. Formato del número de teléfono
+
+Los números se almacenan y envían **sin el símbolo `+`**, en formato E.164:
+
+- Colombia: `573001234567` (código país 57 + número sin prefijo)
+- Argentina: `5491123456789`
+
+El sistema normaliza automáticamente:
+- Elimina caracteres no numéricos.
+- Si el número tiene 10 dígitos y empieza con `3` → agrega prefijo `57` (Colombia).
+- Si ya tiene 12 dígitos → lo usa tal cual.
+
+---
+
+## 9. Lógica de estados del usuario
+
+El bot controla el flujo mediante campos en la tabla `users`:
+
+```
+Estado normal:
+  bot_enabled=1, in_service=0, on_hold=0, advisor_requested=0, bot_paused_until=NULL
+  → Bot responde normalmente
+
+En menú:
+  current_menu_id=<id> → Bot espera número de opción
+
+Atendido por asesor:
+  in_service=1, in_service_by=<admin_id>
+  → Bot NO responde, asesor humano escribe directamente
+
+En espera (hold activo):
+  on_hold=1, bot_paused_until=<datetime>
+  → Bot notifica que está en espera, solo permite MENU/ATRÁS/números
+
+Asesor solicitado:
+  advisor_requested=1, bot_paused_until=<datetime>
+  → Bot espera al asesor, solo permite navegación explícita
+
+Bot pausado:
+  bot_paused_until=<datetime futura>
+  → Bot no responde mensajes libres, solo menús/comandos
+
+Pendiente de términos:
+  terms_pending=1
+  → Bot solo procesa respuesta "acepto" o "rechazo"
+
+Usuario bloqueado:
+  status='blocked'
+  → Todos los mensajes se descartan silenciosamente
+```
+
+---
+
+## 10. Estados de conversación (tabla `user_states`)
+
+Estados clave/valor persistentes por usuario (como sesión):
+
+| `state_key`    | Descripción                                                   |
+|----------------|---------------------------------------------------------------|
+| `menu_history` | Array JSON con historial de IDs de menús visitados           |
+| `current_menu` | ID del menú actual                                           |
+| `form_data`    | Datos temporales de un formulario en curso                   |
+
+---
+
+## 11. Endpoints internos del sistema (API interna)
+
+Estos endpoints son para el **panel de administración**, no son de WhatsApp. Se implementarían como API REST en el nuevo sistema:
+
+| Método | Ruta interna                   | Descripción                                      |
+|--------|-------------------------------|--------------------------------------------------|
+| GET    | `/api/get_conversations.php`  | Lista de conversaciones con paginación           |
+| GET    | `/api/get_conversation_detail.php?user_id=X` | Mensajes de un usuario   |
+| POST   | `/api/send_message.php`       | Enviar mensaje desde el panel                    |
+| POST   | `/api/send_reply.php`         | Responder a un mensaje                           |
+| POST   | `/api/attend.php`             | Marcar usuario como "en atención" por asesor     |
+| POST   | `/api/finish_attend.php`      | Liberar usuario de la atención                   |
+| POST   | `/api/release_hold.php`       | Liberar usuario del estado on_hold               |
+| GET    | `/api/get_templates.php`      | Lista de plantillas aprobadas                    |
+| POST   | `/api/send_broadcast.php`     | Enviar mensaje masivo a múltiples usuarios       |
+| POST   | `/api/schedule_message.php`   | Programar un mensaje                             |
+| GET    | `/api/get_menus.php`          | Lista de menús configurados                      |
+| POST   | `/api/save_menu.php`          | Crear/editar menú                                |
+| GET    | `/api/get_settings.php`       | Configuración del sistema                        |
+| POST   | `/api/save_settings.php`      | Guardar configuración                            |
+| GET    | `/api/sse_events.php`         | Server-Sent Events para tiempo real              |
+
+---
+
+## 12. Flujo de términos y condiciones
+
+```
+Usuario envía mensaje
+        │
+        ▼
+¿needsTermsAcceptance()?
+        │ SÍ
+        ▼
+sendTermsMessage()
+  → Envía texto con el mensaje de términos + URL del documento
+  → Guarda users.terms_pending = 1
+  → Inserta en terms_acceptance (estado: 'pendiente')
+        │
+Usuario responde
+        │
+processTermsResponse()
+  ├─ Si respuesta contiene "acepto", "si", "sí", "ok", "1" → ACEPTA
+  │    → Actualiza users.terms_accepted_at, terms_version_id
+  │    → Actualiza terms_acceptance.estado = 'aceptado'
+  │    → Envía mensaje de confirmación
+  └─ Si respuesta contiene "no", "rechazo", "2" → RECHAZA
+       → Actualiza terms_acceptance.estado = 'rechazado'
+       → Envía mensaje de rechazo
+```
+
+---
+
+## 13. Worker de mensajes programados
+
+Un proceso cron (o worker) ejecuta cada minuto:
+
+1. Consulta `scheduled_messages` donde `status = 'pending'` y `scheduled_date + scheduled_time <= NOW()`.
+2. Para cada registro:
+   - Si `message_type = 'template'` → llama a `WhatsAppService::sendTemplateMessage()`.
+   - Si `message_type = 'text'` → llama a `WhatsAppService::sendTextMessage()`.
+3. Actualiza `status = 'sent'` y registra `sent_at`.
+4. Si falla → `status = 'failed'` + registra `error_message`.
+
+---
+
+## 14. Diagrama de clases del bot
+
+```
+WhatsAppWebhook (api/webhook.php)
+    │
+    ├──uses──▶ WhatsAppService (services/WhatsAppService.php)
+    │              ├── sendTextMessage($to, $message)
+    │              ├── sendTemplateMessage($to, $name, $lang, $bodyParams, $headerParams, $rawComponents)
+    │              ├── sendInteractiveMessage($to, $body, $buttons, $header, $footer)
+    │              ├── sendListMessage($to, $body, $buttonText, $sections, $header, $footer)
+    │              ├── sendImageMessage($to, $url, $caption)
+    │              ├── sendVideoMessage($to, $url, $caption)
+    │              ├── sendAudioMessage($to, $url)
+    │              ├── sendDocumentMessage($to, $url, $filename, $caption)
+    │              ├── sendReactionMessage($to, $messageId, $emoji)
+    │              ├── markAsRead($messageId)
+    │              ├── uploadMedia($filePath, $mimeType) → retorna { id: "..." }
+    │              └── getMediaUrl($mediaId) → retorna URL temporal
+    │
+    └──uses──▶ BotService (services/BotService.php)
+                   │
+                   ├──uses──▶ MenuService (services/MenuService.php)
+                   │              └── getMenu($id), getMenuOptions($menuId)
+                   │
+                   ├──uses──▶ ConversationStateService (services/ConversationStateService.php)
+                   │              ├── getCurrentMenuId($phone)
+                   │              ├── setCurrentMenu($phone, $menuId)
+                   │              └── getStateData($phone, $key)
+                   │
+                   ├──uses──▶ BusinessHoursService (services/BusinessHoursService.php)
+                   │              └── isWithinBusinessHours()
+                   │
+                   └──uses──▶ NLPService (services/NLPService.php)
+                                  └── analyze($text) → detección de intenciones básica
+```
+
+---
+
+## 15. Checklist de implementación
+
+Para reimplementar el bot en otro sistema/lenguaje:
+
+- [ ] Configurar la App en Meta for Developers con permisos `whatsapp_business_messaging`, `whatsapp_business_management`.
+- [ ] Obtener: `Access Token`, `Phone Number ID`, `WABA ID`, `Webhook Verify Token`.
+- [ ] Crear endpoint público HTTPS para el webhook (GET para verificación, POST para mensajes).
+- [ ] Crear las tablas de base de datos: `users`, `conversations`, `menus`, `menu_options`, `message_templates`, `autoresponses`, `system_config`, `notifications`, `terms_versions`, `terms_acceptance`, `scheduled_messages`, `webhook_logs`.
+- [ ] Implementar `WhatsAppService` con los métodos de envío (ver sección 3).
+- [ ] Implementar la lógica de estados del usuario (sección 9).
+- [ ] Implementar el flujo de menús dinámicos (mensajes numerados).
+- [ ] Implementar el flujo de términos y condiciones (sección 12).
+- [ ] Implementar sistema de advisory lock por usuario para evitar mensajes duplicados en procesamiento concurrente.
+- [ ] Implementar cron/worker para mensajes programados (sección 13).
+- [ ] Implementar reinicio de sesión después de 6h de inactividad.
+
+---
+
+## 16. Notas de seguridad
+
+- **Nunca** expongas el `whatsapp_token` en el frontend.
+- Validar siempre el `hub.verify_token` en el handshake del webhook.
+- Sanear todos los campos de texto antes de almacenar en BD para evitar XSS/SQLi.
+- Los mensajes duplicados se detectan por `message_id` único (`wamid.XXX`) — siempre validar antes de procesar.
+- Usar advisory locks a nivel de BD para evitar race conditions cuando WhatsApp envía el mismo webhook dos veces en paralelo.
diff --git a/resources/views/layouts/navigation.blade.php b/resources/views/layouts/navigation.blade.php
index 5f700ff..703718e 100755
--- a/resources/views/layouts/navigation.blade.php
+++ b/resources/views/layouts/navigation.blade.php
@@ -245,6 +245,50 @@
 
                 <livewire:show-saving-ip />
 
+                {{-- Módulo WhatsApp (solo admins) --}}
+                @if (in_array(auth()->user()->rol->nombre, ['super', 'administrador']))
+                    <div x-data="{ openWa: false }" class="space-y-1">
+                        <button @click="openWa = !openWa"
+                            class="flex items-center justify-between w-full py-2 px-3 rounded text-white hover:bg-white/10 focus:outline-none">
+                            <div class="flex items-center gap-2">
+                                <svg class="w-5" viewBox="0 0 24 24" fill="currentColor">
+                                    <path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347z"/><path d="M12 0C5.373 0 0 5.373 0 12c0 2.127.558 4.122 1.532 5.857L.057 23.786a.5.5 0 0 0 .629.628l5.963-1.467A11.944 11.944 0 0 0 12 24c6.627 0 12-5.373 12-12S18.627 0 12 0zm0 22c-1.88 0-3.638-.52-5.145-1.42l-.369-.22-3.818.94.974-3.782-.239-.381A9.944 9.944 0 0 1 2 12c0-5.523 4.477-10 10-10s10 4.477 10 10-4.477 10-10 10z"/>
+                                </svg>
+                                <span>WhatsApp</span>
+                            </div>
+                            <svg :class="openWa ? 'rotate-180' : ''" class="w-4 h-4 transform transition-transform" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
+                                <path stroke-linecap="round" stroke-linejoin="round" d="M19 9l-7 7-7-7" />
+                            </svg>
+                        </button>
+                        <div x-show="openWa" x-transition class="space-y-1">
+                            <a href="{{ route('whatsapp.conversaciones') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white text-left {{ request()->routeIs('whatsapp.conversaciones') ? 'bg-white/20' : 'hover:bg-white/10' }}">
+                                <svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M20.25 8.511c.884.284 1.5 1.128 1.5 2.097v4.286c0 1.136-.847 2.1-1.98 2.193-.34.027-.68.052-1.02.072v3.091l-3-3c-1.354 0-2.694-.055-4.02-.163a2.115 2.115 0 0 1-.825-.242m9.345-8.334a2.126 2.126 0 0 0-.476-.095 48.64 48.64 0 0 0-8.048 0c-1.131.094-1.976 1.057-1.976 2.192v4.286c0 .837.46 1.58 1.155 1.951m9.345-8.334V6.637c0-1.621-1.152-3.026-2.76-3.235A48.455 48.455 0 0 0 11.25 3c-2.115 0-4.198.137-6.24.402-1.608.209-2.76 1.614-2.76 3.235v6.226c0 1.621 1.152 3.026 2.76 3.235.577.075 1.157.14 1.74.194V21l4.155-4.155" /></svg>
+                                <span>Conversaciones</span>
+                            </a>
+                            <a href="{{ route('whatsapp.menus') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white text-left {{ request()->routeIs('whatsapp.menus') ? 'bg-white/20' : 'hover:bg-white/10' }}">
+                                <svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M5 12h14M5 12h14M5 6h14M5 18h14" /></svg>
+                                <span>Menús del Bot</span>
+                            </a>
+                            <a href="{{ route('whatsapp.plantillas') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white text-left {{ request()->routeIs('whatsapp.plantillas') ? 'bg-white/20' : 'hover:bg-white/10' }}">
+                                <svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12h6m-6 4h6m2 5H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5.586a1 1 0 0 1 .707.293l5.414 5.414a1 1 0 0 1 .293.707V19a2 2 0 0 1-2 2z" /></svg>
+                                <span>Plantillas</span>
+                            </a>
+                            <a href="{{ route('whatsapp.programados') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white text-left {{ request()->routeIs('whatsapp.programados') ? 'bg-white/20' : 'hover:bg-white/10' }}">
+                                <svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" /></svg>
+                                <span>Mensajes Programados</span>
+                            </a>
+                            <a href="{{ route('whatsapp.configuracion') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white text-left {{ request()->routeIs('whatsapp.configuracion') ? 'bg-white/20' : 'hover:bg-white/10' }}">
+                                <svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 0 1 0 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 0 1-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.24.437-.613.43-.992a6.932 6.932 0 0 1 0-.255c.007-.378-.138-.75-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28Z" /><path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" /></svg>
+                                <span>Configuración Bot</span>
+                            </a>
+                            <a href="{{ route('whatsapp.logs') }}" class="flex items-center gap-2 py-2 px-3 rounded text-white text-left {{ request()->routeIs('whatsapp.logs') ? 'bg-white/20' : 'hover:bg-white/10' }}">
+                                <svg class="w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M3.75 12h16.5m-16.5 3.75h16.5M3.75 19.5h16.5M5.625 4.5h12.75a1.875 1.875 0 0 1 0 3.75H5.625a1.875 1.875 0 0 1 0-3.75Z" /></svg>
+                                <span>Logs Webhook</span>
+                            </a>
+                        </div>
+                    </div>
+                @endif
+
                 <!-- Logout -->
                 <div>
                     <form method="POST" action="{{ route('logout') }}">
diff --git a/resources/views/livewire/whatsapp/show-configuracion-bot.blade.php b/resources/views/livewire/whatsapp/show-configuracion-bot.blade.php
new file mode 100644
index 0000000..51d7453
--- /dev/null
+++ b/resources/views/livewire/whatsapp/show-configuracion-bot.blade.php
@@ -0,0 +1,118 @@
+<div>
+    <div class="max-w-3xl mx-auto">
+        <h1 class="text-2xl font-bold text-gray-800 flex items-center gap-2 mb-6">
+            <svg class="w-7 h-7 text-green-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"/>
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"/>
+            </svg>
+            Configuración del Bot WhatsApp
+        </h1>
+
+        <form wire:submit.prevent="save" class="space-y-6">
+
+            {{-- Credenciales Meta --}}
+            <div class="bg-white rounded-xl shadow p-6 space-y-4">
+                <h2 class="text-base font-semibold text-gray-700 border-b border-gray-100 pb-2">Credenciales Meta / Graph API</h2>
+
+                <div>
+                    <label class="block text-xs font-medium text-gray-600 mb-1">Token de acceso (Bearer) *</label>
+                    <input wire:model="whatsapp_token" type="password"
+                        class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400 font-mono">
+                    @error('whatsapp_token') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
+                </div>
+
+                <div class="grid grid-cols-2 gap-4">
+                    <div>
+                        <label class="block text-xs font-medium text-gray-600 mb-1">Phone Number ID *</label>
+                        <input wire:model="phone_number_id" type="text" placeholder="123456789012345"
+                            class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400 font-mono">
+                        @error('phone_number_id') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
+                    </div>
+                    <div>
+                        <label class="block text-xs font-medium text-gray-600 mb-1">URL API (Graph) *</label>
+                        <input wire:model="whatsapp_api_url" type="url"
+                            class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400 font-mono">
+                        @error('whatsapp_api_url') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
+                    </div>
+                </div>
+
+                <div>
+                    <label class="block text-xs font-medium text-gray-600 mb-1">Webhook Verify Token *</label>
+                    <input wire:model="webhook_verify_token" type="text"
+                        class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400 font-mono">
+                    @error('webhook_verify_token') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
+                </div>
+            </div>
+
+            {{-- Control del bot --}}
+            <div class="bg-white rounded-xl shadow p-6 space-y-4">
+                <h2 class="text-base font-semibold text-gray-700 border-b border-gray-100 pb-2">Control del Bot</h2>
+
+                <div class="flex items-center gap-4">
+                    <label class="text-sm font-medium text-gray-700">Estado del bot</label>
+                    <label class="relative inline-flex items-center cursor-pointer">
+                        <input type="checkbox" wire:model="bot_enabled" value="1"
+                            class="sr-only peer">
+                        <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-green-500"></div>
+                        <span class="ml-3 text-sm text-gray-600">{{ $bot_enabled ? 'Activo' : 'Inactivo' }}</span>
+                    </label>
+                </div>
+
+                <div>
+                    <label class="block text-xs font-medium text-gray-600 mb-1">Mensaje de bienvenida *</label>
+                    <textarea wire:model="welcome_message" rows="3"
+                        class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm resize-none focus:outline-none focus:ring-2 focus:ring-green-400"></textarea>
+                    @error('welcome_message') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
+                </div>
+
+                <div>
+                    <label class="block text-xs font-medium text-gray-600 mb-1">Respuesta cuando no entiende *</label>
+                    <textarea wire:model="default_no_match" rows="2"
+                        class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm resize-none focus:outline-none focus:ring-2 focus:ring-green-400"></textarea>
+                    @error('default_no_match') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
+                </div>
+
+                <div>
+                    <label class="block text-xs font-medium text-gray-600 mb-1">Mensaje al solicitar asesor *</label>
+                    <textarea wire:model="advisor_message" rows="2"
+                        class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm resize-none focus:outline-none focus:ring-2 focus:ring-green-400"></textarea>
+                    @error('advisor_message') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
+                </div>
+            </div>
+
+            {{-- Horarios --}}
+            <div class="bg-white rounded-xl shadow p-6 space-y-4">
+                <h2 class="text-base font-semibold text-gray-700 border-b border-gray-100 pb-2">Horarios de Atención</h2>
+
+                <div class="flex items-center gap-4">
+                    <label class="text-sm font-medium text-gray-700">Validar horario</label>
+                    <label class="relative inline-flex items-center cursor-pointer">
+                        <input type="checkbox" wire:model="business_hours_enabled" value="1" class="sr-only peer">
+                        <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-green-500"></div>
+                    </label>
+                </div>
+
+                <div class="grid grid-cols-2 gap-4">
+                    <div>
+                        <label class="block text-xs font-medium text-gray-600 mb-1">Hora inicio</label>
+                        <input wire:model="business_hours_start" type="time"
+                            class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                    </div>
+                    <div>
+                        <label class="block text-xs font-medium text-gray-600 mb-1">Hora fin</label>
+                        <input wire:model="business_hours_end" type="time"
+                            class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                    </div>
+                </div>
+            </div>
+
+            <div class="flex justify-end">
+                <button type="submit"
+                    class="bg-green-500 hover:bg-green-600 text-white px-6 py-3 rounded-lg font-semibold text-sm transition flex items-center gap-2">
+                    <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
+                    Guardar Configuración
+                </button>
+            </div>
+        </form>
+    </div>
+</div>
diff --git a/resources/views/livewire/whatsapp/show-conversaciones.blade.php b/resources/views/livewire/whatsapp/show-conversaciones.blade.php
new file mode 100644
index 0000000..ef696bf
--- /dev/null
+++ b/resources/views/livewire/whatsapp/show-conversaciones.blade.php
@@ -0,0 +1,166 @@
+<div class="flex h-[calc(100vh-72px)] overflow-hidden bg-gray-100">
+
+    {{-- Panel izquierdo: lista de contactos --}}
+    <div class="w-80 flex-shrink-0 bg-white border-r border-gray-200 flex flex-col">
+        {{-- Header --}}
+        <div class="p-4 border-b border-gray-200">
+            <h2 class="text-lg font-bold text-gray-800 flex items-center gap-2">
+                <svg class="w-6 h-6 text-green-500" fill="currentColor" viewBox="0 0 24 24">
+                    <path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347z"/>
+                    <path d="M12 0C5.373 0 0 5.373 0 12c0 2.127.558 4.122 1.532 5.857L.057 23.786a.5.5 0 0 0 .629.628l5.963-1.467A11.944 11.944 0 0 0 12 24c6.627 0 12-5.373 12-12S18.627 0 12 0zm0 22c-1.88 0-3.638-.52-5.145-1.42l-.369-.22-3.818.94.974-3.782-.239-.381A9.944 9.944 0 0 1 2 12c0-5.523 4.477-10 10-10s10 4.477 10 10-4.477 10-10 10z"/>
+                </svg>
+                WhatsApp
+            </h2>
+            <div class="mt-2">
+                <input wire:model.live.debounce.300ms="search"
+                    type="text"
+                    placeholder="Buscar contacto..."
+                    class="w-full text-sm border border-gray-300 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-green-400">
+            </div>
+        </div>
+
+        {{-- Lista de usuarios --}}
+        <div class="flex-1 overflow-y-auto">
+            @forelse($users as $user)
+                <button wire:click="selectUser({{ $user->id }})"
+                    class="w-full text-left px-4 py-3 border-b border-gray-100 hover:bg-gray-50 flex items-center gap-3 transition
+                           {{ $selectedUserId === $user->id ? 'bg-green-50 border-l-4 border-l-green-500' : '' }}">
+                    <div class="relative flex-shrink-0">
+                        <img src="https://ui-avatars.com/api/?name={{ urlencode($user->name ?? $user->phone_number) }}&size=40&background=22c55e&color=fff"
+                            class="w-10 h-10 rounded-full" alt="">
+                        <span class="absolute bottom-0 right-0 w-3 h-3 rounded-full border-2 border-white
+                            {{ $user->status === 'active' ? 'bg-green-400' : ($user->status === 'blocked' ? 'bg-red-400' : 'bg-gray-400') }}">
+                        </span>
+                    </div>
+                    <div class="flex-1 min-w-0">
+                        <div class="flex justify-between items-center">
+                            <span class="text-sm font-semibold text-gray-800 truncate">{{ $user->name ?? $user->phone_number }}</span>
+                            @if($user->unread_count > 0)
+                                <span class="bg-green-500 text-white text-xs rounded-full px-2 py-0.5 ml-1">{{ $user->unread_count }}</span>
+                            @endif
+                        </div>
+                        <p class="text-xs text-gray-500 truncate">
+                            {{ $user->phone_number }}
+                        </p>
+                        @if($user->lastMessage)
+                            <p class="text-xs text-gray-400 truncate">
+                                {{ Str::limit($user->lastMessage->content, 40) }}
+                            </p>
+                        @endif
+                    </div>
+                </button>
+            @empty
+                <div class="p-6 text-center text-gray-400 text-sm">No hay contactos</div>
+            @endforelse
+        </div>
+
+        {{-- Paginación --}}
+        <div class="p-2 border-t border-gray-200 text-xs">
+            {{ $users->links() }}
+        </div>
+    </div>
+
+    {{-- Panel derecho: chat --}}
+    <div class="flex-1 flex flex-col">
+        @if($selectedUser)
+            {{-- Chat header --}}
+            <div class="bg-white px-4 py-3 border-b border-gray-200 flex items-center justify-between shadow-sm">
+                <div class="flex items-center gap-3">
+                    <img src="https://ui-avatars.com/api/?name={{ urlencode($selectedUser->name ?? $selectedUser->phone_number) }}&size=40&background=22c55e&color=fff"
+                        class="w-10 h-10 rounded-full" alt="">
+                    <div>
+                        <div class="font-semibold text-gray-800">{{ $selectedUser->name ?? 'Sin nombre' }}</div>
+                        <div class="text-xs text-gray-500">{{ $selectedUser->phone_number }}</div>
+                    </div>
+                </div>
+                <div class="flex items-center gap-2">
+                    @if($selectedUser->in_service)
+                        <span class="text-xs bg-blue-100 text-blue-700 px-2 py-1 rounded-full">En atención</span>
+                    @endif
+                    @if($selectedUser->on_hold)
+                        <span class="text-xs bg-yellow-100 text-yellow-700 px-2 py-1 rounded-full">En espera</span>
+                    @endif
+                    <button wire:click="toggleBlockUser"
+                        class="text-xs px-3 py-1 rounded-full border transition
+                            {{ $selectedUser->status === 'blocked'
+                                ? 'bg-red-100 text-red-700 border-red-200 hover:bg-red-200'
+                                : 'bg-gray-100 text-gray-600 border-gray-200 hover:bg-gray-200' }}">
+                        {{ $selectedUser->status === 'blocked' ? 'Desbloquear' : 'Bloquear' }}
+                    </button>
+                </div>
+            </div>
+
+            {{-- Mensajes --}}
+            <div id="chat-messages" class="flex-1 overflow-y-auto p-4 space-y-2 bg-[#e5ddd5]"
+                x-data x-init="$nextTick(() => { let el = document.getElementById('chat-messages'); el.scrollTop = el.scrollHeight; })"
+                @scroll-to-bottom.window="$nextTick(() => { $el.scrollTop = $el.scrollHeight })">
+
+                @forelse($messages as $msg)
+                    <div class="flex {{ $msg->direction === 'outgoing' ? 'justify-end' : 'justify-start' }}">
+                        <div class="max-w-xs lg:max-w-md xl:max-w-lg {{ $msg->direction === 'outgoing' ? 'bg-[#dcf8c6]' : 'bg-white' }} rounded-lg px-3 py-2 shadow-sm">
+                            @if($msg->message_type === 'text')
+                                <p class="text-sm text-gray-800 whitespace-pre-wrap">{{ $msg->content }}</p>
+                            @elseif(in_array($msg->message_type, ['image', 'video', 'document', 'audio']))
+                                @if($msg->media_url)
+                                    @if($msg->message_type === 'image')
+                                        <img src="{{ $msg->media_url }}" class="rounded max-w-full" alt="Imagen">
+                                    @elseif($msg->message_type === 'document')
+                                        <a href="{{ $msg->media_url }}" target="_blank" class="text-blue-600 text-sm underline flex items-center gap-1">
+                                            <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0-3-3m3 3 3-3M3 17V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z"/></svg>
+                                            {{ $msg->filename ?? 'Documento' }}
+                                        </a>
+                                    @else
+                                        <span class="text-xs text-gray-500 italic">[{{ strtoupper($msg->message_type) }}]</span>
+                                    @endif
+                                @else
+                                    <span class="text-xs text-gray-400 italic">[{{ strtoupper($msg->message_type) }} sin URL]</span>
+                                @endif
+                            @else
+                                <p class="text-sm text-gray-600 italic">{{ $msg->content }}</p>
+                            @endif
+                            <div class="text-right mt-1">
+                                <span class="text-[10px] text-gray-400">{{ $msg->created_at->format('H:i') }}</span>
+                                @if($msg->direction === 'outgoing')
+                                    <span class="text-[10px] ml-1 {{ $msg->status === 'read' ? 'text-blue-500' : 'text-gray-400' }}">✓✓</span>
+                                @endif
+                            </div>
+                        </div>
+                    </div>
+                @empty
+                    <div class="text-center text-gray-400 text-sm py-10">No hay mensajes</div>
+                @endforelse
+            </div>
+
+            {{-- Input de respuesta --}}
+            <div class="bg-white border-t border-gray-200 p-3">
+                @if($selectedUser->status === 'blocked')
+                    <div class="text-center text-red-500 text-sm py-2">Usuario bloqueado — desbloquea para responder</div>
+                @else
+                    <form wire:submit.prevent="sendReply" class="flex items-end gap-2">
+                        <textarea wire:model="replyText"
+                            placeholder="Escribe un mensaje..."
+                            rows="2"
+                            class="flex-1 border border-gray-300 rounded-lg px-3 py-2 text-sm resize-none focus:outline-none focus:ring-2 focus:ring-green-400"
+                            x-on:keydown.ctrl.enter="$wire.sendReply()"></textarea>
+                        <button type="submit"
+                            class="bg-green-500 hover:bg-green-600 text-white p-3 rounded-lg transition">
+                            <svg class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 19l9 2-9-18-9 18 9-2zm0 0v-8"/>
+                            </svg>
+                        </button>
+                    </form>
+                    @error('replyText') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
+                    @if(session('error')) <p class="text-red-500 text-xs mt-1">{{ session('error') }}</p> @endif
+                @endif
+            </div>
+        @else
+            <div class="flex-1 flex flex-col items-center justify-center text-gray-400 bg-[#e5ddd5]">
+                <svg class="w-20 h-20 mb-4 opacity-30" fill="currentColor" viewBox="0 0 24 24">
+                    <path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347z"/>
+                </svg>
+                <p class="text-lg font-medium">Selecciona una conversación</p>
+                <p class="text-sm">Elige un contacto de la lista para ver el chat</p>
+            </div>
+        @endif
+    </div>
+</div>
diff --git a/resources/views/livewire/whatsapp/show-logs-webhook.blade.php b/resources/views/livewire/whatsapp/show-logs-webhook.blade.php
new file mode 100644
index 0000000..0f0d446
--- /dev/null
+++ b/resources/views/livewire/whatsapp/show-logs-webhook.blade.php
@@ -0,0 +1,82 @@
+<div>
+    <div class="flex items-center justify-between mb-4">
+        <h1 class="text-2xl font-bold text-gray-800 flex items-center gap-2">
+            <svg class="w-7 h-7 text-green-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2"/>
+            </svg>
+            Logs del Webhook
+        </h1>
+        <button wire:click="clearAll" wire:confirm="¿Eliminar TODOS los logs? Esta acción no se puede deshacer."
+            class="bg-red-500 hover:bg-red-600 text-white text-sm px-4 py-2 rounded-lg flex items-center gap-2 transition">
+            <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg>
+            Limpiar logs
+        </button>
+    </div>
+
+    <input wire:model.live.debounce.300ms="search" type="text" placeholder="Buscar en el payload..."
+        class="mb-4 border border-gray-300 rounded-lg px-4 py-2 text-sm w-64 focus:outline-none focus:ring-2 focus:ring-green-400">
+
+    <div class="bg-white rounded-xl shadow overflow-hidden">
+        <table class="w-full text-sm">
+            <thead class="bg-gray-50 border-b">
+                <tr>
+                    <th class="px-4 py-3 text-left text-gray-600">ID</th>
+                    <th class="px-4 py-3 text-left text-gray-600">Fecha</th>
+                    <th class="px-4 py-3 text-center text-gray-600">HTTP</th>
+                    <th class="px-4 py-3 text-left text-gray-600">Payload (preview)</th>
+                    <th class="px-4 py-3 text-center text-gray-600">Acciones</th>
+                </tr>
+            </thead>
+            <tbody class="divide-y divide-gray-100">
+                @forelse($logs as $log)
+                    <tr class="hover:bg-gray-50">
+                        <td class="px-4 py-3 text-gray-400 text-xs">{{ $log->id }}</td>
+                        <td class="px-4 py-3 text-gray-600 text-xs">{{ $log->created_at?->format('d/m/Y H:i:s') }}</td>
+                        <td class="px-4 py-3 text-center">
+                            @if($log->status_code)
+                                <span class="text-xs px-2 py-0.5 rounded-full {{ $log->status_code < 300 ? 'bg-green-100 text-green-700' : 'bg-red-100 text-red-600' }}">
+                                    {{ $log->status_code }}
+                                </span>
+                            @else
+                                <span class="text-gray-400">—</span>
+                            @endif
+                        </td>
+                        <td class="px-4 py-3 font-mono text-xs text-gray-500 max-w-md truncate">
+                            {{ Str::limit($log->payload, 120) }}
+                        </td>
+                        <td class="px-4 py-3">
+                            <div class="flex justify-center gap-2">
+                                <button wire:click="viewLog({{ $log->id }})"
+                                    class="text-blue-500 hover:text-blue-700 transition" title="Ver detalle">
+                                    <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"/></svg>
+                                </button>
+                                <button wire:click="deleteLog({{ $log->id }})"
+                                    class="text-red-400 hover:text-red-600 transition" title="Eliminar">
+                                    <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg>
+                                </button>
+                            </div>
+                        </td>
+                    </tr>
+                @empty
+                    <tr><td colspan="5" class="px-4 py-8 text-center text-gray-400">No hay logs registrados</td></tr>
+                @endforelse
+            </tbody>
+        </table>
+        <div class="p-3 border-t border-gray-100">{{ $logs->links() }}</div>
+    </div>
+
+    {{-- Modal detalle payload --}}
+    @if($viewId)
+        <div class="fixed inset-0 bg-black/60 z-50 flex items-center justify-center p-4">
+            <div class="bg-white rounded-2xl shadow-xl w-full max-w-3xl p-6 max-h-[80vh] flex flex-col">
+                <div class="flex justify-between items-center mb-4">
+                    <h3 class="font-bold text-gray-800">Log #{{ $viewId }} — Payload completo</h3>
+                    <button wire:click="clearView" class="text-gray-400 hover:text-gray-700">
+                        <svg class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg>
+                    </button>
+                </div>
+                <pre class="overflow-auto flex-1 bg-gray-900 text-green-400 text-xs rounded-lg p-4 font-mono">{{ $viewPayload }}</pre>
+            </div>
+        </div>
+    @endif
+</div>
diff --git a/resources/views/livewire/whatsapp/show-menus-bot.blade.php b/resources/views/livewire/whatsapp/show-menus-bot.blade.php
new file mode 100644
index 0000000..dcf701e
--- /dev/null
+++ b/resources/views/livewire/whatsapp/show-menus-bot.blade.php
@@ -0,0 +1,250 @@
+<div>
+    <div class="flex items-center justify-between mb-4">
+        <h1 class="text-2xl font-bold text-gray-800 flex items-center gap-2">
+            <svg class="w-7 h-7 text-green-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 10h16M4 14h10"/>
+            </svg>
+            Menús del Bot
+        </h1>
+        <button wire:click="openMenuForm()"
+            class="bg-green-500 hover:bg-green-600 text-white text-sm px-4 py-2 rounded-lg flex items-center gap-2 transition">
+            <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
+            Nuevo Menú
+        </button>
+    </div>
+
+    {{-- Buscador --}}
+    <input wire:model.live.debounce.300ms="search" type="text" placeholder="Buscar menú..."
+        class="mb-4 border border-gray-300 rounded-lg px-4 py-2 text-sm w-full max-w-xs focus:outline-none focus:ring-2 focus:ring-green-400">
+
+    {{-- Tabla de menús --}}
+    <div class="bg-white rounded-xl shadow overflow-hidden mb-6">
+        <table class="w-full text-sm">
+            <thead class="bg-gray-50 border-b border-gray-200">
+                <tr>
+                    <th class="px-4 py-3 text-left text-gray-600">Nombre</th>
+                    <th class="px-4 py-3 text-left text-gray-600">Título</th>
+                    <th class="px-4 py-3 text-center text-gray-600">Principal</th>
+                    <th class="px-4 py-3 text-center text-gray-600">Activo</th>
+                    <th class="px-4 py-3 text-center text-gray-600">Opciones</th>
+                    <th class="px-4 py-3 text-center text-gray-600">Acciones</th>
+                </tr>
+            </thead>
+            <tbody class="divide-y divide-gray-100">
+                @forelse($menus as $menu)
+                    <tr class="hover:bg-gray-50">
+                        <td class="px-4 py-3 font-medium text-gray-800">{{ $menu->name }}</td>
+                        <td class="px-4 py-3 text-gray-600">{{ $menu->title }}</td>
+                        <td class="px-4 py-3 text-center">
+                            @if($menu->is_main)
+                                <span class="bg-green-100 text-green-700 text-xs px-2 py-0.5 rounded-full">Sí</span>
+                            @else
+                                <span class="text-gray-400">—</span>
+                            @endif
+                        </td>
+                        <td class="px-4 py-3 text-center">
+                            <span class="text-xs px-2 py-0.5 rounded-full {{ $menu->is_active ? 'bg-green-100 text-green-700' : 'bg-red-100 text-red-600' }}">
+                                {{ $menu->is_active ? 'Activo' : 'Inactivo' }}
+                            </span>
+                        </td>
+                        <td class="px-4 py-3 text-center">
+                            <button wire:click="$set('viewMenuId', {{ $menu->id }})"
+                                class="text-blue-500 hover:underline text-xs">
+                                {{ $menu->options_count }} opcs.
+                            </button>
+                        </td>
+                        <td class="px-4 py-3">
+                            <div class="flex justify-center gap-2">
+                                <button wire:click="openMenuForm({{ $menu->id }})"
+                                    class="text-yellow-500 hover:text-yellow-700 transition" title="Editar">
+                                    <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/></svg>
+                                </button>
+                                <button wire:click="openOptionForm(null, {{ $menu->id }})"
+                                    class="text-green-500 hover:text-green-700 transition" title="Agregar opción">
+                                    <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
+                                </button>
+                                <button wire:click="deleteMenu({{ $menu->id }})"
+                                    wire:confirm="¿Eliminar este menú y todas sus opciones?"
+                                    class="text-red-400 hover:text-red-600 transition" title="Eliminar">
+                                    <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg>
+                                </button>
+                            </div>
+                        </td>
+                    </tr>
+                @empty
+                    <tr><td colspan="6" class="px-4 py-8 text-center text-gray-400">No hay menús creados</td></tr>
+                @endforelse
+            </tbody>
+        </table>
+    </div>
+
+    {{-- Detalle opciones del menú seleccionado --}}
+    @if($viewMenu)
+        <div class="bg-white rounded-xl shadow p-4 mb-6">
+            <div class="flex items-center justify-between mb-3">
+                <h3 class="font-bold text-gray-800">Opciones del menú: <span class="text-green-600">{{ $viewMenu->name }}</span></h3>
+                <div class="flex gap-2">
+                    <button wire:click="openOptionForm(null, {{ $viewMenu->id }})"
+                        class="text-sm bg-green-500 hover:bg-green-600 text-white px-3 py-1 rounded-lg flex items-center gap-1">
+                        <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
+                        Agregar opción
+                    </button>
+                    <button wire:click="$set('viewMenuId', null)" class="text-sm text-gray-500 hover:text-gray-700">Cerrar</button>
+                </div>
+            </div>
+            <table class="w-full text-sm">
+                <thead class="bg-gray-50 border-b">
+                    <tr>
+                        <th class="px-3 py-2 text-left text-gray-600">#</th>
+                        <th class="px-3 py-2 text-left text-gray-600">Título</th>
+                        <th class="px-3 py-2 text-left text-gray-600">Acción</th>
+                        <th class="px-3 py-2 text-left text-gray-600">Valor</th>
+                        <th class="px-3 py-2 text-center text-gray-600">Activa</th>
+                        <th class="px-3 py-2 text-center text-gray-600">Ops</th>
+                    </tr>
+                </thead>
+                <tbody class="divide-y divide-gray-100">
+                    @forelse($viewMenu->options as $opt)
+                        <tr>
+                            <td class="px-3 py-2 font-bold text-gray-700">{{ $opt->option_number }}</td>
+                            <td class="px-3 py-2">{{ $opt->title }}</td>
+                            <td class="px-3 py-2">
+                                <span class="bg-blue-50 text-blue-700 text-xs px-2 py-0.5 rounded">{{ $opt->action_type }}</span>
+                            </td>
+                            <td class="px-3 py-2 text-gray-500 max-w-xs truncate">{{ $opt->action_value }}</td>
+                            <td class="px-3 py-2 text-center">
+                                <span class="text-xs {{ $opt->is_active ? 'text-green-600' : 'text-red-400' }}">{{ $opt->is_active ? '✓' : '✗' }}</span>
+                            </td>
+                            <td class="px-3 py-2">
+                                <div class="flex justify-center gap-2">
+                                    <button wire:click="openOptionForm({{ $opt->id }})" class="text-yellow-500 hover:text-yellow-700">
+                                        <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/></svg>
+                                    </button>
+                                    <button wire:click="deleteOption({{ $opt->id }})" wire:confirm="¿Eliminar esta opción?"
+                                        class="text-red-400 hover:text-red-600">
+                                        <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg>
+                                    </button>
+                                </div>
+                            </td>
+                        </tr>
+                    @empty
+                        <tr><td colspan="6" class="px-3 py-4 text-center text-gray-400">Sin opciones</td></tr>
+                    @endforelse
+                </tbody>
+            </table>
+        </div>
+    @endif
+
+    {{-- Modal: Formulario Menú --}}
+    @if($showMenuForm)
+        <div class="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4">
+            <div class="bg-white rounded-2xl shadow-xl w-full max-w-lg p-6">
+                <h3 class="text-lg font-bold text-gray-800 mb-4">{{ $editMenuId ? 'Editar Menú' : 'Nuevo Menú' }}</h3>
+                <form wire:submit.prevent="saveMenu" class="space-y-4">
+                    <div class="grid grid-cols-2 gap-4">
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Nombre interno *</label>
+                            <input wire:model="menuName" type="text" class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                            @error('menuName') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                        </div>
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Título visible *</label>
+                            <input wire:model="menuTitle" type="text" class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                            @error('menuTitle') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                        </div>
+                    </div>
+                    <div>
+                        <label class="block text-xs font-medium text-gray-600 mb-1">Mensaje del menú *</label>
+                        <textarea wire:model="menuMessage" rows="4"
+                            class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400 resize-none"></textarea>
+                        @error('menuMessage') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                    </div>
+                    <div class="grid grid-cols-2 gap-4">
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Menú padre</label>
+                            <select wire:model="menuParentId" class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none">
+                                <option value="">— Ninguno —</option>
+                                @foreach($allMenus as $m)
+                                    @if($m->id !== $editMenuId)
+                                        <option value="{{ $m->id }}">{{ $m->name }}</option>
+                                    @endif
+                                @endforeach
+                            </select>
+                        </div>
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Orden</label>
+                            <input wire:model="menuSortOrder" type="number" min="0"
+                                class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none">
+                        </div>
+                    </div>
+                    <div class="flex gap-4">
+                        <label class="flex items-center gap-2 text-sm text-gray-700 cursor-pointer">
+                            <input wire:model="menuIsMain" type="checkbox" class="rounded"> Es menú principal
+                        </label>
+                        <label class="flex items-center gap-2 text-sm text-gray-700 cursor-pointer">
+                            <input wire:model="menuIsActive" type="checkbox" class="rounded"> Activo
+                        </label>
+                    </div>
+                    <div class="flex justify-end gap-3 pt-2 border-t border-gray-100">
+                        <button type="button" wire:click="resetMenuForm()" class="px-4 py-2 text-sm text-gray-600 hover:text-gray-800">Cancelar</button>
+                        <button type="submit" class="bg-green-500 hover:bg-green-600 text-white text-sm px-4 py-2 rounded-lg">Guardar</button>
+                    </div>
+                </form>
+            </div>
+        </div>
+    @endif
+
+    {{-- Modal: Formulario Opción --}}
+    @if($showOptionForm)
+        <div class="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4">
+            <div class="bg-white rounded-2xl shadow-xl w-full max-w-lg p-6">
+                <h3 class="text-lg font-bold text-gray-800 mb-4">{{ $editOptionId ? 'Editar Opción' : 'Nueva Opción' }}</h3>
+                <form wire:submit.prevent="saveOption" class="space-y-4">
+                    <div class="grid grid-cols-2 gap-4">
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Número de opción *</label>
+                            <input wire:model="optionNumber" type="number" min="1"
+                                class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                        </div>
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Título *</label>
+                            <input wire:model="optionTitle" type="text"
+                                class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                            @error('optionTitle') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                        </div>
+                    </div>
+                    <div class="grid grid-cols-2 gap-4">
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Tipo de acción</label>
+                            <select wire:model="optionAction" class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none">
+                                <option value="message">Mensaje</option>
+                                <option value="submenu">Submenú</option>
+                                <option value="template">Plantilla</option>
+                                <option value="url">URL</option>
+                                <option value="advisor">Asesor</option>
+                                <option value="flow">Flujo</option>
+                            </select>
+                        </div>
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Orden</label>
+                            <input wire:model="optionSort" type="number" min="0"
+                                class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none">
+                        </div>
+                    </div>
+                    <div>
+                        <label class="block text-xs font-medium text-gray-600 mb-1">Valor de la acción</label>
+                        <input wire:model="optionValue" type="text" placeholder="ID de submenú, texto, URL..."
+                            class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                    </div>
+                    <label class="flex items-center gap-2 text-sm text-gray-700 cursor-pointer">
+                        <input wire:model="optionIsActive" type="checkbox" class="rounded"> Opción activa
+                    </label>
+                    <div class="flex justify-end gap-3 pt-2 border-t border-gray-100">
+                        <button type="button" wire:click="resetOptionForm()" class="px-4 py-2 text-sm text-gray-600 hover:text-gray-800">Cancelar</button>
+                        <button type="submit" class="bg-green-500 hover:bg-green-600 text-white text-sm px-4 py-2 rounded-lg">Guardar</button>
+                    </div>
+                </form>
+            </div>
+        </div>
+    @endif
+</div>
diff --git a/resources/views/livewire/whatsapp/show-plantillas.blade.php b/resources/views/livewire/whatsapp/show-plantillas.blade.php
new file mode 100644
index 0000000..3a1c7d5
--- /dev/null
+++ b/resources/views/livewire/whatsapp/show-plantillas.blade.php
@@ -0,0 +1,141 @@
+<div>
+    <div class="flex items-center justify-between mb-4">
+        <h1 class="text-2xl font-bold text-gray-800 flex items-center gap-2">
+            <svg class="w-7 h-7 text-green-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
+            </svg>
+            Plantillas de Mensaje
+        </h1>
+        <button wire:click="openForm()" class="bg-green-500 hover:bg-green-600 text-white text-sm px-4 py-2 rounded-lg flex items-center gap-2 transition">
+            <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
+            Nueva Plantilla
+        </button>
+    </div>
+
+    <div class="flex gap-3 mb-4 flex-wrap">
+        <input wire:model.live.debounce.300ms="search" type="text" placeholder="Buscar plantilla..."
+            class="border border-gray-300 rounded-lg px-4 py-2 text-sm w-64 focus:outline-none focus:ring-2 focus:ring-green-400">
+        <select wire:model.live="filterStatus" class="border border-gray-300 rounded-lg px-4 py-2 text-sm focus:outline-none">
+            <option value="">— Todos los estados —</option>
+            <option value="pending">Pendiente</option>
+            <option value="approved">Aprobada</option>
+            <option value="rejected">Rechazada</option>
+            <option value="paused">Pausada</option>
+        </select>
+    </div>
+
+    <div class="bg-white rounded-xl shadow overflow-hidden">
+        <table class="w-full text-sm">
+            <thead class="bg-gray-50 border-b">
+                <tr>
+                    <th class="px-4 py-3 text-left text-gray-600">Nombre</th>
+                    <th class="px-4 py-3 text-left text-gray-600">Template (Meta)</th>
+                    <th class="px-4 py-3 text-left text-gray-600">Idioma</th>
+                    <th class="px-4 py-3 text-left text-gray-600">Header</th>
+                    <th class="px-4 py-3 text-center text-gray-600">Estado</th>
+                    <th class="px-4 py-3 text-center text-gray-600">Acciones</th>
+                </tr>
+            </thead>
+            <tbody class="divide-y divide-gray-100">
+                @forelse($templates as $tpl)
+                    <tr class="hover:bg-gray-50">
+                        <td class="px-4 py-3 font-medium text-gray-800">{{ $tpl->name }}</td>
+                        <td class="px-4 py-3 font-mono text-xs text-gray-600">{{ $tpl->template_name }}</td>
+                        <td class="px-4 py-3 uppercase text-gray-500 text-xs">{{ $tpl->language_code }}</td>
+                        <td class="px-4 py-3 text-gray-500 text-xs capitalize">{{ $tpl->header_type }}</td>
+                        <td class="px-4 py-3 text-center">
+                            @php
+                                $colors = ['approved'=>'green','pending'=>'yellow','rejected'=>'red','paused'=>'gray'];
+                                $c = $colors[$tpl->status] ?? 'gray';
+                            @endphp
+                            <span class="text-xs px-2 py-0.5 rounded-full bg-{{ $c }}-100 text-{{ $c }}-700 capitalize">{{ $tpl->status }}</span>
+                        </td>
+                        <td class="px-4 py-3">
+                            <div class="flex justify-center gap-2">
+                                <button wire:click="openForm({{ $tpl->id }})" class="text-yellow-500 hover:text-yellow-700 transition">
+                                    <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/></svg>
+                                </button>
+                                <button wire:click="delete({{ $tpl->id }})" wire:confirm="¿Eliminar esta plantilla?" class="text-red-400 hover:text-red-600 transition">
+                                    <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg>
+                                </button>
+                            </div>
+                        </td>
+                    </tr>
+                @empty
+                    <tr><td colspan="6" class="px-4 py-8 text-center text-gray-400">No hay plantillas registradas</td></tr>
+                @endforelse
+            </tbody>
+        </table>
+        <div class="p-3 border-t border-gray-100">{{ $templates->links() }}</div>
+    </div>
+
+    {{-- Modal Formulario --}}
+    @if($showForm)
+        <div class="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4">
+            <div class="bg-white rounded-2xl shadow-xl w-full max-w-lg p-6 max-h-screen overflow-y-auto">
+                <h3 class="text-lg font-bold text-gray-800 mb-4">{{ $editId ? 'Editar Plantilla' : 'Nueva Plantilla' }}</h3>
+                <form wire:submit.prevent="save" class="space-y-4">
+                    <div class="grid grid-cols-2 gap-4">
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Nombre interno *</label>
+                            <input wire:model="name" type="text" class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                            @error('name') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                        </div>
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Nombre en Meta *</label>
+                            <input wire:model="templateName" type="text" placeholder="solo_minusculas_sin_espacios"
+                                class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                            @error('templateName') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                        </div>
+                    </div>
+                    <div class="grid grid-cols-3 gap-4">
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Idioma</label>
+                            <input wire:model="languageCode" type="text" placeholder="es"
+                                class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none">
+                        </div>
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Estado</label>
+                            <select wire:model="status" class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none">
+                                <option value="pending">Pendiente</option>
+                                <option value="approved">Aprobada</option>
+                                <option value="rejected">Rechazada</option>
+                                <option value="paused">Pausada</option>
+                            </select>
+                        </div>
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Tipo header</label>
+                            <select wire:model="headerType" class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none">
+                                <option value="none">Ninguno</option>
+                                <option value="text">Texto</option>
+                                <option value="image">Imagen</option>
+                                <option value="video">Video</option>
+                                <option value="document">Documento</option>
+                            </select>
+                        </div>
+                    </div>
+                    @if($headerType === 'text')
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Texto del header</label>
+                            <input wire:model="headerText" type="text" class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none">
+                        </div>
+                    @endif
+                    <div>
+                        <label class="block text-xs font-medium text-gray-600 mb-1">Cuerpo del mensaje *</label>
+                        <textarea wire:model="bodyText" rows="4" placeholder="Hola {{nombre}}, tu pedido {{codigo}} está listo."
+                            class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm resize-none focus:outline-none focus:ring-2 focus:ring-green-400"></textarea>
+                        @error('bodyText') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                    </div>
+                    <div>
+                        <label class="block text-xs font-medium text-gray-600 mb-1">Pie de página</label>
+                        <input wire:model="footerText" type="text" class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none">
+                    </div>
+                    <div class="flex justify-end gap-3 pt-2 border-t border-gray-100">
+                        <button type="button" wire:click="resetForm()" class="px-4 py-2 text-sm text-gray-600 hover:text-gray-800">Cancelar</button>
+                        <button type="submit" class="bg-green-500 hover:bg-green-600 text-white text-sm px-4 py-2 rounded-lg">Guardar</button>
+                    </div>
+                </form>
+            </div>
+        </div>
+    @endif
+</div>
diff --git a/resources/views/livewire/whatsapp/show-programados.blade.php b/resources/views/livewire/whatsapp/show-programados.blade.php
new file mode 100644
index 0000000..e04312b
--- /dev/null
+++ b/resources/views/livewire/whatsapp/show-programados.blade.php
@@ -0,0 +1,142 @@
+<div>
+    <div class="flex items-center justify-between mb-4">
+        <h1 class="text-2xl font-bold text-gray-800 flex items-center gap-2">
+            <svg class="w-7 h-7 text-green-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/>
+            </svg>
+            Mensajes Programados
+        </h1>
+        <button wire:click="$set('showForm', true)"
+            class="bg-green-500 hover:bg-green-600 text-white text-sm px-4 py-2 rounded-lg flex items-center gap-2 transition">
+            <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
+            Programar Mensaje
+        </button>
+    </div>
+
+    <div class="flex gap-3 mb-4 flex-wrap">
+        <input wire:model.live.debounce.300ms="search" type="text" placeholder="Buscar por teléfono..."
+            class="border border-gray-300 rounded-lg px-4 py-2 text-sm w-64 focus:outline-none focus:ring-2 focus:ring-green-400">
+        <select wire:model.live="filterStatus" class="border border-gray-300 rounded-lg px-4 py-2 text-sm focus:outline-none">
+            <option value="">— Todos —</option>
+            <option value="pending">Pendiente</option>
+            <option value="sent">Enviado</option>
+            <option value="failed">Fallido</option>
+            <option value="cancelled">Cancelado</option>
+        </select>
+    </div>
+
+    <div class="bg-white rounded-xl shadow overflow-hidden">
+        <table class="w-full text-sm">
+            <thead class="bg-gray-50 border-b">
+                <tr>
+                    <th class="px-4 py-3 text-left text-gray-600">Teléfono</th>
+                    <th class="px-4 py-3 text-left text-gray-600">Tipo</th>
+                    <th class="px-4 py-3 text-left text-gray-600">Contenido / Plantilla</th>
+                    <th class="px-4 py-3 text-left text-gray-600">Fecha programada</th>
+                    <th class="px-4 py-3 text-center text-gray-600">Estado</th>
+                    <th class="px-4 py-3 text-center text-gray-600">Acciones</th>
+                </tr>
+            </thead>
+            <tbody class="divide-y divide-gray-100">
+                @forelse($messages as $msg)
+                    <tr class="hover:bg-gray-50">
+                        <td class="px-4 py-3 font-mono text-xs">{{ $msg->phone_number }}</td>
+                        <td class="px-4 py-3">
+                            <span class="text-xs bg-blue-50 text-blue-700 px-2 py-0.5 rounded uppercase">{{ $msg->message_type }}</span>
+                        </td>
+                        <td class="px-4 py-3 text-gray-600 max-w-xs truncate">
+                            {{ $msg->message_type === 'text' ? Str::limit($msg->message_content, 50) : $msg->template_name }}
+                        </td>
+                        <td class="px-4 py-3 text-gray-600">
+                            {{ \Carbon\Carbon::parse($msg->scheduled_date)->format('d/m/Y') }}
+                            {{ $msg->scheduled_time }}
+                        </td>
+                        <td class="px-4 py-3 text-center">
+                            @php
+                                $colors = ['pending'=>'yellow','sent'=>'green','failed'=>'red','cancelled'=>'gray'];
+                                $c = $colors[$msg->status] ?? 'gray';
+                            @endphp
+                            <span class="text-xs px-2 py-0.5 rounded-full bg-{{ $c }}-100 text-{{ $c }}-700 capitalize">{{ $msg->status }}</span>
+                        </td>
+                        <td class="px-4 py-3">
+                            <div class="flex justify-center gap-2">
+                                @if($msg->status === 'pending')
+                                    <button wire:click="cancel({{ $msg->id }})" wire:confirm="¿Cancelar este mensaje?"
+                                        class="text-yellow-500 hover:text-yellow-700 text-xs">Cancelar</button>
+                                @endif
+                                <button wire:click="delete({{ $msg->id }})" wire:confirm="¿Eliminar este registro?"
+                                    class="text-red-400 hover:text-red-600 transition">
+                                    <svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg>
+                                </button>
+                            </div>
+                        </td>
+                    </tr>
+                @empty
+                    <tr><td colspan="6" class="px-4 py-8 text-center text-gray-400">No hay mensajes programados</td></tr>
+                @endforelse
+            </tbody>
+        </table>
+        <div class="p-3 border-t border-gray-100">{{ $messages->links() }}</div>
+    </div>
+
+    {{-- Modal formulario --}}
+    @if($showForm)
+        <div class="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4">
+            <div class="bg-white rounded-2xl shadow-xl w-full max-w-md p-6">
+                <h3 class="text-lg font-bold text-gray-800 mb-4">Programar Mensaje</h3>
+                <form wire:submit.prevent="save" class="space-y-4">
+                    <div>
+                        <label class="block text-xs font-medium text-gray-600 mb-1">Número de teléfono *</label>
+                        <input wire:model="phoneNumber" type="text" placeholder="573001234567"
+                            class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                        @error('phoneNumber') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                    </div>
+                    <div class="grid grid-cols-2 gap-4">
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Fecha *</label>
+                            <input wire:model="scheduledDate" type="date"
+                                class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                            @error('scheduledDate') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                        </div>
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Hora *</label>
+                            <input wire:model="scheduledTime" type="time"
+                                class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-green-400">
+                            @error('scheduledTime') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                        </div>
+                    </div>
+                    <div>
+                        <label class="block text-xs font-medium text-gray-600 mb-1">Tipo de mensaje</label>
+                        <select wire:model.live="messageType" class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none">
+                            <option value="text">Texto libre</option>
+                            <option value="template">Plantilla</option>
+                        </select>
+                    </div>
+                    @if($messageType === 'text')
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Mensaje *</label>
+                            <textarea wire:model="messageContent" rows="3"
+                                class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm resize-none focus:outline-none focus:ring-2 focus:ring-green-400"></textarea>
+                            @error('messageContent') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                        </div>
+                    @else
+                        <div>
+                            <label class="block text-xs font-medium text-gray-600 mb-1">Plantilla *</label>
+                            <select wire:model="templateId" class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm focus:outline-none">
+                                <option value="">— Seleccionar —</option>
+                                @foreach($templates as $tpl)
+                                    <option value="{{ $tpl->id }}">{{ $tpl->name }} ({{ $tpl->template_name }})</option>
+                                @endforeach
+                            </select>
+                            @error('templateId') <p class="text-red-500 text-xs">{{ $message }}</p> @enderror
+                        </div>
+                    @endif
+                    <div class="flex justify-end gap-3 pt-2 border-t border-gray-100">
+                        <button type="button" wire:click="resetForm()" class="px-4 py-2 text-sm text-gray-600 hover:text-gray-800">Cancelar</button>
+                        <button type="submit" class="bg-green-500 hover:bg-green-600 text-white text-sm px-4 py-2 rounded-lg">Programar</button>
+                    </div>
+                </form>
+            </div>
+        </div>
+    @endif
+</div>
diff --git a/resources/views/whatsapp/configuracion.blade.php b/resources/views/whatsapp/configuracion.blade.php
new file mode 100644
index 0000000..a1cee71
--- /dev/null
+++ b/resources/views/whatsapp/configuracion.blade.php
@@ -0,0 +1,6 @@
+<x-app-layout>
+    <div class="p-4">
+        <livewire:whatsapp.show-configuracion-bot />
+    </div>
+    @include('layouts.footer')
+</x-app-layout>
diff --git a/resources/views/whatsapp/conversaciones.blade.php b/resources/views/whatsapp/conversaciones.blade.php
new file mode 100644
index 0000000..1cc669e
--- /dev/null
+++ b/resources/views/whatsapp/conversaciones.blade.php
@@ -0,0 +1,3 @@
+<x-app-layout>
+    <livewire:whatsapp.show-conversaciones />
+</x-app-layout>
diff --git a/resources/views/whatsapp/logs.blade.php b/resources/views/whatsapp/logs.blade.php
new file mode 100644
index 0000000..458e111
--- /dev/null
+++ b/resources/views/whatsapp/logs.blade.php
@@ -0,0 +1,6 @@
+<x-app-layout>
+    <div class="p-4">
+        <livewire:whatsapp.show-logs-webhook />
+    </div>
+    @include('layouts.footer')
+</x-app-layout>
diff --git a/resources/views/whatsapp/menus.blade.php b/resources/views/whatsapp/menus.blade.php
new file mode 100644
index 0000000..070caf1
--- /dev/null
+++ b/resources/views/whatsapp/menus.blade.php
@@ -0,0 +1,6 @@
+<x-app-layout>
+    <div class="p-4">
+        <livewire:whatsapp.show-menus-bot />
+    </div>
+    @include('layouts.footer')
+</x-app-layout>
diff --git a/resources/views/whatsapp/plantillas.blade.php b/resources/views/whatsapp/plantillas.blade.php
new file mode 100644
index 0000000..17d4775
--- /dev/null
+++ b/resources/views/whatsapp/plantillas.blade.php
@@ -0,0 +1,6 @@
+<x-app-layout>
+    <div class="p-4">
+        <livewire:whatsapp.show-plantillas />
+    </div>
+    @include('layouts.footer')
+</x-app-layout>
diff --git a/resources/views/whatsapp/programados.blade.php b/resources/views/whatsapp/programados.blade.php
new file mode 100644
index 0000000..787f70e
--- /dev/null
+++ b/resources/views/whatsapp/programados.blade.php
@@ -0,0 +1,6 @@
+<x-app-layout>
+    <div class="p-4">
+        <livewire:whatsapp.show-programados />
+    </div>
+    @include('layouts.footer')
+</x-app-layout>
diff --git a/routes/web.php b/routes/web.php
index 643da27..d57644c 100755
--- a/routes/web.php
+++ b/routes/web.php
@@ -1,6 +1,7 @@
 <?php
 
 use App\Http\Controllers\MenuController;
+use App\Http\Controllers\WhatsappController;
 use Illuminate\Support\Facades\Route;
 
 Route::get('/', function () {
@@ -71,6 +72,16 @@ Route::middleware(["auth", "solo_usuario_administrador"])->group(function () {
     Route::any('/log-historial', [MenuController::class, 'showLogHistorial'])->name('logHistorial');    Route::get('/diagnostico',     [MenuController::class, 'showDiagnostico'])->name('diagnostico');    Route::get('/utilidades',    [MenuController::class, 'showutilidad'])->name('utilidades');
     Route::get('/mantenimiento', [MenuController::class, 'mantenimiento'])->name('mantenimiento');
     Route::get('/rank-management', [MenuController::class, 'showgestionrangos'])->name('gestion-rangos');
+
+    // Módulo WhatsApp
+    Route::prefix('whatsapp')->name('whatsapp.')->group(function () {
+        Route::get('/conversaciones', [WhatsappController::class, 'conversaciones'])->name('conversaciones');
+        Route::get('/menus',          [WhatsappController::class, 'menus'])->name('menus');
+        Route::get('/plantillas',     [WhatsappController::class, 'plantillas'])->name('plantillas');
+        Route::get('/programados',    [WhatsappController::class, 'programados'])->name('programados');
+        Route::get('/configuracion',  [WhatsappController::class, 'configuracion'])->name('configuracion');
+        Route::get('/logs',           [WhatsappController::class, 'logs'])->name('logs');
+    });
 });
 
 Route::post('/registrar-accion-compra', [MenuController::class, 'click_compra'])->name('click_compra');