.step-progress-bar-container {
    display: flex;
    align-items: flex-start;
    width: 100%;
}

.step-progress-bar {
    flex: 1;
    height: $step-progress-bar-height;
    margin: 0;
    padding: 0;

    &:not(:last-child) {
        border-right: $step-progress-bar-border-width solid var(--white);
    }
}

.step-progress-bar-done {
    background-color: $step-progress-bar-done-color;
}

.step-progress-bar-doing {
    background-color: $step-progress-bar-doing-color;
}

.step-progress-bar-to-do {
    background-color: $step-progress-bar-to-do-color;
}