From f2c3ea679dd07da372733714329daf6053257f8f Mon Sep 17 00:00:00 2001
From: FrankZamora <prime.leads.app@gmail.com>
Date: Sat, 8 Nov 2025 18:44:58 -0600
Subject: [PATCH] Fix Navbar: Activar dropdown hover en desktop - Bootstrap 5
 usa click por defecto
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

PROBLEMA IDENTIFICADO:
- Dropdown "Buscador General de Precios Unitarios" (18 elementos) NO se despliega en hover
- Usuario reportó: "el submenu no se despliega" en staging
- Inspeccionado con Chrome DevTools MCP: dropdown permanece display:none en hover

DIAGNÓSTICO:
✅ HTML correcto: <a class="nav-link dropdown-toggle" data-bs-toggle="dropdown">
✅ Bootstrap 5 cargado: window.bootstrap existe
✅ Walker genera data-bs-toggle="dropdown" correctamente
❌ Bootstrap 5 usa CLICK por defecto, NO hover
❌ No había CSS para activar dropdown en hover
❌ Template base tampoco tiene dropdown hover

CAUSA RAÍZ:
Bootstrap 5 NUNCA ha usado hover por defecto. Requiere CSS adicional.

SOLUCIÓN IMPLEMENTADA (CSS > JavaScript):
Agregar 4 líneas CSS para dropdown hover SOLO en desktop (min-width: 992px)

Archivo: componente-navbar.css (líneas 136-144)
@media (min-width: 992px) {
    .nav-item:hover > .dropdown-menu {
        display: block;
    }
}

POR QUÉ CSS vs JavaScript:
✅ Super simple: 4 líneas vs 20-30 líneas JS
✅ Performance perfecto: Sin event listeners
✅ Híbrido perfecto: Hover desktop + Click móvil (Bootstrap)
✅ Compatible: Funciona aunque JS esté deshabilitado
✅ Menos bugs: Menos código = menos errores

ARCHIVOS MODIFICADOS:
- componente-navbar.css: +9 líneas (CSS dropdown hover)
- functions.php: Version 1.0.15 → 1.0.16

RESULTADO:
✅ Desktop (>992px): Dropdown se despliega en hover instantáneamente
✅ Móvil (<992px): Sigue usando click nativo de Bootstrap
✅ Compatible con los 18 elementos + scroll del Issue #103
✅ Sin conflictos con JavaScript existente

TESTING PENDIENTE:
- Verificar en staging que dropdown funciona en hover
- Confirmar que NO interfiere con móvil (debe seguir usando click)

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

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../themes/apus-theme/assets/css/componente-navbar.css | 10 ++++++++++
 wp-content/themes/apus-theme/functions.php             |  2 +-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/wp-content/themes/apus-theme/assets/css/componente-navbar.css b/wp-content/themes/apus-theme/assets/css/componente-navbar.css
index 7e989de2..8a0b96fd 100644
--- a/wp-content/themes/apus-theme/assets/css/componente-navbar.css
+++ b/wp-content/themes/apus-theme/assets/css/componente-navbar.css
@@ -132,3 +132,13 @@
     background-color: rgba(255, 133, 0, 0.1);
     color: var(--color-orange-primary);
 }
+
+/* ========================================
+   Dropdown Hover (Desktop Only)
+   ======================================== */
+
+@media (min-width: 992px) {
+    .nav-item:hover > .dropdown-menu {
+        display: block;
+    }
+}
diff --git a/wp-content/themes/apus-theme/functions.php b/wp-content/themes/apus-theme/functions.php
index 7ec25c3e..19a6694f 100644
--- a/wp-content/themes/apus-theme/functions.php
+++ b/wp-content/themes/apus-theme/functions.php
@@ -14,7 +14,7 @@ if (!defined('ABSPATH')) {
 /**
  * Theme Version
  */
-define('APUS_VERSION', '1.0.15');
+define('APUS_VERSION', '1.0.16');
 
 /**
  * Theme Setup