/* Kundentyp-Umschalter. Farben kommen aus den Einstellungen (--dd-wc-primaer). */
.fbm-kundentyp { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }

.fbm-kundentyp__wahl {
	display: inline-flex; align-items: center; gap: 6px;
	min-height: 24px;
	font-size: 13px; line-height: 1.3; text-decoration: none;
	color: #333; padding: 3px 2px;
}
.fbm-kundentyp__punkt {
	width: 13px; height: 13px; flex: 0 0 13px;
	border: 2px solid var(--dd-wc-primaer, #a40c6e); border-radius: 50%; background: #fff;
}
.fbm-kundentyp__wahl.is-aktiv .fbm-kundentyp__punkt {
	background: var(--dd-wc-primaer, #a40c6e); box-shadow: inset 0 0 0 2px #fff;
}
.fbm-kundentyp__wahl.is-aktiv .fbm-kundentyp__name { font-weight: 700; color: var(--dd-wc-primaer, #a40c6e); }
.fbm-kundentyp__zusatz { color: #555; }
.fbm-kundentyp__wahl:hover .fbm-kundentyp__name { text-decoration: underline; }
.fbm-kundentyp__wahl:focus-visible { outline: 2px solid var(--dd-wc-primaer, #a40c6e); outline-offset: 2px; }

@media (max-width: 900px) {
	/* WCAG 2.5.8: mindestens 24 Pixel, fuer Finger 44 Pixel. */
	.fbm-kundentyp__wahl { min-height: 44px; padding-right: 10px; }
}

@media (max-width: 620px) {
	.fbm-kundentyp { gap: 12px; }
	.fbm-kundentyp__zusatz { display: none; }
}
