/* progress bar */

:root {
	--progress-color-active: #1886ed;
	--progress-color: white;
}

.tc-control.tc-control-progress {
    display: flex;
    align-items: center;
}

.tc-control.tc-control-progress .tc-progress-options {
	flex: 1;
	display: flex;
}

.tc-control.tc-control-progress .tc-control-option {
	flex: 1;
	margin: 0 5px;
}

.tc-root-rtl .tc-control.tc-control-progress .tc-control-option:first-child,
.tc-root-ltr .tc-control.tc-control-progress .tc-control-option:last-child {
	margin-right: 0;
}

.tc-root-rtl .tc-control.tc-control-progress .tc-control-option:last-child,
.tc-root-ltr .tc-control.tc-control-progress .tc-control-option:first-child {
	margin-left: 0;
}


.tc-control.tc-control-progress .tc-control-option .tc-input-progress {
	background-color: var(--progress-color-active);
}

/* progress bar - different color for items after selected */
.tc-control.tc-control-progress .tc-control-option.tc-control-option-selected ~ .tc-control-option .tc-input-progress {
	background-color: var(--progress-color);
}


/* progress bar - left-most item radius  */
.tc-root-rtl .tc-control.tc-control-progress .tc-control-option:last-child .tc-input-progress,
.tc-root-ltr .tc-control.tc-control-progress .tc-control-option:first-child .tc-input-progress {
	border-radius: 10px 0 0 10px;
}

/* progress bar - right-most item radius  */
.tc-root-rtl .tc-control.tc-control-progress .tc-control-option:first-child .tc-input-progress,
.tc-root-ltr .tc-control.tc-control-progress .tc-control-option:last-child .tc-input-progress {
	border-radius: 0 10px 10px 0;
}

/* progress bar - single item radius  */
.tc-control.tc-control-progress .tc-control-option:first-child:last-child .tc-input-progress {
	border-radius: 10px;
}


.tc-table-cell .tc-control.tc-control-progress .tc-control-option {
	margin: 0 2px;
}

.tc-table-cell .tc-input.tc-input-progress {
	height: 18px;
	font-size: 14px;
	line-height: 10px;
}


/* progress bar - left-most item radius  */
.tc-root-rtl .tc-table-cell .tc-control.tc-control-progress .tc-control-option:last-child .tc-input-progress,
.tc-root-ltr .tc-table-cell .tc-control.tc-control-progress .tc-control-option:first-child .tc-input-progress {
	border-radius: 7px 0 0 7px;
}

/* progress bar - right-most item radius  */
.tc-root-rtl .tc-table-cell .tc-control.tc-control-progress .tc-control-option:first-child .tc-input-progress,
.tc-root-ltr .tc-table-cell .tc-control.tc-control-progress .tc-control-option:last-child .tc-input-progress {
	border-radius: 0 7px 7px 0;
}

/* progress bar - single item radius  */
.tc-table-cell .tc-control.tc-control-progress .tc-control-option:first-child:last-child .tc-input-progress {
	border-radius: 7px;
}