/* Shop example search (docs/shop-examples.md): the header product search and its suggestions. */
.myco-header-search > summary {
	list-style: none;
}

.myco-header-search > summary::-webkit-details-marker {
	display: none;
}

.myco-header-search__panel {
	position: absolute;
	z-index: var(--myco-z-menu);
	inset-block-start: 100%;
	inset-inline: var(--myco-space-md);
	padding: var(--myco-space-md);
	border: 1px solid var(--myco-color-border);
	border-radius: var(--myco-radius-md);
	background: var(--myco-color-bg);
	box-shadow: var(--myco-shadow-card);
}

.myco-header-search__panel .search-form {
	position: relative;
}

.myco-product-search__list {
	position: absolute;
	z-index: 1;
	inset-inline: 0;
	inset-block-start: 100%;
	max-block-size: 70vh;
	margin: var(--myco-space-2xs) 0 0;
	padding: var(--myco-space-2xs);
	overflow: auto;
	border: 1px solid var(--myco-color-border);
	border-radius: var(--myco-radius-md);
	background: var(--myco-color-bg);
	list-style: none;
}

.myco-product-search__list [role="option"] {
	display: flex;
	align-items: center;
	gap: var(--myco-space-sm);
	padding: var(--myco-space-2xs) var(--myco-space-xs);
	border-radius: var(--myco-radius-sm);
	cursor: pointer;
}

.myco-product-search__list [aria-selected="true"] {
	background: var(--myco-color-surface);
}

.myco-product-search__list img {
	width: 48px;
	height: 48px;
	object-fit: cover;
}

.myco-product-search__price {
	margin-inline-start: auto;
	color: var(--myco-color-muted);
	font-size: var(--myco-font-size-sm);
}

@media (min-width: 900px) {
	.myco-header-search__panel {
		inset-inline-start: auto;
		inline-size: min(28rem, calc(100vw - 2rem));
	}
}
