/**
 * 2026 Widget: Bullet List — Kreis 17×17, Inline-SVG
 */

.imc-bullet-list-widget__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
}

.imc-bullet-list-widget__item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	padding: 5px 0;
}

.imc-bullet-list-widget__list--dividers .imc-bullet-list-widget__item {
	gap: 30px;
	padding: 10px 0;
}

.imc-bullet-list-widget__list--dividers .imc-bullet-list-widget__item {
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

/* Kreis 17×17 */
.imc-bullet-list-widget__bullet {
	flex: 0 0 auto;
	width: 17px;
	height: 17px;
	border-radius: 50%;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	transform: translateY(4px);
	overflow: hidden;
}

.imc-bullet-list-widget__bullet-svg {
	display: block;
	width: auto;
	height: auto;
	max-width: 10px;
	max-height: 10px;
	flex-shrink: 0;
}

/* Primary = IMC Orange (Theme-Variable mit Fallback) */
.imc-bullet-list-widget__list--bullet-primary .imc-bullet-list-widget__bullet {
	background: var(--imc_orange, rgba(255, 70, 55, 1));
}

.imc-bullet-list-widget__list--bullet-light .imc-bullet-list-widget__bullet {
	background: rgba(250, 250, 250, 1);
}

.imc-bullet-list-widget__list--bullet-dark .imc-bullet-list-widget__bullet {
	background: rgba(40, 40, 40, 1);
}

/* Auf hellem Kreis: SVG-Striche dunkel */
.imc-bullet-list-widget__list--bullet-light .imc-bullet-list-widget__bullet-svg path,
.imc-bullet-list-widget__list--bullet-light .imc-bullet-list-widget__bullet-svg line,
.imc-bullet-list-widget__list--bullet-light .imc-bullet-list-widget__bullet-svg polyline,
.imc-bullet-list-widget__list--bullet-light .imc-bullet-list-widget__bullet-svg polygon,
.imc-bullet-list-widget__list--bullet-light .imc-bullet-list-widget__bullet-svg circle {
	stroke: rgba(40, 40, 40, 1) !important;
}

.imc-bullet-list-widget__list--bullet-light .imc-bullet-list-widget__bullet-svg path[fill]:not([fill='none']) {
	fill: rgba(40, 40, 40, 1) !important;
}

/* Fallback-Punkt ohne SVG */
.imc-bullet-list-widget__bullet-fallback {
	display: block;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: currentColor;
	opacity: 0.85;
}

.imc-bullet-list-widget__list--bullet-primary .imc-bullet-list-widget__bullet-fallback,
.imc-bullet-list-widget__list--bullet-dark .imc-bullet-list-widget__bullet-fallback {
	color: rgba(255, 255, 255, 1);
}

.imc-bullet-list-widget__list--bullet-light .imc-bullet-list-widget__bullet-fallback {
	color: rgba(40, 40, 40, 1);
}

.imc-bullet-list-widget__text {
	flex: 1 1 auto;
	min-width: 0;
	line-height: 1.45;
}

/*
 * Color Text — doppelte Klasse + !important, damit Theme-Regeln (z. B. .widget, .copy) die Farbe nicht überschreiben.
 */
.imc-bullet-list-widget__list.imc-bullet-list-widget__list--text-primary .imc-bullet-list-widget__text {
	color: rgba(255, 70, 55, 1) !important;
}

.imc-bullet-list-widget__list.imc-bullet-list-widget__list--text-light .imc-bullet-list-widget__text {
	color: rgba(255, 255, 255, 1) !important;
}

.imc-bullet-list-widget__list.imc-bullet-list-widget__list--text-dark .imc-bullet-list-widget__text {
	color: rgba(40, 40, 40, 1) !important;
}
