/* Staging indicator */
body.staging #wpadminbar { border-top: 32px solid #ddff00 !important; height: var(--wp-admin--admin-bar--height); }
body.staging #wpadminbar::before, body.staging:not(.admin-bar) .site-header::before {
	background: #ddff00;
	color: #ff00dd;
	content: 'STAGING SITE';
	display: block;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 24px;
	font-weight: bold;
	height: 32px;
	letter-spacing: 0.5em;
	line-height: 32px;
	padding: 0 10px;
	position: fixed; top: 0; right: 0; bottom: auto; left: 0;
	text-align: center;
	z-index: 9999999;
}
body.staging #wpwrap { margin-top: 32px; }

.wp-site-blocks {
	align-items: stretch;
	display: flex;
	flex-direction: column;
	min-height: calc(100vh - var(--wp-admin--admin-bar--height));
}

body.page-template-blank .wp-site-blocks {
	margin-top: calc(var(--wp--style--block-gap) * 2);
	margin-bottom: calc(var(--wp--style--block-gap) * 2);
}

header.site-header {
	border-bottom: var(--wp--custom--header--border-bottom);
	box-shadow: var(--wp--custom--header--box-shadow);
	flex-shrink: 0;
	position: relative;
	z-index: 3;
}

body.locking-header header.site-header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height);
	transition: var(--wp--custom--header--scroll-transition);
}

body.scrolled header.site-header {
	border-bottom: var(--wp--custom--header--border-bottom-scrolled);
	box-shadow: var(--wp--custom--header--box-shadow-scrolled);
}

body.transparent-header header.site-header {
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
}

	header.site-header a, footer.site-footer a {
		text-decoration: none;
	}
	
	/*header.site-header img {
		display: block;
		height: auto;
		max-width: 100%;
		width: auto;
	}*/

	#top_bar {
		background: var(--wp--custom--top-bar--background);
		color: var(--wp--custom--top-bar--text);
	}

		#top_bar a, #top_bar a:visited {
			color: var(--wp--custom--top-bar--text);
		}

		#top_bar a:active, #top_bar a:focus, #top_bar a:hover {
			color: var(--wp--custom--top-bar--text-hover);
		}

	#header {
		background: var(--wp--custom--header--background);
		color: var(--wp--custom--header--text);
	}

main {
	flex-grow: 1;
	flex-shrink: 0;
	margin-block-start: 0 !important;
	overflow: hidden; /* Prevents inner scrollbars with AOS */
	position: relative;
	z-index: 1;
}

body.locking-header main {
	transition: var(--wp--custom--header--scroll-transition);
}

footer.site-footer {
	flex-shrink: 0;
	position: relative;
	z-index: 2;
}

	#footer {
		background: var(--wp--custom--footer--background);
		border-top: var(--wp--custom--footer--border-top);
		color: var(--wp--custom--footer--text);
		padding: var(--wp--custom--footer--padding);
	}
	
		#footer > .wp-block-group:first-child > * {
			align-items: start;
			max-width: calc(33.33vw - var(--wp--style--block-gap));
			min-width: 150px;
		}
	
		#footer a {
			color: var(--wp--custom--footer--text);
		}
		
		#footer a:active, #footer a:focus, #footer a:hover {
			color: var(--wp--custom--footer--text-hover);
		}
		
		/*#footer img {
			display: block;
			height: auto;
			max-width: 100%;
			width: auto;
		}*/

		#footer p, #footer li {
			margin-top: var(--wp--custom--main--half-gap);
		}

@media screen and (min-width: 783px) {

	header.site-header {
		min-height: calc(
			var(--wp--custom--top-bar--height) +
			var(--wp--custom--header--height)
		);
	}

	body.locking-header.scrolled header.site-header {
		min-height: calc(
			var(--wp--custom--top-bar--height) +
			var(--wp--custom--header--height-scrolled)
		);
	}

		#top_bar {
			height: var(--wp--custom--top-bar--height);
			padding: var(--wp--custom--top-bar--padding);
		}

		body.locking-header.scrolled #top_bar {
			min-height: var(--wp--custom--top-bar--height-scrolled);
			padding: var(--wp--custom--top-bar--padding-scrolled);
		}

		#header {
			min-height: var(--wp--custom--header--height);
			padding: var(--wp--custom--header--padding);
			transition: var(--wp--custom--header--scroll-transition);
		}

		body.locking-header.scrolled #header {
			min-height: var(--wp--custom--header--height-scrolled);
			padding: var(--wp--custom--header--padding-scrolled);
		}

			#header .wp-block-site-logo {
				height: auto;
				transition: var(--wp--custom--header--scroll-transition);
				width: var(--wp--custom--header--logo-width);
			}

			#header.logo-alignment-desktop-center .wp-block-site-logo {
				position: relative;
				left: 50%;
				transform: translateX(-50%);
			}

			body.locking-header.scrolled #header .wp-block-site-logo {
				width: var(--wp--custom--header--logo-width-scrolled);
			}
		
				#header .wp-block-site-logo img {
					height: auto;
					max-height: 100%;
					max-width: 100%;
					transition: var(--wp--custom--header--scroll-transition);
					width: 100%;
				}

			body.locking-header.scrolled #header .wp-block-site-logo,
			body.locking-header.scrolled #header .wp-block-site-logo img {
				height: auto;
			}

	#footer > .wp-block-group:not(:last-child) {
		margin-bottom: calc(var(--wp--style--block-gap) * 2);
	}

	#footer > .wp-block-group:last-child {
		margin-bottom: 0;
	}

}

@media screen and (max-width: 1024px) and (min-width: 783px) {

	#header {
		min-height: var(--wp--custom--header--height-tablet);
		padding: var(--wp--custom--header--padding-tablet);
	}

		#header .wp-block-site-logo {
			height: auto;
			width: var(--wp--custom--header--logo-width-tablet);
		}

}

@media screen and (max-width: 782px) {

	body.nav-open {
		overflow-y: scroll;
	}

	#top_bar:not(.mobile-always-visible) {
		display: none;
	}
	
	/* Affix "top bar" to bottom of menu overlay */
	body.nav-open #top_bar:not(.mobile-always-visible) {
		display: block;
		height: auto;
		min-height: var(--wp--custom--top-bar--height-mobile);
		padding: var(--wp--custom--top-bar--padding-mobile);
		position: fixed; top: auto; right: 0; bottom: 0; left: 0;
		z-index: 2;
	}
	
	/*
	Move opened search to top and cover everything else to prevent on-screen keyboard covering form
	Commented out because it causes more problems than it fixes
	@todo Get page to scroll down on focus on the search input, so it's visible
	*/
	/*
	body.nav-open.search-open #top_bar .wp-block-search {
		align-items: center;
		background: var(--wp--custom--top-bar--background);
		display: flex;
		padding: var(--wp--style--block-gap);
		position: fixed; top: calc(var(--wp--custom--header--height-mobile) + var(--wp-admin--admin-bar--height)); right: 0; bottom: 0; left: 0;
		z-index: 3;
	}
	
		body.nav-open.search-open #top_bar .wp-block-search .wp-block-search__inside-wrapper {
			height: var(--wp--custom--top-bar--height-mobile);
		}
		*/

	#header {
		height: var(--wp--custom--header--height-mobile);
		padding: var(--wp--custom--header--padding-mobile);
	}

	body.nav-open #header {
		height: auto !important;
		min-height: calc(100vh - var(--wp-admin--admin-bar--height)) !important;
	}
	
		body #header > .wp-block-group {
			align-items: start;
			flex-direction: column;
			width: 100%;
		}

		#header .wp-block-site-logo {
			height: auto;
			width: var(--wp--custom--header--logo-width-mobile);
		}
		
		#header.logo-alignment-mobile-center .wp-block-site-logo {
			position: relative;
			left: 50%;
			transform: translateX(-50%);
		}

				#header .wp-block-site-logo img {
					height: auto;
					max-height: 100%;
					max-width: 100%;
					width: 100%;
				}

	body.nav-open main, body.nav-open footer.site-footer {
		display: none;
	}

	#footer {
		padding: var(--wp--custom--footer--padding-mobile);
	}
	
		#footer > .wp-block-group {
			display: block;
			max-width: 100% !important;
			min-width: 100% !important;
		}
	
			#footer > .wp-block-group:first-child > * {
				margin-bottom: var(--wp--style--block-gap) !important;
				max-width: 100% !important;
				min-width: 100% !important;
			}
	
}