/* Mamoki — Ô tìm kiếm sidebar (shop, blog, popup lọc mobile) */

#shop-sidebar,
.post-sidebar,
.mfp-content {
	--msw-primary: var(--fs-color-primary, var(--primary-color, #0098ff));
	--msw-border: #e5e7eb;
	--msw-bg: #f8fafc;
	--msw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3-3'/%3E%3C/svg%3E");
}

/* ---------- Tiêu đề "Tìm kiếm" ---------- */
.mamoki-search-widget__heading,
#shop-sidebar .widget_search .widget-title.shop-sidebar,
#shop-sidebar .widget_product_search .widget-title.shop-sidebar,
.post-sidebar .widget_search .widget-title,
.post-sidebar .widget_product_search .widget-title,
.mfp-content .widget_search .widget-title.shop-sidebar,
.mfp-content .widget_product_search .widget-title.shop-sidebar {
	display: block !important;
	font-size: 0.78rem !important;
	font-weight: 800 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	color: #111 !important;
	margin: 0 0 14px !important;
	padding: 0 !important;
	line-height: 1.3 !important;
}

/* Form đã có tiêu đề riêng → ẩn widget-title tránh trùng */
.widget_search:has(.mamoki-search-widget__heading) .widget-title,
.widget_product_search:has(.mamoki-search-widget__heading) .widget-title,
.widget_block:has(.mamoki-search-widget__heading) .widget-title {
	display: none !important;
}

#shop-sidebar .widget_search .widget-title.shop-sidebar span,
#shop-sidebar .widget_product_search .widget-title.shop-sidebar span,
.mfp-content .widget_search .widget-title.shop-sidebar span,
.mfp-content .widget_product_search .widget-title.shop-sidebar span {
	display: block;
}

/* ---------- Layout chung: input + nút một hàng ---------- */
#shop-sidebar .widget_search .searchform,
#shop-sidebar .widget_search form.search-form,
#shop-sidebar .widget_product_search .searchform,
#shop-sidebar .widget_product_search form.search-form,
#shop-sidebar .widget .wp-block-search,
.post-sidebar .widget_search .searchform,
.post-sidebar .widget_search form.search-form,
.post-sidebar .widget .searchform,
.post-sidebar .widget form.search-form,
.post-sidebar .widget .wp-block-search,
.mfp-content .widget_search .searchform,
.mfp-content .widget_search form.search-form,
.mfp-content .widget_product_search .searchform,
.mfp-content .widget_product_search form.search-form,
.mfp-content .widget .wp-block-search {
	margin: 0 !important;
}

#shop-sidebar .searchform .flex-row,
#shop-sidebar form.search-form,
#shop-sidebar .wp-block-search__inside-wrapper,
.post-sidebar .searchform .flex-row,
.post-sidebar form.search-form,
.post-sidebar .wp-block-search__inside-wrapper,
.mfp-content .searchform .flex-row,
.mfp-content form.search-form,
.mfp-content .wp-block-search__inside-wrapper {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	width: 100% !important;
}

#shop-sidebar .searchform .flex-col.flex-grow,
#shop-sidebar form.search-form label,
#shop-sidebar .wp-block-search__inside-wrapper,
.post-sidebar .searchform .flex-col.flex-grow,
.post-sidebar form.search-form label,
.post-sidebar .wp-block-search__inside-wrapper,
.mfp-content .searchform .flex-col.flex-grow,
.mfp-content form.search-form label,
.mfp-content .wp-block-search__inside-wrapper {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	margin: 0 !important;
	width: auto !important;
}

#shop-sidebar .searchform .flex-col:not(.flex-grow),
#shop-sidebar form.search-form .search-submit-wrap,
.post-sidebar .searchform .flex-col:not(.flex-grow),
.mfp-content .searchform .flex-col:not(.flex-grow) {
	flex: 0 0 auto !important;
}

/* Ẩn label trùng với tiêu đề widget */
#shop-sidebar form.search-form label .screen-reader-text,
.post-sidebar form.search-form label .screen-reader-text,
.mfp-content form.search-form label .screen-reader-text,
#shop-sidebar .wp-block-search__label,
.post-sidebar .wp-block-search__label,
.mfp-content .wp-block-search__label {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* ---------- Ô nhập pill ---------- */
#shop-sidebar .searchform .search-field,
#shop-sidebar form.search-form .search-field,
#shop-sidebar form.search-form input[type="search"],
#shop-sidebar form.search-form input[type="text"],
#shop-sidebar .wp-block-search__input,
.post-sidebar .searchform .search-field,
.post-sidebar form.search-form .search-field,
.post-sidebar form.search-form input[type="search"],
.post-sidebar form.search-form input[type="text"],
.post-sidebar .wp-block-search__input,
.mfp-content .searchform .search-field,
.mfp-content form.search-form input[type="search"],
.mfp-content .wp-block-search__input {
	width: 100% !important;
	height: 46px !important;
	min-height: 46px !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border: 1px solid var(--msw-border) !important;
	border-radius: 999px !important;
	background: var(--msw-bg) !important;
	font-size: 0.9rem !important;
	line-height: normal !important;
	box-shadow: none !important;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	-webkit-appearance: none;
	appearance: none;
}

#shop-sidebar .searchform .search-field:focus,
#shop-sidebar form.search-form input:focus,
#shop-sidebar .wp-block-search__input:focus,
.post-sidebar .searchform .search-field:focus,
.post-sidebar form.search-form input:focus,
.post-sidebar .wp-block-search__input:focus,
.mfp-content .searchform .search-field:focus,
.mfp-content form.search-form input:focus,
.mfp-content .wp-block-search__input:focus {
	outline: none !important;
	border-color: var(--msw-primary) !important;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--msw-primary) 15%, transparent) !important;
}

/* ---------- Nút submit — tròn, icon kính lúp ---------- */
#shop-sidebar .searchform .ux-search-submit,
#shop-sidebar .searchform button[type="submit"],
#shop-sidebar form.search-form input[type="submit"],
#shop-sidebar form.search-form button[type="submit"],
#shop-sidebar .wp-block-search__button,
.post-sidebar .searchform .ux-search-submit,
.post-sidebar .searchform button[type="submit"],
.post-sidebar form.search-form input[type="submit"],
.post-sidebar form.search-form button[type="submit"],
.post-sidebar .wp-block-search__button,
.mfp-content .searchform .ux-search-submit,
.mfp-content .searchform button[type="submit"],
.mfp-content form.search-form input[type="submit"],
.mfp-content form.search-form button[type="submit"],
.mfp-content .wp-block-search__button {
	width: 46px !important;
	height: 46px !important;
	min-width: 46px !important;
	max-width: 46px !important;
	min-height: 46px !important;
	max-height: 46px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 50% !important;
	background-color: var(--msw-primary) !important;
	background-image: var(--msw-icon) !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
	color: transparent !important;
	font-size: 0 !important;
	line-height: 0 !important;
	overflow: hidden !important;
	white-space: nowrap !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-shrink: 0 !important;
	cursor: pointer;
	box-shadow: 0 4px 14px color-mix(in srgb, var(--msw-primary) 35%, transparent);
	transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
	-webkit-appearance: none;
	appearance: none;
}

#shop-sidebar .searchform .ux-search-submit:hover,
#shop-sidebar form.search-form input[type="submit"]:hover,
#shop-sidebar form.search-form button[type="submit"]:hover,
#shop-sidebar .wp-block-search__button:hover,
.post-sidebar .searchform .ux-search-submit:hover,
.post-sidebar form.search-form input[type="submit"]:hover,
.post-sidebar form.search-form button[type="submit"]:hover,
.post-sidebar .wp-block-search__button:hover,
.mfp-content .searchform .ux-search-submit:hover,
.mfp-content form.search-form input[type="submit"]:hover,
.mfp-content .wp-block-search__button:hover {
	transform: scale(1.05);
	background-color: color-mix(in srgb, var(--msw-primary) 88%, #000) !important;
}

/* Flatsome icon trong nút — giữ hiển thị, bỏ nền SVG trùng */
#shop-sidebar .searchform .ux-search-submit i,
#shop-sidebar .searchform .ux-search-submit svg,
.post-sidebar .searchform .ux-search-submit i,
.post-sidebar .searchform .ux-search-submit svg,
.mfp-content .searchform .ux-search-submit i,
.mfp-content .searchform .ux-search-submit svg {
	font-size: 18px !important;
	width: 18px !important;
	height: 18px !important;
	color: #fff !important;
	fill: currentColor !important;
	background: none !important;
}

#shop-sidebar .searchform .ux-search-submit:has(i),
#shop-sidebar .searchform .ux-search-submit:has(svg),
.post-sidebar .searchform .ux-search-submit:has(i),
.post-sidebar .searchform .ux-search-submit:has(svg),
.mfp-content .searchform .ux-search-submit:has(i),
.mfp-content .searchform .ux-search-submit:has(svg) {
	background-image: none !important;
	color: #fff !important;
	font-size: 0 !important;
}

#shop-sidebar .searchform .live-search-results,
.post-sidebar .searchform .live-search-results,
.mfp-content .searchform .live-search-results {
	margin-top: 8px;
}