body.jondi-ui-refresh.home {
	--jondi-hour-nav-top-offset: env(safe-area-inset-top, 0px);
}

body.jondi-ui-refresh.home .jondi-home-event-list > .jondi-time-group {
	scroll-margin-top: calc(env(safe-area-inset-top, 0px) + 76px);
}

.jondi-mobile-hour-nav {
	position: fixed;
	z-index: 180;
	top: 0;
	left: 0;
	width: 0;
	height: 0;
	pointer-events: auto;
}

.jondi-mobile-hour-nav[hidden] {
	display: none;
}

.jondi-mobile-hour-nav__stack {
	position: fixed;
	z-index: 180;
	display: flex;
	box-sizing: border-box;
	max-width: calc(100vw - 20px);
	overflow-x: auto;
	overflow-y: hidden;
	padding: 5px;
	border: 1px solid rgba(107, 25, 71, .18);
	border: 1px solid color-mix(in srgb, var(--jondi-wine) 18%, transparent);
	border-radius: 11px;
	background: rgba(255, 253, 249, .94);
	background: color-mix(in srgb, var(--jondi-paper) 94%, transparent);
	box-shadow: 0 8px 24px rgba(38, 0, 24, .16);
	overscroll-behavior-inline: contain;
	pointer-events: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}

.jondi-mobile-hour-nav__stack::-webkit-scrollbar {
	display: none;
}

.jondi-mobile-hour-nav__top {
	top: calc(env(safe-area-inset-top, 0px) + 10px);
	left: 10px;
}

.jondi-mobile-hour-nav__bottom {
	left: 10px;
	bottom: calc(env(safe-area-inset-bottom, 0px) + 10px);
	max-width: calc(100vw - 100px);
	flex-direction: row;
}

.jondi-mobile-hour-nav__link {
	position: relative;
	z-index: 1;
	display: inline-flex;
	box-sizing: border-box;
	min-width: 50px;
	height: 44px;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0 9px;
	border: 1px solid var(--jondi-line);
	border-radius: 8px;
	background: var(--jondi-paper);
	color: var(--jondi-wine) !important;
	font: 700 14px/1 'Space Grotesk', sans-serif;
	letter-spacing: -.01em;
	text-decoration: none !important;
	box-shadow: 0 2px 7px rgba(38, 0, 24, .1);
	touch-action: manipulation;
}

.jondi-mobile-hour-nav__link + .jondi-mobile-hour-nav__link {
	margin-left: -4px;
}

.jondi-mobile-hour-nav__link[aria-current="location"] {
	position: relative;
	z-index: 2;
	border-color: var(--jondi-wine);
	background: var(--jondi-yellow);
	color: var(--jondi-ink) !important;
	box-shadow: 0 4px 12px rgba(38, 0, 24, .2);
}

.jondi-mobile-hour-nav__link:focus-visible {
	position: relative;
	z-index: 3;
	outline: 3px solid var(--jondi-ink);
	outline-offset: 2px;
}

@media (min-width: 761px) {
	.jondi-mobile-hour-nav {
		display: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.jondi-ui-refresh.home .jondi-home-event-list > .jondi-time-group {
		scroll-behavior: auto;
	}
}