/*!
* Components/XDivider
*/

.x-divider {
	display: block;
	flex: var(--x-comp-divider-flex, 1 1 100%);
	height: 0;
	max-height: 0;
	transition: inherit;
	border-color: var(--x-comp-divider-border-color, rgb(var(--x-sys-color-outline), var(--x-sys-opacity-outline)));
	border-style: var(--x-comp-divider-border-style, solid);
	border-width: var(--x-comp-divider-border-width, 0.0625rem 0 0 0);
}

.x-divider--vertical {
	align-self: stretch;
	border-width: var(--x-comp-divider-vertical-border-width, 0 0.0625rem 0 0);
	display: inline-flex;
	height: inherit;
	margin-left: var(--x-comp-divider-vertical-margin-left, -0.0625rem);
	max-height: 100%;
	max-width: 0;
	min-height: 100%;
	vertical-align: text-bottom;
	width: 0;
}

.x-divider--inset:not(.x-divider--vertical) {
	margin-inline-start: var(--x-comp-divider-inset-margin, 4.5rem);
	max-width: var(--x-comp-divider-inset-max-width, calc(100% - 4.5rem));
}

.x-divider--inset.x-divider--vertical {
	margin-bottom: var(--x-comp-divider-vertical-inset-margin-bottom, 0.5rem);
	margin-top: var(--x-comp-divider-vertical-inset-margin-top, 0.5rem);
	max-height: var(--x-comp-divider-vertical-inset-max-height, calc(100% - 1rem));
}