:root {
	--hbc-menu-bg: #ffffff;
	--hbc-menu-z: 9999;
	--hbc-menu-offset: 0px;
	--hbc-menu-viewport: 100vh;
	--hbc-menu-duration: .3s;
}

@supports (height: 100dvh) {
	:root {
		--hbc-menu-viewport: 100dvh;
	}
}

.hbc-mobile-menu {
	position: fixed;
	left: 0;
	right: 0;
	top: var(--hbc-menu-offset);
	width: 100%;
	height: calc(var(--hbc-menu-viewport) - var(--hbc-menu-offset));
	max-height: calc(var(--hbc-menu-viewport) - var(--hbc-menu-offset));
	z-index: var(--hbc-menu-z);
	background: var(--hbc-menu-bg);
	display: flex;
	flex-direction: column;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	padding-bottom: env(safe-area-inset-bottom);
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	transition:
		opacity var(--hbc-menu-duration) ease,
		transform var(--hbc-menu-duration) ease,
		visibility 0s linear var(--hbc-menu-duration);
}

.hbc-mobile-menu.is-open {
	visibility: visible;
	opacity: 1;
	pointer-events: auto;
	transform: none;
	transition:
		opacity var(--hbc-menu-duration) ease,
		transform var(--hbc-menu-duration) ease,
		visibility 0s linear 0s;
}

.hbc-mobile-menu__inner {
	width: 100%;
	min-height: 100%;
	display: flex;
	flex-direction: column;
}

.hbc-mobile-menu[data-animation="slide-right"] {
	transform: translateX(-100%);
}

.hbc-mobile-menu[data-animation="slide-left"] {
	transform: translateX(100%);
}

.hbc-mobile-menu[data-animation="slide-down"] {
	transform: translateY(-100%);
}

.hbc-mobile-menu[data-animation="slide-up"] {
	transform: translateY(100%);
}

.hbc-mobile-menu[data-animation="zoom"] {
	transform: scale(.92);
}

.hbc-mobile-menu[data-animation="fade"] {
	transform: none;
}

html.hbc-menu-open,
html.hbc-menu-open body {
	overflow: hidden;
	overscroll-behavior: none;
}

html.hbc-menu-open body,
html.hbc-menu-open #wpadminbar {
	padding-right: var(--hbc-menu-scrollbar, 0px);
}

.hbc-menu-toggle {
	cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
	.hbc-mobile-menu {
		--hbc-menu-duration: .01ms;
		transform: none;
	}
}
