//
// Progress bars
// --------------------------------------------------

// Bar animations
// -------------------------

// WebKit
@-webkit-keyframes progress-bar-stripes {
	from {
		background-position: 40px 0;
	}
	to {
		background-position: 0 0;
	}
}

// Spec and IE10+
@keyframes progress-bar-stripes {
	from {
		background-position: 40px 0;
	}
	to {
		background-position: 0 0;
	}
}

// Bar itself
// -------------------------

// Outer container
.progress {
	overflow: hidden;
	height: @line-height-computed;
	margin-bottom: @line-height-computed;
	background-color: @progress-bg;
	border-radius: @progress-border-radius;
	.box-shadow(inset 0 1px 2px rgba(0, 0, 0, .1));
}

// Bar of progress
.progress-bar {
	float: left;
	width: 0%;
	height: 100%;
	font-size: @font-size-small;
	line-height: @line-height-computed;
	color: @progress-bar-color;
	text-align: center;
	background-color: @progress-bar-bg;
	.box-shadow(inset 0 -1px 0 rgba(0, 0, 0, .15));
	.transition(width .6s ease);
}

// Striped bars
//
// `.progress-striped .progress-bar` is deprecated as of v3.2.0 in favor of the
// `.progress-bar-striped` class, which you just add to an existing
// `.progress-bar`.
.progress-striped .progress-bar,
.progress-bar-striped {
	#gradient > .striped();
	background-size: 40px 40px;
}

// Call animation for the active one
//
// `.progress.active .progress-bar` is deprecated as of v3.2.0 in favor of the
// `.progress-bar.active` approach.
.progress.active .progress-bar,
.progress-bar.active {
	.animation(progress-bar-stripes 2s linear infinite);
}

// Variations
// -------------------------

.progress-bar-success {
	.progress-bar-variant(@progress-bar-success-bg);
}

.progress-bar-info {
	.progress-bar-variant(@progress-bar-info-bg);
}

.progress-bar-warning {
	.progress-bar-variant(@progress-bar-warning-bg);
}

.progress-bar-danger {
	.progress-bar-variant(@progress-bar-danger-bg);
}
