/*
 * Styles for Site skin "bootstrap_site_navbar_skin"
 */

#evo_site_header {
	.navbar {
		margin-bottom: 0;
		.navbar-header.navbar-header-with-logo {
			.navbar-brand {
				padding: 0;
				img {
					max-height: 100%;
					max-width: 270px;
				}
			}
		}
		.navbar-collapse {
			padding: 0;
			.nav {
				margin: 0;
				
				&.navbar-right {
					border-top: 1px solid; // For separating action buttons from collection links on responsive menu
					padding-top: 9px; // Visual adaptation to the border-top
				}
				
				.evo_widget_basic_menu_link_myprofile {
					padding-top: 4px;
					padding-bottom: 4px;
					line-height: 32px;
					img {
						margin-right: 5px;
						border-radius: 4px;
					}
				}
				
				li {
					// a:hover + .dropdown-menu, .dropdown-menu:hover {
						// display: block;
					// }
					.dropdown-menu {
						border-radius: 0;
						padding: 0;
						li a {
							padding: 10px 20px;
							color: #555;
						}
					}
				}
			}
		}
	}
	
	.level2 ul.nav.nav-pills {
		margin: 15px 0;
	}
}
// Everything bigger than bootstrap-xs
@media (min-width: 768px) {
	#evo_site_header {
		.navbar {
			// Logout/log in button goes to the far right of the navbar
			.container-fluid.level1 {
				padding-right: 0;
			}
			// This positions logo 15px from the left side
			.navbar-header.navbar-header-with-logo {
				.navbar-brand {
					margin-left: -15px;
				}
			}
			.navbar-collapse {
				.nav {
					&.navbar-left {
						margin-right: 15px;
					}
					&.navbar-right {
						border-top: none; // We don't want to see this separation border on regular menu layout
						padding: 0;
						li.evo_widget > a {
							display: inline-block;
						}
						.evo_widget_basic_menu_link_myprofile {
							padding-top: 8px;
							padding-bottom: 9px;
						}
					}
				}
			}
		}
	}
}
// Bootstrap-xs
@media (max-width: 768px) {
	#evo_site_header {
		.navbar {
			// This positions logo 15px from the left side
			.navbar-header.navbar-header-with-logo {
				margin-left: -15px;
			}
			.navbar-collapse {
				.nav li {
					.dropdown-menu {
						background-color: #f8f8f8;
						li a {
							padding: 10px 15px 10px 30px;
							width: 100%;
						}
					}
				}
			}
		}
	}
}

#evo_site_footer {
	background-color: #f5f5f5;
	p {
		margin: 20px 0;
	}
}

// Slide top button
.btn.slide-top {
	opacity: 0;
	visibility: hidden;
	float: right;
	font-size: 20px;
	position: fixed;
	padding: 2px 13px;
	right: 8px;
	top: 8px;
	transition: all 0.3s;
	z-index: 9999;
	&.slide-top-visible {
		opacity: 1;
		visibility: visible;
	}
	&.slide-top-toolbar {
		top: 35px;
	}
	&.slide-top-fixed-header {
		top: 50px;
	}
	&.slide-top-toolbar.slide-top-fixed-header {
		top: 85px;
	}
}

// We need these media queries for controlling margin-top on slide-top button when on devices
@media only screen and (max-device-width: 1024px) {
	.btn.slide-top.slide-top-toolbar {
		top: 8px;
	}
}
@media (min-width: 768px) and (max-width: 991px) and (min-device-width: 1024px) {
	.btn.slide-top.slide-top-toolbar {
		top: 35px;
	}
}