/* Estilos para el efecto hover del menú vertical */

/* Contenedor para la línea */
.sidebar-modern .menu-items li {
    position: relative;
  }
  
  /* Línea vertical que aparece en hover */
  .sidebar-modern .menu-items li a::after {
    content: '';
    position: absolute;
    top: 0;
    right: 23.4px; /* La línea aparece al lado derecho */
    width: 2px;
    height: 100%;
    background-color: #000;
    opacity: 0;
    transition: opacity 0.3s ease;
  }
  
  /* Mostrar la línea en hover */
  .sidebar-modern .menu-items li a:hover::after {
    opacity: 1;
  }
  
  /* Asegurarse de que este efecto solo funcione en escritorio */
  @media (max-width: 768px) {
    .sidebar-modern .menu-items li a::after {
      display: none; /* Desactivar en modo móvil */
    }
  }