/* Mobile Kontaktleiste (sv-kern). Sichtbar bis 781 px Breite. */
.sv-kontaktleiste { display: none; }

@media (max-width: 781px) {
	body.sv-hat-kontaktleiste {
		/* Platz reservieren, damit die Leiste keinen Inhalt verdeckt (INT-3). */
		padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px));
	}
	.sv-kontaktleiste {
		display: grid;
		/* minmax(0, 1fr): alle Knöpfe gleich breit, nie breiter als der Bildschirm (320 px geprüft).
		   Ohne WhatsApp-Knopf (unbestätigt auf dem Server) füllt der Anrufknopf die ganze Breite. */
		grid-auto-flow: column;
		grid-auto-columns: minmax(0, 1fr);
		gap: 0.75rem;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 50;
		padding: 0.6rem max(0.75rem, env(safe-area-inset-left, 0px)) calc(0.6rem + env(safe-area-inset-bottom, 0px)) max(0.75rem, env(safe-area-inset-right, 0px));
		background: #172027;
		box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.08);
		transition: transform 0.2s ease;
	}
	.sv-kontaktleiste.ist-verborgen { transform: translateY(110%); }
	.sv-kontaktleiste__knopf {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.45rem;
		min-height: 52px;
		padding: 0 0.5rem;
		text-align: center;
		line-height: 1.15;
		/* Lange Beschriftung („Werkstatt anrufen“) darf auf sehr schmalen Geräten zweizeilig werden (Umbruch nur zwischen Wörtern). */
		white-space: normal;
		border-radius: 6px;
		font-weight: 700;
		font-size: clamp(0.9375rem, 4vw, 1.0625rem);
		text-decoration: none;
		border: 2px solid transparent;
	}
	.sv-kontaktleiste__knopf svg { flex: none; }
	.sv-kontaktleiste__knopf--anruf { background: #E9B72F; color: #172027; border-color: #E9B72F; }
	.sv-kontaktleiste__knopf--whatsapp { background: #25D366; color: #172027; border-color: #25D366; } /* WhatsApp-Grün, Alex 05.10.2026 */
	.sv-kontaktleiste__knopf:focus-visible { outline: 3px solid #E9B72F; outline-offset: 3px; }
	.sv-kontaktleiste__knopf--anruf:focus-visible { outline-color: #FFFFFF; }
}

/* Nur lokal: unbestätigte Kontaktziele kennzeichnen. */
.sv-lokal .sv-ungeprueft { position: relative; }
.sv-lokal .sv-ungeprueft::after {
	content: "unbestätigt";
	position: absolute;
	top: -0.55rem;
	right: 0.4rem;
	font-size: 0.6875rem;
	font-weight: 700;
	line-height: 1;
	padding: 0.2rem 0.35rem;
	border-radius: 3px;
	background: #b00020;
	color: #fff;
}

@media (prefers-reduced-motion: reduce) {
	.sv-kontaktleiste { transition: none; }
}