.soyyo-header-utilities {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: var(--egt-token-color-text-primary, var(--contrast, #222));
}

.soyyo-header-utility {
	position: relative;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: inherit;
	text-decoration: none;
	cursor: pointer;
	transition: color 160ms ease;
}

.soyyo-header-utility:hover,
.soyyo-header-utility:focus-visible {
	background: transparent;
	color: var(--egt-token-color-accent, var(--accent, #1e73be));
}

.soyyo-header-utility:focus-visible,
.soyyo-header-search input:focus-visible,
.soyyo-header-search button:focus-visible {
	outline: 2px solid var(--egt-token-color-accent, var(--accent, #1e73be));
	outline-offset: 2px;
}

.soyyo-header-utility svg {
	width: 23px;
	height: 23px;
}

.soyyo-header-utility__badge {
	position: absolute;
	top: 2px;
	right: 1px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 17px;
	height: 17px;
	padding: 0 4px;
	border-radius: 9px;
	background: var(--egt-token-color-text-primary, var(--contrast, #222));
	color: var(--egt-token-color-surface-primary, #fff);
	font-size: 10px;
	font-weight: 600;
	line-height: 1;
}

.soyyo-header-search {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	z-index: 100;
	width: min(360px, calc(100vw - 32px));
	padding: 12px;
	background: var(--egt-token-color-surface-primary, var(--base-3, #fff));
	box-shadow: 0 8px 24px rgb(17 24 39 / 14%);
}

.soyyo-header-search form {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto;
	gap: 8px;
	align-items: center;
}

.soyyo-header-search input[type="search"] {
	min-width: 0;
	height: 42px;
	margin: 0;
}

.soyyo-header-search button {
	min-height: 42px;
	padding: 8px 14px;
}

.soyyo-header-search .soyyo-header-search__close {
	width: 42px;
	padding: 0;
	background: transparent;
	color: var(--egt-token-color-text-secondary, var(--contrast-2, #575760));
	font-size: 26px;
	line-height: 1;
}

.main-navigation .menu-bar-items {
	margin-left: auto;
}

@media (max-width: 768px) {
	.soyyo-header-utility {
		width: 44px;
		height: 44px;
	}

	.soyyo-header-utilities {
		gap: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.soyyo-header-utility {
		transition: none;
	}
}