/* Icon List Pro - Frontend Styles */

.ilp-list {
	display: flex;
	flex-direction: column;
	gap: var(--ilp-row-gap, 24px);
	max-width: 100%;
}

.ilp-list.ilp-align-center {
	align-items: center;
	text-align: center;
}

.ilp-item {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: var(--ilp-item-gap, 14px);
	row-gap: 6px;
	max-width: 100%;
}

.ilp-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--ilp-icon-size, 32px);
	height: var(--ilp-icon-size, 32px);
	flex: 0 0 auto;
}

.ilp-icon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}

/* Tinted icon: uses the uploaded image as a mask, filled with icon-color */
.ilp-icon.ilp-icon-tint {
	background-color: var(--ilp-icon-color, #e4001b);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-position: center;
	mask-position: center;
}

.ilp-title {
	font-size: var(--ilp-title-size, 28px);
	color: var(--ilp-title-color, #e4001b);
	font-weight: var(--ilp-title-weight, 700);
	line-height: 1.25;
	white-space: nowrap;
}

.ilp-sep {
	flex: 0 0 auto;
}

.ilp-sep-char {
	font-size: var(--ilp-content-size, 24px);
	color: var(--ilp-separator-color, #5f6368);
	line-height: 1.25;
}

.ilp-sep-line {
	display: inline-block;
	width: var(--ilp-sep-width, 20px);
	height: var(--ilp-sep-height, 2px);
	background-color: var(--ilp-separator-color, #5f6368);
	border-radius: 1px;
}

.ilp-content {
	font-size: var(--ilp-content-size, 24px);
	color: var(--ilp-content-color, #5f6368);
	line-height: 1.35;
}

@media (max-width: 480px) {
	.ilp-title {
		white-space: normal;
	}
}