.selectrumHelloBar {
	width: 100%;
	height: 50px;
	box-sizing: border-box;
	color: var(--selectrum-hello-bar-foreground, #000000);
	background-color: var(--selectrum-hello-bar-background, #a6c82a);
	font-size: 18px;
	line-height: 1.4;
}

.selectrumHelloBar--fallback {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 99999;
}

.selectrumHelloBar__viewport {
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.selectrumHelloBar__track {
	display: flex;
	width: 100%;
	min-width: 100%;
	height: 100%;
}

.selectrumHelloBar__item {
	display: grid;
	align-content: center;
	box-sizing: border-box;
	flex: 0 0 100%;
	width: 100%;
	height: 100%;
	padding: 0 24px;
	white-space: nowrap;
}

.selectrumHelloBar__item p {
	margin: 0;
}

.selectrumHelloBar__item a {
	color: inherit;
}

.selectrumHelloBar.is-overflowing .selectrumHelloBar__track {
	width: max-content;
	min-width: 0;
	animation: selectrum-hello-bar-marquee var(--selectrum-hello-bar-duration, 24s) linear infinite;
}

.selectrumHelloBar.is-overflowing .selectrumHelloBar__item {
	flex: 0 0 auto;
	width: max-content;
}

.selectrumHelloBar.is-overflowing:hover .selectrumHelloBar__track,
.selectrumHelloBar.is-overflowing:focus-within .selectrumHelloBar__track {
	animation-play-state: paused;
}

@keyframes selectrum-hello-bar-marquee {
	to {
		transform: translateX(-50%);
	}
}

@media (prefers-reduced-motion: reduce) {
	.selectrumHelloBar__viewport {
		overflow-x: auto;
	}

	.selectrumHelloBar.is-overflowing .selectrumHelloBar__track {
		animation: none;
	}

	.selectrumHelloBar__item[aria-hidden="true"] {
		display: none;
	}
}