/* =========================
   Container
========================= */

.wpverein-sp-container {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wpverein-sp-abstand);
}

/* =========================
   Karte
========================= */

.wpverein-sp-karte {
	width: var(--wpverein-sp-breite);
	background: var(--wpverein-sp-hintergrund);
	border: var(--wpverein-sp-rahmen-breite) solid var(--wpverein-sp-rahmen-farbe);
	border-radius: var(--wpverein-sp-rahmen-radius);
	overflow: hidden;
	font-size: var(--wpverein-sp-schrift-groesse, inherit);
	color: var(--wpverein-sp-schrift-farbe);
}

/* =========================
   Logo
========================= */

.wpverein-sp-logo-wrapper {
	padding: var(--wpverein-sp-logo-padding);
	margin-bottom: var(--wpverein-sp-logo-abstand, 0px);
	display: flex;
	align-items: center;
	justify-content: center;
}

.wpverein-sp-logo {
	max-width: var(--wpverein-sp-logo-breite);
	max-height: var(--wpverein-sp-logo-hoehe);
	width: auto;
	height: auto;
	border-radius: var(--wpverein-sp-logo-radius);
	display: block;
	object-fit: contain;
}

.wpverein-sp-logo-wrapper a {
	display: flex;
	align-items: center;
	justify-content: center;
}

/* =========================
   Inhalt
========================= */

.wpverein-sp-inhalt {
	padding: 0 var(--wpverein-sp-text-padding) var(--wpverein-sp-text-padding);
}

.wpverein-sp-name {
	margin: 0 0 4px;
	font-weight: var(--wpverein-sp-name-gewicht);
}

.wpverein-sp-beschreibung {
	margin: 0;
	font-size: 0.9em;
}

/* =========================
   Karte: Logo links
========================= */

.wpverein-sp-karte--logo-links {
	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: var(--wpverein-sp-logo-abstand, 0px);
}

.wpverein-sp-karte--logo-links .wpverein-sp-logo-wrapper {
	flex-shrink: 0;
	margin-bottom: 0;
}

.wpverein-sp-karte--logo-links .wpverein-sp-inhalt {
	padding: var(--wpverein-sp-text-padding);
	flex: 1;
	min-width: 0;
}

/* =========================
   Logo-Ansicht (nur Logo)
========================= */

.wpverein-sp-container--logo {
	align-items: center;
}

.wpverein-sp-logo-einzeln {
	display: inline-flex;
	align-items: center;
}

.wpverein-sp-logo-einzeln a {
	display: flex;
}

/* =========================
   Name-Ansicht
========================= */

.wpverein-sp-container--name {
	align-items: center;
}