<?php
// CARGA MAESTRA DE CONFIGURACIÓN Y BRANDING
require_once(__DIR__ . '/core/init.php');

$paginaActual = pathinfo(basename($_SERVER['PHP_SELF']), PATHINFO_FILENAME);

echo '<link rel="stylesheet" href="files/menu-styles.css">';
echo '<script src="files/menu-scripts.js" defer></script>';

?>

<header class="md:hidden fixed top-0 inset-x-0 z-40 bg-[var(--color-primary)] border-b border-gray-900/20" style="padding-top: max(env(safe-area-inset-top), 10px);">
    <div class="h-14 flex items-center justify-between px-3 text-white">
        <button id="open-sidebar" type="button" aria-label="Abrir menú" class="p-3 -ml-2 rounded-md hover:bg-white/10"><i data-lucide="menu" class="w-5 h-5"></i></button>
        <div class="flex items-center gap-2"><img src="img/LogoADN.webp" alt="Logotipo FlowCRM By OrozCo" class="h-10 w-auto" onerror="this.style.display='none'"></div>
        <button id="open-help-top" type="button" aria-label="Abrir ayuda" class="p-3 -mr-2 rounded-md hover:bg-white/10"><i data-lucide="life-buoy" class="w-5 h-5"></i></button>
    </div>
</header>

<div id="nav-overlay" class="md:hidden inset-0 bg-black/50 opacity-0 pointer-events-none transition-opacity duration-300 z-40"></div>

<aside id="sidebar" class="bg-[var(--color-primary)] text-white w-full md:w-72 fixed md:relative inset-0 md:inset-y-0 md:left-0 transform -translate-x-full md:translate-x-0 transition-transform duration-300 ease-in-out z-50 md:z-40 flex flex-col shadow-2xl md:rounded-r-xl overflow-y-auto" role="navigation" aria-label="Menú Principal">
    
    <?php include 'profile.php'; ?>
    
    <div class="md:hidden flex items-center justify-between px-7 py-3 border-b border-white/10 bg-[var(--color-primary)]" style="padding-top: max(env(safe-area-inset-top), 0px);">
        <div class="flex items-center gap-2">
            <img src="img/LogoADN.webp" alt="Logotipo ADN By OrozCo" class="h-12 w-auto">
        </div>
        <button id="close-sidebar" type="button" aria-label="Cerrar Menú" class="p-2 rounded-md hover:bg-white/10">
            <i data-lucide="x" class="w-5 h-5 text-white"></i>
        </button>
    </div>

    <nav id="main-nav">
        <div class="hidden md:block text-center pt-5 pb-5 px-4 border-b border-white/10 sticky top-0 z-10 bg-[var(--color-primary)]">
            <img src="img/LogoADN.webp" alt="Logotipo ADN By OrozCo" class="h-16 w-auto mx-auto">
                         <p class="font-bold text-sm text-white/70 flex items-center justify-center gap-1.5"> Powered by <i data-lucide="shield-check" class="w-4 h-4 text-green-400"></i>
              <span class="font-black text-[var(--color-highlight)] tracking-wide"> FlowCRM™ </span></p>
        </div>

        <div class="px-4 py-4 border-b border-white/10">
            <div class="relative">
                <button type="button" id="platform-switcher-button" class="w-full flex items-center justify-between px-3 py-2.5 bg-white/5 rounded-lg hover:bg-white/10 transition-colors duration-150 focus:outline-none focus:ring-2 focus:ring-white/20">
                    <span class="flex items-center gap-3"><i data-lucide="graduation-cap" class="w-5 h-5 text-[var(--color-highlight)]"></i><span class="font-bold">Programa ADN</span></span>
                    <i data-lucide="chevrons-up-down" class="w-4 h-4 text-white/70"></i>
                </button>
                <div id="platform-switcher-dropdown" class="platform-switcher-dropdown hidden absolute w-full bg-[var(--color-secondary)] rounded-lg shadow-xl overflow-hidden z-20 divide-y divide-white/10">
                     <a href="/dashboard" class="flex items-start gap-3 p-3 text-white hover:bg-white/10 transition-colors duration-150"><i data-lucide="gem" class="w-5 h-5 text-[var(--color-highlight)] flex-shrink-0 mt-1"></i><div><p class="font-bold leading-tight">Suite FlowCRM</p><p class="text-xs text-white/70">Gestión Completa De Tu Negocio</p></div></a>
                     <a href="/ia-marketing" class="flex items-start gap-3 p-3 text-white hover:bg-white/10 transition-colors duration-150"><i data-lucide="cpu" class="w-5 h-5 text-[var(--color-highlight)] flex-shrink-0 mt-1"></i><div><p class="font-bold leading-tight">IA Marketing Tools</p><p class="text-xs text-white/70">Herramientas De Marketing Con IA</p></div></a>
                     <a href="/stock-dashboard" class="flex items-start gap-3 p-3 text-white hover:bg-white/10 transition-colors duration-150"><i data-lucide="graduation-cap" class="w-5 h-5 text-[var(--color-highlight)] flex-shrink-0 mt-1"></i><div><p class="font-bold leading-tight">Recursos IAStock</p><p class="text-xs text-white/70">Recursos Creativos De Promoción</p></div></a>
                </div>
            </div>
        </div>

        <?php
        // ========= ¡ESTA ES LA LÓGICA QUE PEDISTE! =========
    
        $items = [
    // Secciones Principales
    ['adn-dashboard', 'gauge', 'Programa De Negocios ADN'], // Dashboard/Control
    ['docs-dashboard', 'library', 'Manuales De Crecimiento'], // Colección de documentos
    
    ['divider-1', 'title', 'El GPS De Crecimiento'],

    // --- 12 CLASES --- (Masterclasses)
    ['adn-masterclass-1', 'target', 'El Porqué Del Negocio'], // Propósito
    ['adn-masterclass-2', 'user-circle-2', 'El Cliente Ideal Avatar'], // Perfil
    ['adn-masterclass-3', 'bar-chart-2', 'Análisis De Mercado'], // Análisis
    ['adn-masterclass-4', 'git-compare-arrows', 'El Factor Diferenciador'], // Único/Especial
    ['adn-masterclass-5', 'tags', 'Las Tres Ofertas Atractivas'], // Ofertas
    ['adn-masterclass-6', 'hard-drive', 'Los Activos Digitales'], // Digital
    ['adn-masterclass-7', 'locate-fixed', 'Las Fuentes De Tráfico'], // Tráfico
    ['adn-masterclass-8', 'megaphone', 'El Marketing Orgánico'], // Comunicación
    ['adn-masterclass-9', 'credit-card', 'El Marketing De Pago'], // Pago
    ['adn-masterclass-10', 'refresh-cw', 'Seguimiento De Prospectos'], // Ciclo/Seguimiento
    ['adn-masterclass-11', 'heart', 'Fidelización De Clientes'], // Lealtad
    ['adn-masterclass-12', 'scale', 'Medir Para Crecer'], // Medición

    ['divider-2', 'title', 'Estructurando Tu Negocio'],
    
    // --- 8 MANUALES --- (Documentación Específica)
    ['docs-awareness-levels', 'eye', 'Niveles De Conciencia'], // Conciencia
    ['docs-customer-journey', 'route', 'Customer Journey'], // Ruta
    ['docs-acquisition-cycle', 'refresh-ccw-dot', 'Ciclo De Adquisición'], // Ciclo
    ['docs-touchpoints', 'pointer', 'Puntos De Contacto'], // Interacción
    ['docs-ideal-client', 'user-check', 'Perfil Del Cliente Ideal'], // Perfil verificado
    ['docs-transformation-table', 'table', 'Tabla De Transformación'], // Datos/Tabla
    ['docs-emotional-marketing', 'smile', 'Marketing Emocional'], // Emoción
    ['docs-market-trends', 'activity', 'Tendencias Del Mercado'], // Actividad/Tendencia
];

        function isActiveSlug($slug, $paginaActual) {
            return $paginaActual === $slug;
        }
        ?>

        <div class="p-2 space-y-1">
            
            <?php foreach ($items as $it): ?>
            
                <?php 
                // --- MANEJO DE SEPARADORES ---
                if (strpos($it[0], 'divider-') === 0 || $it[1] === 'title'): 
                ?>
                    <div class="px-4 pt-3 pb-2">
                        <h3 class="text-xs font-bold uppercase text-[var(--color-highlight)] tracking-wider"><?php echo htmlspecialchars($it[2]); ?></h3>
                    </div>
                <?php 
                // --- MANEJO DE ENLACES NORMALES ---
                else: 
                    $slug = $it[0];
                    $icon = $it[1];
                    $title = $it[2];
                    
                    $url = $slug . '.php'; 
                    
                    // Lógica especial para las clases
                    if (strpos($slug, 'adn-masterclass-') === 0) {
                        $class_id = str_replace('adn-masterclass-', '', $slug);
                        $url = 'adn-masterclass.php?class=' . $class_id;
                        
                        // Ajustar el slug para la detección 'active'
                        if ($paginaActual === 'adn-masterclass' && isset($_GET['class']) && $_GET['class'] == $class_id) {
                            $slug = $paginaActual; // Hace que coincida
                        }
                        // Detección 'active' para la página de Quiz
                        if ($paginaActual === 'adn-quiz' && isset($_GET['unlock_id']) && ($_GET['unlock_id'] - 1) == $class_id) {
                             $slug = $paginaActual; // Hace que coincida
                        }
                    }
                    
                    // Determinar si está activo
                    $active = isActiveSlug($slug, $paginaActual);
                    $classes = "flex items-center gap-3 px-4 py-2.5 rounded-lg text-[14px] transition-colors duration-150 hover:bg-[var(--color-secondary)] focus:outline-none focus:ring-2 focus:ring-white/20" . ($active ? " active-button" : "");
                ?>
                    <a href="<?php echo $url; ?>" class="<?php echo $classes; ?>">
                        <i data-lucide="<?php echo $icon; ?>" class="w-5 h-5"></i>
                        <span class="uppercase font-bold"><?php echo htmlspecialchars($title); ?></span>
                    </a>
                <?php 
                endif; 
                ?>
                
            <?php endforeach; ?>
            </div>


        <div class="p-2 space-y-1">
            <div class="my-4 py-4 bg-black/20 border-y border-white/10">
                <div class="px-4">
                    <div class="flex items-center gap-3 mb-3">
                        <i data-lucide="megaphone" class="w-5 h-5 text-[var(--color-highlight)]"></i>
                        <h4 class="font-bold uppercase text-sm tracking-wider text-[var(--color-highlight)]">Lo Más Reciente</h4>
                    </div>
                    <?php if (file_exists('ads.php')) { include 'ads.php'; } ?>
                </div>
            </div>
            
            <button id="open-help" class="w-full flex items-center gap-3 px-4 py-3 rounded-lg hover:bg-[var(--color-secondary)]" type="button"><i data-lucide="life-buoy" class="w-5 h-5"></i><span class="uppercase font-bold text-[14px]">Soporte Técnico</span></button>
            <a href="/login.php?logout=true" class="w-full flex items-center gap-3 px-4 py-3 rounded-lg bg-red-700 hover:bg-red-800 text-white"><i data-lucide="log-out" class="w-5 h-5"></i><span class="uppercase font-extrabold text-[14px]">Cerrar Sesión</span></a>
        </div>
        
        <div class="p-4 mt-auto border-t border-white/10">
            <?php if (file_exists('files/footer.php')) { include 'files/footer.php'; } ?>
        </div>
    </nav>
</aside>

<div id="help-overlay" class="fixed inset-0 bg-black/50 opacity-0 pointer-events-none transition-opacity duration-300 z-40"></div>
<aside id="help-panel" class="fixed inset-y-0 right-0 w-full md:w-[520px] bg-white shadow-2xl transform translate-x-full transition-transform duration-300 z-50" role="dialog" aria-modal="true" aria-labelledby="help-title" aria-hidden="true">
    <div class="h-full flex flex-col">
        <div class="px-5 py-4 border-b border-gray-200 bg-gradient-to-r from-[var(--color-primary)] to-[#0f2749] text-white" style="padding-top: max(env(safe-area-inset-top), 0px);">
            <div class="flex items-center justify-between">
                <h3 id="help-title" class="text-lg font-extrabold uppercase tracking-wide">Centro De Soporte</h3>
                <button type="button" class="p-2 rounded-md hover:bg-white/10" data-close-help aria-label="Cerrar panel"><i data-lucide="x" class="w-5 h-5"></i></button>
            </div>
            <p class="text-white/80 text-xs mt-1">¿Tienes Una Duda O Problema? Envíanos Un Mensaje</p>
        </div>
        <form action="/support.php" method="POST" enctype="multipart/form-data" class="flex-1 overflow-y-auto p-5 space-y-4">
            <div><label class="block text-xs font-semibold text-gray-700 uppercase mb-1">Nombre</label><input type="text" name="name" value="<?php echo $userFullName ?? ''; ?>" class="w-full rounded-lg border border-gray-300 px-3 py-3 focus:ring-2 focus:ring-[var(--color-highlight)] focus:border-[var(--color-secondary)]" required></div>
            <div><label class="block text-xs font-semibold text-gray-700 uppercase mb-1">Email</label><input type="email" name="email" value="<?php echo $userEmail ?? ''; ?>" class="w-full rounded-lg border border-gray-300 px-3 py-3 focus:ring-2 focus:ring-[var(--color-highlight)] focus:border-[var(--color-secondary)]" required></div>
            <div>
                <label class="block text-xs font-semibold text-gray-700 uppercase mb-1">Asunto</label>
                <select name="subject" class="w-full rounded-lg border border-gray-300 px-3 py-3 focus:ring-2 focus:ring-[var(--color-highlight)] focus:border-[var(--color-secondary)]" required>
                    <option value="Soporte técnico">Soporte Técnico</option><option value="Facturación">Facturación</option><option value="Sugerencia">Sugerencia</option><option value="Otra consulta">Otra Consulta</option>
                </select>
            </div>
            <div><label class="block text-xs font-semibold text-gray-700 uppercase mb-1">Mensaje</label><textarea name="message" rows="5" class="w-full rounded-lg border border-gray-300 px-3 py-3 focus:ring-2 focus:ring-[var(--color-highlight)] focus:border-[var(--color-secondary)]" placeholder="Cuéntanos el detalle de tu consulta…" required></textarea></div>
            <div><label class="block text-xs font-semibold text-gray-700 uppercase mb-1">Adjuntar Captura (opcional)</label><input type="file" name="attachment" accept="image/*,.pdf" class="block w-full text-sm text-gray-600 file:mr-3 file:py-2 file:px-3 file:rounded-md file:border-0 file:text-sm file:font-semibold file:bg-[var(--color-primary)] file:text-white hover:file:brightness-110"></div>
            <input type="hidden" name="current_page" value="<?php echo htmlspecialchars($paginaActual); ?>">
            <div class="pt-2 flex items-center justify-between gap-3"><button type="button" class="px-4 py-2 rounded-lg border border-gray-300 hover:bg-gray-50" data-close-help>CANCELAR</button><button type="submit" class="px-4 py-2 rounded-lg bg-[var(--color-secondary)] text-white font-bold hover:brightness-110">ENVIAR FORMULARIO</button></div>
        </form>
    </div>
</aside>