.progress-container .progress {
    min-width: 55px;
    height: unset;
    flex: 1;
    position: relative;
    font-size: unset;
    background-color: $evap-light-blue;
}

.progress-container .progress-empty {
    height: 1.5rem;
}

.progress-container .progress-disabled {
    background-color: $light-gray;
    .progress-bartext {
        text-shadow: none;
        color: tint-color($medium-gray, 10%);
    }
}

.progress-container-warning {
    .progress {
        background-color: $evap-yellow;
    }

    .progress-bar {
        background-color: $evap-dark-yellow;
    }

    .progress-bartext {
        color: $black;
        @include bar-shadow($evap-dark-yellow);
    }
}

.progress-bartext {
    position: absolute;
    top: 0;
    left: 0;
    color: $white;
    width: 100%;
    text-align: center;
    @include bar-shadow($evap-dark-blue);
}

.progress-badge-wrapper {
    text-align: right;
    min-width: 45px;
}

.multi-progress-bar .progress-container {
    padding-bottom: 3px;
}

.global-rewards-progress-bar {
    position: relative;
    display: grid;
    padding-top: .5rem;
    padding-inline: 1.5rem;

    .progress-container {
        display: flex;
        height: 25px;
        grid-column-start: 1;
        grid-row-start: 1;
    }
}

.progress-step {
    transform: translateX(-50%);
    width: fit-content;
    grid-column-start: 1;
    grid-row-start: 2;

    .seperator {
        width: 1px;
        height: 8px;
        border: $dark-gray 1px solid;
    }
}

