/**
 * 
 * 07. Page header styles
 * 
 */


/** 07.01 Page cover **/
.page-cover {
	position: relative;
	padding: 7em 50px 7em 50px;
	overflow: hidden;
	@include transition(opacity $duration-opacity $fn-cubic);

	.woocommerce-breadcrumb {
		text-align: center;
	}

	p {
		line-height: 1em;

		&:last-child {
			margin-bottom: 0;
		}
	}

	&.has-cover-image {

		padding: 5em 2em 5em 2em;
		text-align: center;

		.page-cover-bg {
			position: absolute;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			background-repeat: no-repeat;
			background-size: cover;
			background-position: center center;
			background-attachment: scroll;
			z-index: -1;
			@include transition(opacity $duration-opacity $fn-cubic);

			&.parallax-bg {
				height: 200%;
			}

			&.lazyload-bg,
			&.lazyloading-bg {
				opacity: 0; 
			}
		}

		.woocommerce-breadcrumb {
			color: $color-lighter-gray;
			position: relative;
			z-index: 10;
			opacity: 0.7;

			a {
				color: $color-lighter-gray;
			}
		}

		&.shadow-bottom.page-cover-ready {
			box-shadow: inset 0px -30px 70px -10px rgba(0, 0, 0, 0.5);
		}

		.transparent-header & {
			padding-top: 150px;
		}
	}

	header, 
	.term-description, 
	.taxonomy-description {
		position: relative;
		z-index: 6;
		max-width: 1000px;
		margin: 0 auto;
	}

	.term-description, 
	.taxonomy-description {
		@extend %text-theme;
	}

	header {
		.page-title {
			@extend %uppercase;
		}

		&:last-child {
			margin-bottom: 0;
			padding-bottom: 0;
		}
	}

	.theme-sep {
		display: block;
		width: 100%;
		text-align: center;
		margin-bottom: 1em;
		position: relative;
		z-index: 5;
	}

	.cover-overlay {
		position: absolute;
		opacity: 1;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: #000;
		@include transition(none);
	}

	&.windowheight,
	&.customheight {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
	}

	&.no-page-header {
		header {
			display: none;
		}
	}

	&.no-forced-uppercase {
		header .page-title {
			text-transform: initial !important;
		}
	}
}

.page-cover.has-cover-image + .container-main-content > .row:first-child {
	margin-top: 70px;
}


/** 07.02 Page header **/
.page-header {
	margin-top: 0px;
	border-bottom: 0;
	text-align: center;

	h1 {
		margin-top: 0px;
		margin-bottom: 12px;
		text-align: center;
		font-size: 72px;
		line-height: 0.9em;
		font-weight: 900;
		letter-spacing: 5px;
		word-break: break-word;

		&:last-child {
			margin-bottom: 0;
		}

		@include until($bp-sm) {
			font-size: 56px;
			letter-spacing: 0.02em;
		}
		
		@include until($bp-xs) {
			font-size: 48px;
		}

		@include until($bp-xxs) {
			font-size: 10vw;
		}
	}

	.entry-meta {
		font-weight: 700;
	}

	span {
		color: $color-dark-gray;
	}

	ul.categories,
	ul.nav {
		position: relative;

		li {
			display: inline-block;
			font-size: 12px;

			a {
				@extend %text-theme;
				padding: 0 12px;
				@include color-link-inv();
				
				.dark & {
					@include color-link-dark-white();
				}
			}

			&:hover {
				.sub-menu {
					@extend %dropdown-visible;
				}
			}

			.sub-menu {
				a, a:visited {
					color: $color-darker-gray;	
					background-color: transparent;	

					&:hover {
						color: $color-primary; /* redux[color: main_theme_color] */
					}
				}
			}

			mark {
				background-color: transparent;
				color: $color-light-gray;
			}
		}

		> li {
			@include until($bp-xxs) {
				position: static;
				
				.sub-menu {
					width: 100%;
					max-width: 100%;
					
					li {
						width: 100%;
					}
				}
			}
		}

		&:after {
			content: '';
			position: absolute;
			top: -6px;
			width: 100%;
			height: 2px;
			background-color: #fff;
			left: 0;
			opacity: 0.1;
		}

	}
}

// Bottom navigation positioning
.page-cover.bottom-nav {
	.page-header {
		position: static;
		padding-bottom: 0;

		.page-title {
			position: relative;
			margin-bottom: 0;
		}

		.page-title, 
		ul.categories,
		ul.nav {
			z-index: 1;
		}

	}

	ul.categories,
	ul.nav {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		padding: 1.5em;

		&:after {
			display: none;
		}
	}
}

.pre-header-lead {
	margin-bottom: 0;
	font-size: 14px;
	letter-spacing: 9px;
}

// Page header in section
.section .page-header {
	margin-bottom: 0;
	padding-bottom: 0;
	h1 {
		font-size: 52px;
		padding: 0;
		background-color: transparent;
	}
}

// Hide inner header when page header in section has already shown
.no-inner-header .page-header {
	display: none;
	&.content-header {
		display: block;
	}
}
