/* MKA Departments – department nav bar and search bar. Colours are variables; override in Elementor if needed. */

/* ---------- Nav bar: logo left, links right ---------- */
.mkad-head {
	--mkad-navy: #12355b;
	--mkad-blue: #1d4f8f;
	--mkad-line: #e3e7ed;
	--mkad-hover: #eef3f9;
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 24px;
	padding: 16px 0;
	font-family: inherit;
	box-sizing: border-box;
}
.mkad-head *, .mkad-head *::before, .mkad-head *::after { box-sizing: border-box; }
.mkad-head__brand { display: inline-flex; align-items: center; text-decoration: none !important; color: var(--mkad-navy); flex-shrink: 0; }
.mkad-head__logo { display: block; height: auto; max-height: 96px; width: auto; max-width: 320px; }
.mkad-head__name { font-weight: 800; font-size: 22px; line-height: 1.2; }

.mkad-head__nav { flex: 1 1 auto; display: flex; justify-content: flex-end; }
.mkad-head .mkad-head__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.mkad-head .mkad-head__list li { margin: 0; padding: 0; }
.mkad-head .mkad-head__link {
	display: flex;
	align-items: center;
	min-height: 44px;
	padding: 0 14px;
	border-radius: 8px;
	font-weight: 700;
	font-size: 16px;
	letter-spacing: .02em;
	color: var(--mkad-blue);
	text-decoration: none;
}
.mkad-head .mkad-head__link:hover,
.mkad-head .mkad-head__link:focus-visible { background: var(--mkad-hover); color: var(--mkad-navy); }
.mkad-head .mkad-head__link.is-current { background: var(--mkad-hover); color: var(--mkad-navy); }

.mkad-head .mkad-head__toggle {
	display: none;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 14px;
	margin: 0;
	border: 1.5px solid var(--mkad-line);
	border-radius: 8px;
	background: #fff;
	color: var(--mkad-navy);
	font: inherit;
	font-weight: 700;
	font-size: 15px;
	cursor: pointer;
}

/* Phones and tablets: links fold into the Menu button (they stay visible if JavaScript is off). */
@media (max-width: 782px) {
	.mkad-head__logo { max-height: 64px; max-width: 220px; }
	.mkad-head.is-ready .mkad-head__toggle { display: inline-flex; }
	.mkad-head__nav { flex: 1 1 100%; }
	.mkad-head.is-ready .mkad-head__nav { display: none; }
	.mkad-head.is-ready.is-open .mkad-head__nav { display: block; }
	.mkad-head .mkad-head__list { flex-direction: column; gap: 0; border-top: 1px solid var(--mkad-line); }
	.mkad-head .mkad-head__list li { border-bottom: 1px solid var(--mkad-line); }
	.mkad-head .mkad-head__link { min-height: 48px; border-radius: 0; padding: 0 8px; }
}

/* ---------- Search bar ---------- */
.mkad-search {
	--mkad-navy: #12355b;
	--mkad-blue: #1d4f8f;
	--mkad-text: #1b2430;
	--mkad-muted: #5a6575;
	--mkad-border: #c5cdd8;
	--mkad-line: #e3e7ed;
	--mkad-panel: #f4f6f9;
	--mkad-tag-bg: #d9ecd4;
	--mkad-tag-text: #2c5f27;
	position: relative;
	width: 100%;
	font-family: inherit;
	color: var(--mkad-text);
	box-sizing: border-box;
}
.mkad-search *, .mkad-search *::before, .mkad-search *::after { box-sizing: border-box; }

.mkad-search__form {
	position: relative;
	margin: 0;
	background: var(--mkad-panel);
	border: 1px solid var(--mkad-line);
	border-radius: 12px;
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.mkad-search__label {
	font-weight: 700;
	font-size: 15px;
	color: var(--mkad-navy);
	margin: 0;
}

.mkad-search__row { display: flex; gap: 12px; }

.mkad-search__field {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	align-items: center;
	gap: 10px;
	background: #fff;
	border: 1.5px solid var(--mkad-border);
	border-radius: 8px;
	padding: 0 16px;
	min-height: 52px;
	transition: border-color .15s, box-shadow .15s;
}
.mkad-search__field:focus-within {
	border-color: var(--mkad-navy);
	box-shadow: 0 0 0 3px rgba(18, 53, 91, .15);
}
.mkad-search__icon { flex-shrink: 0; color: var(--mkad-muted); }

/* Reset theme/Elementor input styles that usually break search bars */
.mkad-search .mkad-search__input {
	flex: 1;
	min-width: 0;
	width: 100%;
	height: 48px;
	margin: 0;
	padding: 0;
	border: none !important;
	outline: none !important;
	box-shadow: none !important;
	background: transparent !important;
	font: inherit;
	font-size: 16px; /* 16px stops iPhones zooming in */
	color: var(--mkad-text);
	-webkit-appearance: none;
	appearance: none;
}
.mkad-search .mkad-search__input::placeholder { color: #7a8494; opacity: 1; }
.mkad-search .mkad-search__input::-webkit-search-cancel-button { cursor: pointer; }

.mkad-search .mkad-search__button {
	flex-shrink: 0;
	min-height: 52px;
	padding: 0 28px;
	margin: 0;
	background: var(--mkad-navy);
	color: #fff;
	border: none;
	border-radius: 8px;
	font: inherit;
	font-weight: 700;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	transition: background .15s;
}
.mkad-search .mkad-search__button:hover,
.mkad-search .mkad-search__button:focus-visible { background: var(--mkad-blue); color: #fff; }

/* Scope chips */
.mkad-search__scope { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.mkad-search__scope-label { font-size: 13px; color: var(--mkad-muted); }
.mkad-search .mkad-search__chip {
	min-height: 36px;
	padding: 0 14px;
	margin: 0;
	border-radius: 999px;
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	background: #fff;
	color: var(--mkad-navy);
	border: 1.5px solid var(--mkad-border);
}
.mkad-search .mkad-search__chip.is-active {
	background: var(--mkad-navy);
	color: #fff;
	border-color: var(--mkad-navy);
}

/* Spinner */
.mkad-search__spinner {
	width: 18px; height: 18px;
	border: 2px solid var(--mkad-line);
	border-top-color: var(--mkad-navy);
	border-radius: 50%;
	flex-shrink: 0;
	visibility: hidden;
}
.mkad-search.is-loading .mkad-search__spinner {
	visibility: visible;
	animation: mkad-search-spin .7s linear infinite;
}
@keyframes mkad-search-spin { to { transform: rotate(360deg); } }

/* Live results dropdown */
.mkad-search__results {
	position: absolute;
	left: 20px;
	right: 20px;
	top: calc(100% - 8px);
	z-index: 9999;
	background: #fff;
	border: 1px solid var(--mkad-line);
	border-radius: 12px;
	box-shadow: 0 12px 32px rgba(15, 23, 32, .14);
	overflow: hidden;
	max-height: 70vh;
	overflow-y: auto;
}
.mkad-search__results[hidden] { display: none; }

.mkad-search__result {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 16px;
	min-height: 56px;
	text-decoration: none !important;
	color: var(--mkad-text) !important;
	border-bottom: 1px solid var(--mkad-line);
}
.mkad-search__result:hover,
.mkad-search__result.is-active { background: #eef3f9; }
.mkad-search__thumb {
	width: 44px; height: 44px;
	border-radius: 6px;
	object-fit: cover;
	flex-shrink: 0;
	background: #e9edf2;
}
.mkad-search__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mkad-search__type {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--mkad-tag-text);
}
.mkad-search__title { font-weight: 700; font-size: 15px; line-height: 1.3; }
.mkad-search__excerpt {
	font-size: 13px;
	color: var(--mkad-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.mkad-search__title mark { background: #fff3b0; color: inherit; padding: 0; }

.mkad-search__empty,
.mkad-search__all {
	display: block;
	padding: 14px 16px;
	font-size: 14px;
}
.mkad-search__empty { color: var(--mkad-muted); }
.mkad-search__all {
	font-weight: 700;
	color: var(--mkad-blue) !important;
	text-decoration: none !important;
	background: var(--mkad-panel);
}
.mkad-search__all:hover, .mkad-search__all.is-active { background: #eef3f9; }

.mkad-search .mkad-sr {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
	margin: 0;
}

/* ---------- Mobile ---------- */
@media (max-width: 600px) {
	.mkad-search__form { padding: 14px; border-radius: 10px; }
	.mkad-search__row { flex-direction: column; gap: 10px; }
	.mkad-search .mkad-search__button { width: 100%; min-height: 48px; }
	.mkad-search__field { min-height: 48px; padding: 0 12px; }
	.mkad-search .mkad-search__input { height: 44px; }
	.mkad-search__results { left: 0; right: 0; top: calc(100% + 4px); max-height: 60vh; }
	.mkad-search__excerpt { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
	.mkad-search .mkad-search__chip { min-height: 40px; }
}

@media (prefers-reduced-motion: reduce) {
	.mkad-search.is-loading .mkad-search__spinner { animation: none; }
}

.mkad-error { padding: 10px 12px; border-left: 4px solid #d63638; background: #fcf0f1; margin: 8px 0; }

/* Results page */
.mkad-results-page { --mkad-navy: #12355b; --mkad-blue: #1d4f8f; --mkad-muted: #5a6575; --mkad-line: #e3e7ed; display: flex; flex-direction: column; gap: 20px; }
.mkad-back { margin: 0; }
.mkad-back a { font-weight: 700; color: var(--mkad-blue); text-decoration: none; display: inline-flex; align-items: center; min-height: 44px; }
.mkad-back a:hover { text-decoration: underline; }
.mkad-results__heading { margin: 8px 0 0; font-size: 20px; line-height: 1.3; }
.mkad-results__none { margin: 0; color: var(--mkad-muted); }
.mkad-results__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--mkad-line); }
.mkad-results__item { padding: 16px 0; border-bottom: 1px solid var(--mkad-line); display: flex; flex-direction: column; gap: 4px; }
.mkad-results__trail { font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #2c5f27; }
.mkad-results__title { font-size: 18px; font-weight: 700; color: var(--mkad-navy); text-decoration: none; }
.mkad-results__title:hover { text-decoration: underline; }
.mkad-results__excerpt { margin: 0; color: var(--mkad-muted); font-size: 15px; line-height: 1.5; }
.mkad-results__pager { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.mkad-results__pager a { font-weight: 700; color: var(--mkad-blue); text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.mkad-results__pager span { color: var(--mkad-muted); }

@media (max-width: 600px) {
	.mkad-results__title { font-size: 17px; }
}

/* Hold our colours against theme link / button styles. */
.mkad-head a.mkad-head__brand, .mkad-head a.mkad-head__brand:hover, .mkad-head .mkad-head__name { color: var(--mkad-navy); }
.mkad-head .mkad-head__toggle:hover, .mkad-head .mkad-head__toggle:focus, .mkad-head .mkad-head__toggle:active { background: var(--mkad-hover); color: var(--mkad-navy); border-color: var(--mkad-line); }
.mkad-head .mkad-head__toggle:focus-visible { outline: 2px solid var(--mkad-navy); outline-offset: 2px; }
.mkad-results-page a.mkad-results__title, .mkad-results-page a.mkad-results__title:hover { color: var(--mkad-navy); }
