<ul id="alertas-auto" class="navbar-nav main-nav mr-auto">
	<li class="nav-item">
		<a class="navbar-brand mr-0 mr-md-2" href="/" aria-label="VDM">VDM</a>
	</li>
	<li class="nav-item">
		<a class="nav-link tt" href="/ventas/import" title="Nuevas ventas"><span class="d-none d-md-inline">Ventas </span>
		<?php 
		$classCount = 'badge-success';
		if ($_SESSION['count_news'] > 0) {
			$classCount = 'badge-danger';
		}
		?>
		<span class="badge badge-pill <?php echo $classCount; ?>"><?php echo $_SESSION['count_news']; ?></span></a>
	</li>
	<li class="nav-item">
		<a class="nav-link tt" href="/casos" title="Casos Pendientes"><span class="d-none d-md-inline">Casos</span>
			<?php 
			$classCount = 'badge-success';
			if ($_SESSION['casos_pendientes'] > 0) {
				$classCount = 'badge-danger';
			}
			?>
			<span class="badge badge-pill <?php echo $classCount; ?>"><?php echo $_SESSION['casos_pendientes']; ?></span>
		</a>
	</li>
	<li class="nav-item">
		<a class="nav-link tt" href="/tareas" title="Tareas Pendientes"><span class="d-none d-md-inline">Tareas</span>
			<?php 
			$classCount = 'badge-success';
			if ($_SESSION['tareas_revisar'] > 0) {
				$classCount = 'badge-danger';
			}
			?>
			<span class="badge badge-pill <?php echo $classCount; ?>"><?php echo $_SESSION['tareas_revisar']; ?></span>
		</a>
	</li>	

	<li class="nav-item">
		<?php 
		$classCount = 'badge-success';
		if ($_SESSION['diffs'] > 0 || $_SESSION['codigos_repetidos'] > 0) {
			$classCount = 'badge-danger';
		}
		?>
		<a class="nav-link tt" href="/productos/diferencias" title="Diferencias de stock"><span class="d-none d-md-inline">Problemas </span><span class="badge badge-pill <?php echo $classCount; ?>"><?php echo $_SESSION['diffs'] + $_SESSION['codigos_repetidos']; ?></span></a>
	</li>

	<li class="nav-item">
		<?php 
		$classCount = 'badge-success';
		if ($_SESSION['errores_inventario'] > 0) {
			$classCount = 'badge-danger';
		}
		?>
		<a class="nav-link tt" href="/almacenes/errores_inventario" title="Errores de Inventario"><span class="badge badge-pill <?php echo $classCount; ?>"><?php echo $_SESSION['errores_inventario']; ?></span></a>
	</li>

	<li class="nav-item">
		<?php 
		$classCount = 'badge-success';
		if ($_SESSION['anuncios'] > 0) {
			$classCount = 'badge-danger';
		}
		?>
		<a class="nav-link tt" href="/anuncios" title="Anuncios sin leer"><span class="d-none d-md-inline">Anuncios </span><span class="badge badge-pill <?php echo $classCount; ?>"><?php echo $_SESSION['anuncios']; ?></span></a>
	</li>
	<li class="nav-item">
		<a class="nav-link" href="/usuarios/token" data-toggle="modal" data-target="#modalToken" ><i class="fas fa-key"></i></a>
	</li>

	<?php
		// Link a utilidades solo para administradores
		if ($_SESSION['usuario']['admin']) {
			?>
				<li class="nav-item">
					<a class="nav-link" href="/utilidades"><i class="fas fa-tools"></i></a>
				</li>
		<?php 
		}
	?>
</ul>
<ul id="notificaciones-auto" class="navbar-nav main-nav ml-auto">
	<li class="nav-item ml-auto" style="position: relative"> <!-- ml-auto empuja a la derecha -->
		 <?php $cant = isset($_SESSION['usuario']['notificaciones_no_leidas']) ? $_SESSION['usuario']['notificaciones_no_leidas'] : 0; ?>
        <a href="#" id="notificacionesDropdown" class="nav-link" title="Notificaciones" onclick="toggleDropdown(event)" style="cursor:pointer; position: relative;">
            <i class="fa fa-bell" style="font-size: 20px; line-height: 2;"></i>
            <?php if ($cant > 0): ?>
                <span class="badge badge-danger position-absolute" 
                      style="top: 5px; right: 5px; font-size: 0.65rem; border-radius: 50%; padding: 3px 6px;">
                    <?= $cant ?>
                </span>
            <?php endif; ?>
        </a>

        <div id="dropdownNotificaciones" class="dropdown-menu dropdown-menu-right" style="display:none; max-height:600px; overflow-y:auto;">
            <?php
            $notificaciones = isset($_SESSION['usuario']['notificaciones']) ? $_SESSION['usuario']['notificaciones'] : [];

            if (empty($notificaciones)):
            ?>
                <div class="dropdown-item text-center text-muted">No hay notificaciones nuevas</div>
            <?php else:
                foreach ($notificaciones as $notif):
                    $fecha = !empty($notif['created']) ? date('d/m/Y H:i', strtotime($notif['created'])) : '';
                    $titulo = !empty($notif['mensaje']) ? htmlspecialchars($notif['mensaje']) : 'Notificación';
                    $link = !empty($notif['link']) ? $notif['link'] : '#';
                    $clase_leida = !empty($notif['leido']) ? 'text-muted' : 'font-weight-bold';
            ?>
                <a href="<?= $link ?>" class="dropdown-item <?= $clase_leida ?>">
                    <small class="text-secondary"><?= $fecha ?></small><br>
                    <?= $titulo ?>
                </a>
                <div class="dropdown-divider"></div>
            <?php endforeach; endif; ?>
			<a href="/notificaciones/index" class="dropdown-item text-center" style="color: #007bff;">
				Ver todas las notificaciones
			</a>
        </div>
	</li>
</ul>

<script>
document.addEventListener("DOMContentLoaded", function() {
    var li = document.querySelector('.alertas-tienda');
    if (!li) return;

    var idCanal = li.getAttribute('data-id-canal');
    var pendientes = <?php echo json_encode($_SESSION['ventas_pendientes'] ?? []); ?>;
    var datos = pendientes[idCanal] ?? { importar: 0, preparar: 0, transportis: 0};
    var mensajes = [];

    if (datos.importar > 0) {
        var palabraImportar = datos.importar === 1 ? "venta pendiente" : "ventas pendientes";
        mensajes.push(`🚨 Tienes <strong>${datos.importar}</strong> ${palabraImportar} para importar.  
                       <a href="/ventas/import">Ir a importar</a>`);
    }

    if (datos.preparar > 0) {
        var palabraPreparar = datos.preparar === 1 ? "venta pendiente" : "ventas pendientes";
        mensajes.push(`📦 Tienes <strong>${datos.preparar}</strong> ${palabraPreparar} de preparar.  
                       <a href="/ventas/preparacion?transportista=${datos.transportista}">Ir a preparar</a>`);
    }

    if (mensajes.length > 0) {
        li.style.display = "block";
        li.innerHTML = `
            <div class="alert alert-warning mx-2 my-1">
                ${mensajes.join("<br>")}
            </div>`;
    } else {
        li.style.display = "none";
        li.innerHTML = "";
    }
});
</script>