/*
 * Live search results dropdown and mobile search panel (from the live Elementor search widget and
 * its result loop template 2234).
 */

/* Clear button (a small search glyph, as on the live site) */
.ew-search__clear,
.ew-search__clear:hover,
.ew-search__clear:focus {
	position: absolute;
	right: 30px;
	top: 50%;
	display: flex;
	padding: 0;
	background: transparent;
	color: var(--ew-purple);
	line-height: 1;
	transform: translateY(-50%);
}
.ew-search__clear[hidden] { display: none; }
.ew-search__clear svg { width: 10px; height: 10px; fill: currentColor; }

/* Results dropdown */
.ew-results {
	position: absolute;
	top: 65px;
	left: 0;
	right: 0;
	z-index: 2000;
	display: flex;
	flex-direction: column;
	padding: 16px;
	border: 1px solid #cdcdcd;
	background-color: var(--ew-off-white);
}
.ew-results[hidden] { display: none; }
.ew-results__list { display: grid; grid-template-columns: 1fr; gap: 16px; }
.ew-results--equal .ew-results__list { grid-auto-rows: 1fr; }
.ew-results__empty { color: #515962; text-align: center; }
.ew-results__pages { display: flex; justify-content: center; gap: 20px; padding: 15px 0; }
.ew-results__pages button,
.ew-results__pages button:hover,
.ew-results__pages button:focus {
	padding: 0;
	background: transparent;
	color: var(--ew-purple);
	font-family: var(--ew-font-jakarta);
	font-size: 16px;
	font-weight: 300;
	line-height: 1em;
	text-transform: uppercase;
}
.ew-results__pages button:hover { color: var(--ew-mustard); }

/* Result card */
.ew-result { display: flex; box-shadow: 0 0 10px 0 rgba(0, 0, 0, .15); }
.ew-result__image { display: flex; flex: 0 0 50%; text-align: center; }
.ew-result__image a { display: block; width: 100%; line-height: 0; }
.ew-result__image img { display: inline-block; width: 100%; vertical-align: middle; }
.ew-results--equal .ew-result__image img { height: 100%; object-fit: cover; }
.ew-result__body { display: flex; flex-direction: column; justify-content: space-evenly; gap: 1px; flex: 0 0 50%; padding: 5%; }
.ew-result__title-wrap { padding: 1%; }
.ew-result__title {
	margin: 0 0 10px;
	font-family: var(--ew-font-gibson);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.1em;
	text-transform: uppercase;
}
.ew-result__title a,
.ew-result__title a:hover { color: var(--ew-purple); }
.ew-result__buttons { display: flex; }
.ew-result__buttons .ew-result__btn { flex: 1 1 0; margin: 1%; }
.ew-result__btn,
.ew-result__btn:visited {
	display: inline-block;
	padding: 10px;
	background-color: var(--ew-purple);
	color: var(--ew-white);
	font-family: var(--ew-font-gibson);
	font-size: 13px;
	font-weight: 700;
	line-height: 1em;
	text-align: center;
	text-transform: uppercase;
	transition: all .3s;
}
.ew-result__btn:hover,
.ew-result__btn:focus { background-color: var(--ew-off-white); color: var(--ew-purple); }
.ew-result__btn--enquire,
.ew-result__btn--enquire:visited { background-color: var(--ew-mustard); color: var(--ew-purple); text-shadow: 0 0 10px rgba(0, 0, 0, .3); }
.ew-result__btn--enquire:hover,
.ew-result__btn--enquire:focus { background-color: var(--ew-purple); color: var(--ew-mustard); }

@media (max-width: 767px) {
	.ew-result { padding: 0 1%; }
	.ew-result__image { flex: 0 0 115.533px; }
	.ew-result__body { flex: 1 1 auto; }
	.ew-result__btn { font-size: 12px; }
}

/* ---------- Mobile search panel ---------- */
.ew-msearch[hidden] { display: none; }
.ew-msearch { position: fixed; inset: 0; z-index: 10003; }
.ew-msearch__overlay { position: absolute; inset: 0; background-color: rgba(0, 0, 0, .8); }
.ew-msearch__panel {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: 100%;
	min-height: 100vh;
	max-height: 100vh;
	overflow: auto;
	/* 10% / 5% of the inner width (the live container nests its padding inside 2% side padding). */
	padding: 9.6% 2% 4.8%;
	background-color: var(--ew-purple);
	animation: ew-slide-in-left 1s both;
}
@keyframes ew-slide-in-left { from { transform: translateX(-100%); } to { transform: none; } }
.ew-msearch__top { display: flex; flex-wrap: nowrap; gap: 20px; padding: 1%; }
.ew-msearch__logo { flex: 0 0 65.956%; }
.ew-msearch__logo .ew-logo { display: block; }
.ew-msearch__logo .ew-logo img { width: 100%; }
.ew-msearch__close-wrap { flex: 0 1 50%; min-width: 0; padding: 1%; text-align: end; line-height: 24px; }
.ew-msearch__close,
.ew-msearch__close:hover,
.ew-msearch__close:focus { display: inline-block; padding: 0; background: transparent; color: var(--ew-white); font-size: 25px; line-height: 1; }
.ew-msearch__close:hover { color: var(--ew-mustard); }
.ew-msearch__close .ew-icon { display: block; width: 1em; height: 25px; }
.ew-msearch__search { align-self: center; width: 95%; max-width: 95%; }

@media (prefers-reduced-motion: reduce) { .ew-msearch__panel { animation: none; } }
@media (min-width: 768px) { .ew-msearch { display: none !important; } }
