/*------------------------------------------------*/
/*	Main Navigation
/*------------------------------------------------*/

.main-nav-toggle {
	float: left;
	color: #fff;

	i {
		font-size: 28px;
	}

	&:hover, &:focus {
		color: #ddd;
	}
}

/* breadcrumb */
.breadcrumb {

	li+li:before {
		font-family: FontAwesome;
		font-size: 14px;
		content: "\f105";
		color: #b2b6bf;
		margin-right: 2px;
		padding: 0 5px 0 2px;
		position: relative;
		top: 1px;
	}
}

/* main menu */
ul.main-menu {
	padding-left: 0;
	list-style-type: none;

	> li {
		a {
			display: block;
			position: relative;
			padding: 13px 0 13px 15px;
			font-size: 14px;
			color: $base-font-color-dark;
			background-color: #ececec;
			border-top: 1px solid darken($body-bg-color, 5%);
			text-decoration: none;

			&:hover {
				text-decoration: none;
				background-color: lighten($body-bg-color, 2%);
			}
		}

		&.active {
			> a {
				background-color: darken($body-bg-color, 5%);
			}
		}

		&:first-child {
			> a {
				border-top: none;
			}
		}

		i {
			width: 14px;
			text-align: center;
		}

		.text {
			padding-left: 8px;
			font-size: 0.9em;
		}

		.toggle-icon {
			font-size: 14px;
			width: 10px;
			position: absolute;
			right: 10px;
			top:16px;
			text-shadow: none;
		}
	}

	.sub-menu {
		position: relative;
		display: none;
		padding-left: 0;

		&.open {
			overflow: hidden;
			display: block;
		}

		li {
			a {
				padding-left: 33px;
			}

			&.active {
				> a {
					font-weight: 700;
				}
			}
		}

		.sub-menu li a {
			padding-left: 50px;
		}
	}
}

ul.main-menu > li > a,
.content-wrapper {
	@include transition(all 0.3s ease-in-out);
}

.left-sidebar {
	@include transition(all 0.3s ease-in-out);

	width: 230px;
	padding-right: 0;
	padding-left: 0;
	left: 0;
	position: absolute;
	float: none;
	z-index: 999;
	background-color: #ececec;

	&.minified {
		width: 40px;
		margin-right: -40px;
		z-index: 9;

		.main-menu > li {
			position: relative;

			i {
				width: 40px;
			}

			.toggle-icon {
				display: none;
			}

			> a {
				padding-left: 0;

				> .text {
					display: none;
				}
			}

			&:hover > a > .text {
				position: absolute;
				display: block;
				left:  40px;
				top: -1px;
				min-width: 200px;
				z-index: 9999;
				padding: 13px 10px;
				border: 2px solid #dfdfdf;
				line-height: 1.5;
				background: #dfdfdf;
				font-weight: 700;
				opacity: 1 !important;
			}

			&:hover > ul.sub-menu {
				display: block !important;
				min-width: 200px;
				position: absolute;
				margin-left: 40px;
				z-index: 9999;
				border: 1px solid #E4E4E4;
				border-top: none;
				list-style-type: none;

				> li > a {
					padding-left: 10px;
				}
			}
		}
	}

	&.sidebar-hide-left {
		left: -230px;
	}

	@include max-screen($break-medium) {
		left: -230px;
	}
}

body.sidebar-float .left-sidebar {
	left: -230px;
	@include box-shadow(1px 4px 5px 4px rgba(0, 0, 0, 0.3));

	&.sidebar-float-active {
		left: 0;
	}
}

body.sidebar-fixed .left-sidebar {
	position: fixed;
	height: 100%;
}

body.focus-mode .left-sidebar {
	@include opacity(0);
}

.sidebar-minified {
	text-align: center;
	position: relative;
	margin: 8px 0;

	@include max-screen($break-medium) {
		display: none;
	}

	&:before {
		@include inline-block;

		content: "";
		height: 0;
		border-top: 1px solid #c4c4c4;
		position: absolute;
		left: 10px;
		right: 10px;
		top: 13px;
	}

	i {
		@include inline-block;
		@include border-radius(25px);
		
		width: 25px;
		height: 25px;
		position: relative;
		border: 1px solid #A2A2A2;
		color: #A2A2A2;
		padding: 4px;
		background-color: #f1f1f1;
		cursor: pointer;

		&:hover {
			background-color: #f6f6f6;
		}
	}
}

.toggle-sidebar-collapse {
	color: #fff;
	font-size: 22px;
	margin-right: 15px;
	line-height: 34px;

	&:hover, &:active, &:focus {
		color: #fff;
	}
}

/* main content navigation */
.main-content-nav {
	ul {
		line-height: 34px;
	}

	li {
		padding-left: 10px;
		padding-right: 10px;

		a {
			color: lighten($base-font-color-dark, 20%);
			text-decoration: none;

			&:hover, &:focus {
				color: $base-font-color-dark;
			}
		}
	}

	@include max-screen($break-small) {
		float: none !important;
		margin-top: 15px;
	}
}

/* on-top navigation */
body.ontop-nav .top-bar {
	padding: 0;

	.logo {
		top: 14px;
	}

	.right {
		position: relative;
		top: 8px;
	}

	.navbar-toggle {
		@include box-shadow(none);

		display: block;
		padding: 0;
		border: none;
		background: none;
		font-size: 21px;

		&:hover,
		&:active,
		&:focus {
			color: #fff;
		}
	}

	@include min-screen($break-large) {
		.navbar-toggle {
			display: none;
		}
	}

	@include screen($break-small, $break-large - 1px) {
		.navbar-collapse.collapse {
			display: none !important;
		}
	}

	@include min-screen($break-small) {
		.collapse.in {
			display: block !important;
		}
	}
}

#main-navbar-collapse {
	float: right;
	margin-left: 15px;
	max-height: none;

	.navbar-nav > li > a {
		color: #fff;

		&:hover,
		&:focus,
		&:visited {
			color: #fff;
			background-color: darken($top-bar-bg-color, 5%);
		}

		i {
			margin-right: 3px;
		}
	}

	.nav .open > a {
		&,
		&:hover
		&:focus {
			color: #fff;
			background-color: darken($top-bar-bg-color, 5%);
		}
	}

	.dropdown-menu {
		@include box-shadow(none);

		min-width: 200px;
		padding: 0;
		border: none;
		background-color: darken($top-bar-bg-color, 5%);

		> li > a {
			padding-left: 15px;
			padding-right: 15px;
			color: #fff;
			font-size: 13px;

			&:hover,
			&:focus,
			&:active,
			&.active {
				background-color: darken($top-bar-bg-color, 8%);
			}
		}
	}

	@include max-screen($break-large) {
		width: 100%;
		margin-left: 0;

		.navbar-nav > li {
			float: none;
		}

		.navbar-nav > li > a {
			padding-left: 0;

			&:hover,
			&:focus,
			&:visited {
				background-color: transparent;
			}
		}

		.dropdown-menu {
			background-color: transparent;

			> li > a {
				padding-left: 25px;

				&:hover,
				&:focus,
				&:active,
				&.active {
					background-color: transparent;
				}
			}
		}

		.navbar-nav .open .dropdown-menu {
			position: static;
			float: none;
			width: auto;
			margin-top: 0;
			background-color: rgba(0, 0, 0, 0);
			border: 0;
			-webkit-box-shadow: none;
			box-shadow: none;
		}
	}
}




