$timeline-border-color: var(--timeline-border-color, $gray-900) !default;
$timeline-border-width: var(--timeline-border-width, 2px) !default;

$timeline-border-modifier: calc(
	#{$timeline-border-width} * 0.5 - #{$panel-border-left-width}
) !default;

$timeline-icon-active-bg: var(
	--timeline-icon-active-background-color,
	$component-active-bg
) !default;
$timeline-icon-active-border-color: var(
	--timeline-icon-active-border-color,
	$timeline-icon-active-bg
) !default;

$timeline-icon-bg: var(--timeline-icon-background-color, $body-bg) !default;
$timeline-icon-border-color: var(
	--timeline-icon-border-color,
	$gray-600
) !default;
$timeline-icon-border-radius: var(--timeline-icon-border-radius, 50%) !default;
$timeline-icon-border-width: var(--timeline-icon-border-width, 2px) !default;
$timeline-icon-size: var(--timeline-icon-size, 10px) !default;

$timeline-increment-bg: var(
	--timeline-increment-background-color,
	$body-bg
) !default;

$timeline-item-label-color: var(
	--timeline-item-label-color,
	$body-color
) !default;

// Sizes

$timeline-inner-spacing: var(--timeline-inner-spacing, 40px) !default;
$timeline-outer-spacing: var(--timeline-outer-spacing, 25px) !default;

$timeline-item-padding-bottom: var(
	--timeline-item-padding-bottom,
	5px
) !default;
$timeline-item-padding-top: var(--timeline-item-padding-top, 5px) !default;

$timeline-inner-spacing-xl: var(--timeline-inner-spacing-xl, 50px) !default;
$timeline-outer-spacing-xl: var(--timeline-outer-spacing-xl, 25px) !default;

$timeline-item-padding-y-xl: var(--timeline-item-padding-y-xl, 15px) !default;