bb-booking-status-history {

  .booking-status-history {
    @include column-flex-container;

    &__title-container {
      display: flex;
      justify-content: space-between;
      padding: {
        bottom: spacing(5);
      }
      border: {
        bottom: border(1, #d2d6de);
      }
    }

    &__title {
      color: $studio-raven-pale-gray;
      font: {
        size: 16px;
      }
    }

    &__statuses {
      padding: {
        top: spacing(15);
      }
    }

    &__status-list {
      margin: {
        bottom: 0;
      }

      > li {
       &:not(:last-child) {
         padding: {
           bottom: spacing(5);
         }
       }
      }
    }
  }
}

.booking-status-item {
  margin-bottom: spacing(5);

  p {
    margin: 0;
  }

  &__status-title {
    display: flex;
    align-items: center;
  }

  &__icon {
    width: 8px;
    height: 8px;
    border-radius: 8px;
  }

  &__status-and-time {
    padding-left: 10px;
  }

  &__date {
    padding-left: 18px;
    color: $studio-raven-pale-gray;
    font: {
      size: 12px;
    }
  }
}