.sidebar-menu {
	display: table-cell;
	position: relative;
	width: @sidebar-width;
	background: @sidebar-background;
	z-index: 1;
	
	.logo-env {
		padding: @default-padding (@double-margin + @sidebar-horizontal-link-padding);
		border-bottom: 1px solid @sidebar-menu-border;
		&:extend(.clearfix all);
		
		.logo {
			float: left;
			
			.logo-collapsed {
				display: none;
			}
		}
		
		.settings-icon {
			float: right;
			position: relative;
			top: 1px;
			
			a {
				@s: 18px;
				
				color: @main-text-color;
				line-height: 1;
				
				i {
					line-height: 1;
					font-size: @s;
				}

				&:hover {
					color: @main-text-active-color;
				}
			}
		}
	}
	
	
	// Main Menu
	.main-menu {
		padding-left: @double-margin;
		padding-right: @double-margin;
		margin-top: @base-margin;
		margin-bottom: @base-margin;
		list-style: none;
		
		@media screen and (max-width: @screen-sm){
			margin-top: @base-padding;
			margin-bottom: @base-padding;
		}
		
		// Links
		a {
			color: @main-text-color;
			text-decoration: none;
			display: block;
			padding: @sidebar-vertical-link-padding @sidebar-horizontal-link-padding;
			border-bottom: 1px solid @sidebar-menu-border;
			&:extend(.transall);
			
			> i {
				display: inline-block;
				margin-right: @base-padding;
				
				+ span {
					padding-right: @base-padding;
				}
			}
			
			> span {
				display: inline-block;
			}
			
			> .label {
				margin-top: 1px;
			}
			
			> .badge {
				font-size: 75%;
				line-height: 1.2;
			}
			
			&:hover {
				color: @main-text-active-color;
			}
		}
		
		// Active
		li.active > a {
			color: @main-text-active-color;
		}
		
		// With Subs
		li.has-sub {
			
			> a {			
				
				&:before {
					position: relative;
					display: inline-block;
					font-family: 'FontAwesome';
					content: '\f107';
					float: right;
					color: lighten(@sidebar-menu-border, 25%);
					margin-left: @base-padding;
					.rotate(-90deg);
					.transition(~"all 150ms ease-in-out");
				}
			}
			
			&.opened, &.expanded {
				
				> a:before {
					.rotate(0deg);
				}
			}
		}
		
		// First Level
		> li {
			
			&.opened {
				
				> ul {
					display: block;
				}
				
				.opened {
					
					> ul {
						display: block;
					}
				}
			}
		}
		
		// Subs
		ul {
			@sub-spacing: 25px;
			
			display: none;
			margin: 0;
			padding: 0;
			overflow: hidden;
			list-style: none;
			
			li {
				@show-delay: 80ms;
				
				position: relative;
				
				&.is-hidden {
					
					@media screen and (min-width: @screen-sm){
						left: -@base-margin;
						.opacity(0);
					}
				}
				
				&.is-shown {
					left: 0;
					.opacity(1);
					.transition(~"all 200ms ease-in-out");
					
					+ .is-shown { .transition-delay(@show-delay * 1); }
					+ .is-shown + .is-shown { .transition-delay(@show-delay * 1.5); }
					+ .is-shown + .is-shown + .is-shown { .transition-delay(@show-delay * 2); }
					+ .is-shown + .is-shown + .is-shown + .is-shown { .transition-delay(@show-delay * 2.5); }
					+ .is-shown + .is-shown + .is-shown + .is-shown + .is-shown { .transition-delay(@show-delay * 3); }
					+ .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown { .transition-delay(@show-delay * 3.5); }
					+ .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown { .transition-delay(@show-delay * 4); }
					+ .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown { .transition-delay(@show-delay * 4.5); }
					+ .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown { .transition-delay(@show-delay * 5); }
					+ .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown + .is-shown { .transition-delay(@show-delay * 5.5); }
				}
				
				&.hidden-item {
					visibility: hidden;
					.opacity(0);
					.transition(~"all 250ms ease-in-out");
				}
			}
			
			// Second Level
			li a { padding-left: @base-padding + @sub-spacing * 1; }
			
			// Third Level
			li ul li a { padding-left: @base-padding + @sub-spacing * 2; }
			
			// Fourth Level
			li ul li ul li a { padding-left: @base-padding + @sub-spacing * 3; }
			
			// Fifth Level
			li ul li ul li ul li a { padding-left: @base-padding + @sub-spacing * 4; }
		}
	}
		
		
	// Scrollbar
	.ps-scrollbar-x-rail .ps-scrollbar-x,
	.ps-scrollbar-y-rail .ps-scrollbar-y {
		background-color: fade(#fff, 60%);
	}
	
	
	// Fixed sidebar
	&.fixed {
		//position: fixed;
		height: 100%;
		
		.sidebar-menu-inner {
			position: fixed;
			left: 0;
			top: 0;
			bottom: 0;
			width: inherit;
			overflow: hidden;
			
			.page-body.right-sidebar & {
				left: auto;
				right: 0;
			}
		}
	}
	
	
	// Collapsed sidebar
	@media screen and (min-width: @screen-sm) {
	
		&.collapsed {
			width: @sidebar-collapsed-width;
			z-index: 10;
			overflow: visible;
			
			.hidden-collapsed {
				display: none !important;
			}
			
			+ .main-content {
			
				.user-info-navbar {
					
					.user-info-menu {
						
						a[data-toggle="sidebar"] {
							color: @userinfo-link-active-color;
						}
					}
				}
				
				.main-footer {
					left: @sidebar-collapsed-width;
				}
			}
			
			&.fixed {
			}
			
			.sidebar-menu-inner {
				overflow: visible;
				position: relative;
			}
			
			.logo-env {
				@vpadd: 18px;
				
				padding: @vpadd 0;
				
				.logo-collapsed {
					display: block;
					text-align: center;
					
					img {
						display: inline-block;
					}
				}
				
				.logo-expanded, .settings-icon {
					display: none;
				}
				
				.logo {
					float: none;
				}
			}
			
			.main-menu {
				padding-left: 0;
				padding-right: 0;
				
				> li {
					text-align: center;
					position: relative;
					
					&.active, li.active {
						background-color: darken(@sidebar-background, 3%);
					}
	
					> a {
						
						> i {
							margin-right: 0;
							font-size: 16px;
						}
					
						> span {
							display: none;
							
							&.label {
								display: block;
								position: absolute;
								right: 0;
								top: 0;
							}
						}
					}
					
					&.has-sub {
						
						> a:before {
							display: none;
						}
					}
					
					&.opened {
						
						> ul {
							display: none;
						}
					}
					
					> ul {
						position: absolute;
						background: @sidebar-background;
						width: @sidebar-collapsed-submenu-width;
						top: 0;
						left: 100%;
						text-align: left;
						//display: block;
						
						.page-body.right-sidebar & {
							left: auto;
							right: 100%;
						}
						
						// First level
						> li > a {
							padding-left: @base-margin;
						}
						
						> li > ul > li > a {
							padding-left: @base-margin + 15 * 1;
						}
						
						> li > ul > li > ul > li > a {
							padding-left: @base-margin + 15 * 2;
						}
						
						> li > ul > li > ul > li > ul > li > a {
							padding-left: @base-margin + 15 * 3;
						}
						
						> li > ul > li > ul > li > ul > li > ul > li > a {
							padding-left: @base-margin + 15 * 4;
						}
						
						li.has-sub {
							
							> a {
								
								&:before {
									margin-right: @base-padding;
								}
							}
						}
					}
					
					&:hover > ul {
						display: block;
					}
				}
			}
		}
	}
}


// Right sidebar
.page-body.right-sidebar {
	
	.page-container {
		direction: rtl;
		
		> * {
			direction: ltr;
		}
	}
}