/* Search box suggestions: auto-complete.min.js (assets/vendor/auto-complete, used by assets/js/utils.js).
   The script appends div.autocomplete-suggestions to <body> and sets its left/top/width inline under the input:
   without position:absolute here the box is drawn at the bottom of the page. Loaded by every theme that uses it
   (grau.ro, black) with the | asset filter, so a change here reaches browsers at once (?v=<filemtime>).
   fashion.grau.ro uses easy-autocomplete instead, styled in its own app.css. */
.autocomplete-suggestions {
	position: absolute;
	display: none;
	z-index: 9999;
	max-height: 420px;
	overflow-y: auto;
	overflow-x: hidden;
	box-sizing: border-box;
	text-align: left;
	cursor: default;
	background: #fff;
	border: 1px solid #e1e1e1;
	border-top: 0;
	border-radius: 0 0 6px 6px;
	box-shadow: 0 10px 24px rgba(0, 0, 0, .12);
	-webkit-overflow-scrolling: touch;
}
/* one product per row: image | name, shop, price (utils.js renderItem) */
.autocomplete-suggestion {
	position: relative;
	display: flex;
	align-items: center;
	margin: 0;
	padding: 8px 10px;
	font-size: 13px;
	line-height: 1.35;
	color: #333;
	border-bottom: 1px solid #f0f0f0;
	overflow: hidden;
}
.autocomplete-suggestion:last-child { border-bottom: 0; }
.autocomplete-suggestion.row { --bs-gutter-x: 0; margin-left: 0; margin-right: 0; flex-wrap: nowrap; }
.autocomplete-suggestion .col-3 { flex: 0 0 64px; max-width: 64px; padding: 0 10px 0 0; }
.autocomplete-suggestion .col-9 { flex: 1 1 auto; max-width: none; min-width: 0; padding: 0; }
.autocomplete-suggestion img { display: block; width: 54px; height: 54px; object-fit: contain; }
.autocomplete-suggestion b {
	display: block;
	font-weight: 600;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.autocomplete-suggestion.selected,
.autocomplete-suggestion:hover { background: #f5f6f8; cursor: pointer; }

@media (max-width: 575px) {
	.autocomplete-suggestions { max-height: 60vh; }
	.autocomplete-suggestion img { width: 44px; height: 44px; }
	.autocomplete-suggestion .col-3 { flex-basis: 54px; max-width: 54px; }
}