/* Mobile and installed-app navigation geometry. */
@media (max-width: 1023px) {
	[data-bec-mobile-menu] {
		position: fixed;
		z-index: 49;
		inset-inline: 0;
		top: var(--bec-mobile-menu-top, 4.25rem);
		bottom: auto;
		width: 100%;
		height: var(--bec-mobile-menu-height, calc(100dvh - 4.25rem));
		max-height: none;
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
		touch-action: pan-y;
		scrollbar-width: thin;
		scrollbar-color: rgb(227 6 19 / 55%) transparent;
	}

	[data-bec-mobile-menu]::-webkit-scrollbar {
		width: 5px;
	}

	[data-bec-mobile-menu]::-webkit-scrollbar-track {
		background: transparent;
	}

	[data-bec-mobile-menu]::-webkit-scrollbar-thumb {
		border-radius: 999px;
		background: rgb(227 6 19 / 55%);
	}

	[data-bec-mobile-menu] > nav {
		padding-bottom: max(1rem, env(safe-area-inset-bottom));
	}

	body.bec-mobile-menu-open {
		overflow: hidden;
	}

	body.bec-mobile-menu-open [data-bec-mobile-menu] {
		touch-action: pan-y;
	}
}

@media (max-width: 767px) {
	[data-bec-mobile-menu] {
		height: var(--bec-mobile-menu-height, calc(100dvh - 8.0625rem - env(safe-area-inset-bottom)));
	}

	[data-bec-mobile-actions] {
		min-height: calc(3.8125rem + env(safe-area-inset-bottom));
		padding-bottom: env(safe-area-inset-bottom);
	}

	[data-bec-site-shell] {
		padding-bottom: calc(4rem + env(safe-area-inset-bottom));
	}
}

@media (display-mode: standalone) {
	body {
		padding-top: env(safe-area-inset-top);
	}
}
