/**
 * 08-branding.css - Partei-Logo in Header und Footer.
 * Greift nur, wenn im Customizer ein Logo hinterlegt ist (inc/branding.php).
 */

.partei-logo {
	display: inline-flex;
	align-items: center;
	line-height: 0;
	text-decoration: none;
	transition: opacity var(--transition);
}

.partei-logo:hover,
.partei-logo:focus-visible {
	opacity: 0.8;
}

.partei-logo__bild {
	width: auto;
	object-fit: contain;
}

/* --- Header: neben der Wortmarke, durch eine feine Linie getrennt --- */

.partei-logo--header {
	display: none; /* auf Mobil zugunsten der Wortmarke ausgeblendet */
	/* WICHTIG: Als Flex-Element neben der Navigation darf das Logo NICHT
	   schrumpfen. Ohne flex-shrink: 0 druecken Menue und CTA es bei engem
	   Header auf 0 px zusammen - es verschwindet dann spurlos. */
	flex: 0 0 auto;
	margin-left: var(--sp-4);
	padding-left: var(--sp-4);
	border-left: 1px solid var(--color-border);
}

/* Feste Hoehe statt max-height: nur so leitet der Browser die Breite aus dem
   Seitenverhaeltnis ab. Mit max-height allein bleibt die Breite bei "auto"
   unbestimmt und kollabiert im Flex-Layout. */
.partei-logo--header .partei-logo__bild {
	height: 30px;
	max-width: none;
}

@media (min-width: 640px) {
	.partei-logo--header {
		display: inline-flex;
	}
}

/* Im kompakten Sticky-Zustand etwas kleiner. */
.site-header.is-scrolled .partei-logo--header .partei-logo__bild {
	height: 24px;
}

/* Die Wortmarke steht im Header neben dem Logo.
   flex: 0 0 auto ist zwingend: sonst schrumpft der Branding-Block unter seine
   Inhaltsbreite, das Logo laeuft heraus und legt sich ueber die Navigation. */
.site-branding {
	display: flex;
	align-items: center;
	flex: 0 0 auto;
}

/* Mit Logo entfaellt die textliche Unterzeile "CDU Nordhorn" - das Logo sagt
   dasselbe und der Platz wird fuer die Navigation gebraucht. Im Footer bleibt
   die Unterzeile erhalten, dort ist Platz genug. */
.site-branding--mit-logo .brand__tagline {
	display: none;
}

/* --- Footer: unter der Wortmarke --- */

.partei-logo--footer {
	margin-block: var(--sp-4) var(--sp-2);
	padding: var(--sp-3) var(--sp-4);
	border-radius: var(--radius);
	background: var(--c-white);
}

.partei-logo--footer .partei-logo__bild {
	max-height: 40px;
}