/* Mark Vence - Search Assist widget (mv_search_assist) 1.1.0 - STRUCTURE ONLY.
 * Colours, fonts, sizes and spacing come from the widget's Style tab (D-54); the values here are
 * fallbacks for a missing control and never a literal brand colour (currentColor / inherit).
 * Logical properties only (RTL / LTR safe). */

.mv-sa { position: relative; }
.mv-sa [hidden] { display: none !important; }

.mv-sa__idle,
.mv-sa__typing,
.mv-sa__empty {
	display: flex;
	flex-direction: column;
	gap: 32px;
}
.mv-sa__idle > .mv-sa__col { flex: 1 1 0; min-width: 0; }

.mv-sa__heading {
	margin: 0 0 8px;
	padding: 0;
	font-size: inherit;
	line-height: 1.3;
}

.mv-sa__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}
.mv-sa__list > li { margin: 0; padding: 0; }

/* Suggestions are plain links in the Tab order; 44px tall hit area (WCAG 2.5.5 target size). */
.mv-sa__link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	color: inherit;
	text-decoration: none;
	text-underline-offset: 4px;
	transition: color 200ms ease;
}
.mv-sa__link:hover { text-decoration: underline; }

/* VP-FIX lane C (audit 06 #12/#22-#24, D-115) / audit P11: popular-item search glyph (switch "הצג אייקון");
 * size / gap / colour from the Style tab, fallbacks 12px / 8px / Jet. */
.mv-sa__icon {
	width: var(--mv-sa-icon-size, 12px);
	height: var(--mv-sa-icon-size, 12px);
	margin-inline-end: var(--mv-sa-icon-gap, 8px);
	color: var(--mv-sa-icon-color, var(--e-global-color-b58553d));
	flex: none;
}

/* VP-FIX lane C (audit 06 #12/#22-#24, D-115) / audit M10: chevron at the inline end, shown only when "פריסת קישור" = row
 * sets --mv-sa-chev: block (unset = none = no box). Geometry = Branding/Icons/chevron-down.svg,
 * rotated to point at the inline end (RTL: left, LTR: right). */
.mv-sa__link::after {
	content: "";
	display: var(--mv-sa-chev, none);
	width: var(--mv-sa-chev-size, 16px);
	height: var(--mv-sa-chev-size, 16px);
	margin-inline-start: auto;
	flex: none;
	background: var(--mv-sa-chev-color, var(--e-global-color-b58553d));
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	transform: rotate(90deg);
}
[dir="ltr"] .mv-sa__link::after { transform: rotate(-90deg); }

/* Buttons: reset the kit's button look. `.elementor-kit-6 button` is (0,1,1) and its hover /
 * focus rules (0,2,1): the resets below are (0,2,0) and, for hover / focus, (0,3,0). The Style
 * tab's {{WRAPPER}} rules (0,4,0)+ still win over all of them. */
.mv-sa .mv-sa__clear,
.mv-sa .mv-sa__see,
.mv-sa .mv-sa__all {
	-webkit-appearance: none;
	appearance: none;
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: inherit;
	font: inherit;
	letter-spacing: inherit;
	text-transform: none;
	text-align: start;
	cursor: pointer;
}
.mv-sa .mv-sa__clear:is(:hover, :focus, :active),
.mv-sa .mv-sa__see:is(:hover, :focus, :active) {
	background: none;
	border: 0;
	box-shadow: none;
	color: inherit;
}
.mv-sa .mv-sa__clear {
	min-width: 44px;
	min-height: 44px;
	text-decoration: underline;
	text-underline-offset: 4px;
}
.mv-sa .mv-sa__see {
	min-height: 44px;
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* 1.0.2: the Style-tab colour controls default to kit GLOBALS, but this site has Elementor's
 * "disable default colours / fonts" on (elementor_disable_color_schemes = yes), so an untouched
 * control prints nothing and the mobile bar had no background (plain text, post-deploy check 3.8).
 * Fallbacks = the same kit globals as CSS variables (never literal hexes), on the widget wrapper
 * at (0,1,0): any value set in the Style tab ({{WRAPPER}}, 0,3,0+) still wins. */
.elementor-widget-mv_search_assist {
	--mv-sa-link-fg: var(--e-global-color-primary);
	--mv-sa-link-fg-h: var(--e-global-color-b5a1c80);
	--mv-sa-link-fg-f: var(--e-global-color-primary);
	--mv-sa-bar-bg: var(--e-global-color-primary);
	--mv-sa-bar-fg: var(--e-global-color-ac30764);
	--mv-sa-bar-bg-h: var(--e-global-color-b5a1c80);
	--mv-sa-bar-fg-h: var(--e-global-color-ac30764);
}

/* "הצג הכל": the responsive "סגנון" control writes position / width and which colour variables
 * apply (link vs full-width bar); these are the shared rules. */
.mv-sa .mv-sa__all {
	min-height: 44px;
	background-color: var(--mv-sa-all-bg, transparent);
	color: var(--mv-sa-all-fg, inherit);
	text-underline-offset: 4px;
	transition-property: color, background-color;
	transition-duration: 200ms;
}
.mv-sa .mv-sa__all:hover {
	background-color: var(--mv-sa-all-bg-h, var(--mv-sa-all-bg, transparent));
	color: var(--mv-sa-all-fg-h, var(--mv-sa-all-fg, inherit));
}
.mv-sa .mv-sa__all:focus-visible {
	color: var(--mv-sa-all-fg-f, var(--mv-sa-all-fg, inherit));
}

/* Visible focus ring (Style tab "טבעת פוקוס" sets colour / width / offset). */
.mv-sa a:focus-visible,
.mv-sa button:focus-visible {
	outline-style: solid;
	outline-width: 2px;
	outline-offset: 2px;
	outline-color: currentColor;
}
/* The full-width bar draws its ring inside (an outside ring is cut by the screen edge). */
.mv-sa .mv-sa__all:focus-visible { outline-offset: -4px; }

@media (prefers-reduced-motion: reduce) {
	.mv-sa__link,
	.mv-sa .mv-sa__all { transition: none; }
}
