/**
 * Ricerca live [marzia_live_search] (header).
 * Grafica dello snippet originale; tutti i selettori sotto .mc-live-search-wrapper.
 */

.mc-live-search-wrapper {
	--mc-accent: #007f86;
	--mc-black: #171717;
	--mc-text: #292929;
	--mc-muted: #777;
	--mc-bg: #f5f5f3;
	--mc-hover: #f6f6f4;
	--mc-border: #e2e2de;
	position: relative;
	width: 100%;
	z-index: 99990;
	font-family: "Montserrat", Arial, sans-serif !important;
}

.mc-live-search-wrapper *,
.mc-live-search-wrapper *::before,
.mc-live-search-wrapper *::after {
	box-sizing: border-box;
	font-family: "Montserrat", Arial, sans-serif !important;
}

/* Barra ----------------------------------------------------------------- */

.mc-live-search-wrapper .mc-search-bar {
	display: flex;
	align-items: center;
	width: 100%;
	height: 58px;
	margin: 0 !important;
	padding: 0 18px !important;
	background: var(--mc-bg) !important;
	border: 1px solid transparent !important;
	border-radius: 999px !important;
	outline: 0 !important;
	box-shadow: none !important;
	cursor: text;
	transition: .18s ease;
}

.mc-live-search-wrapper .mc-search-bar:hover {
	background: #f0f0ed !important;
}

.mc-live-search-wrapper.is-open .mc-search-bar,
.mc-live-search-wrapper .mc-search-bar:focus-within {
	background: #fff !important;
	border-color: #d4d4cf !important;
	box-shadow: 0 0 0 4px rgba(0, 127, 134, .08), 0 8px 26px rgba(25, 25, 25, .05) !important;
}

.mc-live-search-wrapper .mc-search-input {
	flex: 1;
	min-width: 0;
	width: 100%;
	height: 100%;
	margin: 0 !important;
	padding: 0 14px !important;
	background: transparent !important;
	color: var(--mc-black) !important;
	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	appearance: none !important;
	-webkit-appearance: none !important;
}

.mc-live-search-wrapper .mc-search-input::placeholder {
	color: #595959 !important;
	opacity: 1 !important;
}

.mc-live-search-wrapper .mc-search-input::-webkit-search-cancel-button {
	display: none !important;
}

.mc-live-search-wrapper .mc-search-leading-icon {
	display: inline-flex;
	flex: 0 0 24px;
	width: 24px;
	height: 24px;
	color: #414141;
}

.mc-live-search-wrapper svg {
	display: block;
	width: 100%;
	height: 100%;
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 1.8 !important;
	stroke-linecap: round !important;
	stroke-linejoin: round !important;
}

.mc-live-search-wrapper .mc-search-clear {
	display: none !important;
	align-items: center !important;
	justify-content: center !important;
	width: 38px !important;
	min-width: 38px !important;
	height: 38px !important;
	margin: 0 !important;
	padding: 10px !important;
	background: transparent !important;
	color: #242424 !important;
	border: 0 !important;
	border-radius: 50% !important;
	outline: 0 !important;
	box-shadow: none !important;
	cursor: pointer !important;
}

.mc-live-search-wrapper.has-value .mc-search-clear {
	display: inline-flex !important;
}

.mc-live-search-wrapper .mc-search-clear:hover {
	background: #eeeeeb !important;
	color: var(--mc-accent) !important;
}

.mc-live-search-wrapper .mc-search-clear::before,
.mc-live-search-wrapper .mc-search-clear::after {
	display: none !important;
	content: none !important;
}

/* Pannello risultati ---------------------------------------------------- */

.mc-live-search-wrapper .mc-search-panel {
	position: absolute;
	top: calc(100% + 10px);
	left: 0;
	display: none;
	width: 100%;
	max-height: 520px;
	padding: 10px;
	background: #fff;
	border: 1px solid var(--mc-border);
	border-radius: 20px;
	box-shadow: 0 22px 55px rgba(20, 20, 20, .11), 0 4px 14px rgba(20, 20, 20, .04);
	overflow: hidden;
	z-index: 999999;
	opacity: 0;
	transform: translateY(-5px);
}

.mc-live-search-wrapper.is-open .mc-search-panel {
	display: block;
	animation: mcSearchIn .18s ease forwards;
}

@keyframes mcSearchIn {
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.mc-live-search-wrapper .mc-search-results {
	max-height: 500px;
	overflow: auto;
	scrollbar-width: thin;
	scrollbar-color: #cececa transparent;
}

.mc-live-search-wrapper .mc-search-results::-webkit-scrollbar {
	width: 5px;
}

.mc-live-search-wrapper .mc-search-results::-webkit-scrollbar-thumb {
	background: #cececa;
	border-radius: 999px;
}

.mc-live-search-wrapper .mc-search-section + .mc-search-section {
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px solid #ecece8;
}

.mc-live-search-wrapper .mc-search-section-title {
	padding: 9px 14px 8px;
	color: #858585;
	font-size: 10px;
	font-weight: 600;
	letter-spacing: .09em;
	text-transform: uppercase;
}

.mc-live-search-wrapper .mc-search-clickable {
	width: 100%;
	color: var(--mc-text) !important;
	text-decoration: none !important;
	outline: 0;
	transition: .15s ease;
}

/* Linee */
.mc-live-search-wrapper .mc-category-result {
	display: grid;
	grid-template-columns: 34px minmax(0, 1fr) 34px;
	align-items: center;
	gap: 13px;
	min-height: 66px;
	padding: 11px 12px;
	background: #fafaf8;
	border-radius: 13px;
}

.mc-live-search-wrapper .mc-category-result + .mc-category-result {
	margin-top: 3px;
}

.mc-live-search-wrapper .mc-category-result:hover,
.mc-live-search-wrapper .mc-category-result.is-active {
	background: #f1f1ee;
}

.mc-live-search-wrapper .mc-category-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 7px;
	color: var(--mc-accent);
	background: #fff;
	border: 1px solid #e5e5e1;
	border-radius: 10px;
}

.mc-live-search-wrapper .mc-category-name,
.mc-live-search-wrapper .mc-result-name {
	display: block;
	overflow: hidden;
	color: var(--mc-black);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.35;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.mc-live-search-wrapper .mc-category-meta,
.mc-live-search-wrapper .mc-result-category {
	display: block;
	margin-top: 4px;
	overflow: hidden;
	color: var(--mc-muted);
	font-size: 10.5px;
	font-weight: 500;
	line-height: 1.35;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Prodotti */
.mc-live-search-wrapper .mc-product-result {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 34px;
	align-items: center;
	gap: 18px;
	min-height: 70px;
	padding: 13px 14px 13px 16px;
	border-radius: 13px;
}

.mc-live-search-wrapper .mc-product-result + .mc-product-result {
	margin-top: 2px;
}

.mc-live-search-wrapper .mc-product-result:hover,
.mc-live-search-wrapper .mc-product-result.is-active {
	background: var(--mc-hover);
}

.mc-live-search-wrapper .mc-result-name {
	font-size: 15px;
}

.mc-live-search-wrapper .mc-result-category {
	margin-top: 5px;
	font-size: 11.5px;
}

.mc-live-search-wrapper .mc-result-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 9px;
	color: #4a4a4a;
	border-radius: 50%;
	transition: .15s ease;
}

.mc-live-search-wrapper .mc-search-clickable:hover .mc-result-arrow,
.mc-live-search-wrapper .mc-search-clickable.is-active .mc-result-arrow {
	background: #fff;
	color: var(--mc-accent);
	transform: translateX(2px);
}

/* Caricamento */
.mc-live-search-wrapper .mc-search-loading {
	padding: 5px 0;
}

.mc-live-search-wrapper .mc-search-skeleton {
	display: grid;
	grid-template-columns: 1fr 34px;
	align-items: center;
	gap: 18px;
	min-height: 70px;
	padding: 13px 14px 13px 16px;
}

.mc-live-search-wrapper .mc-skeleton-copy {
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.mc-live-search-wrapper .mc-skeleton-line,
.mc-live-search-wrapper .mc-skeleton-circle {
	display: block;
	background: linear-gradient(90deg, #eeeeeb 25%, #f8f8f6 50%, #eeeeeb 75%);
	background-size: 200% 100%;
	animation: mcSkeleton 1.25s linear infinite;
}

.mc-live-search-wrapper .mc-skeleton-line {
	width: 48%;
	height: 11px;
	border-radius: 999px;
}

.mc-live-search-wrapper .mc-skeleton-line:last-child {
	width: 27%;
	height: 8px;
}

.mc-live-search-wrapper .mc-skeleton-circle {
	width: 34px;
	height: 34px;
	border-radius: 50%;
}

@keyframes mcSkeleton {
	to {
		background-position: -200% 0;
	}
}

/* Nessun risultato / errore */
.mc-live-search-wrapper .mc-search-empty {
	display: flex;
	align-items: flex-start;
	gap: 15px;
	padding: 24px 18px 26px;
}

.mc-live-search-wrapper .mc-empty-icon {
	display: inline-flex;
	flex: 0 0 25px;
	width: 25px;
	height: 25px;
	color: #3c3c3c;
}

.mc-live-search-wrapper .mc-empty-title {
	display: block;
	color: var(--mc-black);
	font-size: 14px;
	font-weight: 600;
}

.mc-live-search-wrapper .mc-empty-description {
	display: block;
	margin-top: 4px;
	color: var(--mc-muted);
	font-size: 12px;
	line-height: 1.5;
}

.mc-live-search-wrapper .mc-search-status {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

/* Mobile ---------------------------------------------------------------- */

@media (max-width: 767px) {

	.mc-live-search-wrapper .mc-search-bar {
		height: 52px;
		padding: 0 10px 0 15px !important;
	}

	.mc-live-search-wrapper .mc-search-input {
		padding: 0 8px 0 11px !important;
		font-size: 14px !important;
	}

	.mc-live-search-wrapper .mc-search-leading-icon {
		flex-basis: 21px;
		width: 21px;
		height: 21px;
	}

	.mc-live-search-wrapper .mc-search-clear {
		width: 35px !important;
		min-width: 35px !important;
		height: 35px !important;
		padding: 9px !important;
	}

	.mc-live-search-wrapper .mc-search-panel {
		left: 50%;
		width: calc(100vw - 24px);
		max-height: min(470px, calc(100vh - 110px));
		padding: 7px;
		border-radius: 16px;
		transform: translateX(-50%) translateY(-5px);
	}

	.mc-live-search-wrapper.is-open .mc-search-panel {
		animation: mcSearchMobileIn .18s ease forwards;
	}

	@keyframes mcSearchMobileIn {
		to {
			opacity: 1;
			transform: translateX(-50%) translateY(0);
		}
	}

	.mc-live-search-wrapper .mc-search-results {
		max-height: min(445px, calc(100vh - 175px));
	}

	.mc-live-search-wrapper .mc-category-result {
		grid-template-columns: 31px minmax(0, 1fr) 31px;
		gap: 10px;
		min-height: 62px;
		padding: 10px;
	}

	.mc-live-search-wrapper .mc-category-icon,
	.mc-live-search-wrapper .mc-result-arrow {
		width: 31px;
		height: 31px;
	}

	.mc-live-search-wrapper .mc-product-result {
		grid-template-columns: minmax(0, 1fr) 31px;
		gap: 12px;
		min-height: 66px;
		padding: 12px 11px 12px 13px;
	}

	.mc-live-search-wrapper .mc-result-name {
		font-size: 13.5px;
	}

	.mc-live-search-wrapper .mc-result-category {
		font-size: 10.5px;
	}
}

@media (prefers-reduced-motion: reduce) {

	.mc-live-search-wrapper * {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
	}
}
