/* The line is inline-block so the Alignment setting (text-align) places it. */
.sv-divider {
	padding-block: var(--sv-space-xs);
	line-height: 0;
}

.sv-divider__line {
	display: inline-block;
	inline-size: 100%;
	margin: 0;
	border: 0;
	border-block-start: 1px solid var(--sv-color-border);
	vertical-align: middle;
}

.sv-divider--line-style-dashed .sv-divider__line {
	border-block-start-style: dashed;
}

.sv-divider--line-style-dotted .sv-divider__line {
	border-block-start-style: dotted;
}

.sv-divider--thickness-medium .sv-divider__line {
	border-block-start-width: 2px;
}

.sv-divider--thickness-thick .sv-divider__line {
	border-block-start-width: 4px;
}

.sv-divider--length-half .sv-divider__line {
	inline-size: 50%;
}

.sv-divider--length-short .sv-divider__line {
	inline-size: 5rem;
}

.sv-divider--tone-strong .sv-divider__line {
	border-block-start-color: color-mix(in srgb, var(--sv-color-text) 45%, transparent);
}

.sv-divider--tone-primary .sv-divider__line {
	border-block-start-color: var(--sv-color-primary);
}

.sv-divider--tone-secondary .sv-divider__line {
	border-block-start-color: var(--sv-color-secondary);
}

/* A line beside a project part with nothing to show (no scope, no client testimonial: ADR 0168) isn't drawn. */
.sv-divider:has(+ :is(.sv-project-scope, .sv-testimonials):empty),
:is(.sv-project-scope, .sv-testimonials):empty + .sv-divider {
	display: none;
}