/* VIVI Lite Pages v0.10.198：全站關鍵字搜尋欄清除 X 統一採用生活探索規格 -------- */
body.vivi-lite-page .vivi-search-clear-host {
	position: relative;
}

body.vivi-lite-page input.vivi-search-clear-input[type="search"] {
	padding-right: 46px !important;
}

body.vivi-lite-page input.vivi-search-clear-input[type="search"]::-webkit-search-cancel-button,
body.vivi-lite-page input.vivi-search-clear-input[type="search"]::-webkit-search-decoration,
body.vivi-lite-page input.vivi-search-clear-input[type="search"]::-webkit-search-results-button,
body.vivi-lite-page input.vivi-search-clear-input[type="search"]::-webkit-search-results-decoration {
	-webkit-appearance: none;
	appearance: none;
	display: none;
}

/*
 * 生活探索清除 X 標準：
 * 28px 操作區、21px X、透明底、8px 圓角；使用 !important 隔離各頁按鈕規則，
 * 避免生活誌、票券、社團與專頁的通用 button 樣式改變尺寸或字型。
 */
body.vivi-lite-page .vivi-search-clear-button {
	-webkit-appearance: none !important;
	appearance: none !important;
	position: absolute !important;
	top: 50% !important;
	right: 8px !important;
	z-index: 6 !important;
	display: none !important;
	align-items: center !important;
	justify-content: center !important;
	width: 28px !important;
	height: 28px !important;
	min-width: 28px !important;
	min-height: 28px !important;
	max-width: 28px !important;
	max-height: 28px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: var(--vivi-radius, 8px) !important;
	background: transparent !important;
	color: var(--vivi-color-text-muted, #6b7280) !important;
	box-shadow: none !important;
	font-family: var(--vivi-font-body, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif) !important;
	font-size: 21px !important;
	font-style: normal !important;
	font-weight: 400 !important;
	letter-spacing: 0 !important;
	line-height: 1 !important;
	text-align: center !important;
	text-decoration: none !important;
	text-indent: 0 !important;
	text-transform: none !important;
	cursor: pointer !important;
	transform: translateY(-50%) !important;
	transition: color var(--vivi-transition, .18s ease), background var(--vivi-transition, .18s ease), transform var(--vivi-transition, .18s ease) !important;
	-webkit-tap-highlight-color: transparent;
}

body.vivi-lite-page .vivi-search-clear-button > span,
body.vivi-lite-page .vivi-search-clear-button .vivi-search-clear-glyph {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 28px !important;
	height: 28px !important;
	margin: 0 !important;
	padding: 0 !important;
	font: inherit !important;
	font-size: 21px !important;
	font-weight: 400 !important;
	letter-spacing: 0 !important;
	line-height: 1 !important;
	pointer-events: none !important;
}

body.vivi-lite-page .vivi-search-clear-button.is-visible,
body.vivi-lite-page input.vivi-search-clear-input[type="search"]:not(:placeholder-shown) + .vivi-search-clear-button {
	display: inline-flex !important;
}

body.vivi-lite-page .vivi-search-clear-button:hover,
body.vivi-lite-page .vivi-search-clear-button:focus-visible {
	background: var(--vivi-color-bg-soft, #f3f4f6) !important;
	color: var(--vivi-color-heading, #111827) !important;
	outline: none !important;
}

body.vivi-lite-page .vivi-search-clear-button:focus-visible {
	box-shadow: 0 0 0 2px var(--vivi-form-focus-ring, rgba(166,112,24,.16)) !important;
}

body.vivi-lite-page .vivi-search-clear-button:active {
	transform: translateY(-50%) scale(.94) !important;
}

/* 生活探索搜尋欄右側另有搜尋按鈕，清除 X 固定放在搜尋按鈕左側。 */
body.vivi-lite-page .vivi-brand-map-keyword-control input.vivi-search-clear-input[type="search"] {
	padding-right: 82px !important;
}

body.vivi-lite-page .vivi-brand-map-keyword-control .vivi-search-clear-button {
	right: 44px !important;
}
