/* ============================================================
   Wisest Search Pro — premium autocomplete
   ============================================================ */

.wsp-dropdown {
	position: absolute;
	top: calc( 100% + 10px );
	right: 0;
	width: 420px;
	max-width: min( 94vw, 460px );
	background: #fffdfa;
	border: 1px solid #ece5db;
	border-radius: 16px;
	box-shadow:
		0 2px 6px rgba( 30, 22, 12, .04 ),
		0 24px 60px -12px rgba( 30, 22, 12, .22 );
	z-index: 100050;
	overflow: hidden;
	opacity: 0;
	transform: translateY( -8px );
	pointer-events: none;
	transition: opacity .2s ease, transform .2s ease;
	font-family: inherit;
	text-align: left;
	direction: ltr;
}
.wsp-dropdown .wsp-item,
.wsp-dropdown .wsp-info,
.wsp-dropdown .wsp-info > * {
	text-align: left !important;
}
.wsp-dropdown.is-open {
	opacity: 1;
	transform: translateY( 0 );
	pointer-events: auto;
}

/* --- Group header --- */
.wsp-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 14px 20px 10px;
	position: sticky;
	top: 0;
	background: #fffdfa;
	z-index: 2;
}
.wsp-head-label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	color: #a89f90;
}
.wsp-head-count {
	font-size: 11px;
	font-weight: 600;
	color: #9a9182;
	background: #f3ede4;
	border-radius: 20px;
	min-width: 20px;
	height: 20px;
	padding: 0 7px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* --- Preloader --- */
.wsp-preloader {
	display: none;
	align-items: center;
	justify-content: center;
	padding: 34px 0;
}
.wsp-dropdown.is-loading .wsp-preloader {
	display: flex;
}
.wsp-dropdown.is-loading .wsp-results {
	opacity: .35;
}
.wsp-dropdown.is-loading .wsp-results:empty {
	display: none;
}
.wsp-spinner {
	width: 26px;
	height: 26px;
	border: 2px solid #ebe3d7;
	border-top-color: #8ba766;
	border-radius: 50%;
	animation: wsp-spin .7s linear infinite;
}
@keyframes wsp-spin {
	to { transform: rotate( 360deg ); }
}

/* --- Results --- */
.wsp-results {
	max-height: min( 72vh, 560px );
	overflow-y: auto;
	padding: 4px 8px 8px;
	overscroll-behavior: contain;
}
.wsp-results::-webkit-scrollbar {
	width: 8px;
}
.wsp-results::-webkit-scrollbar-thumb {
	background: #e2dacd;
	border-radius: 8px;
	border: 2px solid #fffdfa;
}

/* Reset: the search form sits inside .main-navigation, whose `a` rules would
   otherwise pollute our anchors (inline-block, underline ::after, uppercase). */
.wsp-dropdown .wsp-item {
	display: flex !important;
	position: relative !important;
	float: none !important;
	width: 100% !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	max-width: none !important;
	min-height: 0 !important;
	line-height: 1.3 !important;
}
.wsp-dropdown .wsp-item::before,
.wsp-dropdown .wsp-item::after {
	content: none !important;
	display: none !important;
}

.wsp-item {
	align-items: center;
	gap: 16px;
	padding: 16px 14px;
	border-radius: 12px;
	text-decoration: none !important;
	color: #1f1b16;
	transition: background .16s ease;
}
.wsp-item + .wsp-item {
	margin-top: 14px !important;
}
.wsp-item:hover,
.wsp-item.is-active {
	background: #f7f2ea;
}

/* Thumbnail */
.wsp-thumb {
	flex: 0 0 60px;
	width: 60px;
	height: 60px;
	border-radius: 10px;
	overflow: hidden;
	background: #f6f2ec;
	border: 1px solid #efe8dd;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 5px;
	box-sizing: border-box;
}
.wsp-thumb img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	mix-blend-mode: multiply;
	display: block;
}

/* Info column */
.wsp-info {
	min-width: 0;
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 3px;
}
.wsp-cats {
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .9px;
	color: #a89f90;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.wsp-title {
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.3;
	color: #1a1712;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}
.wsp-title mark {
	background: transparent;
	color: #6f8a45;
	font-weight: 700;
	padding: 0;
}
.wsp-desc {
	font-size: 12px;
	color: #928979;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.wsp-price {
	font-size: 13px;
	font-weight: 600;
	color: #6f8a45;
	margin-top: 2px;
}

/* Hover arrow */
.wsp-arrow {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	color: #c3b9a8;
	opacity: 0;
	transform: translateX( -4px );
	transition: opacity .16s ease, transform .16s ease;
}
.wsp-item:hover .wsp-arrow,
.wsp-item.is-active .wsp-arrow {
	opacity: 1;
	transform: translateX( 0 );
	color: #8ba766;
}

/* Empty state */
.wsp-empty {
	padding: 30px 20px;
	text-align: center;
	color: #a89f90;
	font-size: 13.5px;
}

/* View all */
.wsp-viewall {
	display: none;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 20px 16px;
	text-align: center;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #4f6a2e !important;
	text-decoration: none !important;
	border-top: 1px solid #efe8dd;
	background: #fbf8f3;
	transition: background .16s ease, letter-spacing .16s ease;
}
.wsp-viewall.is-shown {
	display: flex;
}
.wsp-viewall:hover {
	background: #f4ede3;
	letter-spacing: 1.4px;
}
/* Beat the theme's `.main-navigation a` padding (higher specificity). */
.wsp-dropdown a.wsp-viewall {
	padding: 22px 16px !important;
	margin: 0 !important;
	line-height: 1.2 !important;
}

/* Small screens: anchor to both edges under the (full-width) form */
@media ( max-width: 600px ) {
	.wsp-dropdown {
		left: 0;
		right: 0;
		width: auto;
		max-width: none;
		border-radius: 14px;
	}
}
