/**
 * מכון נדב — חיפוש ערכות בתפריט העליון.
 * Colours follow the site: #426086 blue, #EF9439 orange, black top bar.
 */

/* ------------------------------------------------------------------- dock */

/* The script appends the dock straight to the black bar section, beside the
   orange menu frame rather than inside it — at the bar's left end (the owner's
   choice, 23/09/2026). Elementor already positions sections; this only
   guarantees it. */
.elementor-section.mn-search-has-dock {
	position: relative;
}

.mn-search-dock {
	position: absolute;
	top: 50%;
	inset-inline-end: clamp( 16px, 5vw, 86px );
	transform: translateY( -50% );
	z-index: 5;
	display: flex;
	align-items: center;
}

.mn-search-trigger {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	height: 44px;
	padding: 0 18px;
	margin: 0;
	border-radius: 0;
	font: inherit;
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}

.mn-search-trigger__icon {
	display: inline-flex;
	flex: none;
}

.mn-search-trigger__icon svg {
	width: 18px;
	height: 18px;
	display: block;
}

.mn-search-trigger__kbd {
	flex: none;
	margin-inline-start: 4px;
	padding: 2px 7px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	border-radius: 3px;
	opacity: 0.75;
}

/* --- variant A: twin frame, echoing the orange menu box ------------------ */

.mn-search-dock--a .mn-search-trigger {
	background: transparent;
	border: 2px solid #ef9439;
	color: #fff;
}

.mn-search-dock--a .mn-search-trigger__icon {
	color: #ef9439;
}

.mn-search-dock--a .mn-search-trigger__kbd {
	border: 1px solid rgba( 239, 148, 57, 0.6 );
	color: #ef9439;
}

.mn-search-dock--a .mn-search-trigger:hover,
.mn-search-dock--a .mn-search-trigger:focus-visible {
	background: #ef9439;
	border-color: #ef9439;
	color: #111;
}

.mn-search-dock--a .mn-search-trigger:hover .mn-search-trigger__icon,
.mn-search-dock--a .mn-search-trigger:focus-visible .mn-search-trigger__icon {
	color: #111;
}

.mn-search-dock--a .mn-search-trigger:hover .mn-search-trigger__kbd,
.mn-search-dock--a .mn-search-trigger:focus-visible .mn-search-trigger__kbd {
	border-color: rgba( 17, 17, 17, 0.35 );
	color: #111;
}

/* --- variant B: solid orange, like the site's call-to-action bars -------- */

.mn-search-dock--b .mn-search-trigger {
	background: #ef9439;
	border: 2px solid #ef9439;
	color: #111;
	font-weight: 700;
}

.mn-search-dock--b .mn-search-trigger__kbd {
	border: 1px solid rgba( 17, 17, 17, 0.3 );
	color: #111;
}

.mn-search-dock--b .mn-search-trigger:hover,
.mn-search-dock--b .mn-search-trigger:focus-visible {
	background: #db7f22;
	border-color: #db7f22;
	color: #fff;
}

.mn-search-dock--b .mn-search-trigger:hover .mn-search-trigger__kbd,
.mn-search-dock--b .mn-search-trigger:focus-visible .mn-search-trigger__kbd {
	border-color: rgba( 255, 255, 255, 0.45 );
	color: #fff;
}

/* --- variant C: a real-looking field ------------------------------------ */

.mn-search-dock--c .mn-search-trigger {
	background: #fff;
	border: 2px solid #ef9439;
	color: #6f6f6f;
	min-width: 230px;
	justify-content: flex-start;
}

.mn-search-dock--c .mn-search-trigger__icon {
	color: #ef9439;
}

.mn-search-dock--c .mn-search-trigger__kbd {
	margin-inline-start: auto;
	border: 1px solid #e0d9cf;
	background: #faf7f2;
	color: #9a9a9a;
}

.mn-search-dock--c .mn-search-trigger:hover,
.mn-search-dock--c .mn-search-trigger:focus-visible {
	border-color: #db7f22;
	color: #333;
}

/* --- below desktop: the black bar's own menu item, centred ---------------

   Below desktop the bar shows a separate Elementor nav-menu widget (c1007c5,
   hidden on desktop) whose "רכישת ערכת מבחנים אונליין" link spans the full
   width with its words at the right edge. The owner wants it centred over the
   search field (23/09/2026). Only the top-level link; the opened list keeps
   its own alignment. */

@media ( max-width: 1024px ) {
	.elementor-element-c1007c5 .elementor-nav-menu--dropdown > .elementor-nav-menu > li > a.elementor-item {
		justify-content: center;
		text-align: center;
	}
}

/* --- below desktop: sit under the menu, full width ---------------------- */

@media ( max-width: 1024px ) {
	.mn-search-dock {
		position: static;
		transform: none;
		display: flex;
		justify-content: center;
		padding: 0 14px 14px;
	}

	.mn-search-trigger {
		width: 100%;
		max-width: 420px;
		justify-content: flex-start;
		height: 46px;
	}

	.mn-search-trigger__kbd {
		display: none;
	}

	.mn-search-dock--c .mn-search-trigger {
		min-width: 0;
	}
}

/* ------------------------------------------------------------------ overlay */

html.mn-search-open,
html.mn-search-open body {
	overflow: hidden;
}

/* The WhatsApp and Crisp bubbles are fixed at z-index 99999999 and would sit
   on top of the panel, so stand them down while the search is open. */
html.mn-search-open .ccw_plugin,
html.mn-search-open .crisp-client,
html.mn-search-open #crisp-chatbox {
	display: none !important;
}

.mn-search {
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	padding: clamp( 16px, 8vh, 96px ) 16px 16px;
	direction: rtl;
}

.mn-search[hidden] {
	display: none;
}

.mn-search__backdrop {
	position: absolute;
	inset: 0;
	background: rgba( 12, 17, 24, 0.62 );
	backdrop-filter: blur( 4px );
	-webkit-backdrop-filter: blur( 4px );
	opacity: 0;
	transition: opacity 0.18s ease;
}

.mn-search.is-open .mn-search__backdrop {
	opacity: 1;
}

.mn-search__box {
	position: relative;
	width: min( 620px, 100% );
	max-height: min( 560px, 82vh );
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 4px;
	border-top: 4px solid #ef9439;
	box-shadow: 0 24px 64px -16px rgba( 12, 17, 24, 0.55 );
	overflow: hidden;
	transform: translateY( -10px ) scale( 0.985 );
	opacity: 0;
	transition: transform 0.2s cubic-bezier( 0.2, 0.7, 0.3, 1 ), opacity 0.18s ease;
	font-family: inherit;
	text-align: right;
}

.mn-search.is-open .mn-search__box {
	transform: none;
	opacity: 1;
}

.mn-search__srlabel {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect( 0 0 0 0 );
	white-space: nowrap;
	border: 0;
}

/* field */

.mn-search__field {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 18px;
	border-bottom: 1px solid #e8e3db;
}

.mn-search__fieldicon {
	display: inline-flex;
	flex: none;
	color: #9aa3ad;
}

.mn-search__fieldicon svg {
	width: 20px;
	height: 20px;
	display: block;
}

/* The child theme ships a blanket `input { display: none }` in style.css, so
   every field here has to state its own display. */
.mn-search__input {
	display: block;
	flex: 1;
	min-width: 0;
	border: 0;
	outline: none;
	background: none;
	font: inherit;
	font-size: 19px;
	color: #17202b;
	padding: 0;
	box-shadow: none;
	height: auto;
	width: auto;
}

.mn-search__input::placeholder {
	color: #9aa3ad;
}

.mn-search__clear {
	flex: none;
	border: 0;
	background: #f1ece4;
	color: #6b7581;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	font-size: 19px;
	line-height: 1;
	cursor: pointer;
	padding: 0;
}

.mn-search__clear:hover {
	background: #e6dfd4;
	color: #17202b;
}

.mn-search__esc {
	flex: none;
	border: 1px solid #e0d9cf;
	background: #f7f4ef;
	color: #8b949f;
	border-radius: 6px;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 11px;
	letter-spacing: 0.04em;
	padding: 4px 8px;
	cursor: pointer;
}

.mn-search__esc:hover {
	color: #ef9439;
	border-color: #ef9439;
}

/* results */

.mn-search__results {
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: 8px;
	flex: 1;
}

.mn-search__row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 9px 12px;
	border-radius: 3px;
	text-decoration: none !important;
	color: inherit;
	box-shadow: none !important;
}

.mn-search__row.is-selected {
	background: #fdf1e3;
	box-shadow: inset 3px 0 0 #ef9439 !important;
}

.mn-search__rowmain {
	min-width: 0;
}

.mn-search__rowtitle {
	display: block;
	font-size: 17px;
	font-weight: 600;
	color: #17202b;
	line-height: 1.35;
}

.mn-search__rowtitle mark {
	background: rgba( 239, 148, 57, 0.4 );
	color: inherit;
	border-radius: 3px;
	padding: 0 1px;
}

.mn-search__rowgroup {
	display: block;
	font-size: 13px;
	color: #8b949f;
	margin-top: 1px;
}

.mn-search__rowgo {
	margin-right: auto;
	flex: none;
	font-size: 14px;
	color: #b3bac2;
}

.mn-search__row.is-selected .mn-search__rowgo {
	color: #ef9439;
}

.mn-search__empty {
	margin: 0;
	padding: 34px 18px;
	text-align: center;
	color: #8b949f;
	font-size: 16px;
	line-height: 1.7;
}

.mn-search__empty b {
	color: #17202b;
}

/* footer */

.mn-search__foot {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	padding: 9px 18px;
	border-top: 1px solid #e8e3db;
	background: #faf8f5;
	font-size: 13px;
	color: #8b949f;
}

.mn-search__hint {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.mn-search__foot kbd {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 11px;
	background: #fff;
	border: 1px solid #e0d9cf;
	border-radius: 4px;
	padding: 1px 5px;
	color: #6b7581;
}

.mn-search__count {
	margin-right: auto;
}

@media ( max-width: 600px ) {
	.mn-search {
		padding: 0;
	}

	.mn-search__box {
		width: 100%;
		max-height: 100%;
		height: 100%;
		border-radius: 0;
	}

	.mn-search__hint {
		display: none;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.mn-search__box,
	.mn-search__backdrop {
		transition: none;
	}
}
