@import '../../../../../@theme/styles/themes';

@include nb-install-component() {
  display: flex;
  align-items: flex-end;
  height: nb-theme(list-item-line-height);
  max-width: 7rem;

  .value-prev,
  .value-now {
    flex: 1;
  }

  .progress-line-container {
    flex: 1;
    margin-bottom: 0.1875rem;
  }

  .progress-line-prev,
  .progress-line-now {
    height: 100%;
    width: 0.7rem;
  }

  .progress-line-prev {
    background-color: nb-theme(border-basic-color-3);
    @include nb-ltr {
      margin-left: auto;
      margin-right: 0.25rem;
    }
    @include nb-rtl {
      margin-left: 0.25rem;
      margin-right: auto;
    }
  }

  .progress-line-now {
    @include nb-ltr {
      margin-left: 0.25rem;
      margin-right: auto;
    }
    @include nb-rtl {
      margin-left: auto;
      margin-right: 0.25rem;
    }

    &.success {
      background-color: nb-theme(color-success-default);
    }
    &.failure {
      background-color: nb-theme(color-danger-default);
    }
  }
}