diff --git a/app/controllers/administrador.php b/app/controllers/administrador.php
index ee0f5e8..1bbdc79 100644
--- a/app/controllers/administrador.php
+++ b/app/controllers/administrador.php
@@ -237,6 +237,154 @@ function aprobar_usuario()
     exit;
 }
 
+function denegar_usuario()
+{
+    $conn = getConnection();
+
+    $id     = $_GET['id'] ?? null;
+    $motivo = trim($_POST['motivo'] ?? '');
+
+    // Definir motivo por defecto si no se ingresó uno
+    if ($motivo === '') {
+        $motivo = 'La solicitud ha sido rechazada por no cumplir con los requisitos establecidos.';
+    }
+
+    // Validar parámetros
+    if (!$id || !is_numeric($id)) {
+        header("Location: /IMPORTADORES/administrador/aprobarUsuarios?error=invalid_id");
+        exit;
+    }
+
+    if (!$motivo || trim($motivo) === '') {
+        header("Location: /IMPORTADORES/administrador/aprobarUsuarios?error=motivo_required");
+        exit;
+    }
+
+    // Verificar sesión del usuario administrador
+    if (!isset($_SESSION['usuario_id']) || empty($_SESSION['usuario_id'])) {
+        header("Location: /IMPORTADORES/administrador/aprobarUsuarios?error=session_error");
+        exit;
+    }
+
+    try {
+        // Obtener la solicitud
+        $sql  = "SELECT * FROM solicitudes_importadores WHERE request_id = ?";
+        $stmt = sqlsrv_query($conn, $sql, [$id]);
+        
+        if (!$stmt) {
+            throw new Exception("Error en consulta de solicitud: " . print_r(sqlsrv_errors(), true));
+        }
+
+        $solicitud = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_ASSOC);
+
+        if (!$solicitud) {
+            throw new Exception("Solicitud no encontrada");
+        }
+
+        // Validar que no haya sido procesada ya
+        if ($solicitud['request_status'] === 'denied') {
+            header("Location: /IMPORTADORES/administrador/aprobarUsuarios?error=already_denied");
+            exit;
+        }
+
+        if ($solicitud['request_status'] === 'approved') {
+            header("Location: /IMPORTADORES/administrador/aprobarUsuarios?error=already_approved");
+            exit;
+        }
+
+        // Preparar datos para el correo
+        $nombre = !empty($solicitud['company_name']) ? decrypt($solicitud['company_name']) : 'Usuario';
+        $email  = $solicitud['email'] ?? null;
+
+        if (empty($email)) {
+            throw new Exception("Email no disponible en la solicitud");
+        }
+
+        // Actualizar solicitud como denegada
+        $sqlUpdate  = "UPDATE solicitudes_importadores
+                       SET request_status = 'denied', 
+                           approval_date = GETDATE(), 
+                           approved_by = ?
+                       WHERE request_id = ?
+                      ";
+        $stmtUpdate = sqlsrv_query($conn, $sqlUpdate, [$_SESSION['usuario_id'], $id]);
+
+        if (!$stmtUpdate) {
+            throw new Exception("Error al actualizar solicitud: " . print_r(sqlsrv_errors(), true));
+        }
+
+        // Enviar correo de notificación de denegación
+        $mail = new PHPMailer(true);
+        try {
+            $mail->isSMTP();
+            $mail->Host       = 'secure.emailsrvr.com';
+            $mail->SMTPAuth   = true;
+            $mail->Username   = 'noreply@aduanasoft.com.mx';
+            $mail->Password   = $_ENV['SMTP_PASS'] ?? '';
+            $mail->SMTPSecure = PHPMailer::ENCRYPTION_STARTTLS;
+            $mail->Port       = 587;
+
+            $mail->setFrom('noreply@aduanasoft.com.mx', 'SIIH | Sistema Integral para Importadores de Hidrocarburos');
+            $mail->addAddress($email);
+            $mail->CharSet = 'UTF-8';
+            $mail->isHTML(true);
+            $mail->Subject = 'Solicitud de registro denegada - SIIH';
+
+            $mail->Body = "
+            <div style='font-family: Segoe UI, sans-serif; background-color: #f4f6f9; padding: 40px;'>
+              <div style='max-width: 600px; margin: auto; background: #fff; border: 1px solid #ddd; border-radius: 10px; overflow: hidden;'>
+                <div style='background: linear-gradient(to right, #dc3545, #c82333); padding: 20px; text-align: center;'>
+                  <h2 style='color: white;'>Solicitud Denegada</h2>
+                </div>
+                <div style='padding: 30px; color: #333; font-size: 16px;'>
+                  <p>Estimado(a) <strong>$nombre</strong>,</p>
+                  <p>Lamentamos informarte que tu solicitud de registro como importador en el sistema SIIH ha sido denegada.</p>
+                  
+                  <div style='background: #f8f9fa; padding: 15px; border-left: 4px solid #dc3545; margin: 20px 0;'>
+                    <p style='margin: 0; font-weight: bold; color: #dc3545;'>Motivo de la denegación:</p>
+                    <p style='margin: 10px 0 0 0;'>$motivo</p>
+                  </div>
+                  
+                  <p>Si consideras que esta decisión es incorrecta o deseas obtener más información, puedes contactarnos para revisar tu caso.</p>
+                  
+                  <p>Agradecemos tu interés en formar parte del Sistema Integral para Importadores de Hidrocarburos.</p>
+                </div>
+                <div style='background: #e9ecef; text-align: center; padding: 15px; font-size: 13px; color: #666;'>
+                  &copy; " . date('Y') . " SIIH · Sistema Integral para Importadores de Hidrocarburos
+                </div>
+              </div>
+            </div>";
+
+            $mail->send();
+            
+            // Éxito completo (solicitud denegada y correo enviado)
+            header("Location: /IMPORTADORES/administrador/aprobarUsuarios?success=denied");
+            
+        } catch (Exception $mailException) {
+            // Error en el correo, pero la solicitud fue denegada exitosamente
+            error_log("Error al enviar correo de denegación: " . $mailException->getMessage());
+            
+            // Redirigir con mensaje de éxito parcial
+            header("Location: /IMPORTADORES/administrador/aprobarUsuarios?success=denied&warning=email_failed");
+        }
+
+    } catch (Exception $e) {
+        // Log del error para debugging
+        error_log("Error al denegar usuario: " . $e->getMessage());
+        
+        // Redirigir con error específico basado en el tipo de error
+        if (strpos($e->getMessage(), 'Solicitud no encontrada') !== false) {
+            header("Location: /IMPORTADORES/administrador/aprobarUsuarios?error=invalid_request");
+        } elseif (strpos($e->getMessage(), 'Email no disponible') !== false) {
+            header("Location: /IMPORTADORES/administrador/aprobarUsuarios?error=email_unavailable");
+        } else {
+            header("Location: /IMPORTADORES/administrador/aprobarUsuarios?error=process_failed");
+        }
+    }
+
+    exit;
+}
+
 function altaUsuarios() 
 {
     if (!isset($_SESSION['usuario_id']) || $_SESSION['tipo_usuario'] !== 'super_admin') {
@@ -649,6 +797,123 @@ function aprobar_agencia()
     exit;
 }
 
+function denegar_agencia()
+{
+    $conn = getConnection();
+
+    $id         = $_GET['id'] ?? null;
+    $motivo     = trim($_POST['motivo'] ?? '');
+    $usuario_id = $_SESSION['usuario_id'];
+
+    // Definir motivo por defecto si no se ingresó uno
+    if ($motivo === '') {
+        $motivo = 'La solicitud ha sido rechazada por no cumplir con los requisitos establecidos.';
+    }
+
+    // Validar parámetros
+    if (!$id || !is_numeric($id)) {
+        header("Location: /IMPORTADORES/administrador/aprobarAgencias?error=invalid_id");
+        exit;
+    }
+
+    if (!$motivo || trim($motivo) === '') {
+        header("Location: /IMPORTADORES/administrador/aprobarAgencias?error=motivo_required");
+        exit;
+    }
+
+    // Obtener la solicitud
+    $sql       = "SELECT * FROM solicitudes_agencias WHERE request_id = ?";
+    $stmt      = sqlsrv_query($conn, $sql, [$id]);
+    $solicitud = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_ASSOC);
+
+    if (!$solicitud) {   
+        header("Location: /IMPORTADORES/administrador/aprobarAgencias?error=invalid_request");
+        exit;
+    }
+
+    // Validar que no haya sido procesada ya
+    if ($solicitud['request_status'] === 'denied') {
+        die("⚠️ Esta solicitud ya fue denegada.");
+    }
+
+    if ($solicitud['request_status'] === 'approved') {
+        die("⚠️ Esta solicitud ya fue aprobada y no se puede denegar.");
+    }
+
+    // Preparar datos para el correo
+    $nombre      = decrypt($solicitud['agencia_name']);
+    $admin_name  = decrypt($solicitud['admin_name']);
+    $admin_email = $solicitud['admin_email'];
+
+    // Actualizar solicitud como denegada
+    $sqlUpdate  = "UPDATE solicitudes_agencias
+                   SET request_status = 'denied', 
+                       approval_date = GETDATE(), 
+                       approved_by = ?
+                   WHERE request_id = ?
+                  ";
+    $stmtUpdate = sqlsrv_query($conn, $sqlUpdate, [$usuario_id, $id]);
+
+    if (!$stmtUpdate) {
+        header("Location: /IMPORTADORES/administrador/aprobarAgencias?error=update_request_failed");
+        exit;
+    }
+
+    // Enviar correo de notificación de denegación
+    $mail = new PHPMailer(true);
+    try {
+        $mail->isSMTP();
+        $mail->Host       = 'secure.emailsrvr.com';
+        $mail->SMTPAuth   = true;
+        $mail->Username   = 'noreply@aduanasoft.com.mx';
+        $mail->Password   = $_ENV['SMTP_PASS'];
+        $mail->SMTPSecure = PHPMailer::ENCRYPTION_STARTTLS;
+        $mail->Port       = 587;
+
+        $mail->setFrom('noreply@aduanasoft.com.mx', 'SIIH | Sistema Integral para Importadores de Hidrocarburos');
+        $mail->addAddress($admin_email);
+        $mail->CharSet = 'UTF-8';
+        $mail->isHTML(true);
+        $mail->Subject = 'Solicitud de agencia denegada - SIIH';
+
+        $mail->Body = "
+        <div style='font-family: Segoe UI, sans-serif; background-color: #f4f6f9; padding: 40px;'>
+          <div style='max-width: 600px; margin: auto; background: #fff; border: 1px solid #ddd; border-radius: 10px; overflow: hidden;'>
+            <div style='background: linear-gradient(to right, #dc3545, #c82333); padding: 20px; text-align: center;'>
+              <h2 style='color: white;'>Solicitud Denegada</h2>
+            </div>
+            <div style='padding: 30px; color: #333; font-size: 16px;'>
+              <p>Estimado(a) <strong>$admin_name</strong>,</p>
+              <p>Lamentamos informarte que tu solicitud para registrar la agencia <strong>$nombre</strong> en el sistema SIIH ha sido denegada.</p>
+              
+              <div style='background: #f8f9fa; padding: 15px; border-left: 4px solid #dc3545; margin: 20px 0;'>
+                <p style='margin: 0; font-weight: bold; color: #dc3545;'>Motivo de la denegación:</p>
+                <p style='margin: 10px 0 0 0;'>$motivo</p>
+              </div>
+              
+              <p>Si consideras que esta decisión es incorrecta o deseas obtener más información, puedes contactarnos para revisar tu caso.</p>
+              
+              <p>Agradecemos tu interés en formar parte del Sistema Integral para Importadores de Hidrocarburos.</p>
+            </div>
+            <div style='background: #e9ecef; text-align: center; padding: 15px; font-size: 13px; color: #666;'>
+              &copy; " . date('Y') . " SIIH · Sistema Integral para Importadores de Hidrocarburos
+            </div>
+          </div>
+        </div>";
+
+        $mail->send();
+
+    } catch (Exception $e) {
+        error_log("Error al enviar correo de denegación: {$mail->ErrorInfo}");
+    }
+
+    // Registrar en bitácora (opcional - crear función específica para denegaciones)
+    registrar_bitacora_agencia($id, $nombre, 'DENEGACION', $usuario_id);
+
+    header("Location: /IMPORTADORES/administrador/aprobarAgencias?success=denied");
+    exit;
+}
+
 function altaAgencias() 
 {
     if (!isset($_SESSION['usuario_id']) || $_SESSION['tipo_usuario'] !== 'super_admin') {
diff --git a/app/controllers/importadores.php b/app/controllers/importadores.php
index eaf0aa3..44dbb40 100644
--- a/app/controllers/importadores.php
+++ b/app/controllers/importadores.php
@@ -289,6 +289,8 @@ function desvincularUsuario()
     $conn = getConnection();  
 
     try {
+        $stmtActualizarAgencia = null;
+
         // Iniciar transacción
         sqlsrv_begin_transaction($conn);
 
@@ -357,9 +359,16 @@ function desvincularUsuario()
         }
 
         // Limpiar statements
-        sqlsrv_free_stmt($stmtVerificar);
-        sqlsrv_free_stmt($stmtDesactivar);
-        sqlsrv_free_stmt($stmtActualizarAgencia);
+        if (isset($stmtVerificar) && is_resource($stmtVerificar)) {
+            sqlsrv_free_stmt($stmtVerificar);
+        }
+        if (isset($stmtDesactivar) && is_resource($stmtDesactivar)) {
+            sqlsrv_free_stmt($stmtDesactivar);
+        }
+        if (isset($stmtActualizarAgencia) && is_resource($stmtActualizarAgencia)) {
+            sqlsrv_free_stmt($stmtActualizarAgencia);
+        }
+
 
         // Confirmar transacción
         sqlsrv_commit($conn);
diff --git a/views/admin/agencias_activas.php b/views/admin/agencias_activas.php
index e81380b..8c0258a 100644
--- a/views/admin/agencias_activas.php
+++ b/views/admin/agencias_activas.php
@@ -98,7 +98,7 @@
                   <td><?= htmlspecialchars(decrypt($ag['nombre_admin'] ?? '')) ?></td>
                   <td>
                     <?php if (isset($ag['activo']) && $ag['activo'] == 1): ?>
-                      <a href="/IMPORTADORES/administrador/suspenderAgencia?id=<?= $ag['id_agencia'] ?>&success=1" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Suspender</a>
+                      <a href="#" onclick="confirmSuspencion(<?= (int) ($ag['id_agencia'] ?? 0) ?>)" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Suspender</a>
                     <?php endif; ?>
                   </td>
                 </tr>
@@ -119,6 +119,21 @@
         }
       });
     });
+
+    function confirmSuspencion(id) {
+      Swal.fire({
+        title: '¿Estás seguro?',
+        text: 'Solo se suspenderá el perfil del usuario.',
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Sí, suspender',
+        cancelButtonText: 'Cancelar'
+      }).then((result) => {
+        if (result.isConfirmed) {
+          window.location.href = `/IMPORTADORES/administrador/suspenderAgencia?id=${id}`;
+        }
+      });
+    }
   </script>
 
   <?php if (isset($_GET['success'])): ?>
diff --git a/views/admin/alta_usuarios.php b/views/admin/alta_usuarios.php
index 82f31af..ad2f872 100644
--- a/views/admin/alta_usuarios.php
+++ b/views/admin/alta_usuarios.php
@@ -228,7 +228,7 @@
                 <td><?= isset($u['creado_en']) && $u['creado_en'] instanceof DateTime ? $u['creado_en']->format('Y-m-d H:i') : '' ?></td>
                 <td>
                   <?php if (isset($u['activo']) && $u['activo'] == 1): ?>
-                    <a href="/IMPORTADORES/administrador/suspender?id=<?= $u['id_usuario'] ?>&success=1" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Suspender</a>
+                    <a href="#" onclick="confirmSuspencion(<?= (int) ($u['id_usuario'] ?? 0) ?>)" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Suspender</a>
                   <?php endif; ?>
                 </td>
               </tr>
@@ -252,7 +252,8 @@
 
     // Script para manejar las animaciones de validación
     document.addEventListener('DOMContentLoaded', function() {
-      const inputs = document.querySelectorAll('input.form-control, select.form_select');
+      const inputs  = document.querySelectorAll('input.form-control, select.form_select');
+      const selects = document.querySelectorAll('select.form_select');
       
       inputs.forEach(input => {
         // Validación en tiempo real
@@ -309,6 +310,21 @@
         });
       });
     });
+
+    function confirmSuspencion(id) {
+      Swal.fire({
+        title: '¿Estás seguro?',
+        text: 'Esta acción no se puede deshacer.',
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Sí, suspender',
+        cancelButtonText: 'Cancelar'
+      }).then((result) => {
+        if (result.isConfirmed) {
+          window.location.href = `/IMPORTADORES/administrador/suspender?id=${id}`;
+        }
+      });
+    }
   </script>
 
   <?php if (isset($_GET['success'])): ?>
diff --git a/views/admin/aprobar_agencias.php b/views/admin/aprobar_agencias.php
index 4e2af3f..24ae341 100644
--- a/views/admin/aprobar_agencias.php
+++ b/views/admin/aprobar_agencias.php
@@ -106,7 +106,8 @@
                     <?php endif; ?>
                   </td>
                   <td>
-                    <a href="/IMPORTADORES/administrador/aprobar_agencia?id=<?= $s['request_id'] ?>" class="btn btn-sm btn-success mt-auto w-auto btn-animated">Aprobar</a>
+                    <a href="#" onclick="confirmAprobacion(<?= $s['request_id'] ?>)" class="btn btn-sm btn-success mt-auto w-auto btn-animated">Aprobar</a>
+                    <a href="#" onclick="denegateRequest(<?= $s['request_id'] ?>)" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Denegar</a>
                   </td>
                 </tr>
               <?php endforeach; ?>
@@ -117,6 +118,14 @@
     </div>
   </div>
 
+  <?php if (isset($_GET['success'])): ?>
+    <script>
+      <?php if ($_GET['success'] === 'denied'): ?>
+        Swal.fire({ icon: 'success', title: 'Registro de Agencia denegado', text: 'La solicitud fue denegada.', confirmButtonColor: '#198754' });
+      <?php endif; ?>
+    </script>
+  <?php endif; ?>
+
   <script>
     $(document).ready(function () {
       $('#tabla-agencias-pendientes').DataTable({
@@ -126,6 +135,36 @@
         }
       });
     });
+
+    function confirmAprobacion(id) {
+      Swal.fire({
+        title: '¿Estás seguro?',
+        text: 'Se creará el perfil y se notificará al usuario.',
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Sí, aprobar',
+        cancelButtonText: 'Cancelar'
+      }).then((result) => {
+        if (result.isConfirmed) {
+          window.location.href = `/IMPORTADORES/administrador/aprobar_agencia?id=${id}`;
+        }
+      });
+    }
+
+    function denegateRequest(id) {
+      Swal.fire({
+        title: '¿Estás seguro?',
+        text: 'Se denegara la solicitud de registro de la agencia.',
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Sí, denegar',
+        cancelButtonText: 'Cancelar'
+      }).then((result) => {
+        if (result.isConfirmed) {
+          window.location.href = `/IMPORTADORES/administrador/denegar_agencia?id=${id}`;
+        }
+      });
+    }
   </script>
 
   <?php if (isset($_GET['error'])): ?>
diff --git a/views/admin/aprobar_usuarios.php b/views/admin/aprobar_usuarios.php
index af9791e..3bb4068 100644
--- a/views/admin/aprobar_usuarios.php
+++ b/views/admin/aprobar_usuarios.php
@@ -103,7 +103,8 @@
                     <?php endif; ?>
                   </td>
                   <td>
-                    <a href="/IMPORTADORES/administrador/aprobar_usuario?id=<?= $s['request_id'] ?>" class="btn btn-sm btn-success mt-auto w-auto btn-animated">Aprobar</a>
+                    <a href="#" onclick="confirmAprobacion(<?= $s['request_id'] ?>)" class="btn btn-sm btn-success mt-auto w-auto btn-animated">Aprobar</a>
+                    <a href="#" onclick="denegateRequest(<?= $s['request_id'] ?>)" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Denegar</a>
                   </td>
                 </tr>
               <?php endforeach; ?>
@@ -123,14 +124,46 @@
         }
       });
     });
+
+    function confirmAprobacion(id) {
+      Swal.fire({
+        title: '¿Estás seguro?',
+        text: 'Se creará el perfil y se notificará al usuario.',
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Sí, aprobar',
+        cancelButtonText: 'Cancelar'
+      }).then((result) => {
+        if (result.isConfirmed) {
+          window.location.href = `/IMPORTADORES/administrador/aprobar_usuario?id=${id}`;
+        }
+      });
+    }
+
+    function denegateRequest(id) {
+      Swal.fire({
+        title: '¿Estás seguro?',
+        text: 'Se denegara la solicitud de registro del usuario.',
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Sí, denegar',
+        cancelButtonText: 'Cancelar'
+      }).then((result) => {
+        if (result.isConfirmed) {
+          window.location.href = `/IMPORTADORES/administrador/denegar_usuario?id=${id}`;
+        }
+      });
+    }
   </script>
 
   <?php if (isset($_GET['success'])): ?>
     <script>
       <?php if ($_GET['success'] === 'approved'): ?>
-        Swal.fire({ icon: 'success', title: 'Usuario aprobado',
-          text: 'El usuario ha sido aprobado correctamente y se ha enviado un correo con las credenciales.',
-          confirmButtonColor: '#198754' });
+        Swal.fire({ icon: 'success', title: 'Usuario aprobado', text: 'El usuario ha sido aprobado correctamente y se ha enviado un correo con las credenciales.', confirmButtonColor: '#198754' });
+      <?php endif; ?>
+
+      <?php if ($_GET['success'] === 'denied'): ?>
+        Swal.fire({ icon: 'success', title: 'Registro de Usuario denegado', text: 'La solicitud fue denegada.', confirmButtonColor: '#198754' });
       <?php endif; ?>
     </script>
   <?php endif; ?>
diff --git a/views/admin/usuarios_inactivos.php b/views/admin/usuarios_inactivos.php
index 1e8098b..5f7ae84 100644
--- a/views/admin/usuarios_inactivos.php
+++ b/views/admin/usuarios_inactivos.php
@@ -95,8 +95,8 @@
                 <td><?= isset($u['creado_en']) && $u['creado_en'] instanceof DateTime ? $u['creado_en']->format('Y-m-d H:i') : '' ?></td>
                 <td>
                   <?php if (isset($u['activo']) && $u['activo'] == 0): ?>
-                    <a href="/IMPORTADORES/administrador/activar?id=<?= $u['id_usuario'] ?>&success=1" class="btn btn-sm btn-success mt-auto w-auto btn-animated">Activar</a>
-                    <a href="/IMPORTADORES/administrador/reset_password?id=<?= $u['id_usuario'] ?>" class="btn btn-sm btn-secondary mt-auto w-auto btn-animated">Nueva Contraseña</a>
+                    <a href="#" onclick="confirmActivacion(<?= (int) ($u['id_usuario'] ?? 0) ?>)" class="btn btn-sm btn-success mt-auto w-auto btn-animated">Activar</a>
+                    <a href="#" onclick="changePassword(<?= (int) ($u['id_usuario'] ?? 0) ?>)" class="btn btn-sm btn-secondary mt-auto w-auto btn-animated">Restablecer</a>
                   <?php endif; ?>
                 </td>
               </tr>
@@ -117,6 +117,36 @@
         }
       });
     });
+
+    function confirmActivacion(id) {
+      Swal.fire({
+        title: '¿Estás seguro?',
+        text: 'Se reactivara el perfil del usuario.',
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Sí, reactivar',
+        cancelButtonText: 'Cancelar'
+      }).then((result) => {
+        if (result.isConfirmed) {
+          window.location.href = `/IMPORTADORES/administrador/activar?id=${id}`;
+        }
+      });
+    }
+
+    function changePassword(id) {
+      Swal.fire({
+        title: '¿Estás seguro?',
+        text: 'Se restablecera la contraseña del usuario.',
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Sí, restablecer',
+        cancelButtonText: 'Cancelar'
+      }).then((result) => {
+        if (result.isConfirmed) {
+          window.location.href = `/IMPORTADORES/administrador/reset_password?id=${id}`;
+        }
+      });
+    }
   </script>
 
   <?php if (isset($_GET['success'])): ?>
diff --git a/views/partials/sidebar_administrador.php b/views/partials/sidebar_administrador.php
index f84ecf5..d9493cc 100644
--- a/views/partials/sidebar_administrador.php
+++ b/views/partials/sidebar_administrador.php
@@ -1,179 +1,315 @@
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+
 <style>
-  .nav .nav-link { font-weight: normal; color: white; transition: all 0.3s ease; }
-  .nav .nav-link:hover,
-  .nav .nav-link.active { background-color: #495057; color: #fff; }
-  /* Estilo inverso solo para pantallas pequeñas (sidebar tipo offcanvas) */
+  /* Estilos inspirados en Tailwind */
+  .sidebar-container { background-color: #f9fafb; border-right: 1px solid #e5e7eb; }
+  .sidebar-dark { background-color: #1f2937; border-right: 1px solid #374151; }
+  .sidebar-nav .nav-link { color: #374151; font-weight: 500; padding: 0.5rem 0.75rem; margin-bottom: 0.125rem;
+    border-radius: 0.5rem; transition: all 0.15s ease-in-out; display: flex; align-items: center; }
+  .sidebar-nav .nav-link:hover { background-color: #f3f4f6; color: #111827; }
+  .sidebar-nav .nav-link.active { background-color: #f3f4f6; color: #111827; }
+  .sidebar-nav .nav-link .icon { width: 1.25rem; height: 1.25rem; margin-right: 0.75rem; color: #6b7280; transition: color 0.15s ease-in-out; flex-shrink: 0; }
+  .sidebar-nav .nav-link:hover .icon,
+  .sidebar-nav .nav-link.active .icon { color: #374151; }
+  .sidebar-nav .badge { background-color: #f3f4f6; color: #374151; font-size: 0.75rem; font-weight: 500; padding: 0.25rem 0.5rem; border-radius: 9999px; margin-left: auto; }
+  .sidebar-nav .badge.badge-primary { background-color: #dbeafe; color: #1e40af; }
+  .submenu .nav-link { padding-left: 2.75rem; color: #6b7280; font-weight: 400; }
+  .submenu .nav-link:hover { background-color: #f3f4f6; color: #374151; }
+  .submenu .nav-link.active { background-color: #f3f4f6; color: #374151; }
+  .collapse-icon { width: 0.75rem; height: 0.75rem; margin-left: auto; transition: transform 0.15s ease-in-out; }
+  .nav-link[aria-expanded="true"] .collapse-icon { transform: rotate(180deg); }
+  /* Estilos para modo oscuro */
+  .sidebar-dark .sidebar-nav .nav-link { color: #d1d5db; }
+  .sidebar-dark .sidebar-nav .nav-link:hover { background-color: #374151; color: #ffffff; }
+  .sidebar-dark .sidebar-nav .nav-link.active { background-color: #374151; color: #ffffff; }
+  .sidebar-dark .sidebar-nav .nav-link .icon { color: #9ca3af; }
+  .sidebar-dark .sidebar-nav .nav-link:hover .icon,
+  .sidebar-dark .sidebar-nav .nav-link.active .icon { color: #ffffff; }
+  .sidebar-dark .sidebar-nav .badge { background-color: #374151; color: #d1d5db; }
+  .sidebar-dark .sidebar-nav .badge.badge-primary { background-color: #1e3a8a; color: #93c5fd; }
+  .sidebar-dark .submenu .nav-link { color: #9ca3af; }
+  .sidebar-dark .submenu .nav-link:hover { background-color: #374151; color: #d1d5db; }
+  .sidebar-dark .submenu .nav-link.active { background-color: #374151; color: #d1d5db; }
+  /* Navbar */
+  .navbar-brand { font-weight: 600; font-size: 1.125rem; }
+  .menu-toggle { border: 1px solid #6b7280; border-radius: 0.5rem; padding: 0.5rem; transition: all 0.15s ease-in-out; }
+  .menu-toggle:hover { background-color: #f3f4f6; }
+  /* Offcanvas para móviles */
+  .offcanvas { background-color: #ffffff; }
+  .offcanvas-header { border-bottom: 1px solid #e5e7eb; padding: 1rem 1.5rem; }
+  .offcanvas-title { font-weight: 600; font-size: 1.125rem; color: #111827; }
+  .offcanvas-body { padding: 1rem 1.5rem; }
+  /* Responsive adjustments */
   @media (max-width: 767.98px) {
-    .nav .nav-link { font-weight: normal; color: #343a40; background-color: transparent; }
-    .nav .nav-link:hover,
-    .nav .nav-link.active { background-color: #e9ecef; color: #212529; }
+    .sidebar-nav .nav-link { color: #374151; }
+    .sidebar-nav .nav-link:hover { background-color: #f3f4f6; color: #111827; }
+    .sidebar-nav .nav-link.active { background-color: #f3f4f6; color: #111827; }
   }
 </style>
-  
-<!-- 🔷 NAVBAR -->
+
+<!-- NAVBAR -->
 <nav class="navbar navbar-dark bg-dark fixed-top">
   <div class="container-fluid">
     <!-- Botón de menú para móviles -->
-    <button class="btn btn-outline-light d-md-none me-2" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
-      ☰
+    <button class="menu-toggle d-md-none me-3" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
+      <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+        <path clip-rule="evenodd" fill-rule="evenodd" d="M2 4.75A.75.75 0 012.75 4h14.5a.75.75 0 010 1.5H2.75A.75.75 0 012 4.75zm0 10.5a.75.75 0 01.75-.75h7.5a.75.75 0 010 1.5h-7.5a.75.75 0 01-.75-.75zM2 10a.75.75 0 01.75-.75h14.5a.75.75 0 010 1.5H2.75A.75.75 0 012 10z"></path>
+      </svg>
     </button>
     <span class="navbar-brand">SIIH | Administrador</span>
     <div class="d-flex ms-auto text-white">
-      <?php
-      // Verifica si estás en el dashboard principal del administrador
-      $esDashboard = str_contains($_SERVER['REQUEST_URI'], '/administrador/dashboard');
+      <div id="navbar-content">
+        <?php
+        // Verifica si estás en el dashboard principal del administrador
+        $esDashboard = str_contains($_SERVER['REQUEST_URI'], '/administrador/dashboard');
 
-      if ($esDashboard): ?>
-        Bienvenido, <?= htmlspecialchars($_SESSION['usuario_nombre']) ?>
-      <?php else: ?>
-        <a href="/IMPORTADORES/sistemas/logout" class="btn btn-outline-light btn-sm ms-2 W-auto btn-animated">Cerrar Sesión</a>
-      <?php endif; ?>
-    </div>  
+        if ($esDashboard): ?>
+          <span id="welcome-text">Bienvenido, <?= htmlspecialchars($_SESSION['usuario_nombre']) ?></span>
+        <?php else: ?>
+          <a href="/IMPORTADORES/sistemas/logout" class="btn btn-outline-light btn-sm ms-2 W-auto btn-animated" id="logout-btn">Cerrar Sesión</a>
+        <?php endif; ?>
+      </div>
+    </div>
   </div>
 </nav>
 
 <!-- SIDEBAR FIJA (escritorio) -->
-<div class="d-none d-md-block bg-dark text-white position-fixed h-100 pt-5" style="width: 250px;">
-  <nav class="nav flex-column">
-
-    <!-- INICIO -->
-    <a href="/IMPORTADORES/administrador/dashboard"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/dashboard') ? 'active' : '' ?>">     
-      🏠 Inicio
-    </a>
-
-    <!-- AGENCIAS -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuAgencias" role="button" aria-expanded="false">
-      🏪 Agencias
-      <span class="badge bg-secondary">3</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/administrador') ? 'show' : '' ?>" id="submenuAgencias">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/administrador/aprobarAgencias"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/aprobarAgencias') ? 'active' : '' ?>">
-          • Aprobar agencias
-        </a>
-        <a href="/IMPORTADORES/administrador/altaAgencias"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/altaAgencias') ? 'active' : '' ?>">
-          • Alta de agencia
-        </a>
-        <a href="/IMPORTADORES/administrador/agenciasActivas"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/agenciasActivas') ? 'active' : '' ?>">
-          • Ver agencias
-        </a>
-      </nav>
-    </div>
-
-    <!-- USUARIOS -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuUsuarios" role="button" aria-expanded="false">
-      👥 Usuarios
-      <span class="badge bg-secondary">3</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/administrador') ? 'show' : '' ?>" id="submenuUsuarios">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/administrador/aprobarUsuarios"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/aprobarUsuarios') ? 'active' : '' ?>">
-          • Aprobar usuarios
-        </a>
-        <a href="/IMPORTADORES/administrador/altaUsuarios"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/altaUsuarios') ? 'active' : '' ?>">
-          • Ver usuarios
-        </a>
-        <a href="/IMPORTADORES/administrador/usuariosInactivos"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/usuariosInactivos') ? 'active' : '' ?>">
-          • Usuarios inactivos
-        </a>
-      </nav>
-    </div>
-
-    <!-- CONFIGURACIÓN -->
-    <a href="/IMPORTADORES/administrador/configuracion"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/configuracion') ? 'active' : '' ?>">
-      ⚙️ Configuración
-    </a>
-
-  </nav>
+<div class="d-none d-md-block sidebar-container sidebar-dark position-fixed h-100" style="width: 250px; top: 0; padding-top: 4rem; z-index: 1000;">
+  <div class="px-3 py-4 h-100 overflow-y-auto">
+    <nav class="sidebar-nav">
+      <ul class="nav flex-column">
+        <!-- INICIO -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/administrador/dashboard" class="nav-link active">
+            <svg class="icon" fill="currentColor" viewBox="0 0 22 21">
+              <path d="M16.975 11H10V4.025a1 1 0 0 0-1.066-.998 8.5 8.5 0 1 0 9.039 9.039.999.999 0 0 0-1-1.066h.002Z"/>
+              <path d="M12.5 0c-.157 0-.311.01-.565.027A1 1 0 0 0 11 1.02V10h8.975a1 1 0 0 0 1-.935c.013-.188.028-.374.028-.565A8.51 8.51 0 0 0 12.5 0Z"/>
+            </svg>
+            <span>Inicio</span>
+          </a>
+        </li>
+        <!-- AGENCIAS -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuAgencias" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 18 21">
+              <path d="M15 12a1 1 0 0 0 .962-.726l2-7A1 1 0 0 0 17 3H3.77L3.175.745A1 1 0 0 0 2.208 0H1a1 1 0 0 0 0 2h.438l.6 2.255v.019l2 7 .746 2.986A3 3 0 1 0 9 17a2.966 2.966 0 0 0-.184-1h2.368c-.118.32-.18.659-.184 1a3 3 0 1 0 3-3H6.78l-.5-2H15Z"/>
+            </svg>
+            <span>Agencias</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuAgencias">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/aprobarAgencias" class="nav-link">
+                  Aprobar agencias
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/altaAgencias" class="nav-link">
+                  Alta de agencia
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/agenciasActivas" class="nav-link">
+                  Ver agencias
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- USUARIOS -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuUsuarios" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 18">
+              <path d="M14 2a3.963 3.963 0 0 0-1.4.267 6.439 6.439 0 0 1-1.331 6.638A4 4 0 1 0 14 2Zm1 9h-1.264A6.957 6.957 0 0 1 15 15v2a2.97 2.97 0 0 1-.184 1H19a1 1 0 0 0 1-1v-1a5.006 5.006 0 0 0-5-5ZM6.5 9a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9ZM8 10H5a5.006 5.006 0 0 0-5 5v2a1 1 0 0 0 1 1h11a1 1 0 0 0 1-1v-2a5.006 5.006 0 0 0-5-5Z"/>
+            </svg>
+            <span>Usuarios</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuUsuarios">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/aprobarUsuarios" class="nav-link">
+                  Aprobar usuarios
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/altaUsuarios" class="nav-link">
+                  Alta de usuario
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/usuariosInactivos" class="nav-link">
+                  Usuarios inactivos
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- CONFIGURACIÓN -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/administrador/configuracion" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M5 5V.13a2.96 2.96 0 0 0-1.293.749L.879 3.707A2.96 2.96 0 0 0 .13 5H5Z"/>
+              <path d="M6.737 11.061a2.961 2.961 0 0 1 .81-1.515l6.117-6.116A4.839 4.839 0 0 1 16 2.141V2a1.97 1.97 0 0 0-1.933-2H7v5a2 2 0 0 1-2 2H0v11a1.969 1.969 0 0 0 1.933 2h12.134A1.97 1.97 0 0 0 16 18v-3.093l-1.546 1.546c-.413.413-.94.695-1.513.81l-3.4.679a2.947 2.947 0 0 1-1.85-.227 2.96 2.96 0 0 1-1.635-3.257l.681-3.397Z"/>
+            </svg>
+            <span>Configuración</span>
+          </a>
+        </li>
+      </ul>
+    </nav>
+  </div>
 </div>
 
 <!-- OFFCANVAS PARA MÓVILES -->
-<div class="offcanvas offcanvas-start d-md-none" tabindex="-1" id="sidebarMenu" style="top: 75px;">
+<div class="offcanvas offcanvas-start d-md-none" tabindex="-1" id="sidebarMenu" style="top: 0; width: 250px;">
   <div class="offcanvas-header">
     <h5 class="offcanvas-title">Menú</h5>
     <button type="button" class="btn-close" data-bs-dismiss="offcanvas"></button>
   </div>
   <div class="offcanvas-body">
-        
-    <!-- INICIO -->
-    <a href="/IMPORTADORES/administrador/dashboard"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/dashboard') ? 'active' : '' ?>">     
-      🏠 Inicio
-    </a>
-
-    <!-- AGENCIAS -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuAgencias" role="button"
-       aria-expanded="<?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador') ? 'true' : 'false' ?>"
-       aria-controls="submenuAgencias">
-      🏪 Agencias
-      <span class="badge bg-secondary">3</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/administrador') ? 'show' : '' ?>" id="submenuAgencias">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/administrador/aprobarAgencias"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/aprobarAgencias') ? 'active' : '' ?>">
-          • Aprobar agencias
-        </a>
-        <a href="/IMPORTADORES/administrador/altaAgencias"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/altaAgencias') ? 'active' : '' ?>">
-          • Alta de agencia
-        </a>
-        <a href="/IMPORTADORES/administrador/agenciasActivas"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/agenciasActivas') ? 'active' : '' ?>">
-          • Ver agencias
-        </a>
-      </nav>
-    </div>
-
-    <!-- USUARIOS -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuUsuarios" role="button"
-       aria-expanded="<?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador') ? 'true' : 'false' ?>"
-       aria-controls="submenuUsuarios">
-      👥 Usuarios
-      <span class="badge bg-secondary">4</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/administrador') ? 'show' : '' ?>" id="submenuUsuarios">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/administrador/aprobarUsuarios"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/aprobarUsuarios') ? 'active' : '' ?>">
-          • Aprobar usuarios
-        </a>
-        <a href="/IMPORTADORES/administrador/altaUsuarios"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/altaUsuarios') ? 'active' : '' ?>">
-          • Alta de usuario
-        </a>
-        <a href="/IMPORTADORES/administrador/usuariosActivos"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/usuariosActivos') ? 'active' : '' ?>">
-          • Ver usuarios 
-        </a>
-        <a href="/IMPORTADORES/administrador/usuariosInactivos"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/usuariosInactivos') ? 'active' : '' ?>">
-          • Usuarios inactivos
-        </a>
-      </nav>
-    </div>
-
-    <!-- CONFIGURACIÓN -->
-    <a href="/IMPORTADORES/administrador/configuracion"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/administrador/configuracion') ? 'active' : '' ?>">
-      ⚙️ Configuración
-    </a>
-    
+    <nav class="sidebar-nav">
+      <ul class="nav flex-column">
+        <!-- INICIO -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/administrador/dashboard" class="nav-link active">
+            <svg class="icon" fill="currentColor" viewBox="0 0 22 21">
+              <path d="M16.975 11H10V4.025a1 1 0 0 0-1.066-.998 8.5 8.5 0 1 0 9.039 9.039.999.999 0 0 0-1-1.066h.002Z"/>
+              <path d="M12.5 0c-.157 0-.311.01-.565.027A1 1 0 0 0 11 1.02V10h8.975a1 1 0 0 0 1-.935c.013-.188.028-.374.028-.565A8.51 8.51 0 0 0 12.5 0Z"/>
+            </svg>
+            <span>Inicio</span>
+          </a>
+        </li>
+        <!-- AGENCIAS -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuAgenciasMobile" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 18 21">
+              <path d="M15 12a1 1 0 0 0 .962-.726l2-7A1 1 0 0 0 17 3H3.77L3.175.745A1 1 0 0 0 2.208 0H1a1 1 0 0 0 0 2h.438l.6 2.255v.019l2 7 .746 2.986A3 3 0 1 0 9 17a2.966 2.966 0 0 0-.184-1h2.368c-.118.32-.18.659-.184 1a3 3 0 1 0 3-3H6.78l-.5-2H15Z"/>
+            </svg>
+            <span>Agencias</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuAgenciasMobile">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/aprobarAgencias" class="nav-link">
+                  Aprobar agencias
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/altaAgencias" class="nav-link">
+                  Alta de agencia
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/agenciasActivas" class="nav-link">
+                  Ver agencias
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- USUARIOS -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuUsuariosMobile" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 18">
+              <path d="M14 2a3.963 3.963 0 0 0-1.4.267 6.439 6.439 0 0 1-1.331 6.638A4 4 0 1 0 14 2Zm1 9h-1.264A6.957 6.957 0 0 1 15 15v2a2.97 2.97 0 0 1-.184 1H19a1 1 0 0 0 1-1v-1a5.006 5.006 0 0 0-5-5ZM6.5 9a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9ZM8 10H5a5.006 5.006 0 0 0-5 5v2a1 1 0 0 0 1 1h11a1 1 0 0 0 1-1v-2a5.006 5.006 0 0 0-5-5Z"/>
+            </svg>
+            <span>Usuarios</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuUsuariosMobile">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/aprobarUsuarios" class="nav-link">
+                  Aprobar usuarios
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/altaUsuarios" class="nav-link">
+                  Alta de usuario
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/administrador/usuariosInactivos" class="nav-link">
+                  Usuarios inactivos
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- CONFIGURACIÓN -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/administrador/configuracion" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M5 5V.13a2.96 2.96 0 0 0-1.293.749L.879 3.707A2.96 2.96 0 0 0 .13 5H5Z"/>
+              <path d="M6.737 11.061a2.961 2.961 0 0 1 .81-1.515l6.117-6.116A4.839 4.839 0 0 1 16 2.141V2a1.97 1.97 0 0 0-1.933-2H7v5a2 2 0 0 1-2 2H0v11a1.969 1.969 0 0 0 1.933 2h12.134A1.97 1.97 0 0 0 16 18v-3.093l-1.546 1.546c-.413.413-.94.695-1.513.81l-3.4.679a2.947 2.947 0 0 1-1.85-.227 2.96 2.96 0 0 1-1.635-3.257l.681-3.397Z"/>
+            </svg>
+            <span>Configuración</span>
+          </a>
+        </li>
+      </ul>
+    </nav>
   </div>
-</div>
\ No newline at end of file
+</div>
+
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+<script>
+  // Simular lógica de dashboard
+  document.addEventListener('DOMContentLoaded', function() {
+    const esDashboard = window.location.pathname.includes('/administrador/dashboard');
+    const welcomeText = document.getElementById('welcome-text');
+    const logoutBtn   = document.getElementById('logout-btn');
+        
+    if (!esDashboard) {
+      welcomeText.style.display = 'none';
+      logoutBtn.style.display   = 'inline-block';
+    }
+        
+    // Manejar estados activos basados en URL actual
+    const currentPath = window.location.pathname;
+    const navLinks    = document.querySelectorAll('.nav-link');
+        
+    navLinks.forEach(link => {
+      const href = link.getAttribute('href');
+      if (href && currentPath.includes(href)) {
+        link.classList.add('active');
+      }
+    });
+        
+    // Manejar collapse manualmente
+    document.querySelectorAll('[data-bs-toggle="collapse"]').forEach(trigger => {
+      trigger.addEventListener('click', function(e) {
+        e.preventDefault();
+        e.stopPropagation();
+                
+        const targetId      = this.getAttribute('href');
+        const targetElement = document.querySelector(targetId);
+        const isExpanded    = this.getAttribute('aria-expanded') === 'true';
+                
+        if (targetElement) {
+          if (isExpanded) {
+            // Cerrar
+            targetElement.classList.remove('show');
+            this.setAttribute('aria-expanded', 'false');
+          } else {
+            // Abrir
+            targetElement.classList.add('show');
+            this.setAttribute('aria-expanded', 'true');
+          }
+        }
+      });
+            
+      // Remover el atributo data-bs-toggle para evitar conflictos
+      trigger.removeAttribute('data-bs-toggle');
+    });
+  });
+</script>
\ No newline at end of file
diff --git a/views/partials/sidebar_agencia.php b/views/partials/sidebar_agencia.php
index 2715c2d..8b338f5 100644
--- a/views/partials/sidebar_agencia.php
+++ b/views/partials/sidebar_agencia.php
@@ -1,12 +1,49 @@
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+
 <style>
-  .nav .nav-link { font-weight: normal; color: white; transition: all 0.3s ease; }
-  .nav .nav-link:hover,
-  .nav .nav-link.active { background-color: #495057; color: #fff; }
-  /* Estilo inverso solo para pantallas pequeñas (sidebar tipo offcanvas) */
+  /* Estilos inspirados en Tailwind */
+  .sidebar-container { background-color: #f9fafb; border-right: 1px solid #e5e7eb; }
+  .sidebar-dark { background-color: #1f2937; border-right: 1px solid #374151; }
+  .sidebar-nav .nav-link { color: #374151; font-weight: 500; padding: 0.5rem 0.75rem; margin-bottom: 0.125rem;
+    border-radius: 0.5rem; transition: all 0.15s ease-in-out; display: flex; align-items: center; }
+  .sidebar-nav .nav-link:hover { background-color: #f3f4f6; color: #111827; }
+  .sidebar-nav .nav-link.active { background-color: #f3f4f6; color: #111827; }
+  .sidebar-nav .nav-link .icon { width: 1.25rem; height: 1.25rem; margin-right: 0.75rem; color: #6b7280; transition: color 0.15s ease-in-out; flex-shrink: 0; }
+  .sidebar-nav .nav-link:hover .icon,
+  .sidebar-nav .nav-link.active .icon { color: #374151; }
+  .sidebar-nav .badge { background-color: #f3f4f6; color: #374151; font-size: 0.75rem; font-weight: 500; padding: 0.25rem 0.5rem; border-radius: 9999px; margin-left: auto; }
+  .sidebar-nav .badge.badge-primary { background-color: #dbeafe; color: #1e40af; }
+  .submenu .nav-link { padding-left: 2.75rem; color: #6b7280; font-weight: 400; }
+  .submenu .nav-link:hover { background-color: #f3f4f6; color: #374151; }
+  .submenu .nav-link.active { background-color: #f3f4f6; color: #374151; }
+  .collapse-icon { width: 0.75rem; height: 0.75rem; margin-left: auto; transition: transform 0.15s ease-in-out; }
+  .nav-link[aria-expanded="true"] .collapse-icon { transform: rotate(180deg); }
+  /* Estilos para modo oscuro */
+  .sidebar-dark .sidebar-nav .nav-link { color: #d1d5db; }
+  .sidebar-dark .sidebar-nav .nav-link:hover { background-color: #374151; color: #ffffff; }
+  .sidebar-dark .sidebar-nav .nav-link.active { background-color: #374151; color: #ffffff; }
+  .sidebar-dark .sidebar-nav .nav-link .icon { color: #9ca3af; }
+  .sidebar-dark .sidebar-nav .nav-link:hover .icon,
+  .sidebar-dark .sidebar-nav .nav-link.active .icon { color: #ffffff; }
+  .sidebar-dark .sidebar-nav .badge { background-color: #374151; color: #d1d5db; }
+  .sidebar-dark .sidebar-nav .badge.badge-primary { background-color: #1e3a8a; color: #93c5fd; }
+  .sidebar-dark .submenu .nav-link { color: #9ca3af; }
+  .sidebar-dark .submenu .nav-link:hover { background-color: #374151; color: #d1d5db; }
+  .sidebar-dark .submenu .nav-link.active { background-color: #374151; color: #d1d5db; }
+  /* Navbar */
+  .navbar-brand { font-weight: 600; font-size: 1.125rem; }
+  .menu-toggle { border: 1px solid #6b7280; border-radius: 0.5rem; padding: 0.5rem; transition: all 0.15s ease-in-out; }
+  .menu-toggle:hover { background-color: #f3f4f6; }
+  /* Offcanvas para móviles */
+  .offcanvas { background-color: #ffffff; }
+  .offcanvas-header { border-bottom: 1px solid #e5e7eb; padding: 1rem 1.5rem; }
+  .offcanvas-title { font-weight: 600; font-size: 1.125rem; color: #111827; }
+  .offcanvas-body { padding: 1rem 1.5rem; }
+  /* Responsive adjustments */
   @media (max-width: 767.98px) {
-    .nav .nav-link { font-weight: normal; color: #343a40; background-color: transparent; }
-    .nav .nav-link:hover,
-    .nav .nav-link.active { background-color: #e9ecef; color: #212529; }
+    .sidebar-nav .nav-link { color: #374151; }
+    .sidebar-nav .nav-link:hover { background-color: #f3f4f6; color: #111827; }
+    .sidebar-nav .nav-link.active { background-color: #f3f4f6; color: #111827; }
   }
 </style>
 
@@ -14,233 +51,299 @@
 <nav class="navbar navbar-dark bg-dark fixed-top">
   <div class="container-fluid">
     <!-- Botón de menú para móviles -->
-    <button class="btn btn-outline-light d-md-none me-2" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
+    <button class="menu-toggle d-md-none me-3" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
       ☰
     </button>
     <span class="navbar-brand">SIIH | Agencia Aduanal</span>
     <div class="d-flex ms-auto text-white">
-      <?php
-      // Verifica si estás en el dashboard principal del importador
-      $esDashboard = str_contains($_SERVER['REQUEST_URI'], '/agencias/dashboard');
+      <div class="navbar-content">
+        <?php
+        // Verifica si estás en el dashboard principal del importador
+        $esDashboard = str_contains($_SERVER['REQUEST_URI'], '/agencias/dashboard');
 
-      if ($esDashboard): ?>
-        Bienvenido, <?= htmlspecialchars($_SESSION['usuario_nombre']) ?>
-      <?php else: ?>
-        <a href="/IMPORTADORES/sistemas/logout" class="btn btn-outline-light btn-sm ms-2 W-auto btn-animated">Cerrar Sesión</a>
-      <?php endif; ?>
+        if ($esDashboard): ?>
+          <span id="welcome-text">Bienvenido, <?= htmlspecialchars($_SESSION['usuario_nombre']) ?></span>
+        <?php else: ?>
+          <a href="/IMPORTADORES/sistemas/logout" class="btn btn-outline-light btn-sm ms-2 W-auto btn-animated">Cerrar Sesión</a>
+        <?php endif; ?>
+      </div>
     </div>
   </div>
 </nav>
 
 <!-- SIDEBAR FIJA (escritorio) -->
-<div class="d-none d-md-block bg-dark text-white position-fixed h-100 pt-5" style="width: 250px;">
-  <nav class="nav flex-column">
-
-    <?php
-      // Detecta si estamos en alguna parte de locaciones
-      $esVistaLocaciones  = str_contains($_SERVER['REQUEST_URI'], '/locaciones');
-      // Detecta si estamos en alguna parte de agentes
-      $esVistaAdmin       = str_contains($_SERVER['REQUEST_URI'], '/agencias');
-      // Detecta si estamos en alguna parte de agente aduanal
-      $esVistaPatente     = str_contains($_SERVER['REQUEST_URI'], '/patente');
-      // Detecta si estamos en alguna parte de vinculación
-      $esVistaVinculacion = str_contains($_SERVER['REQUEST_URI'], '/vinculaciones');
-    ?>
-
-    <!-- INICIO -->
-    <a href="/IMPORTADORES/agencias/dashboard"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/agencias/dashboard') ? 'active' : '' ?>">     
-      🏠 Inicio
-    </a>
-
-    <!-- SOLICITUDES VINCULACIÓN -->
-    <a href="/IMPORTADORES/vinculaciones/solicitudesVinculacion"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones/solicitudesVinculacion') ? 'active' : '' ?>">
-      🔗 Vinculación
-    </a>
-
-    <!-- USUARIOS ACTIVOS -->
-    <a href="/IMPORTADORES/vinculaciones/vinculacionesAgencia"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones/vinculacionesAgencia') ? 'active' : '' ?>">     
-      👥 Usuarios Vinculados
-    </a>
-
-    <!-- PATENTES -->
-    <?php if ($esVistaPatente): ?>
-      <?php $enDashboardPatente = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/patente/dashboard'; ?>
-      <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaPatente ? 'active' : '' ?>"
-        href="<?= $enDashboardPatente ? '#submenuAgentesAduanales' : 'IMPORTADORES/patente/dashboard' ?>"
-        <?= $enDashboardPatente ? 'data-bs-toggle="collapse"' : '' ?>
-        role="button" aria-expanded="true" aria-controls="submenuAgentesAduanales" 
-        onclick="<?= $enDashboardPatente ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/patente/dashboard\';' ?>">
-        📑 Patentes
-        <span class="badge bg-secondary">2</span>
-      </a>
-      <div class="collapse show" id="submenuAgentesAduanales">
-        <nav class="nav flex-column ms-3">
-          <a href="/IMPORTADORES/patente/lista"
-            class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/patente/lista' ? 'active' : '' ?>">
-            • Ver Patentes
+<div class="d-none d-md-block sidebar-container sidebar-dark position-fixed h-100" style="width: 250px; top: 0; padding-top: 4rem; z-index: 1000;">
+  <div class="px-3 py-4 h-100 overflow-y-auto">
+    <nav class="sidebar-nav">
+      <ul class="nav flex-column">
+        <!-- INICIO -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/agencias/dashboard" class="nav-link active">
+            <svg class="icon" fill="currentColor" viewBox="0 0 22 21">
+              <path d="M16.975 11H10V4.025a1 1 0 0 0-1.066-.998 8.5 8.5 0 1 0 9.039 9.039.999.999 0 0 0-1-1.066h.002Z"/>
+              <path d="M12.5 0c-.157 0-.311.01-.565.027A1 1 0 0 0 11 1.02V10h8.975a1 1 0 0 0 1-.935c.013-.188.028-.374.028-.565A8.51 8.51 0 0 0 12.5 0Z"/>
+            </svg>
+            <span>Inicio</span>
           </a>
-          <a href="/IMPORTADORES/patente/alta"
-            class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/patente/alta') ? 'active' : '' ?>">
-            • Nueva Patente
+        </li>
+        <!-- SOLICITUDES VINCULACIÓN -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/vinculaciones/solicitudesVinculacion" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4 0 005.656 0l3-3a4 4 0 00-5.656-5.656l-1.5 1.5a1 1 0 101.414 1.414l1.5-1.5z"/>
+              <path d="M7.414 15.414a2 2 0 01-2.828-2.828l3-3a2 2 0 012.828 0 1 1 0 001.414-1.414 4 4 0 00-5.656 0l-3 3a4 4 0 105.656 5.656l1.5-1.5a1 1 0 10-1.414-1.414l-1.5 1.5z"/>
+            </svg>
+            <span>Vinculación</span>
           </a>
-        </nav>
-      </div>
-    <?php elseif ($esVistaAdmin || $esVistaLocaciones || $esVistaVinculacion): ?>
-      <a href="/IMPORTADORES/patente/dashboard"
-        class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-        📑 Patentes
-        <span class="badge bg-secondary">2</span>
-      </a>
-    <?php endif; ?>
-
-    <!-- LOCACIONES -->
-    <?php if ($esVistaLocaciones): ?>
-      <?php $enDashboardLocaciones = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/locaciones/lista'; ?>
-      <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaLocaciones ? 'active' : '' ?>"
-        href="<?= $enDashboardLocaciones ? '#submenuLocaciones' : '/IMPORTADORES/locaciones/lista' ?>"
-        <?= $enDashboardLocaciones ? 'data-bs-toggle="collapse"' : '' ?>
-        role="button" aria-expanded="true" aria-controls="submenuLocaciones" 
-        onclick="<?= $enDashboardLocaciones ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/locaciones/lista\';' ?>">
-        🗺️ Locaciones
-        <span class="badge bg-secondary">2</span>
-      </a>
-      <div class="collapse show" id="submenuLocaciones">
-          <nav class="nav flex-column ms-3">
-            <a href="/IMPORTADORES/locaciones/lista"
-              class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/locaciones/lista' ? 'active' : '' ?>">
-              • Ver Locaciones
-            </a>
-            <a href="/IMPORTADORES/locaciones/alta"
-              class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/locaciones/alta') ? 'active' : '' ?>">
-              • Agregar Locaciones
-            </a>
-          </nav>
-        </div>
-    <?php elseif ($esVistaAdmin || $esVistaPatente || $esVistaVinculacion): ?>
-      <a href="/IMPORTADORES/locaciones/lista"
-        class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-        🗺️ Locaciones
-        <span class="badge bg-secondary">2</span>
-      </a>
-    <?php endif; ?>
-
-    <!-- ALTA DE AGENTES -->
-    <a href="/IMPORTADORES/agencias/alta"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/agencias/alta') ? 'active' : '' ?>">     
-      📥 Alta de Agentes
-    </a>
-
-    <!-- CONFIGURACIÓN -->
-    <a href="/IMPORTADORES/configuracion"
-       class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/configuracion') ? 'active' : '' ?>">
-      ⚙️ Configuración
-    </a>
-
-  </nav>
+        </li>
+        <!-- USUARIOS VINCULADOS -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/vinculaciones/vinculacionesAgencia" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M14 2a3.963 3.963 0 0 0-1.4.267 6.439 6.439 0 0 1-1.331 6.638A4 4 0 1 0 14 2Zm1 9h-1.264A6.957 6.957 0 0 1 15 15v2a2.97 2.97 0 0 1-.184 1H19a1 1 0 0 0 1-1v-1a5.006 5.006 0 0 0-5-5ZM6.5 9a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9ZM8 10H5a5.006 5.006 0 0 0-5 5v2a1 1 0 0 0 1 1h11a1 1 0 0 0 1-1v-2a5.006 5.006 0 0 0-5-5Z"/>
+            </svg>
+            <span>Usuarios Vinculados</span>
+          </a>
+        </li>
+        <!-- Patentes -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuPatentes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z" clip-rule="evenodd"/>
+            </svg>
+            <span>Patentes</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuPatentes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/patente/lista" class="nav-link">
+                  Ver Patentes
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/patente/alta" class="nav-link">
+                  Nueva Patente
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- LOCACIONES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuLocaciones" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M10 2C6.686 2 4 4.686 4 8c0 5.25 6 12 6 12s6-6.75 6-12c0-3.314-2.686-6-6-6zm0 8c-1.105 0-2-.895-2-2s.895-2 2-2 2 .895 2 2-.895 2-2 2z"/>
+            </svg>
+            <span>Locaciones</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuLocaciones">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/locaciones/lista" class="nav-link">
+                  Ver Locaciones
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/locaciones/alta" class="nav-link">
+                  Agregar Locaciones
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- ALTA DE AGENTES -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/agencias/alta" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clip-rule="evenodd"/>
+            </svg>
+            <span>Alta de agentes</span>
+          </a>
+        </li>
+        <!-- CONFIGURACIÓN -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/configuracion" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M5 5V.13a2.96 2.96 0 0 0-1.293.749L.879 3.707A2.96 2.96 0 0 0 .13 5H5Z"/>
+              <path d="M6.737 11.061a2.961 2.961 0 0 1 .81-1.515l6.117-6.116A4.839 4.839 0 0 1 16 2.141V2a1.97 1.97 0 0 0-1.933-2H7v5a2 2 0 0 1-2 2H0v11a1.969 1.969 0 0 0 1.933 2h12.134A1.97 1.97 0 0 0 16 18v-3.093l-1.546 1.546c-.413.413-.94.695-1.513.81l-3.4.679a2.947 2.947 0 0 1-1.85-.227 2.96 2.96 0 0 1-1.635-3.257l.681-3.397Z"/>
+            </svg>
+            <span>Configuración</span>
+          </a>
+        </li>
+      </ul>
+    </nav>
+  </div>
 </div>
 
 <!-- OFFCANVAS PARA MÓVILES -->
-<div class="offcanvas offcanvas-start d-md-none" tabindex="-1" id="sidebarMenu" style="top: 56px;">
+<div class="offcanvas offcanvas-start d-md-none" tabindex="-1" id="sidebarMenu" style="top: 0; width: 250px;">
   <div class="offcanvas-header">
     <h5 class="offcanvas-title">Menú</h5>
     <button type="button" class="btn-close" data-bs-dismiss="offcanvas"></button>
   </div>
   <div class="offcanvas-body">
-        
-    <!-- INICIO -->
-    <a href="/IMPORTADORES/agencias/dashboard"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/agencias/dashboard') ? 'active' : '' ?>">     
-      🏠 Inicio
-    </a>
-
-    <!-- SOLICITUDES VINCULACIÓN -->
-    <a href="/IMPORTADORES/vinculaciones/solicitudesVinculacion"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones/solicitudesVinculacion') ? 'active' : '' ?>">
-      🔗 Vinculación
-    </a>
-
-    <!-- USUARIOS ACTIVOS -->
-    <a href="/IMPORTADORES/vinculaciones/vinculacionesAgencia"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones/vinculacionesAgencia') ? 'active' : '' ?>">     
-      👥 Usuarios Vinculados
-    </a>
-
-    <!-- PATENTES -->
-    <?php if ($esVistaPatente): ?>
-      <?php $enDashboardPatente = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/patente/dashboard'; ?>
-      <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaPatente ? 'active' : '' ?>"
-        href="<?= $enDashboardPatente ? '#submenuAgentesAduanales' : 'IMPORTADORES/patente/dashboard' ?>"
-        <?= $enDashboardPatente ? 'data-bs-toggle="collapse"' : '' ?>
-        role="button" aria-expanded="true" aria-controls="submenuAgentesAduanales" 
-        onclick="<?= $enDashboardPatente ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/patente/dashboard\';' ?>">
-        📑 Patentes
-        <span class="badge bg-secondary">2</span>
-      </a>
-      <div class="collapse show" id="submenuAgentesAduanales">
-        <nav class="nav flex-column ms-3">
-          <a href="/IMPORTADORES/patente/lista"
-            class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/patente/lista' ? 'active' : '' ?>">
-            • Ver Patentes
+    <nav class="sidebar-nav">
+      <ul class="nav flex-column">
+        <!-- INICIO -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/agentes/dashboard" class="nav-link active">
+            <svg class="icon" fill="currentColor" viewBox="0 0 22 21">
+              <path d="M16.975 11H10V4.025a1 1 0 0 0-1.066-.998 8.5 8.5 0 1 0 9.039 9.039.999.999 0 0 0-1-1.066h.002Z"/>
+              <path d="M12.5 0c-.157 0-.311.01-.565.027A1 1 0 0 0 11 1.02V10h8.975a1 1 0 0 0 1-.935c.013-.188.028-.374.028-.565A8.51 8.51 0 0 0 12.5 0Z"/>
+            </svg>
+            <span>Inicio</span>
           </a>
-          <a href="/IMPORTADORES/patente/alta"
-            class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/patente/alta') ? 'active' : '' ?>">
-            • Nueva Patente
+        </li>
+        <!-- SOLICITUDES VINCULACIÓN -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/vinculaciones/solicitudesVinculacion" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4 0 005.656 0l3-3a4 4 0 00-5.656-5.656l-1.5 1.5a1 1 0 101.414 1.414l1.5-1.5z"/>
+              <path d="M7.414 15.414a2 2 0 01-2.828-2.828l3-3a2 2 0 012.828 0 1 1 0 001.414-1.414 4 4 0 00-5.656 0l-3 3a4 4 0 105.656 5.656l1.5-1.5a1 1 0 10-1.414-1.414l-1.5 1.5z"/>
+            </svg>
+            <span>Vinculación</span>
           </a>
-        </nav>
-      </div>
-    <?php elseif ($esVistaAdmin || $esVistaLocaciones || $esVistaVinculacion): ?>
-      <a href="/IMPORTADORES/patente/dashboard"
-        class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-        📑 Patentes
-        <span class="badge bg-secondary">2</span>
-      </a>
-    <?php endif; ?>
-
-    <!-- LOCACIONES -->
-    <?php if ($esVistaLocaciones): ?>
-      <?php $enDashboardLocaciones = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/locaciones/lista'; ?>
-      <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaLocaciones ? 'active' : '' ?>"
-        href="<?= $enDashboardLocaciones ? '#submenuLocaciones' : '/IMPORTADORES/locaciones/lista' ?>"
-        <?= $enDashboardLocaciones ? 'data-bs-toggle="collapse"' : '' ?>
-        role="button" aria-expanded="true" aria-controls="submenuLocaciones" 
-        onclick="<?= $enDashboardLocaciones ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/locaciones/lista\';' ?>">
-        🗺️ Locaciones
-        <span class="badge bg-secondary">2</span>
-      </a>
-      <div class="collapse show" id="submenuLocaciones">
-          <nav class="nav flex-column ms-3">
-            <a href="/IMPORTADORES/locaciones/lista"
-              class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/locaciones/lista' ? 'active' : '' ?>">
-              • Ver Locaciones
-            </a>
-            <a href="/IMPORTADORES/locaciones/alta"
-              class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/locaciones/alta') ? 'active' : '' ?>">
-              • Agregar Locaciones
-            </a>
-          </nav>
-        </div>
-    <?php elseif ($esVistaAdmin || $esVistaPatente || $esVistaVinculacion): ?>
-      <a href="/IMPORTADORES/locaciones/lista"
-        class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-        🗺️ Locaciones
-        <span class="badge bg-secondary">2</span>
-      </a>
-    <?php endif; ?>
-
-    <!-- ALTA DE AGENTES -->
-    <a href="/IMPORTADORES/agencias/alta"
-      class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/agencias/alta') ? 'active' : '' ?>">     
-      📥 Alta de Agentes
-    </a>
-
-    <!-- CONFIGURACIÓN -->
-    <a href="/IMPORTADORES/configuracion"
-       class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/configuracion') ? 'active' : '' ?>">
-      ⚙️ Configuración
-    </a>
-
+        </li>
+        <!-- USUARIOS VINCULADOS -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/vinculaciones/vinculacionesAgencia" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M14 2a3.963 3.963 0 0 0-1.4.267 6.439 6.439 0 0 1-1.331 6.638A4 4 0 1 0 14 2Zm1 9h-1.264A6.957 6.957 0 0 1 15 15v2a2.97 2.97 0 0 1-.184 1H19a1 1 0 0 0 1-1v-1a5.006 5.006 0 0 0-5-5ZM6.5 9a4.5 4.5 0 1 0 0-9 4.5 4.5 0 0 0 0 9ZM8 10H5a5.006 5.006 0 0 0-5 5v2a1 1 0 0 0 1 1h11a1 1 0 0 0 1-1v-2a5.006 5.006 0 0 0-5-5Z"/>
+            </svg>
+            <span>Usuarios Vinculados</span>
+          </a>
+        </li>
+        <!-- Patentes -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuPatentes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z" clip-rule="evenodd"/>
+            </svg>
+            <span>Patentes</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuPatentes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/patente/lista" class="nav-link">
+                  Ver Patentes
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/patente/alta" class="nav-link">
+                  Nueva Patente
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- LOCACIONES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuLocaciones" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M10 2C6.686 2 4 4.686 4 8c0 5.25 6 12 6 12s6-6.75 6-12c0-3.314-2.686-6-6-6zm0 8c-1.105 0-2-.895-2-2s.895-2 2-2 2 .895 2 2-.895 2-2 2z"/>
+            </svg>
+            <span>Locaciones</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuLocaciones">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/locaciones/lista" class="nav-link">
+                  Ver Locaciones
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/locaciones/alta" class="nav-link">
+                  Agregar Locaciones
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- ALTA DE AGENTES -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/agencias/alta" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clip-rule="evenodd"/>
+            </svg>
+            <span>Alta de agentes</span>
+          </a>
+        </li>
+        <!-- CONFIGURACIÓN -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/configuracion" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M5 5V.13a2.96 2.96 0 0 0-1.293.749L.879 3.707A2.96 2.96 0 0 0 .13 5H5Z"/>
+              <path d="M6.737 11.061a2.961 2.961 0 0 1 .81-1.515l6.117-6.116A4.839 4.839 0 0 1 16 2.141V2a1.97 1.97 0 0 0-1.933-2H7v5a2 2 0 0 1-2 2H0v11a1.969 1.969 0 0 0 1.933 2h12.134A1.97 1.97 0 0 0 16 18v-3.093l-1.546 1.546c-.413.413-.94.695-1.513.81l-3.4.679a2.947 2.947 0 0 1-1.85-.227 2.96 2.96 0 0 1-1.635-3.257l.681-3.397Z"/>
+            </svg>
+            <span>Configuración</span>
+          </a>
+        </li>
+      </ul>
+    </nav>
   </div>
-</div>
\ No newline at end of file
+</div>
+
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+<script>
+  // Simular lógica de dashboard
+  document.addEventListener('DOMContentLoaded', function() {
+    const esDashboard = window.location.pathname.includes('/administrador/dashboard');
+    const welcomeText = document.getElementById('welcome-text');
+    const logoutBtn   = document.getElementById('logout-btn');
+        
+    if (!esDashboard) {
+      welcomeText.style.display = 'none';
+      logoutBtn.style.display   = 'inline-block';
+    }
+        
+    // Manejar estados activos basados en URL actual
+    const currentPath = window.location.pathname;
+    const navLinks    = document.querySelectorAll('.nav-link');
+        
+    navLinks.forEach(link => {
+      const href = link.getAttribute('href');
+      if (href && currentPath.includes(href)) {
+        link.classList.add('active');
+      }
+    });
+        
+    // Manejar collapse manualmente
+    document.querySelectorAll('[data-bs-toggle="collapse"]').forEach(trigger => {
+      trigger.addEventListener('click', function(e) {
+        e.preventDefault();
+        e.stopPropagation();
+                
+        const targetId      = this.getAttribute('href');
+        const targetElement = document.querySelector(targetId);
+        const isExpanded    = this.getAttribute('aria-expanded') === 'true';
+                
+        if (targetElement) {
+          if (isExpanded) {
+            // Cerrar
+            targetElement.classList.remove('show');
+            this.setAttribute('aria-expanded', 'false');
+          } else {
+            // Abrir
+            targetElement.classList.add('show');
+            this.setAttribute('aria-expanded', 'true');
+          }
+        }
+      });
+            
+      // Remover el atributo data-bs-toggle para evitar conflictos
+      trigger.removeAttribute('data-bs-toggle');
+    });
+  });
+</script>
\ No newline at end of file
diff --git a/views/partials/sidebar_agente.php b/views/partials/sidebar_agente.php
index c173c8a..67d5ceb 100644
--- a/views/partials/sidebar_agente.php
+++ b/views/partials/sidebar_agente.php
@@ -1,12 +1,49 @@
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+
 <style>
-  .nav .nav-link { font-weight: normal; color: white; transition: all 0.3s ease; }
-  .nav .nav-link:hover,
-  .nav .nav-link.active { background-color: #495057; color: #fff; }
-  /* Estilo inverso solo para pantallas pequeñas (sidebar tipo offcanvas) */
+  /* Estilos inspirados en Tailwind */
+  .sidebar-container { background-color: #f9fafb; border-right: 1px solid #e5e7eb; }
+  .sidebar-dark { background-color: #1f2937; border-right: 1px solid #374151; }
+  .sidebar-nav .nav-link { color: #374151; font-weight: 500; padding: 0.5rem 0.75rem; margin-bottom: 0.125rem;
+    border-radius: 0.5rem; transition: all 0.15s ease-in-out; display: flex; align-items: center; }
+  .sidebar-nav .nav-link:hover { background-color: #f3f4f6; color: #111827; }
+  .sidebar-nav .nav-link.active { background-color: #f3f4f6; color: #111827; }
+  .sidebar-nav .nav-link .icon { width: 1.25rem; height: 1.25rem; margin-right: 0.75rem; color: #6b7280; transition: color 0.15s ease-in-out; flex-shrink: 0; }
+  .sidebar-nav .nav-link:hover .icon,
+  .sidebar-nav .nav-link.active .icon { color: #374151; }
+  .sidebar-nav .badge { background-color: #f3f4f6; color: #374151; font-size: 0.75rem; font-weight: 500; padding: 0.25rem 0.5rem; border-radius: 9999px; margin-left: auto; }
+  .sidebar-nav .badge.badge-primary { background-color: #dbeafe; color: #1e40af; }
+  .submenu .nav-link { padding-left: 2.75rem; color: #6b7280; font-weight: 400; }
+  .submenu .nav-link:hover { background-color: #f3f4f6; color: #374151; }
+  .submenu .nav-link.active { background-color: #f3f4f6; color: #374151; }
+  .collapse-icon { width: 0.75rem; height: 0.75rem; margin-left: auto; transition: transform 0.15s ease-in-out; }
+  .nav-link[aria-expanded="true"] .collapse-icon { transform: rotate(180deg); }
+  /* Estilos para modo oscuro */
+  .sidebar-dark .sidebar-nav .nav-link { color: #d1d5db; }
+  .sidebar-dark .sidebar-nav .nav-link:hover { background-color: #374151; color: #ffffff; }
+  .sidebar-dark .sidebar-nav .nav-link.active { background-color: #374151; color: #ffffff; }
+  .sidebar-dark .sidebar-nav .nav-link .icon { color: #9ca3af; }
+  .sidebar-dark .sidebar-nav .nav-link:hover .icon,
+  .sidebar-dark .sidebar-nav .nav-link.active .icon { color: #ffffff; }
+  .sidebar-dark .sidebar-nav .badge { background-color: #374151; color: #d1d5db; }
+  .sidebar-dark .sidebar-nav .badge.badge-primary { background-color: #1e3a8a; color: #93c5fd; }
+  .sidebar-dark .submenu .nav-link { color: #9ca3af; }
+  .sidebar-dark .submenu .nav-link:hover { background-color: #374151; color: #d1d5db; }
+  .sidebar-dark .submenu .nav-link.active { background-color: #374151; color: #d1d5db; }
+  /* Navbar */
+  .navbar-brand { font-weight: 600; font-size: 1.125rem; }
+  .menu-toggle { border: 1px solid #6b7280; border-radius: 0.5rem; padding: 0.5rem; transition: all 0.15s ease-in-out; }
+  .menu-toggle:hover { background-color: #f3f4f6; }
+  /* Offcanvas para móviles */
+  .offcanvas { background-color: #ffffff; }
+  .offcanvas-header { border-bottom: 1px solid #e5e7eb; padding: 1rem 1.5rem; }
+  .offcanvas-title { font-weight: 600; font-size: 1.125rem; color: #111827; }
+  .offcanvas-body { padding: 1rem 1.5rem; }
+  /* Responsive adjustments */
   @media (max-width: 767.98px) {
-    .nav .nav-link { font-weight: normal; color: #343a40; background-color: transparent; }
-    .nav .nav-link:hover,
-    .nav .nav-link.active { background-color: #e9ecef; color: #212529; }
+    .sidebar-nav .nav-link { color: #374151; }
+    .sidebar-nav .nav-link:hover { background-color: #f3f4f6; color: #111827; }
+    .sidebar-nav .nav-link.active { background-color: #f3f4f6; color: #111827; }
   }
 </style>
 
@@ -14,207 +51,263 @@
 <nav class="navbar navbar-dark bg-dark fixed-top">
   <div class="container-fluid">
     <!-- Botón de menú para móviles -->
-    <button class="btn btn-outline-light d-md-none me-2" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
+    <button class="menu-toggle d-md-none me-3" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
       ☰
     </button>
     <span class="navbar-brand">SIIH | Agente Aduanal</span>
     <div class="d-flex ms-auto text-white">
-      <?php
-      // Verifica si estás en el dashboard principal del importador
-      $esDashboard = str_contains($_SERVER['REQUEST_URI'], '/agentes/dashboard');
+      <div class="navbar-content">
+        <?php
+        // Verifica si estás en el dashboard principal del importador
+        $esDashboard = str_contains($_SERVER['REQUEST_URI'], '/agentes/dashboard');
 
-      if ($esDashboard): ?>
-        Bienvenido, <?= htmlspecialchars($_SESSION['usuario_nombre']) ?>
-      <?php else: ?>
-        <a href="/IMPORTADORES/sistemas/logout" class="btn btn-outline-light btn-sm ms-2 W-auto btn-animated">Cerrar Sesión</a>
-      <?php endif; ?>
+        if ($esDashboard): ?>
+          <span id="welcome-text">Bienvenido, <?= htmlspecialchars($_SESSION['usuario_nombre']) ?></span>
+        <?php else: ?>
+          <a href="/IMPORTADORES/sistemas/logout" class="btn btn-outline-light btn-sm ms-2 W-auto btn-animated">Cerrar Sesión</a>
+        <?php endif; ?>
+      </div>
     </div>
   </div>
 </nav>
 
 <!-- SIDEBAR FIJA (escritorio) -->
-<div class="d-none d-md-block bg-dark text-white position-fixed h-100 pt-5" style="width: 250px;">
-  <nav class="nav flex-column">
-
-    <?php
-      // Detecta si estamos en alguna parte de locaciones
-      $esVistaLocaciones = str_contains($_SERVER['REQUEST_URI'], '/locaciones');
-      // Detecta si estamos en alguna parte de agentes
-      $esVistaAgentes    = str_contains($_SERVER['REQUEST_URI'], '/agentes');
-      // Detecta si estamos en alguna parte de agente aduanal
-      $esVistaPatente    = str_contains($_SERVER['REQUEST_URI'], '/patente');
-    ?>
-
-    <!-- INICIO -->
-    <a href="/IMPORTADORES/agentes/dashboard"
-      class="nav-link px-3 py-2 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/agentes/dashboard' ? 'active' : '' ?>">     
-      🏠 Inicio
-    </a>
-
-    <!-- IMPORTADORES VINCULADOS -->
-    <a href="/IMPORTADORES/agentes/vinculados"
-      class="nav-link px-3 py-2 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/agentes/vinculados' ? 'active' : '' ?>">     
-      🔗 Vinculados
-    </a>
-
-    <!-- Patentes -->
-    <?php if ($esVistaPatente): ?>
-      <?php $enDashboardPatente = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/patente/dashboard'; ?>
-      <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaPatente ? 'active' : '' ?>"
-        href="<?= $enDashboardPatente ? '#submenuAgentesAduanales' : 'IMPORTADORES/patente/dashboard' ?>"
-        <?= $enDashboardPatente ? 'data-bs-toggle="collapse"' : '' ?>
-        role="button" aria-expanded="true" aria-controls="submenuAgentesAduanales" 
-        onclick="<?= $enDashboardPatente ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/patente/dashboard\';' ?>">
-        📑 Patentes
-        <span class="badge bg-secondary">2</span>
-      </a>
-      <div class="collapse show" id="submenuAgentesAduanales">
-        <nav class="nav flex-column ms-3">
-          <a href="/IMPORTADORES/patente/lista"
-            class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/patente/lista' ? 'active' : '' ?>">
-            • Ver Patentes
+<div class="d-none d-md-block sidebar-container sidebar-dark position-fixed h-100" style="width: 250px; top: 0; padding-top: 4rem; z-index: 1000;">
+  <div class="px-3 py-4 h-100 overflow-y-auto">
+    <nav class="sidebar-nav">
+      <ul class="nav flex-column">
+        <!-- INICIO -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/agentes/dashboard" class="nav-link active">
+            <svg class="icon" fill="currentColor" viewBox="0 0 22 21">
+              <path d="M16.975 11H10V4.025a1 1 0 0 0-1.066-.998 8.5 8.5 0 1 0 9.039 9.039.999.999 0 0 0-1-1.066h.002Z"/>
+              <path d="M12.5 0c-.157 0-.311.01-.565.027A1 1 0 0 0 11 1.02V10h8.975a1 1 0 0 0 1-.935c.013-.188.028-.374.028-.565A8.51 8.51 0 0 0 12.5 0Z"/>
+            </svg>
+            <span>Inicio</span>
           </a>
-          <a href="/IMPORTADORES/patente/alta"
-            class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/patente/alta') ? 'active' : '' ?>">
-            • Nueva Patente
+        </li>
+        <!-- IMPORTADORES VINCULADOS -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/agentes/vinculados" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4 0 005.656 0l3-3a4 4 0 00-5.656-5.656l-1.5 1.5a1 1 0 101.414 1.414l1.5-1.5z"/>
+              <path d="M7.414 15.414a2 2 0 01-2.828-2.828l3-3a2 2 0 012.828 0 1 1 0 001.414-1.414 4 4 0 00-5.656 0l-3 3a4 4 0 105.656 5.656l1.5-1.5a1 1 0 10-1.414-1.414l-1.5 1.5z"/>
+            </svg>
+            <span>Vinculación</span>
           </a>
-        </nav>
-      </div>
-    <?php elseif ($esVistaAgentes || $esVistaLocaciones): ?>
-      <a href="/IMPORTADORES/patente/dashboard"
-        class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-        📑 Patentes
-        <span class="badge bg-secondary">2</span>
-      </a>
-    <?php endif; ?>
-
-    <!-- LOCACIONES -->
-    <?php if ($esVistaLocaciones): ?>
-      <?php $enDashboardLocaciones = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/locaciones/lista'; ?>
-      <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaLocaciones ? 'active' : '' ?>"
-        href="<?= $enDashboardLocaciones ? '#submenuLocaciones' : '/IMPORTADORES/locaciones/lista' ?>"
-        <?= $enDashboardLocaciones ? 'data-bs-toggle="collapse"' : '' ?>
-        role="button" aria-expanded="true" aria-controls="submenuLocaciones" 
-        onclick="<?= $enDashboardLocaciones ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/locaciones/lista\';' ?>">
-        🗺️ Locaciones
-        <span class="badge bg-secondary">2</span>
-      </a>
-      <div class="collapse show" id="submenuLocaciones">
-          <nav class="nav flex-column ms-3">
-            <a href="/IMPORTADORES/locaciones/lista"
-              class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/locaciones/lista' ? 'active' : '' ?>">
-              • Ver Locaciones
-            </a>
-            <a href="/IMPORTADORES/locaciones/alta"
-              class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/locaciones/alta') ? 'active' : '' ?>">
-              • Agregar Locaciones
-            </a>
-          </nav>
-        </div>
-    <?php elseif ($esVistaAgentes || $esVistaPatente): ?>
-      <a href="/IMPORTADORES/locaciones/lista"
-        class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-        🗺️ Locaciones
-        <span class="badge bg-secondary">2</span>
-      </a>
-    <?php endif; ?>
-
-    <!-- CONFIGURACIÓN -->
-    <a href="/IMPORTADORES/configuracion"
-       class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/configuracion') ? 'active' : '' ?>">
-      ⚙️ Configuración
-    </a>
-
-  </nav>
+        </li>
+        <!-- Patentes -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuPatentes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z" clip-rule="evenodd"/>
+            </svg>
+            <span>Patentes</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuPatentes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/patente/lista" class="nav-link">
+                  Ver Patentes
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/patente/alta" class="nav-link">
+                  Nueva Patente
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- LOCACIONES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuLocaciones" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M10 2C6.686 2 4 4.686 4 8c0 5.25 6 12 6 12s6-6.75 6-12c0-3.314-2.686-6-6-6zm0 8c-1.105 0-2-.895-2-2s.895-2 2-2 2 .895 2 2-.895 2-2 2z"/>
+            </svg>
+            <span>Locaciones</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuLocaciones">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/locaciones/lista" class="nav-link">
+                  Ver Locaciones
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/locaciones/alta" class="nav-link">
+                  Agregar Locaciones
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- CONFIGURACIÓN -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/configuracion" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M5 5V.13a2.96 2.96 0 0 0-1.293.749L.879 3.707A2.96 2.96 0 0 0 .13 5H5Z"/>
+              <path d="M6.737 11.061a2.961 2.961 0 0 1 .81-1.515l6.117-6.116A4.839 4.839 0 0 1 16 2.141V2a1.97 1.97 0 0 0-1.933-2H7v5a2 2 0 0 1-2 2H0v11a1.969 1.969 0 0 0 1.933 2h12.134A1.97 1.97 0 0 0 16 18v-3.093l-1.546 1.546c-.413.413-.94.695-1.513.81l-3.4.679a2.947 2.947 0 0 1-1.85-.227 2.96 2.96 0 0 1-1.635-3.257l.681-3.397Z"/>
+            </svg>
+            <span>Configuración</span>
+          </a>
+        </li>
+      </ul>
+    </nav>
+  </div>
 </div>
 
 <!-- OFFCANVAS PARA MÓVILES -->
-<div class="offcanvas offcanvas-start d-md-none" tabindex="-1" id="sidebarMenu" style="top: 56px;">
+<div class="offcanvas offcanvas-start d-md-none" tabindex="-1" id="sidebarMenu" style="top: 0; width: 250px;">
   <div class="offcanvas-header">
     <h5 class="offcanvas-title">Menú</h5>
     <button type="button" class="btn-close" data-bs-dismiss="offcanvas"></button>
   </div>
   <div class="offcanvas-body">
-        
-    <!-- INICIO -->
-    <a href="/IMPORTADORES/agentes/dashboard"
-      class="nav-link px-3 py-2 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/agentes/dashboard' ? 'active' : '' ?>">     
-      🏠 Inicio
-    </a>
-
-    <!-- IMPORTADORES VINCULADOS -->
-    <a href="/IMPORTADORES/agentes/vinculados"
-      class="nav-link px-3 py-2 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/agentes/vinculados' ? 'active' : '' ?>">     
-      🔗 Vinculados
-    </a>
-
-    <!-- Patentes -->
-    <?php if ($esVistaPatente): ?>
-      <?php $enDashboardPatente = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/patente/dashboard'; ?>
-      <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaPatente ? 'active' : '' ?>"
-        href="<?= $enDashboardPatente ? '#submenuAgentesAduanales' : 'IMPORTADORES/patente/dashboard' ?>"
-        <?= $enDashboardPatente ? 'data-bs-toggle="collapse"' : '' ?>
-        role="button" aria-expanded="true" aria-controls="submenuAgentesAduanales" 
-        onclick="<?= $enDashboardPatente ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/patente/dashboard\';' ?>">
-        📑 Patentes
-        <span class="badge bg-secondary">2</span>
-      </a>
-      <div class="collapse show" id="submenuAgentesAduanales">
-        <nav class="nav flex-column ms-3">
-          <a href="/IMPORTADORES/patente/lista"
-            class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/patente/lista' ? 'active' : '' ?>">
-            • Ver Patentes
+    <nav class="sidebar-nav">
+      <ul class="nav flex-column">
+        <!-- INICIO -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/agentes/dashboard" class="nav-link active">
+            <svg class="icon" fill="currentColor" viewBox="0 0 22 21">
+              <path d="M16.975 11H10V4.025a1 1 0 0 0-1.066-.998 8.5 8.5 0 1 0 9.039 9.039.999.999 0 0 0-1-1.066h.002Z"/>
+              <path d="M12.5 0c-.157 0-.311.01-.565.027A1 1 0 0 0 11 1.02V10h8.975a1 1 0 0 0 1-.935c.013-.188.028-.374.028-.565A8.51 8.51 0 0 0 12.5 0Z"/>
+            </svg>
+            <span>Inicio</span>
           </a>
-          <a href="/IMPORTADORES/patente/alta"
-            class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/patente/alta') ? 'active' : '' ?>">
-            • Nueva Patente
+        </li>
+        <!-- IMPORTADORES VINCULADOS -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/agentes/vinculados" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4 0 005.656 0l3-3a4 4 0 00-5.656-5.656l-1.5 1.5a1 1 0 101.414 1.414l1.5-1.5z"/>
+              <path d="M7.414 15.414a2 2 0 01-2.828-2.828l3-3a2 2 0 012.828 0 1 1 0 001.414-1.414 4 4 0 00-5.656 0l-3 3a4 4 0 105.656 5.656l1.5-1.5a1 1 0 10-1.414-1.414l-1.5 1.5z"/>
+            </svg>
+            <span>Vinculación</span>
           </a>
-        </nav>
-      </div>
-    <?php elseif ($esVistaAgentes || $esVistaLocaciones): ?>
-      <a href="/IMPORTADORES/patente/dashboard"
-        class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-        📑 Patentes
-        <span class="badge bg-secondary">2</span>
-      </a>
-    <?php endif; ?>
-
-    <!-- LOCACIONES -->
-    <?php if ($esVistaLocaciones): ?>
-      <?php $enDashboardLocaciones = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/locaciones/lista'; ?>
-      <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaLocaciones ? 'active' : '' ?>"
-        href="<?= $enDashboardLocaciones ? '#submenuLocaciones' : '/IMPORTADORES/locaciones/lista' ?>"
-        <?= $enDashboardLocaciones ? 'data-bs-toggle="collapse"' : '' ?>
-        role="button" aria-expanded="true" aria-controls="submenuLocaciones" 
-        onclick="<?= $enDashboardLocaciones ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/locaciones/lista\';' ?>">
-        🗺️ Locaciones
-        <span class="badge bg-secondary">2</span>
-      </a>
-      <div class="collapse show" id="submenuLocaciones">
-          <nav class="nav flex-column ms-3">
-            <a href="/IMPORTADORES/locaciones/lista"
-              class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/locaciones/lista' ? 'active' : '' ?>">
-              • Ver Locaciones
-            </a>
-            <a href="/IMPORTADORES/locaciones/alta"
-              class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/locaciones/alta') ? 'active' : '' ?>">
-              • Agregar Locaciones
-            </a>
-          </nav>
-        </div>
-    <?php elseif ($esVistaAgentes || $esVistaPatente): ?>
-      <a href="/IMPORTADORES/locaciones/lista"
-        class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-        🗺️ Locaciones
-        <span class="badge bg-secondary">2</span>
-      </a>
-    <?php endif; ?>
-
-    <!-- CONFIGURACIÓN -->
-    <a href="/IMPORTADORES/configuracion"
-       class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/configuracion') ? 'active' : '' ?>">
-      ⚙️ Configuración
-    </a>
-
+        </li>
+        <!-- Patentes -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuPatentes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z" clip-rule="evenodd"/>
+            </svg>
+            <span>Patentes</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuPatentes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/patente/lista" class="nav-link">
+                  Ver Patentes
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/patente/alta" class="nav-link">
+                  Nueva Patente
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- LOCACIONES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuLocaciones" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M10 2C6.686 2 4 4.686 4 8c0 5.25 6 12 6 12s6-6.75 6-12c0-3.314-2.686-6-6-6zm0 8c-1.105 0-2-.895-2-2s.895-2 2-2 2 .895 2 2-.895 2-2 2z"/>
+            </svg>
+            <span>Locaciones</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuLocaciones">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/locaciones/lista" class="nav-link">
+                  Ver Locaciones
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/locaciones/alta" class="nav-link">
+                  Agregar Locaciones
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- CONFIGURACIÓN -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/configuracion" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M5 5V.13a2.96 2.96 0 0 0-1.293.749L.879 3.707A2.96 2.96 0 0 0 .13 5H5Z"/>
+              <path d="M6.737 11.061a2.961 2.961 0 0 1 .81-1.515l6.117-6.116A4.839 4.839 0 0 1 16 2.141V2a1.97 1.97 0 0 0-1.933-2H7v5a2 2 0 0 1-2 2H0v11a1.969 1.969 0 0 0 1.933 2h12.134A1.97 1.97 0 0 0 16 18v-3.093l-1.546 1.546c-.413.413-.94.695-1.513.81l-3.4.679a2.947 2.947 0 0 1-1.85-.227 2.96 2.96 0 0 1-1.635-3.257l.681-3.397Z"/>
+            </svg>
+            <span>Configuración</span>
+          </a>
+        </li>
+      </ul>
+    </nav>
   </div>
-</div>
\ No newline at end of file
+</div>
+
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+<script>
+  // Simular lógica de dashboard
+  document.addEventListener('DOMContentLoaded', function() {
+    const esDashboard = window.location.pathname.includes('/administrador/dashboard');
+    const welcomeText = document.getElementById('welcome-text');
+    const logoutBtn   = document.getElementById('logout-btn');
+        
+    if (!esDashboard) {
+      welcomeText.style.display = 'none';
+      logoutBtn.style.display   = 'inline-block';
+    }
+        
+    // Manejar estados activos basados en URL actual
+    const currentPath = window.location.pathname;
+    const navLinks    = document.querySelectorAll('.nav-link');
+        
+    navLinks.forEach(link => {
+      const href = link.getAttribute('href');
+      if (href && currentPath.includes(href)) {
+        link.classList.add('active');
+      }
+    });
+        
+    // Manejar collapse manualmente
+    document.querySelectorAll('[data-bs-toggle="collapse"]').forEach(trigger => {
+      trigger.addEventListener('click', function(e) {
+        e.preventDefault();
+        e.stopPropagation();
+                
+        const targetId      = this.getAttribute('href');
+        const targetElement = document.querySelector(targetId);
+        const isExpanded    = this.getAttribute('aria-expanded') === 'true';
+                
+        if (targetElement) {
+          if (isExpanded) {
+            // Cerrar
+            targetElement.classList.remove('show');
+            this.setAttribute('aria-expanded', 'false');
+          } else {
+            // Abrir
+            targetElement.classList.add('show');
+            this.setAttribute('aria-expanded', 'true');
+          }
+        }
+      });
+            
+      // Remover el atributo data-bs-toggle para evitar conflictos
+      trigger.removeAttribute('data-bs-toggle');
+    });
+  });
+</script>
\ No newline at end of file
diff --git a/views/partials/sidebar_configuracion.php b/views/partials/sidebar_configuracion.php
index d04d5ec..8a60a5d 100644
--- a/views/partials/sidebar_configuracion.php
+++ b/views/partials/sidebar_configuracion.php
@@ -8,8 +8,7 @@ if (!isset($_SESSION['usuario_id'])) {
 
 // Obtener información del usuario
 $tipoUsuario = $_SESSION['tipo_usuario'] ?? '';
-$agenciaId   = $_SESSION['agencia_id'] ?? null;
-$usuarioId   = $_SESSION['usuario_id'] ?? null;
+$usuarioId   = $_SESSION['usuario_id']   ?? null;
 
 // Definir permisos por tipo de usuario
 $permisos = [
@@ -82,6 +81,15 @@ function contarBitacorasDisponibles($permisosBitacoras) {
 
 $cantidadBitacoras = contarBitacorasDisponibles($permisosBitacoras);
 
+// Variables para detectar las vistas actuales
+$currentPath             = $_SERVER['REQUEST_URI'];
+$esConfiguracion         = $currentPath === '/IMPORTADORES/configuracion/index' || $currentPath === '/IMPORTADORES/configuracion';
+$esVistaAutomatizaciones = strpos($currentPath, '/IMPORTADORES/automatizaciones/') === 0;
+$esVistaPreferencias     = strpos($currentPath, '/IMPORTADORES/preferencias/')     === 0;
+$esVistaSeguridad        = strpos($currentPath, '/IMPORTADORES/seguridad/')        === 0;
+$esVistaBitacoras        = strpos($currentPath, '/IMPORTADORES/bitacoras/')        === 0 && $currentPath !== '/IMPORTADORES/configuracion';
+$esVistaReset            = strpos($currentPath, '/IMPORTADORES/reset/')            === 0;
+
 // Función para obtener el texto descriptivo según el permiso
 function obtenerTextoPermiso($permiso, $tipoUsuario) {
     $textos = [
@@ -98,22 +106,6 @@ function obtenerTextoPermiso($permiso, $tipoUsuario) {
     return $textos[$permiso] ?? ucfirst(str_replace('_', ' ', $permiso));
 }
 
-// Función para obtener el icono según el permiso
-function obtenerIconoPermiso($permiso) {
-    $iconos = [
-        'registro_accesos'        => '🌐',
-        'registro_cambios'        => '🔄',
-        'registro_usuarios'       => '👥',
-        'registro_agencias'       => '🏪',
-        'acceso_usuarios_agencia' => '👥',
-        'registro_vinculaciones'  => '🔗',
-        'mi_actividad'            => '👤',
-        'vinculaciones_usuario'   => '🔗'
-    ];
-    
-    return $iconos[$permiso] ?? '📋';
-}
-
 // Función para obtener la URL según el permiso
 function obtenerUrlPermiso($permiso) {
     $urls = [
@@ -131,15 +123,52 @@ function obtenerUrlPermiso($permiso) {
 }
 ?>
 
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+
 <style>
-  .nav .nav-link { font-weight: normal; color: white; transition: all 0.3s ease; }
-  .nav .nav-link:hover,
-  .nav .nav-link.active { background-color: #495057; color: #fff; }
-  /* Estilo inverso solo para pantallas pequeñas (sidebar tipo offcanvas) */
-  @media (max-width: 767.98px) { 
-    .nav .nav-link { font-weight: normal; color: #343a40; background-color: transparent; }
-    .nav .nav-link:hover,
-    .nav .nav-link.active { background-color: #e9ecef; color: #212529; }
+  /* Estilos inspirados en Tailwind */
+  .sidebar-container { background-color: #f9fafb; border-right: 1px solid #e5e7eb; }
+  .sidebar-dark { background-color: #1f2937; border-right: 1px solid #374151; }
+  .sidebar-nav .nav-link { color: #374151; font-weight: 500; padding: 0.5rem 0.75rem; margin-bottom: 0.125rem;
+    border-radius: 0.5rem; transition: all 0.15s ease-in-out; display: flex; align-items: center; }
+  .sidebar-nav .nav-link:hover { background-color: #f3f4f6; color: #111827; }
+  .sidebar-nav .nav-link.active { background-color: #f3f4f6; color: #111827; }
+  .sidebar-nav .nav-link .icon { width: 1.25rem; height: 1.25rem; margin-right: 0.75rem; color: #6b7280; transition: color 0.15s ease-in-out; flex-shrink: 0; }
+  .sidebar-nav .nav-link:hover .icon,
+  .sidebar-nav .nav-link.active .icon { color: #374151; }
+  .sidebar-nav .badge { background-color: #f3f4f6; color: #374151; font-size: 0.75rem; font-weight: 500; padding: 0.25rem 0.5rem; border-radius: 9999px; margin-left: auto; }
+  .sidebar-nav .badge.badge-primary { background-color: #dbeafe; color: #1e40af; }
+  .submenu .nav-link { padding-left: 2.75rem; color: #6b7280; font-weight: 400; }
+  .submenu .nav-link:hover { background-color: #f3f4f6; color: #374151; }
+  .submenu .nav-link.active { background-color: #f3f4f6; color: #374151; }
+  .collapse-icon { width: 0.75rem; height: 0.75rem; margin-left: auto; transition: transform 0.15s ease-in-out; }
+  .nav-link[aria-expanded="true"] .collapse-icon { transform: rotate(180deg); }
+  /* Estilos para modo oscuro */
+  .sidebar-dark .sidebar-nav .nav-link { color: #d1d5db; }
+  .sidebar-dark .sidebar-nav .nav-link:hover { background-color: #374151; color: #ffffff; }
+  .sidebar-dark .sidebar-nav .nav-link.active { background-color: #374151; color: #ffffff; }
+  .sidebar-dark .sidebar-nav .nav-link .icon { color: #9ca3af; }
+  .sidebar-dark .sidebar-nav .nav-link:hover .icon,
+  .sidebar-dark .sidebar-nav .nav-link.active .icon { color: #ffffff; }
+  .sidebar-dark .sidebar-nav .badge { background-color: #374151; color: #d1d5db; }
+  .sidebar-dark .sidebar-nav .badge.badge-primary { background-color: #1e3a8a; color: #93c5fd; }
+  .sidebar-dark .submenu .nav-link { color: #9ca3af; }
+  .sidebar-dark .submenu .nav-link:hover { background-color: #374151; color: #d1d5db; }
+  .sidebar-dark .submenu .nav-link.active { background-color: #374151; color: #d1d5db; }
+  /* Navbar */
+  .navbar-brand { font-weight: 600; font-size: 1.125rem; }
+  .menu-toggle { border: 1px solid #6b7280; border-radius: 0.5rem; padding: 0.5rem; transition: all 0.15s ease-in-out; }
+  .menu-toggle:hover { background-color: #f3f4f6; }
+  /* Offcanvas para móviles */
+  .offcanvas { background-color: #ffffff; }
+  .offcanvas-header { border-bottom: 1px solid #e5e7eb; padding: 1rem 1.5rem; }
+  .offcanvas-title { font-weight: 600; font-size: 1.125rem; color: #111827; }
+  .offcanvas-body { padding: 1rem 1.5rem; }
+  /* Responsive adjustments */
+  @media (max-width: 767.98px) {
+    .sidebar-nav .nav-link { color: #374151; }
+    .sidebar-nav .nav-link:hover { background-color: #f3f4f6; color: #111827; }
+    .sidebar-nav .nav-link.active { background-color: #f3f4f6; color: #111827; }
     .permission-scope { background-color: rgba(108, 117, 125, 0.2); }
     .submenu-item:hover { background-color: rgba(233, 236, 239, 0.8) !important; }
   }
@@ -154,7 +183,7 @@ function obtenerUrlPermiso($permiso) {
 <nav class="navbar navbar-dark bg-dark fixed-top">
   <div class="container-fluid">
     <!-- Botón de menú para móviles -->
-    <button class="btn btn-outline-light d-md-none me-2" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
+    <button class="menu-toggle d-md-none me-3" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
       ☰
     </button>
     <span class="navbar-brand">
@@ -180,309 +209,224 @@ function obtenerUrlPermiso($permiso) {
 </nav>
 
 <!-- SIDEBAR FIJA (escritorio) -->
-<div class="d-none d-md-block bg-dark text-white position-fixed h-100 pt-5" style="width: 250px;">
-  <nav class="nav flex-column">
-
-    <!-- Definimos variables de ubicación -->
-    <?php
-      // Detecta si estamos en alguna parte de configuración
-      $esConfiguracion         = str_contains($_SERVER['REQUEST_URI'], '/configuracion');
-      // Detecta si estamos en alguna parte de bitácoras
-      $esVistaBitacoras        = str_contains($_SERVER['REQUEST_URI'], '/bitacoras');
-      // Detecta si estamos en alguna parta de seguridad
-      $esVistaSeguridad        = str_contains($_SERVER['REQUEST_URI'], '/seguridad');
-      // Detecta si estamos en alguna parte de preferencias
-      $esVistaPreferencias     = str_contains($_SERVER['REQUEST_URI'], '/preferencias');
-      // Detecta si estamos en alguna parte de automatizaciones
-      $esVistaAutomatizaciones = str_contains($_SERVER['REQUEST_URI'], '/automatizaciones');
-      // Detecta si estamos en alguna parte del reset
-      $esVistaReset            = str_contains($_SERVER['REQUEST_URI'], '/reset');
-    ?>
-
-    <!-- INFORMACIÓN GENERAL -->
-    <?php if ($permisosUsuario['informacion_general']): ?>
-      <a href="/IMPORTADORES/configuracion/index"
-        class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/configuracion/dashboard_configuracion') ? 'active' : '' ?>">
-        ℹ️ Información General
-      </a>
-    <?php endif; ?>
-
-    <!-- AUTOMATIZACIONES -->
-    <?php if ($permisosUsuario['automatizaciones']): ?>
-      <?php if ($esVistaAutomatizaciones): ?>
-        <?php $enDashboardAutomatizaciones = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/automatizaciones/index'; ?>
-        <a href="/IMPORTADORES/automatizaciones/index"
-          class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/automatizaciones/index') ? 'active' : '' ?>">
-          ⚙️ Automatizaciones
-        </a>
-      <?php elseif ($esConfiguracion || $esVistaSeguridad || $esVistaPreferencias || $esVistaBitacoras || $esVistaReset): ?>
-        <a href="/IMPORTADORES/automatizaciones/index"
-          class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/automatizaciones/index') ? 'active' : '' ?>">
-          ⚙️ Automatizaciones
-        </a>
-      <?php endif; ?>
-    <?php endif; ?>
-
-    <!-- PREFERENCIAS -->
-    <?php if ($permisosUsuario['preferencias']): ?>
-      <?php if ($esVistaPreferencias): ?>
-        <?php $enDashboardPreferencias = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/preferencias/index'; ?>
-        <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaPreferencias ? 'active' : '' ?>"
-          href="<?= $enDashboardPreferencias ? '#submenuPreferencias' : '/IMPORTADORES/preferencias/index' ?>"
-          <?= $enDashboardPreferencias ? 'data-bd-toggle="collapse"' : '' ?>
-          role="button" aria-expanded="true" aria-controls="submenuPreferencias" 
-          onclick="<? $enDashboardPreferencias ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/preferencias/index\';' ?>">
-          ✅ Preferencias
-          <span class="badge bg-secondary">2</span>
-        </a>
-        <div class="collapse show" id="submenuPreferencias">
-          <nav class="nav flex-column ms-3">
-            <a href="/IMPORTADORES/preferencias/notificaciones"
-            class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/preferencias/notificaciones' ? 'active' : '' ?>">
-            • Gestión de Notificaciones
+<div class="d-none d-md-block sidebar-container sidebar-dark position-fixed h-100" style="width: 250px; top: 0; padding-top: 4rem; z-index: 1000;">
+  <div class="px-3 py-4 h-100 overflow-y-auto">
+    <nav class="sidebar-nav">
+      <ul class="nav flex-column">
+        <!-- INFORMACIÓN GENERAL -->
+        <li class="nav-item">
+          <?php if ($permisosUsuario['informacion_general']): ?>
+            <a href="/IMPORTADORES/configuracion/index" class="nav-link">
+              <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+                <path fill-rule="evenodd" d="M18 10c0 4.418-3.582 8-8 8s-8-3.582-8-8 3.582-8 8-8 8 3.582 8 8zm-8-4a1 1 0 100 2 1 1 0 000-2zm-1 4a1 1 0 000 2h1v3a1 1 0 102 0v-4a1 1 0 00-1-1h-2z" clip-rule="evenodd" />
+              </svg>
+              <span>Información general</span>
             </a>
-            <a href="/IMPORTADORES/preferencias/catalogos"
-            class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/preferencias/catalogos' ? 'active' : '' ?>">
-            • Visualización de Catálogos
+          <?php endif; ?>
+        </li>
+        <!-- AUTOMATIZACIONES -->
+        <li class="nav-item">
+          <?php if ($permisosUsuario['automatizaciones']): ?>
+            <a href="/IMPORTADORES/automatizaciones/index" class="nav-link">
+              <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+                <path d="M13 7H7v6h6V7z" />
+                <path fill-rule="evenodd" d="M5 3a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2V9.586a1 1 0 00-.293-.707l-4.586-4.586A1 1 0 0012.414 4H5zm7 1.414L16.586 10H13a1 1 0 01-1-1V4.414z" clip-rule="evenodd"/>
+              </svg>
+              <span>Automatizaciones</span>
             </a>
-          </nav>
-        </div>
-      <?php elseif ($esConfiguracion || $esVistaAutomatizaciones || $esVistaSeguridad || $esVistaBitacoras || $esVistaReset): ?>
-        <a href="/IMPORTADORES/preferencias/index"
-          class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-          ✅ Preferencias
-          <span class="badge bg-secondary">2</span>
-        </a>
-      <?php endif; ?>
-    <?php endif; ?>
-
-    <!-- SEGURIDAD -->
-    <?php if ($permisosUsuario['seguridad']): ?>
-      <?php if ($esVistaSeguridad): ?>
-        <?php $enDashboardSeguridad = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/seguridad/index'; ?>
-        <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaSeguridad ? 'active' : '' ?>"
-          href="<?= $enDashboardSeguridad ? '#submenuSeguridad' : '/IMPORTADORES/seguridad/index' ?>"
-          <?= $enDashboardSeguridad ? 'data-bs-toggle="collapse"' : '' ?>
-          role="button" aria-expanded="true" aria-controls="submenuSeguridad"
-          onclick="<?= $enDashboardSeguridad ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/seguridad/index\';' ?>">
-          👮 Seguridad
-          <span class="badge bg-secondary">1</span>
-        </a>
-        <div class="collapse show" id="submenuSeguridad">
-          <nav class="nav flex-column ms-3">
-            <a href="/IMPORTADORES/seguridad/opciones"
-              class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/seguridad/opciones' ? 'active' : '' ?>">
-              • Opciones de Seguridad
+          <?php endif; ?>
+        </li>
+        <!-- PREFERENCIAS -->
+        <li class="nav-item">
+          <?php if ($permisosUsuario['preferencias']): ?>
+            <?php $enDashboardPreferencias = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/preferencias/index'; ?>
+            <a class="nav-link <?= $esVistaPreferencias ? 'active' : '' ?>"
+              href="<?= $enDashboardPreferencias ? '#submenuPreferencias' : '/IMPORTADORES/preferencias/index' ?>"
+              <?= $enDashboardPreferencias ? 'data-bs-toggle="collapse"' : '' ?>
+              role="button" aria-expanded="false" aria-controls="submenuPreferencias" 
+              onclick="<?= $enDashboardPreferencias ? 'return true;' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/preferencias/index\';' ?>">
+              <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+                <path fill-rule="evenodd" d="M11.3 1.046a1 1 0 00-2.6 0L7.528 3H4a1 1 0 000 2h1v10H4a1 1 0 000 2h3.528l1.172 1.954a1 1 0 001.6 0L12.472 17H16a1 1 0 000-2h-1V5h1a1 1 0 100-2h-3.528L11.3 1.046zM9 6a1 1 0 011 1v6a1 1 0 11-2 0V7a1 1 0 011-1z" clip-rule="evenodd"/>
+              </svg>
+              <span>Preferencias</span>
+              <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+              </svg>
             </a>
-          </nav>
-        </div>
-      <?php elseif ($esConfiguracion || $esVistaAutomatizaciones || $esVistaPreferencias || $esVistaBitacoras || $esVistaReset): ?>
-        <a href="/IMPORTADORES/seguridad/index"
-          class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-          👮 Seguridad
-          <span class="badge bg-secondary">1</span>
-        </a>
-      <?php endif; ?>
-    <?php endif; ?>
-    
-    <!-- BITÁCORAS CON PERMISOS ESPECÍFICOS -->
-    <?php if (tieneAccesoBitacoras($permisosBitacoras)): ?>
-      <?php $enDashboardBitacoras = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/bitacoras/index'; ?>
-      <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaBitacoras ? 'active' : '' ?>"
-        href="<?= $enDashboardBitacoras ? '#submenuBitacoras' : '/IMPORTADORES/bitacoras/index' ?>"
-        <?= $enDashboardBitacoras ? 'data-bs-toggle="collapse"' : '' ?>
-        role="button" aria-expanded="true" aria-controls="submenuBitacoras"
-        onclick="<?= $enDashboardBitacoras ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/bitacoras/index\';' ?>">
-        📖 Bitácoras
-        <span class="badge bg-secondary"><?= $cantidadBitacoras ?></span>
-      </a>
+            <div class="collapse" id="submenuPreferencias">
+              <ul class="nav flex-column submenu">
+                <li class="nav-item">
+                  <a href="/IMPORTADORES/preferencias/notificaciones" class="nav-link">
+                    Gestión de Notificaciones
+                  </a>
+                </li>
+                <li class="nav-item">
+                  <a href="/IMPORTADORES/preferencias/catalogos" class="nav-link">
+                    Visualización de Catálogos
+                  </a>
+                </li>
+              </ul>
+            </div>
+          <?php endif; ?>
+        </li>
+        <!-- SEGURIDAD -->
+        <li class="nav-item">
+          <?php if ($permisosUsuario['seguridad']): ?>
+            <?php $enDashboardSeguridad = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/seguridad/index'; ?>
+            <a class="nav-link <?= $esVistaSeguridad ? 'active' : '' ?>"
+              href="<?= $enDashboardSeguridad ? '#submenuSeguridad' : '/IMPORTADORES/seguridad/index' ?>"
+              <?= $enDashboardSeguridad ? 'data-bs-toggle="collapse"' : '' ?>
+              role="button" aria-expanded="false" aria-controls="submenuSeguridad"
+              onclick="<?= $enDashboardSeguridad ? 'return true;' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/seguridad/index\';' ?>">
+              <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+                <path fill-rule="evenodd" d="M10 2a4 4 0 00-4 4v2H5a2 2 0 00-2 2v6a2 2 0 002 2h10a2 2 0 002-2v-6a2 2 0 00-2-2h-1V6a4 4 0 00-4-4zm2 6V6a2 2 0 10-4 0v2h4z" clip-rule="evenodd"/>
+              </svg>
+              <span>Seguridad</span>
+              <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+              </svg>
+            </a>
+            <div class="collapse" id="submenuSeguridad">
+              <nav class="nav flex-column submenu">
+                <li class="nav-item">
+                  <a href="/IMPORTADORES/seguridad/opciones" class="nav-link">
+                    Opciones de Seguridad
+                  </a>
+                </li>
+              </nav>
+            </div>
+          <?php endif; ?>
+        </li>
+        <!-- BITÁCORAS CON PERMISOS ESPECÍFICOS -->
+        <li class="nav-item">
+          <?php if (tieneAccesoBitacoras($permisosBitacoras)): ?>
+            <?php $enDashboardBitacoras = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/bitacoras/index'; ?>
+            <a class="nav-link <?= $esVistaBitacoras ? 'active' : '' ?>"
+              href="<?= $enDashboardBitacoras ? '#submenuBitacoras' : '/IMPORTADORES/bitacoras/index' ?>"
+              <?= $enDashboardBitacoras ? 'data-bs-toggle="collapse"' : '' ?>
+              role="button" aria-expanded="<?= $enDashboardBitacoras ? 'false' : 'false' ?>" aria-controls="submenuBitacoras"
+              onclick="<?= $enDashboardBitacoras ? 'return true;' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/bitacoras/index\';' ?>">
+              <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+                <path d="M4 3a2 2 0 00-2 2v10a2 2 0 002 2h12a1 1 0 001-1V4a1 1 0 00-1-1H4zm0 2h11v10H4V5z"/>
+                <path d="M6 7h5v1H6V7zm0 3h8v1H6v-1z"/>
+              </svg>
+              <span>Bitácoras</span>
+              <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+              </svg>
+            </a>
+            <div class="collapse" id="submenuBitacoras">
+              <nav class="nav flex-column submenu">
+                <?php foreach ($permisosBitacoras as $permiso => $tienePermiso): ?>
+                  <li class="nav-item">
+                    <?php if ($tienePermiso): ?>
+                      <?php
+                        $url      = obtenerUrlPermiso($permiso);
+                        $texto    = obtenerTextoPermiso($permiso, $tipoUsuario);
+                        $esActivo = $_SERVER['REQUEST_URI'] === $url;
 
-      <div class="collapse <?= $esVistaBitacoras ? 'show' : '' ?>" id="submenuBitacoras">
-        <nav class="nav flex-column ms-3">
-          <?php foreach ($permisosBitacoras as $permiso => $tienePermiso): ?>
-            <?php if ($tienePermiso): ?>
-              <?php
-                $url      = obtenerUrlPermiso($permiso);
-                $texto    = obtenerTextoPermiso($permiso, $tipoUsuario);
-                $icono    = obtenerIconoPermiso($permiso);
-                $esActivo = $_SERVER['REQUEST_URI'] === $url;
-
-                // Scope según dashboard
-                $scope = '';
-                if ($tipoUsuario === 'super_admin') {
-                  $scope = 'Global';
-                } elseif ($tipoUsuario === 'admin_agencia' || $tipoUsuario === 'agente_aduanal') {
-                  if (in_array($permiso, ['acceso_usuarios_agencia', 'registro_vinculaciones'])) {
-                    $scope = 'Agencia';
-                  } elseif (in_array($permiso, ['mis_vinculaciones', 'mi_actividad'])) {
-                    $scope = 'Personal';
-                  }
-                } elseif ($tipoUsuario === 'importador') {
-                  $scope = 'Personal';
-                }
-              ?>
-              <a href="<?= $url ?>"
-                class="nav-link submenu-item px-3 py-2 d-flex justify-content-between align-items-center <?= $esActivo ? 'active' : '' ?>">
-                <span>
-                  <?= $icono ?> <?= htmlspecialchars($texto) ?>
-                  <?php if ($scope): ?>
-                    <span class="permission-scope"><?= $scope ?></span>
-                  <?php endif; ?>
-                </span>
-              </a>
-            <?php endif; ?>
-          <?php endforeach; ?>
-        </nav>
-      </div>
-    <?php endif; ?>
-    
-  </nav>
+                        // Scope según dashboard
+                        $scope = '';
+                        if ($tipoUsuario === 'super_admin') {
+                          $scope = 'Global';
+                        } elseif ($tipoUsuario === 'admin_agencia' || $tipoUsuario === 'agente_aduanal') {
+                          if (in_array($permiso, ['acceso_usuarios_agencia', 'registro_vinculaciones'])) {
+                            $scope = 'Agencia';
+                          } elseif (in_array($permiso, ['mis_vinculaciones', 'mi_actividad'])) {
+                            $scope = 'Personal';
+                          }
+                        } elseif ($tipoUsuario === 'importador') {
+                          $scope = 'Personal';
+                        }
+                      ?>
+                      <a href="<?= $url ?>"
+                        class="nav-link submenu-item px-3 py-2 d-flex justify-content-between align-items-center <?= $esActivo ? 'active' : '' ?>">
+                        <span>
+                          <?= htmlspecialchars($texto) ?>
+                          <?php if ($scope): ?>
+                            <span class="permission-scope"><?= $scope ?></span>
+                          <?php endif; ?>
+                        </span>
+                      </a>
+                    <?php endif; ?>
+                  </li>
+                <?php endforeach; ?>
+              </nav>
+            </div>
+          <?php endif; ?>
+        </li>
+      </ul>
+    </nav>
+  </div>
 </div>
 
 <!-- OFFCANVAS PARA MÓVILES -->
-<div class="offcanvas offcanvas-start d-md-none" tabindex="-1" id="sidebarMenu" style="top: 56px;">
+<div class="offcanvas offcanvas-start d-md-none" tabindex="-1" id="sidebarMenu" style="top: 0; width: 250px;">
   <div class="offcanvas-header">
     <h5 class="offcanvas-title">Menú</h5>
     <button type="button" class="btn-close" data-bs-dismiss="offcanvas"></button>
   </div>
   <div class="offcanvas-body">
-
-    <!-- INFORMACIÓN GENERAL -->
-    <?php if ($permisosUsuario['informacion_general']): ?>
-      <a href="/IMPORTADORES/configuracion/index"
-        class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/configuracion/dashboard_configuracion') ? 'active' : '' ?>">
-        ℹ️ Información General
-      </a>
-    <?php endif; ?>
-
-    <!-- AUTOMATIZACIONES -->
-    <?php if ($permisosUsuario['automatizaciones']): ?>
-      <?php if ($esVistaAutomatizaciones): ?>
-        <?php $enDashboardAutomatizaciones = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/automatizaciones/index'; ?>
-        <a href="/IMPORTADORES/automatizaciones/index"
-          class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/automatizaciones/index') ? 'active' : '' ?>">
-          ⚙️ Automatizaciones
-        </a>
-      <?php elseif ($esConfiguracion || $esVistaSeguridad || $esVistaPreferencias || $esVistaBitacoras || $esVistaReset): ?>
-        <a href="/IMPORTADORES/automatizaciones/index"
-          class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/automatizaciones/index') ? 'active' : '' ?>">
-          ⚙️ Automatizaciones
-        </a>
-      <?php endif; ?>
-    <?php endif; ?>
-
-    <!-- PREFERENCIAS -->
-    <?php if ($permisosUsuario['preferencias']): ?>
-      <?php if ($esVistaPreferencias): ?>
-        <?php $enDashboardPreferencias = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/preferencias/index'; ?>
-        <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaPreferencias ? 'active' : '' ?>"
-          href="<?= $enDashboardPreferencias ? '#submenuPreferencias' : '/IMPORTADORES/preferencias/index' ?>"
-          <?= $enDashboardPreferencias ? 'data-bd-toggle="collapse"' : '' ?>
-          role="button" aria-expanded="true" aria-controls="submenuPreferencias" 
-          onclick="<? $enDashboardPreferencias ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/preferencias/index\';' ?>">
-          ✅ Preferencias
-          <span class="badge bg-secondary">2</span>
-        </a>
-        <div class="collapse show" id="submenuPreferencias">
-          <nav class="nav flex-column ms-3">
-            <a href="/IMPORTADORES/preferencias/notificaciones"
-            class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/preferencias/notificaciones' ? 'active' : '' ?>">
-            • Gestión de Notificaciones
-            </a>
-            <a href="/IMPORTADORES/preferencias/catalogos"
-            class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/preferencias/catalogos' ? 'active' : '' ?>">
-            • Visualización de Catálogos
-            </a>
-          </nav>
-        </div>
-      <?php elseif ($esConfiguracion || $esVistaAutomatizaciones || $esVistaSeguridad || $esVistaBitacoras || $esVistaReset): ?>
-        <a href="/IMPORTADORES/preferencias/index"
-          class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-          ✅ Preferencias
-          <span class="badge bg-secondary">2</span>
-        </a>
-      <?php endif; ?>
-    <?php endif; ?>
-
-    <!-- SEGURIDAD -->
-    <?php if ($permisosUsuario['seguridad']): ?>
-      <?php if ($esVistaSeguridad): ?>
-        <?php $enDashboardSeguridad = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/seguridad/index'; ?>
-        <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaSeguridad ? 'active' : '' ?>"
-          href="<?= $enDashboardSeguridad ? '#submenuSeguridad' : '/IMPORTADORES/seguridad/index' ?>"
-          <?= $enDashboardSeguridad ? 'data-bs-toggle="collapse"' : '' ?>
-          role="button" aria-expanded="true" aria-controls="submenuSeguridad"
-          onclick="<?= $enDashboardSeguridad ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/seguridad/index\';' ?>">
-          👮 Seguridad
-          <span class="badge bg-secondary">1</span>
-        </a>
-        <div class="collapse show" id="submenuSeguridad">
-          <nav class="nav flex-column ms-3">
-            <a href="/IMPORTADORES/seguridad/opciones"
-              class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/seguridad/opciones' ? 'active' : '' ?>">
-              • Opciones de Seguridad
-            </a>
-          </nav>
-        </div>
-      <?php elseif ($esConfiguracion || $esVistaAutomatizaciones || $esVistaPreferencias || $esVistaBitacoras || $esVistaReset): ?>
-        <a href="/IMPORTADORES/seguridad/index"
-          class="nav-link px-3 py-2 d-flex justify-content-between align-items-center">
-          👮 Seguridad
-          <span class="badge bg-secondary">1</span>
-        </a>
-      <?php endif; ?>
-    <?php endif; ?>
-    
-    <!-- BITÁCORAS CON PERMISOS ESPECÍFICOS -->
-    <?php if (tieneAccesoBitacoras($permisosBitacoras)): ?>
-      <?php $enDashboardBitacoras = $_SERVER['REQUEST_URI'] === '/IMPORTADORES/bitacoras/index'; ?>
-      <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= $esVistaBitacoras ? 'active' : '' ?>"
-        href="<?= $enDashboardBitacoras ? '#submenuBitacoras' : '/IMPORTADORES/bitacoras/index' ?>"
-        <?= $enDashboardBitacoras ? 'data-bs-toggle="collapse"' : '' ?>
-        role="button" aria-expanded="true" aria-controls="submenuBitacoras"
-        onclick="<?= $enDashboardBitacoras ? '' : 'event.preventDefault(); window.location.href = \'/IMPORTADORES/bitacoras/index\';' ?>">
-        📖 Bitácoras
-        <span class="badge bg-secondary"><?= $cantidadBitacoras ?></span>
-      </a>
-
-      <div class="collapse <?= $esVistaBitacoras ? 'show' : '' ?>" id="submenuBitacoras">
-        <nav class="nav flex-column ms-3">
-          <?php foreach ($permisosBitacoras as $permiso => $tienePermiso): ?>
-            <?php if ($tienePermiso): ?>
-              <?php
-                $url      = obtenerUrlPermiso($permiso);
-                $texto    = obtenerTextoPermiso($permiso, $tipoUsuario);
-                $icono    = obtenerIconoPermiso($permiso);
-                $esActivo = $_SERVER['REQUEST_URI'] === $url;
-
-                // Scope según dashboard
-                $scope = '';
-                if ($tipoUsuario === 'super_admin') {
-                  $scope = 'Global';
-                } elseif ($tipoUsuario === 'admin_agencia' || $tipoUsuario === 'agente_aduanal') {
-                  if (in_array($permiso, ['acceso_usuarios_agencia', 'registro_vinculaciones'])) {
-                    $scope = 'Agencia';
-                  } elseif (in_array($permiso, ['mis_vinculaciones', 'mi_actividad'])) {
-                    $scope = 'Personal';
-                  }
-                } elseif ($tipoUsuario === 'importador') {
-                  $scope = 'Personal';
-                }
-              ?>
-              <a href="<?= $url ?>"
-                class="nav-link submenu-item px-3 py-2 d-flex justify-content-between align-items-center <?= $esActivo ? 'active' : '' ?>">
-                <span>
-                  <?= $icono ?> <?= htmlspecialchars($texto) ?>
-                  <?php if ($scope): ?>
-                    <span class="permission-scope"><?= $scope ?></span>
-                  <?php endif; ?>
-                </span>
-              </a>
-            <?php endif; ?>
-          <?php endforeach; ?>
-        </nav>
-      </div>
-    <?php endif; ?>
-
+    <nav class="sidebar-nav">
+      <ul class="nav flex-column">
+        
+      </ul>
+    </nav>
   </div>
-</div>
\ No newline at end of file
+</div>
+
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+<script>
+  document.addEventListener('DOMContentLoaded', function() {
+    // Detectar la ruta actual
+    const currentPath = window.location.pathname;
+    
+    // Función para abrir collapse si la página actual está en esa sección
+    function inicializarCollapses() {
+      // Preferencias
+      if (currentPath.includes('/preferencias/')) {
+        const preferencesCollapse = document.getElementById('submenuPreferencias');
+        if (preferencesCollapse) {
+          preferencesCollapse.classList.add('show');
+          const trigger = document.querySelector('[aria-controls="submenuPreferencias"]');
+          if (trigger) trigger.setAttribute('aria-expanded', 'true');
+        }
+      }
+      
+      // Seguridad
+      if (currentPath.includes('/seguridad/')) {
+        const securityCollapse = document.getElementById('submenuSeguridad');
+        if (securityCollapse) {
+          securityCollapse.classList.add('show');
+          const trigger = document.querySelector('[aria-controls="submenuSeguridad"]');
+          if (trigger) trigger.setAttribute('aria-expanded', 'true');
+        }
+      }
+      
+      // Bitácoras
+      if (currentPath.includes('/bitacoras/')) {
+        const bitacorasCollapse = document.getElementById('submenuBitacoras');
+        if (bitacorasCollapse) {
+          bitacorasCollapse.classList.add('show');
+          const trigger = document.querySelector('[aria-controls="submenuBitacoras"]');
+          if (trigger) trigger.setAttribute('aria-expanded', 'true');
+        }
+      }
+    }
+    
+    // Marcar enlaces activos
+    function marcarEnlacesActivos() {
+      const navLinks = document.querySelectorAll('.nav-link');
+      navLinks.forEach(link => {
+        const href = link.getAttribute('href');
+        if (href && currentPath === href) {
+          link.classList.add('active');
+        }
+      });
+    }
+    
+    // Inicializar todo
+    inicializarCollapses();
+    marcarEnlacesActivos();
+  });
+</script>
\ No newline at end of file
diff --git a/views/partials/sidebar_importador.php b/views/partials/sidebar_importador.php
index d014752..ebb7e44 100644
--- a/views/partials/sidebar_importador.php
+++ b/views/partials/sidebar_importador.php
@@ -1,12 +1,49 @@
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+
 <style>
-  .nav .nav-link { font-weight: normal; color: white; transition: all 0.3s ease; }
-  .nav .nav-link:hover,
-  .nav .nav-link.active { background-color: #495057; color: #fff; }
-  /* Estilo inverso solo para pantallas pequeñas (sidebar tipo offcanvas) */
+  /* Estilos inspirados en Tailwind */
+  .sidebar-container { background-color: #f9fafb; border-right: 1px solid #e5e7eb; }
+  .sidebar-dark { background-color: #1f2937; border-right: 1px solid #374151; }
+  .sidebar-nav .nav-link { color: #374151; font-weight: 500; padding: 0.5rem 0.75rem; margin-bottom: 0.125rem;
+    border-radius: 0.5rem; transition: all 0.15s ease-in-out; display: flex; align-items: center; }
+  .sidebar-nav .nav-link:hover { background-color: #f3f4f6; color: #111827; }
+  .sidebar-nav .nav-link.active { background-color: #f3f4f6; color: #111827; }
+  .sidebar-nav .nav-link .icon { width: 1.25rem; height: 1.25rem; margin-right: 0.75rem; color: #6b7280; transition: color 0.15s ease-in-out; flex-shrink: 0; }
+  .sidebar-nav .nav-link:hover .icon,
+  .sidebar-nav .nav-link.active .icon { color: #374151; }
+  .sidebar-nav .badge { background-color: #f3f4f6; color: #374151; font-size: 0.75rem; font-weight: 500; padding: 0.25rem 0.5rem; border-radius: 9999px; margin-left: auto; }
+  .sidebar-nav .badge.badge-primary { background-color: #dbeafe; color: #1e40af; }
+  .submenu .nav-link { padding-left: 2.75rem; color: #6b7280; font-weight: 400; }
+  .submenu .nav-link:hover { background-color: #f3f4f6; color: #374151; }
+  .submenu .nav-link.active { background-color: #f3f4f6; color: #374151; }
+  .collapse-icon { width: 0.75rem; height: 0.75rem; margin-left: auto; transition: transform 0.15s ease-in-out; }
+  .nav-link[aria-expanded="true"] .collapse-icon { transform: rotate(180deg); }
+  /* Estilos para modo oscuro */
+  .sidebar-dark .sidebar-nav .nav-link { color: #d1d5db; }
+  .sidebar-dark .sidebar-nav .nav-link:hover { background-color: #374151; color: #ffffff; }
+  .sidebar-dark .sidebar-nav .nav-link.active { background-color: #374151; color: #ffffff; }
+  .sidebar-dark .sidebar-nav .nav-link .icon { color: #9ca3af; }
+  .sidebar-dark .sidebar-nav .nav-link:hover .icon,
+  .sidebar-dark .sidebar-nav .nav-link.active .icon { color: #ffffff; }
+  .sidebar-dark .sidebar-nav .badge { background-color: #374151; color: #d1d5db; }
+  .sidebar-dark .sidebar-nav .badge.badge-primary { background-color: #1e3a8a; color: #93c5fd; }
+  .sidebar-dark .submenu .nav-link { color: #9ca3af; }
+  .sidebar-dark .submenu .nav-link:hover { background-color: #374151; color: #d1d5db; }
+  .sidebar-dark .submenu .nav-link.active { background-color: #374151; color: #d1d5db; }
+  /* Navbar */
+  .navbar-brand { font-weight: 600; font-size: 1.125rem; }
+  .menu-toggle { border: 1px solid #6b7280; border-radius: 0.5rem; padding: 0.5rem; transition: all 0.15s ease-in-out; }
+  .menu-toggle:hover { background-color: #f3f4f6; }
+  /* Offcanvas para móviles */
+  .offcanvas { background-color: #ffffff; }
+  .offcanvas-header { border-bottom: 1px solid #e5e7eb; padding: 1rem 1.5rem; }
+  .offcanvas-title { font-weight: 600; font-size: 1.125rem; color: #111827; }
+  .offcanvas-body { padding: 1rem 1.5rem; }
+  /* Responsive adjustments */
   @media (max-width: 767.98px) {
-    .nav .nav-link { font-weight: normal; color: #343a40; background-color: transparent; }
-    .nav .nav-link:hover,
-    .nav .nav-link.active { background-color: #e9ecef; color: #212529; }
+    .sidebar-nav .nav-link { color: #374151; }
+    .sidebar-nav .nav-link:hover { background-color: #f3f4f6; color: #111827; }
+    .sidebar-nav .nav-link.active { background-color: #f3f4f6; color: #111827; }
   }
 </style>
 
@@ -14,410 +51,603 @@
 <nav class="navbar navbar-dark bg-dark fixed-top">
   <div class="container-fluid">
     <!-- Botón de menú para móviles -->
-    <button class="btn btn-outline-light d-md-none me-2" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
+    <button class="menu-toggle d-md-none me-3" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
       ☰
     </button>
-    <span class="navbar-brand">SIIH | Importador</span>
+    <span class="navbar-brand">SIIH | Administrador</span>
     <div class="d-flex ms-auto text-white">
-      <?php
-      $esDashboard = str_contains($_SERVER['REQUEST_URI'], '/importadores/dashboard');
-      if ($esDashboard): ?>
-        Bienvenido, <?= htmlspecialchars($_SESSION['usuario_nombre']) ?>
-      <?php else: ?>
-        <a href="/IMPORTADORES/sistemas/logout" class="btn btn-outline-light btn-sm ms-2 W-auto btn-animated">Cerrar Sesión</a>
-      <?php endif; ?>
+      <div id="navbar-content">
+        <?php
+        // Verifica si estás en el dashboard principal del administrador
+        $esDashboard = str_contains($_SERVER['REQUEST_URI'], '/administrador/dashboard');
+
+        if ($esDashboard): ?>
+          <span id="welcome-text">Bienvenido, <?= htmlspecialchars($_SESSION['usuario_nombre']) ?></span>
+        <?php else: ?>
+          <a href="/IMPORTADORES/sistemas/logout" class="btn btn-outline-light btn-sm ms-2 W-auto btn-animated" id="logout-btn">Cerrar Sesión</a>
+        <?php endif; ?>
+      </div>
     </div>
   </div>
 </nav>
 
 <!-- SIDEBAR FIJA (escritorio) -->
-<div class="d-none d-md-block bg-dark text-white position-fixed h-100 pt-5" style="width: 250px;">
-  <nav class="nav flex-column">
-
-    <!-- INICIO -->
-    <a href="/IMPORTADORES/importadores/dashboard"
-       class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/importadores/dashboard') ? 'active' : '' ?>">
-      🏠 Inicio
-    </a>
-
-    <!-- LOCACIONES -->
-     <a href="/IMPORTADORES/importadores/lista"
-     class="nav-link px-3 py-2 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/importadores/lista' ? 'active' : '' ?>">
-     🗺️ Locaciones
-    </a>
-
-    <!-- VINCULACIONES -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-         <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuVinculaciones" role="button" aria-expanded="false">
-      🔗 Vinculación
-      <span class="badge bg-secondary">2</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones') ? 'show' : '' ?>" id="submenuVinculaciones">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/vinculaciones/vinculacionesUsuario"
-          class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones/vinculacionesUsuario') ? 'active' : '' ?>">
-          • Mis vinculaciones
-        </a>
-        <a href="/IMPORTADORES/vinculaciones/nuevaVinculacion"
-          class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones/nuevaVinculacion') ? 'active' : '' ?>">
-          • Nueva vinculación
-        </a>
-      </nav>
-    </div>
-    
-    <!-- TRANSPORTISTAS -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportistas') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuTransportistas" role="button" aria-expanded="false">
-      🚚 Transportistas
-      <span class="badge bg-secondary">3</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportistas') ? 'show' : '' ?>" id="submenuTransportistas">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/transportistas/lista"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportistas/lista') ? 'active' : '' ?>">
-          • Mis transportistas
-        </a>
-        <a href="/IMPORTADORES/transportistas/alta"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportistas/alta') ? 'active' : '' ?>">
-          • Alta de transportista
-        </a>
-        <a href="/IMPORTADORES/transportistas/bulk_upload"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/transportistas/bulk_upload') ? 'active' : '' ?>">
-          • Carga masiva 
-        </a>
-      </nav>
-    </div>
-
-    <!-- TRANSPORTES -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportes') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuTransportes" role="button" aria-expanded="false">
-      🚛 Transportes
-      <span class="badge bg-secondary">3</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportes') ? 'show' : '' ?>" id="submenuTransportes">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/transportes/lista"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportes/lista') ? 'active' : '' ?>">
-          • Mis transportes
-        </a>
-        <a href="/IMPORTADORES/transportes/crear"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportes/crear') ? 'active' : '' ?>">
-          • Nuevo transporte
-        </a>
-        <a href="/IMPORTADORES/transportes/masivo"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportes/masivo') ? 'active' : '' ?>">
-          • Carga masiva
-        </a>
-      </nav>
-    </div>
-
-    <!-- CHOFERES -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/choferes') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuChoferes" role="button" aria-expanded="false">
-      👨‍✈️ Choferes
-      <span class="badge bg-secondary">2</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/choferes') ? 'show' : '' ?>" id="submenuChoferes">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/choferes/lista"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/choferes/lista') ? 'active' : '' ?>">
-          • Mis choferes
-        </a>
-        <a href="/IMPORTADORES/choferes/crear"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/choferes/crear') ? 'active' : '' ?>">
-          • Nuevo chofer
-        </a>
-      </nav>
-    </div>
-
-    <!-- PROVEEDORES -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'active' : '' ?>"
-      data-bs-toggle="collapse" href="#submenuProveedores" role="button" aria-expanded="<?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'true' : 'false' ?>"
-      aria-controls="submenuProveedores">
-      🏭 Proveedores
-      <span class="badge bg-secondary">2</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'show' : '' ?>" id="submenuProveedores">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/proveedores" class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/proveedores' ? 'active' : '' ?>">
-          • Lista de Proveedores
-        </a>
-        <a href="/IMPORTADORES/proveedores/crear"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores/crear') ? 'active' : '' ?>">
-          • Registro de Proveedor
-        </a>
-      </nav>
-    </div>
-
-    <!-- PRODUCTOS FRECUENTES -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/productos_frecuentes') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuProductosFrecuentes" role="button" aria-expanded="false">
-      ⭐ Productos Frecuentes
-      <span class="badge bg-secondary">3</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/productos_frecuentes') ? 'show' : '' ?>" id="submenuProductosFrecuentes">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/productos_frecuentes/alta"
-           class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/productos_frecuentes/alta' ? 'active' : '' ?>">
-          • Alta Producto
-        </a>
-        <a href="/IMPORTADORES/productos_frecuentes/editar"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/productos_frecuentes/editar') ? 'active' : '' ?>">
-          • Ver Productos
-        </a>
-        <!--
-        <a href="/IMPORTADORES/productos_frecuentes/importacion_csv"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/productos_frecuentes/importacion_csv') ? 'active' : '' ?>">
-          • Importación Masiva CSV
-        </a>
-        -->
-      </nav>
-    </div>
-
-    <!-- SOLICITUDES DE IMPORTACIÓN -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/solicitud_importacion') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuSolicitudes" role="button" aria-expanded="false">
-      📄 Solicitudes Importación
-      <span class="badge bg-secondary">2</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/solicitud_importacion') ? 'show' : '' ?>" id="submenuSolicitudes">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/solicitud_importacion/lista"
-           class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/solicitud_importacion/lista' ? 'active' : '' ?>">
-          • Mis solicitudes
-        </a>
-        <a href="/IMPORTADORES/solicitud_importacion/crear"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/solicitud_importacion/crear') ? 'active' : '' ?>">
-          • Nueva solicitud
-        </a>
-      </nav>
-    </div>
-
-    <!-- EXPEDIENTE ELECTRÓNICO -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/expediente') ? 'active' : '' ?>"
-      data-bs-toggle="collapse" href="#submenuExpediente" role="button" aria-expanded="false">
-      📁 Expediente Electrónico
-      <span class="badge bg-secondary">1</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/expediente') ? 'show' : '' ?>" id="submenuExpediente">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/expediente/index"
-           class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/expediente/consultar' ? 'active' : '' ?>">
-          • Ver expediente
-        </a>
-      </nav>
-    </div>
-
-    <!-- CONFIGURACIÓN -->
-    <a href="/IMPORTADORES/configuracion"
-       class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/configuracion') ? 'active' : '' ?>">
-      ⚙️ Configuración
-    </a>
-
-  </nav>
+<div class="d-none d-md-block sidebar-container sidebar-dark position-fixed h-100" style="width: 250px; top: 0; padding-top: 4rem; z-index: 1000;">
+  <div class="px-3 py-4 h-100 overflow-y-auto">
+    <nav class="sidebar-nav">
+      <ul class="nav flex-column">
+        <!-- INICIO -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/importadores/dashboard" class="nav-link active">
+            <svg class="icon" fill="currentColor" viewBox="0 0 22 21">
+              <path d="M16.975 11H10V4.025a1 1 0 0 0-1.066-.998 8.5 8.5 0 1 0 9.039 9.039.999.999 0 0 0-1-1.066h.002Z"/>
+              <path d="M12.5 0c-.157 0-.311.01-.565.027A1 1 0 0 0 11 1.02V10h8.975a1 1 0 0 0 1-.935c.013-.188.028-.374.028-.565A8.51 8.51 0 0 0 12.5 0Z"/>
+            </svg>
+            <span>Inicio</span>
+          </a>
+        </li>
+        <!-- LOCACIONES -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/importadores/lista" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M10 2C6.686 2 4 4.686 4 8c0 5.25 6 12 6 12s6-6.75 6-12c0-3.314-2.686-6-6-6zm0 8c-1.105 0-2-.895-2-2s.895-2 2-2 2 .895 2 2-.895 2-2 2z"/>
+            </svg>
+            <span>Locaciones</span>
+          </a>
+        </li>
+        <!-- VINCULACIONES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuVinculaciones" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4 0 005.656 0l3-3a4 4 0 00-5.656-5.656l-1.5 1.5a1 1 0 101.414 1.414l1.5-1.5z"/>
+              <path d="M7.414 15.414a2 2 0 01-2.828-2.828l3-3a2 2 0 012.828 0 1 1 0 001.414-1.414 4 4 0 00-5.656 0l-3 3a4 4 0 105.656 5.656l1.5-1.5a1 1 0 10-1.414-1.414l-1.5 1.5z"/>
+            </svg>
+            <span>Vinculación</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuVinculaciones">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/vinculaciones/vinculacionesUsuario" class="nav-link">
+                  Mis vinculaciones
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/vinculaciones/nuevaVinculacion" class="nav-link">
+                  Nueva vinculación
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- TRANSPORTISTAS -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuTransportistas" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M3 4a1 1 0 011-1h12a1 1 0 011 1v2a1 1 0 01-1 1H4a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6zM14 9a1 1 0 00-1 1v6a1 1 0 001 1h2a1 1 0 001-1v-6a1 1 0 00-1-1h-2z"/>
+            </svg>
+            <span>Transportistas</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuTransportistas">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportistas/lista" class="nav-link">
+                  Mis transportistas
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportistas/alta" class="nav-link">
+                  Alta de transportista
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportistas/bulk_upload" class="nav-link">
+                  Carga masiva 
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- TRANSPORTES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuTransportes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M8 16.5a1.5 1.5 0 11-3 0 1.5 1.5 0 013 0zM15 16.5a1.5 1.5 0 11-3 0 1.5 1.5 0 013 0z"/>
+              <path d="M3 4a1 1 0 00-1 1v10a1 1 0 001 1h1.464a1.5 1.5 0 002.072 0h6.928a1.5 1.5 0 002.072 0H17a1 1 0 001-1V5a1 1 0 00-1-1H3zM4 7h12v2H4V7zm0 4h12v2H4v-2z"/>
+            </svg>
+            <span>Transportes</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuTransportes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportes/lista" class="nav-link">
+                  Mis transportes
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportes/crear" class="nav-link">
+                  Nuevo transporte
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportes/masivo" class="nav-link">
+                  Carga masiva
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- CHOFERES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuChoferes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clip-rule="evenodd"/>
+            </svg>
+            <span>Choferes</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuChoferes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/choferes/lista" class="nav-link">
+                  Mis choferes
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/choferes/crear" class="nav-link">
+                  Nuevo chofer
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- PROVEEDORES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuProveedores" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
+              <path fill-rule="evenodd" d="M4 3a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V5a2 2 0 00-2-2H4zm12 12H4l4-8 3 6 2-4 3 6z" clip-rule="evenodd"/>
+            </svg>
+            <span>Proveedores</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuProveedores">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/proveedores" class="nav-link">
+                  Lista de Proveedores
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/proveedores/crear" class="nav-link">
+                  Registro de Proveedor
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- PRODUCTOS FRECUENTES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuProductosFrecuentes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"/>
+            </svg>
+            <span>Productos Frecuentes</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuProductosFrecuentes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/productos_frecuentes/editar" class="nav-link">
+                  Mis productos
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/productos_frecuentes/alta" class="nav-link">
+                  Alta de productos
+                </a>
+              </li>
+              <!-- 
+              <li class="nav-item">
+                <a href="/IMPORTADORES/productos_frecuentes/importacion_csv" class="nav-link">
+                  Importación masiva
+                </a>
+              </li>
+              -->
+            </ul>
+          </div>
+        </li>
+        <!-- SOLICITUDES DE IMPORTACIÓN -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuSolicitudes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z" clip-rule="evenodd"/>
+            </svg>
+            <span>Solicitudes Importación</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuSolicitudes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/solicitud_importacion/lista" class="nav-link">
+                  Mis solicitudes
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/solicitud_importacion/crear" class="nav-link">
+                  Nueva solicitud
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- EXPEDIENTE ELECTRÓNICO -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuExpediente" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M3 4a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1H4a1 1 0 01-1-1V4zm6 0a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1V4zm6 0a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1H4a1 1 0 01-1-1v-3zm6 0a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1v-3zm6 0a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1v-3z" clip-rule="evenodd"/>
+            </svg>
+            <span>Expediente Electrónico</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuExpediente">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/expediente/index" class="nav-link">
+                  Mi expediente
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- CONFIGURACIÓN -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/configuracion" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M5 5V.13a2.96 2.96 0 0 0-1.293.749L.879 3.707A2.96 2.96 0 0 0 .13 5H5Z"/>
+              <path d="M6.737 11.061a2.961 2.961 0 0 1 .81-1.515l6.117-6.116A4.839 4.839 0 0 1 16 2.141V2a1.97 1.97 0 0 0-1.933-2H7v5a2 2 0 0 1-2 2H0v11a1.969 1.969 0 0 0 1.933 2h12.134A1.97 1.97 0 0 0 16 18v-3.093l-1.546 1.546c-.413.413-.94.695-1.513.81l-3.4.679a2.947 2.947 0 0 1-1.85-.227 2.96 2.96 0 0 1-1.635-3.257l.681-3.397Z"/>
+            </svg>
+            <span>Configuración</span>
+          </a>
+        </li>
+      </ul>
+    </nav>
+  </div>
 </div>
 
 <!-- OFFCANVAS PARA MÓVILES -->
-<div class="offcanvas offcanvas-start d-md-none" tabindex="-1" id="sidebarMenu" style="top: 75px;">
+<div class="offcanvas offcanvas-start d-md-none" tabindex="-1" id="sidebarMenu" style="top: 0; width: 250px;">
   <div class="offcanvas-header">
     <h5 class="offcanvas-title">Menú</h5>
     <button type="button" class="btn-close" data-bs-dismiss="offcanvas"></button>
   </div>
   <div class="offcanvas-body">
-
-    <!-- INICIO -->
-    <a href="/IMPORTADORES/importadores/dashboard"
-       class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/importadores/dashboard') ? 'active' : '' ?>">
-      🏠 Inicio
-    </a>
-
-    <!-- LOCACIONES -->
-     <a href="/IMPORTADORES/importadores/lista"
-     class="nav-link px-3 py-2 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/importadores/lista' ? 'active' : '' ?>">
-     🗺️ Locaciones
-    </a>
-
-    <!-- VINCULACIONES -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-         <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuVinculaciones" role="button" aria-expanded="false">
-      🔗 Vinculación
-      <span class="badge bg-secondary">2</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones') ? 'show' : '' ?>" id="submenuVinculaciones">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/vinculaciones/vinculacionesUsuario"
-          class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones/vinculacionesUsuario') ? 'active' : '' ?>">
-          • Mis vinculaciones
-        </a>
-        <a href="/IMPORTADORES/vinculaciones/nuevaVinculacion"
-          class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/vinculaciones/nuevaVinculacion') ? 'active' : '' ?>">
-          • Nueva vinculación
-        </a>
-      </nav>
-    </div>
-    
-    <!-- TRANSPORTISTAS -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportistas') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuTransportistas" role="button" aria-expanded="false">
-      🚚 Transportistas
-      <span class="badge bg-secondary">3</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportistas') ? 'show' : '' ?>" id="submenuTransportistas">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/transportistas/lista"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportistas/lista') ? 'active' : '' ?>">
-          • Mis transportistas
-        </a>
-        <a href="/IMPORTADORES/transportistas/alta"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportistas/alta') ? 'active' : '' ?>">
-          • Alta de transportista
-        </a>
-        <a href="/IMPORTADORES/transportistas/bulk_upload"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/transportistas/bulk_upload') ? 'active' : '' ?>">
-          • Carga masiva 
-        </a>
-      </nav>
-    </div>
-
-    <!-- TRANSPORTES -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportes') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuTransportes" role="button" aria-expanded="false">
-      🚛 Transportes
-      <span class="badge bg-secondary">3</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportes') ? 'show' : '' ?>" id="submenuTransportes">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/transportes/lista"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportes/lista') ? 'active' : '' ?>">
-          • Mis transportes
-        </a>
-        <a href="/IMPORTADORES/transportes/crear"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportes/crear') ? 'active' : '' ?>">
-          • Nuevo transporte
-        </a>
-        <a href="/IMPORTADORES/transportes/masivo"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/transportes/masivo') ? 'active' : '' ?>">
-          • Carga masiva
-        </a>
-      </nav>
-    </div>
-
-    <!-- CHOFERES -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/choferes') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuChoferes" role="button" aria-expanded="false">
-      👨‍✈️ Choferes
-      <span class="badge bg-secondary">2</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/choferes') ? 'show' : '' ?>" id="submenuChoferes">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/choferes/lista"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/choferes/lista') ? 'active' : '' ?>">
-          • Mis choferes
-        </a>
-        <a href="/IMPORTADORES/choferes/crear"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/choferes/crear') ? 'active' : '' ?>">
-          • Nuevo chofer
-        </a>
-      </nav>
-    </div>
-
-    <!-- PROVEEDORES -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'active' : '' ?>"
-      data-bs-toggle="collapse" href="#submenuProveedores" role="button" aria-expanded="<?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'true' : 'false' ?>"
-      aria-controls="submenuProveedores">
-      🏭 Proveedores
-      <span class="badge bg-secondary">2</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores') ? 'show' : '' ?>" id="submenuProveedores">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/proveedores" class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/proveedores' ? 'active' : '' ?>">
-          • Lista de Proveedores
-        </a>
-        <a href="/IMPORTADORES/proveedores/crear"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/proveedores/crear') ? 'active' : '' ?>">
-          • Registro de Proveedor
-        </a>
-      </nav>
-    </div>
-
-    <!-- PRODUCTOS FRECUENTES -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/productos_frecuentes') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuProductosFrecuentes" role="button" aria-expanded="false">
-      ⭐ Productos Frecuentes
-      <span class="badge bg-secondary">3</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/productos_frecuentes') ? 'show' : '' ?>" id="submenuProductosFrecuentes">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/productos_frecuentes/alta"
-           class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/productos_frecuentes/alta' ? 'active' : '' ?>">
-          • Alta Producto
-        </a>
-        <a href="/IMPORTADORES/productos_frecuentes/editar"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/productos_frecuentes/editar') ? 'active' : '' ?>">
-          • Ver Productos
-        </a>
-        <!--
-        <a href="/IMPORTADORES/productos_frecuentes/importacion_csv"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/productos_frecuentes/importacion_csv') ? 'active' : '' ?>">
-          • Importación Masiva CSV
-        </a>
-        -->
-      </nav>
-    </div>
-
-    <!-- SOLICITUDES DE IMPORTACIÓN -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/solicitud_importacion') ? 'active' : '' ?>"
-       data-bs-toggle="collapse" href="#submenuSolicitudes" role="button" aria-expanded="false">
-      📄 Solicitudes Importación
-      <span class="badge bg-secondary">2</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/solicitud_importacion') ? 'show' : '' ?>" id="submenuSolicitudes">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/solicitud_importacion/lista"
-           class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/solicitud_importacion/lista' ? 'active' : '' ?>">
-          • Mis solicitudes
-        </a>
-        <a href="/IMPORTADORES/solicitud_importacion/crear"
-           class="nav-link px-3 py-1 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/solicitud_importacion/crear') ? 'active' : '' ?>">
-          • Nueva solicitud
-        </a>
-      </nav>
-    </div>
-
-    <!-- EXPEDIENTE ELECTRÓNICO -->
-    <a class="nav-link px-3 py-2 d-flex justify-content-between align-items-center
-        <?= str_contains($_SERVER['REQUEST_URI'], '/expediente') ? 'active' : '' ?>"
-      data-bs-toggle="collapse" href="#submenuExpediente" role="button" aria-expanded="false">
-      📁 Expediente Electrónico
-      <span class="badge bg-secondary">1</span>
-    </a>
-    <div class="collapse <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/expediente') ? 'show' : '' ?>" id="submenuExpediente">
-      <nav class="nav flex-column ms-3">
-        <a href="/IMPORTADORES/expediente/index"
-           class="nav-link px-3 py-1 <?= $_SERVER['REQUEST_URI'] === '/IMPORTADORES/expediente/consultar' ? 'active' : '' ?>">
-          • Ver expediente
-        </a>
-      </nav>
-    </div>
-
-    <!-- CONFIGURACIÓN -->
-    <a href="/IMPORTADORES/configuracion"
-       class="nav-link px-3 py-2 <?= str_contains($_SERVER['REQUEST_URI'], '/IMPORTADORES/configuracion') ? 'active' : '' ?>">
-      ⚙️ Configuración
-    </a>
-
+    <nav class="sidebar-nav">
+      <ul class="nav flex-column">
+        <!-- INICIO -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/importadores/dashboard" class="nav-link active">
+            <svg class="icon" fill="currentColor" viewBox="0 0 22 21">
+              <path d="M16.975 11H10V4.025a1 1 0 0 0-1.066-.998 8.5 8.5 0 1 0 9.039 9.039.999.999 0 0 0-1-1.066h.002Z"/>
+              <path d="M12.5 0c-.157 0-.311.01-.565.027A1 1 0 0 0 11 1.02V10h8.975a1 1 0 0 0 1-.935c.013-.188.028-.374.028-.565A8.51 8.51 0 0 0 12.5 0Z"/>
+            </svg>
+            <span>Inicio</span>
+          </a>
+        </li>
+        <!-- LOCACIONES -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/importadores/lista" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M10 2C6.686 2 4 4.686 4 8c0 5.25 6 12 6 12s6-6.75 6-12c0-3.314-2.686-6-6-6zm0 8c-1.105 0-2-.895-2-2s.895-2 2-2 2 .895 2 2-.895 2-2 2z"/>
+            </svg>
+            <span>Locaciones</span>
+          </a>
+        </li>
+        <!-- VINCULACIONES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuVinculaciones" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M12.586 4.586a2 2 0 112.828 2.828l-3 3a2 2 0 01-2.828 0 1 1 0 00-1.414 1.414 4 4 0 005.656 0l3-3a4 4 0 00-5.656-5.656l-1.5 1.5a1 1 0 101.414 1.414l1.5-1.5z"/>
+              <path d="M7.414 15.414a2 2 0 01-2.828-2.828l3-3a2 2 0 012.828 0 1 1 0 001.414-1.414 4 4 0 00-5.656 0l-3 3a4 4 0 105.656 5.656l1.5-1.5a1 1 0 10-1.414-1.414l-1.5 1.5z"/>
+            </svg>
+            <span>Vinculación</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuVinculaciones">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/vinculaciones/vinculacionesUsuario" class="nav-link">
+                  Mis vinculaciones
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/vinculaciones/nuevaVinculacion" class="nav-link">
+                  Nueva vinculación
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- TRANSPORTISTAS -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuTransportistas" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M3 4a1 1 0 011-1h12a1 1 0 011 1v2a1 1 0 01-1 1H4a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6zM14 9a1 1 0 00-1 1v6a1 1 0 001 1h2a1 1 0 001-1v-6a1 1 0 00-1-1h-2z"/>
+            </svg>
+            <span>Transportistas</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuTransportistas">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportistas/lista" class="nav-link">
+                  Mis transportistas
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportistas/alta" class="nav-link">
+                  Alta de transportista
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportistas/bulk_upload" class="nav-link">
+                  Carga masiva 
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- TRANSPORTES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuTransportes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M8 16.5a1.5 1.5 0 11-3 0 1.5 1.5 0 013 0zM15 16.5a1.5 1.5 0 11-3 0 1.5 1.5 0 013 0z"/>
+              <path d="M3 4a1 1 0 00-1 1v10a1 1 0 001 1h1.464a1.5 1.5 0 002.072 0h6.928a1.5 1.5 0 002.072 0H17a1 1 0 001-1V5a1 1 0 00-1-1H3zM4 7h12v2H4V7zm0 4h12v2H4v-2z"/>
+            </svg>
+            <span>Transportes</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuTransportes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportes/lista" class="nav-link">
+                  Mis transportes
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportes/crear" class="nav-link">
+                  Nuevo transporte
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/transportes/masivo" class="nav-link">
+                  Carga masiva
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- CHOFERES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuChoferes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clip-rule="evenodd"/>
+            </svg>
+            <span>Choferes</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuChoferes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/choferes/lista" class="nav-link">
+                  Mis choferes
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/choferes/crear" class="nav-link">
+                  Nuevo chofer
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- PROVEEDORES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuProveedores" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
+              <path fill-rule="evenodd" d="M4 3a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V5a2 2 0 00-2-2H4zm12 12H4l4-8 3 6 2-4 3 6z" clip-rule="evenodd"/>
+            </svg>
+            <span>Proveedores</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuProveedores">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/proveedores" class="nav-link">
+                  Lista de Proveedores
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/proveedores/crear" class="nav-link">
+                  Registro de Proveedor
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- PRODUCTOS FRECUENTES -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuProductosFrecuentes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"/>
+            </svg>
+            <span>Productos Frecuentes</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuProductosFrecuentes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/productos_frecuentes/editar" class="nav-link">
+                  Mis productos
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/productos_frecuentes/alta" class="nav-link">
+                  Alta de productos
+                </a>
+              </li>
+              <!-- 
+              <li class="nav-item">
+                <a href="/IMPORTADORES/productos_frecuentes/importacion_csv" class="nav-link">
+                  Importación masiva
+                </a>
+              </li>
+              -->
+            </ul>
+          </div>
+        </li>
+        <!-- SOLICITUDES DE IMPORTACIÓN -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuSolicitudes" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z" clip-rule="evenodd"/>
+            </svg>
+            <span>Solicitudes Importación</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuSolicitudes">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/solicitud_importacion/lista" class="nav-link">
+                  Mis solicitudes
+                </a>
+              </li>
+              <li class="nav-item">
+                <a href="/IMPORTADORES/solicitud_importacion/crear" class="nav-link">
+                  Nueva solicitud
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- EXPEDIENTE ELECTRÓNICO -->
+        <li class="nav-item">
+          <a class="nav-link" data-bs-toggle="collapse" href="#submenuExpediente" role="button" aria-expanded="false">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path fill-rule="evenodd" d="M3 4a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1H4a1 1 0 01-1-1V4zm6 0a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1V4zm6 0a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1H4a1 1 0 01-1-1v-3zm6 0a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1v-3zm6 0a1 1 0 011-1h3a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1v-3z" clip-rule="evenodd"/>
+            </svg>
+            <span>Expediente Electrónico</span>
+            <svg class="collapse-icon" fill="none" stroke="currentColor" viewBox="0 0 10 6">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 4 4 4-4"/>
+            </svg>
+          </a>
+          <div class="collapse" id="submenuExpediente">
+            <ul class="nav flex-column submenu">
+              <li class="nav-item">
+                <a href="/IMPORTADORES/expediente/index" class="nav-link">
+                  Mi expediente
+                </a>
+              </li>
+            </ul>
+          </div>
+        </li>
+        <!-- CONFIGURACIÓN -->
+        <li class="nav-item">
+          <a href="/IMPORTADORES/configuracion" class="nav-link">
+            <svg class="icon" fill="currentColor" viewBox="0 0 20 20">
+              <path d="M5 5V.13a2.96 2.96 0 0 0-1.293.749L.879 3.707A2.96 2.96 0 0 0 .13 5H5Z"/>
+              <path d="M6.737 11.061a2.961 2.961 0 0 1 .81-1.515l6.117-6.116A4.839 4.839 0 0 1 16 2.141V2a1.97 1.97 0 0 0-1.933-2H7v5a2 2 0 0 1-2 2H0v11a1.969 1.969 0 0 0 1.933 2h12.134A1.97 1.97 0 0 0 16 18v-3.093l-1.546 1.546c-.413.413-.94.695-1.513.81l-3.4.679a2.947 2.947 0 0 1-1.85-.227 2.96 2.96 0 0 1-1.635-3.257l.681-3.397Z"/>
+            </svg>
+            <span>Configuración</span>
+          </a>
+        </li>
+      </ul>
+    </nav>
   </div>
 </div>
+
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+<script>
+  // Simular lógica de dashboard
+  document.addEventListener('DOMContentLoaded', function() {
+    const esDashboard = window.location.pathname.includes('/administrador/dashboard');
+    const welcomeText = document.getElementById('welcome-text');
+    const logoutBtn   = document.getElementById('logout-btn');
+        
+    if (!esDashboard) {
+      welcomeText.style.display = 'none';
+      logoutBtn.style.display   = 'inline-block';
+    }
+        
+    // Manejar estados activos basados en URL actual
+    const currentPath = window.location.pathname;
+    const navLinks    = document.querySelectorAll('.nav-link');
+        
+    navLinks.forEach(link => {
+      const href = link.getAttribute('href');
+      if (href && currentPath.includes(href)) {
+        link.classList.add('active');
+      }
+    });
+        
+    // Manejar collapse manualmente
+    document.querySelectorAll('[data-bs-toggle="collapse"]').forEach(trigger => {
+      trigger.addEventListener('click', function(e) {
+        e.preventDefault();
+        e.stopPropagation();
+                
+        const targetId      = this.getAttribute('href');
+        const targetElement = document.querySelector(targetId);
+        const isExpanded    = this.getAttribute('aria-expanded') === 'true';
+                
+        if (targetElement) {
+          if (isExpanded) {
+            // Cerrar
+            targetElement.classList.remove('show');
+            this.setAttribute('aria-expanded', 'false');
+          } else {
+            // Abrir
+            targetElement.classList.add('show');
+            this.setAttribute('aria-expanded', 'true');
+          }
+        }
+      });
+            
+      // Remover el atributo data-bs-toggle para evitar conflictos
+      trigger.removeAttribute('data-bs-toggle');
+    });
+  });
+</script>
\ No newline at end of file
diff --git a/views/vinculaciones/importadores_vinculados.php b/views/vinculaciones/importadores_vinculados.php
index 0722d33..f811547 100644
--- a/views/vinculaciones/importadores_vinculados.php
+++ b/views/vinculaciones/importadores_vinculados.php
@@ -89,7 +89,7 @@
                 <td><?= htmlspecialchars($v['telefono']) ?></td>
                 <td><?= isset($v['fecha_vinculacion']) && $v['fecha_vinculacion'] instanceof DateTime ? $v['fecha_vinculacion']->format('Y-m-d H:i') : '' ?></td>
                 <td>
-                  <a href="/IMPORTADORES/agentes/desvincularAgente?id=<?= $v['id_relacion'] ?>" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Desvincular</a>
+                  <a href="#" onclick="confirmUnlink(<?= $v['id_relacion'] ?>)" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Desvincular</a>
                 </td>
               </tr>
             <?php endforeach; ?>
@@ -108,6 +108,21 @@
         }
       });
     });
+
+    function confirmUnlink(id) {
+      Swal.fire({
+        title: '¿Estás seguro?',
+        text: 'Esta acción no se puede deshacer.',
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Sí, desvincular',
+        cancelButtonText: 'Cancelar'
+      }).then((result) => {
+        if (result.isConfirmed) {
+          window.location.href = `/IMPORTADORES/agentes/desvincularAgente?id=${id}`;
+        }
+      });
+    }
   </script>
 
   <?php if (isset($_GET['success'])): ?>
diff --git a/views/vinculaciones/usuarios_vinculados.php b/views/vinculaciones/usuarios_vinculados.php
index 6b1d5e8..39e6f56 100644
--- a/views/vinculaciones/usuarios_vinculados.php
+++ b/views/vinculaciones/usuarios_vinculados.php
@@ -94,10 +94,10 @@
                   <td><?= htmlspecialchars(ucfirst($v['tipo_vinculacion'] ?? '')) ?></td>
                   <td><?= !empty($v['fecha_vinculacion']) ? $v['fecha_vinculacion']->format('Y-m-d H:i') : '' ?></td>
                   <td>
-                    <?php if (in_array($v['tipo_usuario_sistema'], ['importador', 'agente_aduanal'])): ?>
-                      <a href="/IMPORTADORES/vinculaciones/desvincularAgencia?id=<?= $v['id_relacion'] ?>&tipo=<?= $v['tipo_vinculacion'] ?>" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">
-                        Desvincular
-                      </a>
+                    <?php if ($v['tipo_usuario_sistema'] === 'importador'): ?>
+                      <button onclick="confirmUnlink(<?= $v['id_relacion'] ?>, 'importador')" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Desvincular</button>
+                    <?php elseif ($v['tipo_usuario_sistema'] === 'agente_aduanal'): ?>
+                      <button onclick="confirmUnlink(<?= $v['id_relacion'] ?>, 'agente')" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Desvincular</button>
                     <?php else: ?>
                       <span class="text-muted small">N/A</span>
                     <?php endif; ?>
@@ -120,6 +120,21 @@
         }
       });
     });
+
+    function confirmUnlink(id, tipo) {
+      Swal.fire({
+        title: '¿Estás seguro?',
+        text: 'Esta acción no se puede deshacer.',
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Sí, desvincular',
+        cancelButtonText: 'Cancelar'
+      }).then((result) => {
+        if (result.isConfirmed) {
+          window.location.href = `/IMPORTADORES/vinculaciones/desvincularAgencia?id=${id}&tipo=${tipo}`;
+        }
+      });
+    }
   </script>
 
   <?php if (isset($_GET['success'])): ?>
diff --git a/views/vinculaciones/vinculaciones_importador.php b/views/vinculaciones/vinculaciones_importador.php
index c5739a7..5870af4 100644
--- a/views/vinculaciones/vinculaciones_importador.php
+++ b/views/vinculaciones/vinculaciones_importador.php
@@ -103,7 +103,7 @@
                     <?php else: ?>
                       <a href="/IMPORTADORES/importadores/cambiarAgenciaActiva?id=<?= $v['id_agencia'] ?>" class="btn btn-sm btn-success mt-auto w-auto btn-animated">Usar Agencia</a>
                     <?php endif; ?>
-                    <a href="/IMPORTADORES/importadores/desvincularUsuario?id=<?= $v['id_relacion'] ?>" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Desvincular</a>
+                    <button onclick="confirmUnlink(<?= $v['id_relacion'] ?>)" class="btn btn-sm btn-danger mt-auto w-auto btn-animated">Desvincular</button>
                   </td>
                 </tr>
               <?php endforeach; ?>
@@ -123,6 +123,21 @@
         }
       });
     });
+
+    function confirmUnlink(id) {
+      Swal.fire({
+        title: '¿Estás seguro?',
+        text: 'Esta acción no se puede deshacer.',
+        icon: 'warning',
+        showCancelButton: true,
+        confirmButtonText: 'Sí, desvincular',
+        cancelButtonText: 'Cancelar'
+      }).then((result) => {
+        if (result.isConfirmed) {
+          window.location.href = `/IMPORTADORES/importadores/desvincularUsuario?id=${id}`;
+        }
+      });
+    }
   </script>
 
   <?php if (isset($_GET['success'])): ?>