/* Merchify God Tool – eingebettete Produktsuche [mf_suche] (eigenständig, funktioniert auch neben dem WPCode-Snippet) */
.mf-es {
	--es-bg: #fff; --es-fg: #141414; --es-muted: #6b6b6b; --es-line: #e4e4e7; --es-hover: #f4f4f5; --es-accent: #ff0080;
	--es-field: #fff; --es-shadow: 0 18px 40px rgba(0,0,0,.14);
	position: relative; width: 100%; max-width: var(--es-width, 640px); margin: 0 auto; font-family: inherit; color: var(--es-fg); text-align: left; z-index: 20;
}
.mf-es--dunkel { --es-bg: #141414; --es-fg: #fff; --es-muted: #a1a1aa; --es-line: #2c2c2c; --es-hover: #1f1f1f; --es-field: #1b1b1b; --es-shadow: 0 18px 40px rgba(0,0,0,.5); }
.mf-es *, .mf-es *::before, .mf-es *::after { box-sizing: border-box; }
.mf-es__form { display: flex !important; align-items: center; gap: 0; margin: 0 !important; background: var(--es-field); border: 2px solid var(--es-line); border-radius: 999px; padding: 4px 4px 4px 16px; transition: border-color .15s, box-shadow .15s; }
.mf-es__form:focus-within { border-color: var(--es-accent); box-shadow: 0 0 0 4px rgba(255,0,128,.12); }
.mf-es__icon { display: flex; width: 20px; height: 20px; flex: 0 0 20px; color: var(--es-muted); }
.mf-es__icon svg { width: 100%; height: 100%; }
.mf-es__input { flex: 1 1 auto; min-width: 0; height: 44px !important; margin: 0 !important; padding: 0 12px !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent !important; color: var(--es-fg) !important; font: inherit !important; font-size: 16px !important; }
.mf-es__input::placeholder { color: var(--es-muted); opacity: 1; }
.mf-es__input::-webkit-search-cancel-button { cursor: pointer; }
.mf-es__btn { flex: 0 0 auto; height: 44px; margin: 0 !important; padding: 0 22px !important; border: 0 !important; border-radius: 999px !important; background: var(--es-accent) !important; color: #fff !important; font: inherit !important; font-weight: 600 !important; cursor: pointer; transition: filter .15s; }
.mf-es__btn:hover { filter: brightness(1.08); }
.mf-es.is-loading .mf-es__icon { animation: mf-es-pulse .9s ease-in-out infinite; }
@keyframes mf-es-pulse { 50% { opacity: .35; } }

.mf-es__panel { margin-top: 8px; background: var(--es-bg); border: 1px solid var(--es-line); border-radius: 16px; padding: 8px; max-height: min(70vh, 560px); overflow: auto; }
.mf-es--dropdown .mf-es__panel { position: absolute; left: 0; right: 0; top: 100%; box-shadow: var(--es-shadow); }
.mf-es--list .mf-es__panel { max-height: none; }
.mf-es__label { margin: 10px 10px 6px !important; padding: 0 !important; font-size: 11px !important; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--es-muted); }
.mf-es__item { display: flex !important; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 10px; color: var(--es-fg) !important; text-decoration: none !important; }
.mf-es__item:hover, .mf-es__item.is-active { background: var(--es-hover); }
.mf-es__item.is-active { box-shadow: inset 0 0 0 1px rgba(255,0,128,.5); }
.mf-es__img { width: 52px; height: 52px; flex: 0 0 52px; border-radius: 8px; background: #f2f2f2 center / cover no-repeat; }
.mf-es__img--logo { background-color: #111; background-size: 78%; background-position: center; }
.mf-es__name { flex: 1 1 auto; min-width: 0; font-size: 14px; line-height: 1.35; }
.mf-es__name small { display: block; margin-top: 2px; font-size: 12px; color: var(--es-muted); }
.mf-es__name mark { background: none; color: var(--es-accent); font-weight: 700; }
.mf-es__price { flex: 0 0 auto; font-weight: 700; font-size: 14px; white-space: nowrap; }
.mf-es__go { display: flex; color: var(--es-muted); }
.mf-es__all { display: flex !important; align-items: center; justify-content: center; gap: 8px; width: 100%; margin: 8px 0 2px; padding: 11px; border: 1px solid var(--es-line) !important; border-radius: 10px; background: transparent !important; color: var(--es-fg) !important; font: inherit !important; font-weight: 600 !important; text-decoration: none !important; cursor: pointer; }
.mf-es__all:hover { border-color: var(--es-accent) !important; color: var(--es-accent) !important; }
.mf-es__all[disabled] { opacity: .6; cursor: progress; }
.mf-es__empty { margin: 0 !important; padding: 18px 10px !important; color: var(--es-muted); text-align: center; }
.mf-es__chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 10px 10px; }
.mf-es__chip { margin: 0 !important; padding: 6px 14px !important; border: 1px solid var(--es-line) !important; border-radius: 999px !important; background: transparent !important; color: var(--es-fg) !important; font: inherit !important; font-size: 13px !important; cursor: pointer; }
.mf-es__chip:hover { border-color: var(--es-accent) !important; color: var(--es-accent) !important; }
@media (max-width: 520px) {
	.mf-es__btn { padding: 0 14px !important; }
	.mf-es__img { width: 44px; height: 44px; flex-basis: 44px; }
}
@media (prefers-reduced-motion: reduce) { .mf-es.is-loading .mf-es__icon { animation: none; } }

/* Lupe zum Platzieren [mf_suche_icon] */
.mf-search-icon, .mf-search-icon:hover, .mf-search-icon:focus, .mf-search-icon:active {
	display: inline-flex !important; align-items: center; gap: 8px; margin: 0 !important; padding: 6px !important; border: 0 !important; border-radius: 10px !important;
	background: transparent !important; box-shadow: none !important; color: inherit; font: inherit !important; line-height: 1 !important; cursor: pointer; vertical-align: middle;
}
.mf-search-icon:focus-visible { outline: 2px solid #ff0080 !important; outline-offset: 2px; }
.mf-search-icon svg { display: block; width: var(--mf-icon-size, 26px) !important; height: var(--mf-icon-size, 26px) !important; transition: transform .15s ease; }
.mf-search-icon:hover svg { transform: scale(1.1); }
.mf-search-icon span { font-weight: 600; }
.mf-open-search { cursor: pointer; }
