/**
 * Site header — the dark strip and the white bar, from the design of
 * 2026-10-02. Loaded only on requests where the theme prints the header
 * itself.
 *
 * Two roots, .hec-header-strip and .hec-header. They are siblings so the bar
 * can stay stuck to the top after the strip has scrolled away. Every rule
 * carries a root, and every link and button restates its hover and focus
 * look, so the theme reset and the Elementor kit's (0,2,1) rules do not
 * repaint them. Logical properties throughout: the site is RTL.
 *
 * One HTML serves both layouts. From 1024px the menu, the search and the
 * button sit in the bar; below that they are in the panel the menu button
 * opens. The panel is closed only under .hec-js, which one inline line of
 * script sets on <html>: a visitor without scripts gets the links open under
 * a bar that does not stick.
 *
 * The page's own sticky parts (the directory's tabs, the guide's menu, the
 * vendor page's side column) read their offsets from variables set here on
 * body.hec-has-header, so they stop under the bar instead of behind it.
 */

body.hec-has-header {
	--hec-header-height: 68px;
	--hec-comm-sticky-top: 68px;
	--hec-guide-sticky-top: 92px;
	--hec-vendor-sticky-top: 92px;
}

.hec-header-strip,
.hec-header {
	--hh-ink: #1F1B2D;
	--hh-body: #4A4761;
	--hh-muted: #6E6B85;
	--hh-line: #E3E1EA;
	--hh-soft-line: #F0EEF4;
	--hh-ground: #F6F5F8;
	--hh-dark: #2A2337;
	--hh-accent: #A676A5;
	--hh-accent-dark: #7A4A79;
	--hh-wash: #F2ECF2;
	--hh-on-dark: #E9E6F0;
	--hh-on-dark-hover: #E8B4C8;
	--hh-dot: #E58FB0;

	font-family: "Noto Sans Hebrew", sans-serif;
	line-height: 1.5;
}

.hec-header-strip *,
.hec-header-strip *::before,
.hec-header-strip *::after,
.hec-header *,
.hec-header *::before,
.hec-header *::after {
	box-sizing: border-box;
}

.hec-header-strip a,
.hec-header a,
.hec-header button,
.hec-header input {
	transition: color .15s, background-color .15s, border-color .15s;
}

.hec-header-strip a:focus-visible {
	outline: 2px solid var(--hh-on-dark-hover);
	outline-offset: 2px;
}

.hec-header a:focus-visible,
.hec-header button:focus-visible,
.hec-header input:focus-visible {
	outline: 2px solid var(--hh-accent-dark);
	outline-offset: 2px;
}

/* ---------- The strip ---------- */

.hec-header-strip {
	background: var(--hh-dark);
	color: var(--hh-on-dark);
	font-size: 13px;
}

.hec-header-strip .hec-header-strip__in {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 4px 16px;
	max-width: 1240px;
	min-height: 40px;
	margin-inline: auto;
	padding-inline: 24px;
}

.hec-header-strip .hec-header-strip__note {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 0;
	color: var(--hh-on-dark);
	font-size: 13px;
	font-weight: 600;
}

.hec-header-strip .hec-header-strip__dot {
	display: block;
	flex: 0 0 auto;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--hh-dot);
}

.hec-header-strip .hec-header-strip__contacts {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-inline-start: auto;
}

.hec-header-strip a.hec-header-strip__link,
.hec-header-strip a.hec-header-strip__contact {
	color: var(--hh-on-dark);
	text-decoration: none;
}

.hec-header-strip a.hec-header-strip__link:hover,
.hec-header-strip a.hec-header-strip__link:focus,
.hec-header-strip a.hec-header-strip__contact:hover,
.hec-header-strip a.hec-header-strip__contact:focus {
	color: var(--hh-on-dark-hover);
}

.hec-header-strip a.hec-header-strip__link:hover {
	text-decoration: underline;
}

/* ---------- The bar ---------- */

.hec-header {
	position: sticky;
	top: 0;
	z-index: 100;
	border-block-end: 1px solid var(--hh-line);
	background: #FFFFFF;
	color: var(--hh-ink);
}

/* Logged-in visitors have the fixed admin bar on top (32px; 46px on tablets;
   not fixed at 600px and below). */
body.admin-bar .hec-header {
	top: 32px;
}

@media (max-width: 782px) {
	body.admin-bar .hec-header {
		top: 46px;
	}
}

@media (max-width: 600px) {
	body.admin-bar .hec-header {
		top: 0;
	}
}

.hec-header .hec-header__in {
	display: flex;
	align-items: center;
	gap: 20px;
	max-width: 1240px;
	height: 68px;
	margin-inline: auto;
	padding-inline: 24px;
}

.hec-header a.hec-header__brand {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 12px;
	min-width: 0;
}

/* Only the colour is restated for hover and focus: the layout above must be
   free to change in the menu-button layout whatever the pointer is doing. */
.hec-header a.hec-header__brand,
.hec-header a.hec-header__brand:hover,
.hec-header a.hec-header__brand:focus {
	color: var(--hh-ink);
	text-decoration: none;
}

.hec-header .hec-header__mark {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 4px;
	background: var(--hh-accent);
	color: #FFFFFF;
	font-size: 14px;
	font-weight: 800;
}

.hec-header img.hec-header__logo {
	display: block;
	flex: 0 0 auto;
	width: auto;
	max-width: 160px;
	height: auto;
	max-height: 40px;
	border-radius: 0;
}

.hec-header .hec-header__name {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.1;
}

/* A name too long for the room it has is cut with an ellipsis. Without this
   a wide logo or a long name pushes the menu button off a phone's screen. */
.hec-header .hec-header__title,
.hec-header .hec-header__tagline {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.hec-header .hec-header__title {
	font-size: 18px;
	font-weight: 700;
}

.hec-header .hec-header__tagline {
	color: var(--hh-muted);
	font-size: 11px;
	letter-spacing: .12em;
}

.hec-header .hec-header__nav {
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	gap: 2px;
	min-width: 0;
	overflow-x: auto;
	font-size: 15px;
	white-space: nowrap;
	scrollbar-width: none;
}

.hec-header .hec-header__nav::-webkit-scrollbar {
	display: none;
}

.hec-header a.hec-header__link {
	padding: 8px 12px;
	border-radius: 4px;
	color: var(--hh-body);
	text-decoration: none;
}

.hec-header a.hec-header__link:hover,
.hec-header a.hec-header__link:focus {
	background: var(--hh-wash);
	color: var(--hh-accent-dark);
}

.hec-header a.hec-header__link[aria-current],
.hec-header a.hec-header__link[aria-current]:hover,
.hec-header a.hec-header__link[aria-current]:focus {
	background: transparent;
	color: var(--hh-ink);
	font-weight: 700;
	box-shadow: inset 0 -3px 0 var(--hh-accent);
}

.hec-header a.hec-header__button,
.hec-header a.hec-header__panel-button {
	background: var(--hh-dark);
	color: #FFFFFF;
	font-weight: 600;
	text-decoration: none;
}

.hec-header a.hec-header__button {
	flex: 0 0 auto;
	padding: 11px 20px;
	border-radius: 4px;
	font-size: 14px;
	white-space: nowrap;
}

.hec-header a.hec-header__button:hover,
.hec-header a.hec-header__button:focus,
.hec-header a.hec-header__panel-button:hover,
.hec-header a.hec-header__panel-button:focus {
	background: var(--hh-accent-dark);
	color: #FFFFFF;
}

/* ---------- The vendor search ---------- */

.hec-header .hec-header__search {
	position: relative;
	/* The large shrink factor makes the search give way before the menu does. */
	flex: 0 1000 190px;
	min-width: 140px;
	margin: 0;
}

.hec-header input.hec-header__search-input,
.hec-header input.hec-header__search-input:focus {
	display: block;
	width: 100%;
	height: 40px;
	margin: 0;
	padding-block: 0;
	padding-inline: 34px 12px;
	border: 1px solid var(--hh-line);
	border-radius: 4px;
	background-color: var(--hh-ground);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236E6B85' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.6-3.6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: calc(100% - 12px) 50%;
	color: var(--hh-ink);
	font-family: inherit;
	font-size: 14px;
	line-height: 1.2;
	box-shadow: none;
}

.hec-header input.hec-header__search-input:focus {
	border-color: var(--hh-accent);
	background-color: #FFFFFF;
}

.hec-header input.hec-header__search-input::placeholder {
	color: var(--hh-muted);
	opacity: 1;
}

.hec-header .hec-header__results {
	position: absolute;
	inset-inline: 0;
	top: calc(100% + 6px);
	z-index: 5;
	min-width: 240px;
	max-height: 60vh;
	margin: 0;
	padding: 4px;
	overflow-y: auto;
	border: 1px solid var(--hh-line);
	border-radius: 6px;
	background: #FFFFFF;
	box-shadow: 0 12px 30px rgba(31, 27, 45, .12);
	list-style: none;
}

.hec-header .hec-header__results[hidden] {
	display: none;
}

.hec-header .hec-header__result {
	margin: 0;
	padding: 0;
	border-radius: 4px;
	color: var(--hh-ink);
	font-size: 14px;
	white-space: normal;
}

.hec-header .hec-header__result--status {
	padding: 9px 10px;
	color: var(--hh-muted);
}

.hec-header a.hec-header__result-link,
.hec-header a.hec-header__result-link:hover,
.hec-header a.hec-header__result-link:focus {
	display: block;
	padding: 9px 10px;
	border-radius: 4px;
	color: inherit;
	text-decoration: none;
}

.hec-header .hec-header__result[aria-selected="true"],
.hec-header .hec-header__result:not(.hec-header__result--status):hover {
	background: var(--hh-wash);
	color: var(--hh-accent-dark);
}

/* ---------- The phone menu ---------- */

.hec-header button.hec-header__toggle {
	display: none;
	flex: 0 0 auto;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 44px;
	height: 44px;
	margin-inline-start: auto;
	padding: 0;
	border: 1px solid var(--hh-line);
	border-radius: 6px;
	background: #FFFFFF;
	color: var(--hh-dark);
	cursor: pointer;
}

.hec-header button.hec-header__toggle:hover,
.hec-header button.hec-header__toggle:focus {
	border-color: var(--hh-line);
	background: #FFFFFF;
	color: var(--hh-dark);
}

.hec-header .hec-header__toggle span {
	display: block;
	width: 18px;
	height: 2px;
	background: var(--hh-dark);
}

.hec-header .hec-header__panel {
	display: none;
}

.hec-header .hec-header__panel-nav {
	display: flex;
	flex-direction: column;
}

.hec-header a.hec-header__panel-link,
.hec-header a.hec-header__panel-link:hover,
.hec-header a.hec-header__panel-link:focus {
	padding: 13px 4px;
	border-block-end: 1px solid var(--hh-soft-line);
	color: var(--hh-ink);
	text-decoration: none;
}

.hec-header a.hec-header__panel-link[aria-current],
.hec-header a.hec-header__panel-link[aria-current]:hover,
.hec-header a.hec-header__panel-link[aria-current]:focus {
	color: var(--hh-accent-dark);
	font-weight: 700;
}

.hec-header a.hec-header__panel-button {
	margin-block-start: 14px;
	padding: 14px;
	border-radius: 6px;
	text-align: center;
}

/* Narrow desktops: the menu, the search and the button share one row, so
   each gives up a little room. Without this the last link is cut off at
   1024px on pages that show the search. */
@media (min-width: 1024px) and (max-width: 1199px) {
	.hec-header .hec-header__in {
		gap: 12px;
		padding-inline: 16px;
	}

	.hec-header .hec-header__nav {
		font-size: 14px;
	}

	.hec-header a.hec-header__link {
		padding: 8px;
	}

	.hec-header .hec-header__search {
		flex-basis: 150px;
		min-width: 110px;
	}

	.hec-header a.hec-header__button {
		padding-inline: 14px;
	}
}

@media (max-width: 1023px) {
	.hec-header-strip .hec-header-strip__in {
		padding-block: 6px;
		padding-inline: 16px;
	}

	.hec-header .hec-header__in {
		padding-inline: 16px;
	}

	/* The brand shares the row with the menu button only, and gives way to it. */
	.hec-header a.hec-header__brand {
		flex: 0 1 auto;
	}

	.hec-header img.hec-header__logo {
		max-width: 120px;
	}

	.hec-header .hec-header__nav,
	.hec-header .hec-header__search--bar,
	.hec-header a.hec-header__button {
		display: none;
	}

	.hec-header .hec-header__panel {
		display: flex;
		flex-direction: column;
		max-height: calc(100vh - 68px);
		padding: 8px 16px 16px;
		overflow-y: auto;
		border-block-start: 1px solid var(--hh-line);
		background: #FFFFFF;
		font-size: 17px;
	}

	.hec-header .hec-header__search--panel {
		flex: 0 0 auto;
		margin-block: 8px 4px;
	}

	.hec-js .hec-header button.hec-header__toggle {
		display: flex;
	}

	.hec-js .hec-header:not(.is-open) .hec-header__panel {
		display: none;
	}

	html:not(.hec-js) .hec-header {
		position: static;
	}
}

/* Phones: the strip shows only its message. A strip that holds nothing but
   the phone and the WhatsApp link is hidden whole, not left as an empty band. */
@media (max-width: 767px) {
	.hec-header-strip .hec-header-strip__contacts {
		display: none;
	}

	.hec-header-strip.hec-header-strip--bare {
		display: none;
	}
}

/* ---------- A desktop whose menu does not fit ---------- */

/* The script sets is-compact when the menu is wider than its place in the
   bar (many or long links). The layout is the phone's: the brand and the
   menu button in the bar, everything else in the panel, which lines up with
   the page's content. Set only by the script, so it needs no .hec-js. */
.hec-header.is-compact a.hec-header__brand {
	flex: 0 1 auto;
}

.hec-header.is-compact .hec-header__nav,
.hec-header.is-compact .hec-header__search--bar,
.hec-header.is-compact a.hec-header__button {
	display: none;
}

.hec-header.is-compact button.hec-header__toggle {
	display: flex;
}

.hec-header.is-compact .hec-header__panel {
	display: flex;
	flex-direction: column;
	max-height: calc(100vh - 68px);
	padding-block: 8px 16px;
	padding-inline: max(24px, calc((100% - 1240px) / 2 + 24px));
	overflow-y: auto;
	border-block-start: 1px solid var(--hh-line);
	background: #FFFFFF;
	font-size: 17px;
}

.hec-header.is-compact:not(.is-open) .hec-header__panel {
	display: none;
}

.hec-header.is-compact .hec-header__search--panel {
	flex: 0 0 auto;
	margin-block: 8px 4px;
}

@media (prefers-reduced-motion: reduce) {
	.hec-header-strip a,
	.hec-header a,
	.hec-header button,
	.hec-header input {
		transition: none;
	}
}