/**
 * core/list – "Checklist" style: accent check circles instead of bullets.
 * The circle is ::before, the check mark is ::after (pure CSS, themeable).
 */
.wp-block-list.is-style-checklist {
	list-style: none;
}

.wp-block-list.is-style-checklist > li {
	position: relative;
	padding-inline-start: 2rem;
}

.wp-block-list.is-style-checklist > li + li {
	margin-block-start: 0.5em;
}

.wp-block-list.is-style-checklist > li::before,
.wp-block-list.is-style-checklist > li::after {
	content: "";
	position: absolute;
	inset-block-start: 0.15em;
	inset-block-start: calc((1lh - 1.25rem) / 2);
	inset-inline-start: 0;
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 50%;
}

/* Circle, then a check mark of the same size masked into its centre. */
.wp-block-list.is-style-checklist > li::before {
	background-color: var(--rowww-accent-start);
}

.wp-block-list.is-style-checklist > li::after {
	background-color: var(--rowww-accent-on);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.2l2.7 2.7L14.2 7.4' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.2l2.7 2.7L14.2 7.4' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat;
}

@media (forced-colors: active) {

	.wp-block-list.is-style-checklist > li::before {
		background-color: CanvasText;
	}

	.wp-block-list.is-style-checklist > li::after {
		background-color: Canvas;
	}
}

/**
 * core/list – "Cross list" style: the counterpart of the checklist, a muted
 * circle with an X (e.g. the "without" side of a comparison).
 */
.wp-block-list.is-style-crosslist {
	list-style: none;
}

.wp-block-list.is-style-crosslist > li {
	position: relative;
	padding-inline-start: 2rem;
}

.wp-block-list.is-style-crosslist > li + li {
	margin-block-start: 0.5em;
}

.wp-block-list.is-style-crosslist > li::before,
.wp-block-list.is-style-crosslist > li::after {
	content: "";
	position: absolute;
	inset-block-start: calc((1lh - 1.25rem) / 2);
	inset-inline-start: 0;
	width: 1.25rem;
	height: 1.25rem;
	border-radius: 50%;
}

.wp-block-list.is-style-crosslist > li::before {
	background-color: var(--wp--preset--color--surface);
	box-shadow: inset 0 0 0 1px var(--wp--custom--line--default);
}

.wp-block-list.is-style-crosslist > li::after {
	background-color: var(--wp--preset--color--muted);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M7 7l6 6M13 7l-6 6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M7 7l6 6M13 7l-6 6' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center / 100% no-repeat;
}

@media (forced-colors: active) {

	.wp-block-list.is-style-crosslist > li::before {
		box-shadow: inset 0 0 0 1px CanvasText;
	}

	.wp-block-list.is-style-crosslist > li::after {
		background-color: CanvasText;
	}
}

/**
 * core/list – "Feature list" style: larger points, each with a lime check
 * circle, a bold title (the item's first <strong>, on its own line) and a
 * muted description, separated by thin lines.
 */
.wp-block-list.is-style-features {
	list-style: none;
}

.wp-block-list.is-style-features > li {
	position: relative;
	padding-inline-start: 3rem;
}

.wp-block-list.is-style-features > li + li {
	margin-block-start: var(--wp--preset--spacing--50);
	padding-block-start: var(--wp--preset--spacing--50);
	border-block-start: 1px solid var(--wp--custom--line--subtle);
}

.wp-block-list.is-style-features > li > strong:first-child {
	display: block;
	margin-block-end: var(--wp--preset--spacing--20);
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--md);
	font-weight: 500;
}

.wp-block-list.is-style-features > li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	width: 1.9rem;
	height: 1.9rem;
	border-radius: 50%;
	background: var(--wp--preset--color--cta) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.2l2.7 2.7L14.2 7.4' fill='none' stroke='%230B0B0B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat;
}

/* Level with the title, below the divider. */
.wp-block-list.is-style-features > li + li::before {
	inset-block-start: var(--wp--preset--spacing--50);
}

@media (forced-colors: active) {

	.wp-block-list.is-style-features > li::before {
		forced-color-adjust: none;
		background-color: CanvasText;
	}
}

/*
 * Trust points under the hero buttons (`rowww-hero-points`): the checklist in
 * one centred, wrapping row, smaller and muted.
 */
.wp-block-list.is-style-checklist.rowww-hero-points {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--20) var(--wp--preset--spacing--50);
	justify-content: center;
	padding: 0;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--sm);
}

.wp-block-list.is-style-checklist.rowww-hero-points > li {
	padding-inline-start: 1.5rem;
}

.wp-block-list.is-style-checklist.rowww-hero-points > li + li {
	margin-block-start: 0;
}

.wp-block-list.is-style-checklist.rowww-hero-points > li::before,
.wp-block-list.is-style-checklist.rowww-hero-points > li::after {
	width: 1rem;
	height: 1rem;
	inset-block-start: calc((1lh - 1rem) / 2);
}