/**
 * Icon List block – front-end styles.
 *
 * @package wuppi-blocks
 */

.wuppi-icon-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--wuppi-icon-list-gap, 12px);
}

/* ── List item ───────────────────────────────────────────────────────────── */

.wuppi-icon-list__item {
	display: flex;
	align-items: flex-start;
	gap: var(--wuppi-icon-list-gap, 12px);
}

/* ── Icon ────────────────────────────────────────────────────────────────── */

.wuppi-icon-list__icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	line-height: 1;
	/* Vertically align with the first line of text. */
	margin-top: 0.1em;
}

.wuppi-icon-list__icon svg {
	width: var(--wuppi-icon-size, 20px);
	height: var(--wuppi-icon-size, 20px);
	stroke: currentColor;
	fill: none;
	display: block;
}

/* ── Text ────────────────────────────────────────────────────────────────── */

.wuppi-icon-list__text {
	line-height: 1.5;
}