// Lower specificity - target list element.
ol.wp-block-latest-comments {
	// Removes left spacing in Customizer Widgets screen.
	// Due to low specificity this will be safely overridden
	// by default wp-block layout styles in the Post/Site editor
	margin-left: 0;

	// This block has customizable padding, border-box makes that more predictable.
	box-sizing: border-box;
}

// Following styles leverage :where so that typography block support styles and
// global styles apply when necessary.
:where(.wp-block-latest-comments:not([style*="line-height"] .wp-block-latest-comments__comment)) {
	line-height: 1.1;
}

:where(.wp-block-latest-comments:not([style*="line-height"] .wp-block-latest-comments__comment-excerpt p)) {
	line-height: 1.8;
}

.has-dates,
.has-excerpts {
	:where(.wp-block-latest-comments:not([style*="line-height"])) {
		line-height: 1.5;
	}
}

// Higher specificity - target list via wrapper.
.wp-block-latest-comments .wp-block-latest-comments {
	// Remove left spacing. Higher specificity required to
	// override default wp-block layout styles in the Post/Site editor.
	padding-left: 0;
}

.wp-block-latest-comments__comment {
	list-style: none;
	margin-bottom: 1em;

	.has-avatars & {
		min-height: 2.25em;
		list-style: none;

		.wp-block-latest-comments__comment-meta,
		.wp-block-latest-comments__comment-excerpt {
			margin-left: 3.25em;
		}
	}
}

.wp-block-latest-comments__comment-excerpt p {
	font-size: 0.875em;
	margin: 0.36em 0 1.4em;
}

.wp-block-latest-comments__comment-date {
	display: block;
	font-size: 0.75em;
}

.wp-block-latest-comments .avatar,
.wp-block-latest-comments__comment-avatar {
	border-radius: 1.5em;
	display: block;
	float: left;
	height: 2.5em;
	margin-right: 0.75em;
	width: 2.5em;
}

// Enforce font size when user has made selection at the individual block level.
.wp-block-latest-comments[style*="font-size"],
.wp-block-latest-comments[class*="-font-size"] {
	a {
		font-size: inherit;
	}
}
