//* Base Header *//

// Settings

// BEGIN: Header
$header_zindex:			 														$zindex-navbar;
$header_transition: 															0.2s;
$header_height:                                                   				100px;  
$topbar_height:																	44px;
$header_on-scroll-height:                                         				65px;  

// Desktop mode
$header_desktop_brand-margin: 													38px 0 37px 0;  
$header_desktop_mega-menu-primary-link-padding: 								41px 15px 39px 15px; 
$header_desktop_mega-menu-btn-margin: 											34px 15px 33px 15px; 
$header_desktop_mega-menu-btn-icon-margin: 										24px 5px 18px 5px;
$header_desktop_mega-menu-quick-sidebar-toggler-padding:						44px 0 40px 15px; 
$header_desktop_mega-menu-dropdown-link-font-size:                              14px;
$header_desktop_mega-menu-dropdown-link-uppercase-font-size:                    12px;

$header_desktop_mega-menu-quick-search-close-icon-top:							50px;
$header_desktop_mega-menu-quick-search-close-icon-right:						-2px;
$header_desktop_mega-menu-quick-search-form-control-padding:					10px 0;

$header_desktop_min-header-brand-margin:										22px 0 19px 0;  
$header_desktop_min-header-mega-menu-primary-link-padding: 						23px 15px 21px 15px;
$header_desktop_min-header_mega-menu-btn-margin: 								15px 15px 16px 15px; 
$header_desktop_min-header_mega-menu-btn-icon-margin: 							6px 5px 7px 5px;
$header_desktop_min-header_mega-menu-quick-sidebar-toggler-padding:				26px 0 24px 15px; 

$header_desktop_min-header-mega-menu-quick-search-close-icon-top:				33px;
$header_desktop_min-header-mega-menu-quick-search-form-control-padding:			10px 0;

// END


@import '_mixins'; 

// BEGIN: General mode

.c-layout-header {
	@include clearfix();

	//	Topbar
	.c-topbar {
		@include clearfix();	

		.c-top-menu {	
			@include inline-block();
			@include reset-padmar();
			
			> .c-icons,
			> .c-links,
			> .c-ext {
				float: left;
				display: inline-block;
				height: $topbar_height;
				@include reset-padmar();  
   
				list-style-type: none;
		    	
		    	> li {
		    		display: inline-block;
		    	}
			}

			> .c-icons {
		    	
		    	> li {
		    		padding: 11px 3px 11px 3px; 


		    		> a {
		    			font-size: 14px;

		    			> i {
		    				font-size: 15px;
		    				padding: 6px 6px;
		    			}
		    		}

		    		> span {
		    			font-size: 15px;
		    		}

		    		> a {
						
		    			&:active,
		    			&:hover,
		    			&:focus {
		    				cursor: pointer;
		    				text-decoration: none;		    			
		    			}
		    		}
		    	}
			}

			> .c-links {
		    	
		    	> li {
		    		padding: 10px 3px 8px 3px; 

		    		> a:not(.btn),
		    		> span {
		    			font-size: 15px;
		    			> i {
		    				font-size: 16px;
		    			}
		    		}

		    		> a:not(.btn) {						
		    			&:active,
		    			&:hover,
		    			&:focus {
		    				cursor: pointer;
		    				text-decoration: none;		    			
		    			}
		    		}

		    		&.c-divider {
		    			position: relative;
		    			font-size: 13px;
		    			top: -1px;
		    		}
		    	}
			}

			> .c-ext > li {
				margin: 0;
				padding: 0;

				> a > i {
					font-size: 15px;
					position: relative;
					top: 3px;
				}

				&.c-lang {
					margin: 8px 10px 0 15px;

					&.c-last {
						margin-right: 0;
					}

					> a {		
						display: inline-block;		
						float: left;
						padding: 7px 7px 5px 7px;
						height: 28px;
						font-size: 12px;
						font-weight: 500;
						text-transform: uppercase;
						letter-spacing: 1px;
					}

					> .dropdown-menu {
						@include border-radius(0);
						min-width: 155px;
						padding: 0;
						margin:0;

						> li {
							padding: 0;
							> a {	
								letter-spacing: 1px;
								font-size: 12px;
								font-weight: 500;
								text-transform: uppercase; 
								padding: 8px 12px; 	
							}
						}
					}
				}

				&.c-search {
					margin-top: 8px;

					> form {
						float: left;
						padding: 0;
						margin: 0;
						position: relative;

						> .form-control {
							font-weight: 400;
							border: 0;
							border-radius: 0;
							padding: 4px 14px 2px 6px;
							height: 28px;
							font-size: 12px;
							text-transform: uppercase;
						}

						> i {
							cursor: pointer;
							font-size: 13px;
							position: absolute;
							top: 8px;
							right: 8px;
						}
					}
				}
			}
		}
	}

	//	Navbar
	.c-navbar {
		@include clearfix();		
	}

	// Header brand
	.c-brand {
		transition: all $header_transition;
			
		@include inline-block();

		> .c-hor-nav-toggler { 
			display: none;
		}

		> .c-search-toggler {
			display: none;
		}

		// hide when full view quick search is shown 
		.c-layout-quick-search-shown & {
			display: none;
		}

		// logo
		.c-desktop-logo {
			display: block;
		}
				
		.c-desktop-logo-inverse {
			display: none;
		}
	}

	// Quick search
	.c-quick-search {
		display: none;
		padding: 0;
		margin: 0;
		transition: all $header_transition;  
		position: relative;

		@include clearfix();

		// search shown state
		.c-layout-quick-search-shown & {
			display: block;
			transition: all $header_transition;
		}
				
		> .form-control {
			display: block;
			font-size: 22px;
			font-weight: 400;
			border: 0;				
			background: transparent;
			box-shadow: none;
			@include border-radius(0);

			// remove IE10+ clear icon
			&::-ms-clear {
	    		display: none;
			}

			&:focus,
			&:active {
				box-shadow: none;
			}
		}

		> span {
			display: inline-block;
			position: absolute;
			font-size: 36px;
			font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

			&:hover {
				cursor: pointer;
			}
		}
	}
}

// END

// BEGIN: Desktop mode

@media (min-width: $screen-md-min) { /* 992px */
	// Base header
	.c-layout-header {

		&.c-no-border {
			border-bottom: 0 !important;
		}

		// Topbar 
		.c-topbar {
			> .container-fluid {
				padding: $layout-fluid-padding;
			}
		}

		//	Navbar
		.c-navbar {
			line-height: 0px;
			// reset container position for mega menu support
			> .container {
				position: relative;
			}

			> .container-fluid {
				position: relative;
				padding: $layout-fluid-padding;
			}	
		}

		// Header brand
		.c-brand {
			margin: $header_desktop_brand-margin;

			.c-desktop-logo-inverse {
				display: none;
			}

			.c-desktop-logo {
				display: inline-block;
			}

			.c-mobile-logo {
				display: none;
			}
		}

		// Quick search
		.c-quick-search {
			> .form-control {
				padding: $header_desktop_mega-menu-quick-search-form-control-padding;
				height: $header_height;
			}

			> span {
				top: $header_desktop_mega-menu-quick-search-close-icon-top;
				right: $header_desktop_mega-menu-quick-search-close-icon-right;
			}
		}
	}

	// Fixed header
	.c-layout-header-fullscreen.c-layout-header-static .c-layout-header,
	.c-layout-header-fixed .c-layout-header {     
		top: 0;
		position: fixed;
		z-index: $header_zindex;
		width: 100%;
	}	

	.c-layout-header-fixed .c-layout-page {
		margin-top: $header_height;
	}

	.c-layout-header-fixed.c-layout-header-topbar .c-layout-page {
		margin-top: $header_height + $topbar_height;
	}

	.c-layout-header-fullscreen .c-layout-page,
	.c-layout-header-fullscreen.c-layout-header-fixed.c-layout-header-topbar .c-layout-page {
		margin-top: 0;
	}

	// Minimized mode on scroll
	.c-page-on-scroll.c-layout-header-static .c-layout-header {
		display: none;
	}

	.c-page-on-scroll.c-layout-header-fixed .c-layout-header {
		height: $header_on-scroll-height; 
		line-height: 0px;

		//	Topbar
		.c-topbar { 
			transition: all $header_transition;
			display: none;
		}

		// Brand
		.c-brand {
			transition: margin $header_transition;
			margin: $header_desktop_min-header-brand-margin;

			// logo
			.c-desktop-logo {
				display: none;
			}

			.c-desktop-logo-inverse {
				display: block;
			}
		}

		// Horizontal Navigation bar
		.c-mega-menu {		
			line-height: 0px;	
			
			.nav.navbar-nav > li {
				
				// link
				> .c-link {
					transition: all $header_transition;  
					padding: $header_desktop_min-header-mega-menu-primary-link-padding;
					min-height: $header_on-scroll-height;
				}

				// Quick sidebar toggler

				> .c-quick-sidebar-toggler {
					transition: all $header_transition;  
					padding: $header_desktop_min-header_mega-menu-quick-sidebar-toggler-padding;
				}

				// button
				> .c-btn {
					transition: all $header_transition;
					margin: $header_desktop_min-header_mega-menu-btn-margin;
				}

				// icon
				> .c-btn-icon {
					transition: all $header_transition;
					margin: $header_desktop_min-header_mega-menu-btn-icon-margin;
				}		
			}		
		}

		// Quick search form
		.c-quick-search {
			> .form-control {
				font-size: 22px;
				padding: $header_desktop_min-header-mega-menu-quick-search-form-control-padding;
				height: $header_on-scroll-height;
			}

			// close icon
			> span {
				font-size: 36px;
				top: $header_desktop_min-header-mega-menu-quick-search-close-icon-top;
			}
		}
	}
}

// END