/* Section Divider — follows theme palette vars */
.vcs-section-divider {
	--divider-color: var(--theme-palette-color-4);
	color: var(--divider-color);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	width: 100%;
}

/* Stretching lines (solid by default) */
.vcs-section-divider .vcs-divider-line {
	display: block;
	width: clamp(
		var(--divider-line-min, 160px),
		calc( (100% - var(--mordent-size) - (2 * var(--divider-gap))) * (var(--divider-line-len, 40) * 0.01) ),
		var(--divider-line-max, 520px)
	);
	flex: 0 0 auto;
	height: var(--divider-thickness);
	background: currentColor;
}

/* Dashed variant */
.vcs-section-divider .vcs-divider-line.is-dashed {
	display: block;
	width: clamp(
		var(--divider-line-min, 160px),
		calc( (100% - var(--mordent-size) - (2 * var(--divider-gap))) * (var(--divider-line-len, 40) * 0.01) ),
		var(--divider-line-max, 520px)
	);
	flex: 0 0 auto;
	background: none;
	height: 0;
	border-top: var(--divider-thickness) dashed currentColor;
}

/* Space around the mordent */
.vcs-section-divider .vcs-divider-line:first-child {
	margin-right: var(--divider-gap);
}
.vcs-section-divider .vcs-divider-line:last-child {
	margin-left: var(--divider-gap);
}

/* Fixed-size mordent */
.vcs-section-divider .vcs-divider-mordent {
	width: var(--mordent-size);
	height: var(--mordent-size);
	display: block;
	flex: 0 0 auto;
}

.vcs-section-divider.aligncenter {
	display: flex;
}
.editor-styles-wrapper .vcs-section-divider.aligncenter {
	align-items: center;
	justify-content: center;
}