#sidebar, #sidebar .nav-link {
			transition: none !important;
		}
        #sidebar {
            min-width: 250px;
            max-width: 250px;
            background-color: #202123;
            transition: all 0.3s;
        }
        #sidebar.collapsed {
            margin-left: -250px;
        }
        #sidebar .nav-link {
            color: #ececf1;
        }
        #sidebar .nav-link:hover {
            background-color: #343541;
        }
        #content {
            flex: 1;
            padding: 20px;
        }
        .navbar {
            background-color: #202123;
        }
        .navbar .navbar-brand, .navbar .navbar-text, .navbar .btn {
            color: #ececf1;
        }
        .navbar .btn:hover {
            background-color: #343541;
        }
        .dropdown-menu {
            z-index: 9999;
        }
        /* Estilo especial para opción de rangos */
        .nav-link.rangos {
            color: #ff8e53 !important;
            font-weight: 500;
        }
        .nav-link.rangos:hover {
            color: #ffaa7a !important;
        }
        
        /* Ocultar sidebar por defecto en pantallas pequeñas */
        @media (max-width: 768px) {
            #sidebar {
                margin-left: -250px;
            }

            #sidebar.show {
                margin-left: 0;
            }
        }
        
        /* Nuevos estilos para la barra superior */
        .navbar-actions {
            display: flex;
            align-items: center;
            gap: 10px;
        }
        
        .separator {
            width: 1px;
            height: 30px;
            background-color: rgba(255, 255, 255, 0.2);
            margin: 0 10px;
        }
        
        .user-info {
            display: flex;
            align-items: center;
            margin-left: auto;
        }
        
        .user-text {
			margin-right: 10px;
			white-space: nowrap;
			overflow-x: auto;         /* Permite scroll horizontal */
			overflow-y: hidden;
			display: inline-block;
			max-width: 300px;         /* Ajusta según necesites */
			-webkit-overflow-scrolling: touch; /* Para scroll suave en móviles */
        }
        
        @media (max-width: 768px) {
            .user-text {
                max-width: 120px;
            }
        }