// Alerts.
@red: #c1041c;
@green: #00b361;
@yellow: #ea9712;

.progressBar {
  width: 100%;

  &__top {
    display: flex;

    &__left {
      flex-grow: 1;

      &__due {
        font-size: 13px;
        color: #9399ad;

        &--red {
          color: @red;
          font-weight: bold;
        }
      }
    }

    &__percent {
      color: #9399ad;
      font-size: 13px;
      margin-bottom: 2px;
    }
  }

  &__bar {
    border-radius: 4px;
    background: #eaecf2;
    height: 10px;
    width: 100%;

    &__inner {
      box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);

      &--red {
        background: @red;
      }

      &--green {
        background: @green;
      }
    }
  }
}