.uni-progress {

    &__container {
        margin: 0 0 10px 0;
        min-height: 3px;
        background-color: $color-grey-medium;

        &--only-bar {
            margin: 0;
        }
    }

    &__counter, &__percentage {
        color: $color-grey-dark;
        font-size: $font-smallest;
    }

    &__bar {
        background-color: $color-grey;
		padding: $basic-padding / 15 $basic-padding / 15 $basic-padding / 15 $basic-padding / 6;

        &--primary {
			background-color: $color-primary;

            .uni-progress__percentage {
                color: white;
            }
		}

        &--error {
			background-color: $color-error;

            .uni-progress__percentage {
                color: white;
            }
		}

        &--warning {
            background-color: $color-warning;
		}

        &--success {
			background-color: $color-success;

            .uni-progress__percentage {
                color: white;
            }
        }
    }
}