/* =====================================================================
   Website-Suche (1.35.0)

   Zwei Teile: die Lupe samt aufklappender Leiste in der Kopfzeile
   (immer geladen, in site-chrome.css wäre sie auch richtig aufgehoben —
   sie steht hier, damit alles zur Suche an einer Stelle liegt), und die
   Ergebnisseite (nur auf /?s=… geladen).
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. Lupe in der Kopfzeile
   --------------------------------------------------------------------- */
.mb-suche-knopf {
	flex: 0 0 auto;
	width: 38px;
	height: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 1px solid #E1E4E7;
	border-radius: 3px;
	color: var(--wp--preset--color--blau, #004C99);
	cursor: pointer;
	padding: 0;
	transition: background .15s, border-color .15s, color .15s;
}
.mb-suche-knopf svg { width: 18px; height: 18px; display: block; }

/* color ausdrücklich: Kadence stylt button:hover mit eigener Textfarbe und
   ist spezifischer als unsere Klasse — dieselbe Falle wie in 1.33.0. */
.mb-suche-knopf:hover,
.mb-suche-knopf:focus-visible {
	background: var(--wp--preset--color--blau, #004C99);
	border-color: var(--wp--preset--color--blau, #004C99);
	color: #fff;
}
.mb-suche-knopf:focus-visible {
	outline: 2px solid var(--wp--preset--color--blau-dunkel, #00325E);
	outline-offset: 2px;
}
.mb-suche-knopf[aria-expanded="true"] {
	background: var(--wp--preset--color--blau, #004C99);
	border-color: var(--wp--preset--color--blau, #004C99);
	color: #fff;
}

/* ---------------------------------------------------------------------
   2. Aufklappende Leiste

   position:absolute statt eines eingeschobenen Elements: So verschiebt
   sich beim Öffnen nichts, die Seite springt nicht.
   --------------------------------------------------------------------- */
.mb-suche-leiste {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	z-index: 60;
	background: var(--wp--preset--color--blau-dunkel, #00325E);
	padding: 18px var(--edge);
	box-shadow: 0 14px 30px rgba(14, 27, 38, 0.18);
}
.mb-suche-leiste[hidden] { display: none; }
.mb-suche-leiste form {
	display: flex;
	gap: 10px;
	max-width: 760px;
	margin: 0 auto;
}
.mb-suche-leiste input[type="search"] {
	flex: 1;
	min-width: 0;
	padding: 13px 16px;
	border: none;
	border-radius: 3px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 1rem;
}
.mb-suche-leiste input[type="search"]:focus {
	outline: 3px solid #fff;
	outline-offset: 2px;
}
.mb-suche-leiste button {
	flex: 0 0 auto;
	background: var(--wp--preset--color--blau, #004C99);
	color: #fff;
	border: 1px solid #fff;
	border-radius: 3px;
	padding: 13px 22px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: .92rem;
	font-weight: 600;
	cursor: pointer;
}
.mb-suche-leiste button:hover,
.mb-suche-leiste button:focus-visible { background: #fff; color: var(--wp--preset--color--blau-dunkel, #00325E); }
.mb-suche-hinweis {
	max-width: 760px;
	margin: 9px auto 0;
	color: rgba(255, 255, 255, 0.72);
	font-size: .78rem;
}

/* ---------------------------------------------------------------------
   3. Suchfeld im mobilen Menü — offen, kein Symbol
   --------------------------------------------------------------------- */
.mb-mnp-suche {
	display: flex;
	gap: 8px;
	margin: 0 0 18px;
}
.mb-mnp-suche input[type="search"] {
	flex: 1;
	min-width: 0;
	padding: 12px 14px;
	border: 1px solid #E1E4E7;
	border-radius: 3px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 1rem;
}
.mb-mnp-suche button {
	flex: 0 0 auto;
	width: 46px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--blau, #004C99);
	color: #fff;
	border: none;
	border-radius: 3px;
	cursor: pointer;
}
.mb-mnp-suche button svg { width: 18px; height: 18px; display: block; }
.mb-mnp-suche button:hover,
.mb-mnp-suche button:focus-visible { background: var(--wp--preset--color--blau-dunkel, #00325E); color: #fff; }

/* ---------------------------------------------------------------------
   4. Ergebnisseite
   --------------------------------------------------------------------- */
.mb-suche-kopf {
	background: var(--wp--preset--color--paper, #F3F6FB);
	border-bottom: 1px solid #E1E4E7;
	padding: 36px var(--edge) 30px;
}
.mb-suche-kopf-innen { max-width: 1320px; margin: 0 auto; }
.mb-suche-kopf h1 { margin: 0 0 4px; }

.mb-suche-formular {
	display: flex;
	gap: 10px;
	max-width: 640px;
	margin: 16px 0 0;
}
.mb-suche-formular input[type="search"] {
	flex: 1;
	min-width: 0;
	padding: 12px 15px;
	border: 1px solid #E1E4E7;
	border-radius: 3px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: 1rem;
	background: #fff;
}
.mb-suche-formular button {
	flex: 0 0 auto;
	background: var(--wp--preset--color--blau, #004C99);
	color: #fff;
	border: none;
	border-radius: 3px;
	padding: 12px 24px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-size: .92rem;
	font-weight: 600;
	cursor: pointer;
}
.mb-suche-formular button:hover,
.mb-suche-formular button:focus-visible { background: var(--wp--preset--color--blau-dunkel, #00325E); color: #fff; }

.mb-suche-zahl {
	font-family: 'IBM Plex Mono', monospace;
	font-size: .78rem;
	color: var(--wp--preset--color--grau-dunkel, #595959);
	margin: 14px 0 0;
}

.mb-suche-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; }
.mb-suche-chip {
	display: inline-flex;
	align-items: center;
	border: 1px solid #E1E4E7;
	background: #fff;
	color: var(--wp--preset--color--ink, #0E1B26);
	border-radius: 999px;
	padding: 8px 15px;
	font-size: .82rem;
	font-weight: 600;
	text-decoration: none;
	transition: background .15s, border-color .15s, color .15s;
}
/* Gefüllt beim Überfahren, gefüllt beim Ausgewähltsein — dieselbe Sprache
   wie bei den Kundenstimmen- und Trainingsfiltern seit 1.33.0. */
.mb-suche-chip:hover,
.mb-suche-chip:focus-visible,
.mb-suche-chip.is-aktiv {
	background: var(--wp--preset--color--blau, #004C99);
	border-color: var(--wp--preset--color--blau, #004C99);
	color: #fff;
}
.mb-suche-n { font-family: 'IBM Plex Mono', monospace; font-size: .72rem; opacity: .7; margin-left: 6px; }

.mb-suche-koerper { max-width: 1320px; margin: 0 auto; padding: 30px var(--edge) 70px; }

.mb-suche-treffer { list-style: none; margin: 0; padding: 0; max-width: 860px; }
.mb-suche-treffer li { padding: 20px 0; border-bottom: 1px solid #E1E4E7; }
.mb-suche-treffer li:first-child { padding-top: 0; }

.mb-suche-typ {
	display: inline-block;
	font-family: 'IBM Plex Mono', monospace;
	font-size: .62rem;
	letter-spacing: .07em;
	text-transform: uppercase;
	padding: 2px 7px;
	border-radius: 3px;
	margin-bottom: 7px;
	background: #F1F1F1;
	color: var(--wp--preset--color--grau-dunkel, #595959);
}
/* Farbe nach Achse: Wissen grün, Angebot blau, Magazin gelb — dieselbe
   Zuordnung wie im übrigen Auftritt. */
.mb-suche-typ.is-wissensartikel,
.mb-suche-typ.is-glossarbegriff { background: var(--wp--preset--color--gruen-hell, #EDF6EE); color: var(--wp--preset--color--gruen, #167F27); }
.mb-suche-typ.is-leistung       { background: var(--wp--preset--color--blau-hell, #EEF4FA);  color: var(--wp--preset--color--blau, #004C99); }
.mb-suche-typ.is-post           { background: var(--wp--preset--color--gelb-hell, #FDF6E3);  color: #8a6a12; }

.mb-suche-treffer h2 { font-size: 1.05rem; margin: 0 0 5px; line-height: 1.3; }
.mb-suche-treffer h2 a { color: var(--wp--preset--color--blau, #004C99); text-decoration: none; }
.mb-suche-treffer h2 a:hover { text-decoration: underline; }
.mb-suche-treffer p { margin: 0 0 6px; font-size: .92rem; color: var(--wp--preset--color--grau-dunkel, #595959); }
.mb-suche-treffer mark { background: #FFF1A8; color: inherit; padding: 0 2px; border-radius: 2px; }
.mb-suche-pfad { font-family: 'IBM Plex Mono', monospace; font-size: .72rem; color: var(--wp--preset--color--grau, #969696); }

.mb-suche-leer {
	background: var(--wp--preset--color--paper, #F3F6FB);
	border-radius: 12px;
	padding: 34px 24px;
	text-align: center;
	max-width: 700px;
}
.mb-suche-leer h2 { margin: 0 0 8px; }
.mb-suche-leer > p { color: var(--wp--preset--color--grau-dunkel, #595959); font-size: .94rem; max-width: 520px; margin: 0 auto 16px; }
.mb-suche-vorschlaege { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.mb-suche-kontakt { margin: 18px 0 0; font-size: .9rem; }

/* Blättern — Kadence bringt eigene Stile mit, die hier zu laut sind. */
.mb-suche-koerper .navigation.pagination { margin-top: 30px; }
.mb-suche-koerper .nav-links { display: flex; flex-wrap: wrap; gap: 8px; }
.mb-suche-koerper .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	border: 1px solid #E1E4E7;
	border-radius: 3px;
	text-decoration: none;
	font-size: .88rem;
	color: var(--wp--preset--color--ink, #0E1B26);
}
.mb-suche-koerper .page-numbers:hover,
.mb-suche-koerper .page-numbers.current {
	background: var(--wp--preset--color--blau, #004C99);
	border-color: var(--wp--preset--color--blau, #004C99);
	color: #fff;
}

@media (max-width: 600px) {
	.mb-suche-leiste form { flex-wrap: wrap; }
	.mb-suche-leiste button { width: 100%; }
	.mb-suche-formular { flex-wrap: wrap; }
	.mb-suche-formular button { width: 100%; }
}

/* Zusatz bei aktivem Filter — tiefergestellt, damit die Zahl führt. */
.mb-suche-gefiltert { color: var(--wp--preset--color--grau, #969696); }