.bs-tkn-pipeline-visualization-step-list {
  min-width: 10em;
}

.bs-tkn-pipeline-visualization-step-list__task-name {
  font-weight: var(--pf-t--global--font--weight--heading);
  line-height: var(--pf-t--global--spacer--lg);
  max-height: var(--pf-t--global--spacer--2xl);
  max-width: 15em;
  margin: 0 auto 10px auto;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.bs-tkn-pipeline-visualization-step-list__task-type {
  line-height: var(--pf-t--global--spacer--xs);
  max-height: var(--pf-t--global--spacer--2xl);
  margin: 0 auto 10px auto;
}

.bs-tkn-pipeline-visualization-step-list__step {
  display: flex;
  margin-bottom: var(--pf-t--global--spacer--xs);
}

.bs-tkn-pipeline-visualization-step-list__step--task-run {
  margin-bottom: var(--pf-t--global--spacer--sm);
}

.bs-tkn-pipeline-visualization-step-list__step:last-child {
  margin-bottom: 0;
}

.bs-tkn-pipeline-visualization-step-list__bullet {
  font-size: 1rem;
}

.bs-tkn-pipeline-visualization-step-list__icon {
  flex: 0 0 18px;
}

.bs-tkn-pipeline-visualization-step-list__icon-backdrop {
  fill: var(--pf-t--color--white);
}

.bs-tkn-pipeline-visualization-step-list__name {
  flex: 1 1 auto;
  overflow: hidden;
  padding-left: var(--pf-t--global--spacer--sm);
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bs-tkn-pipeline-visualization-step-list__name.is-main-focus {
  padding: 0 var(--pf-t--global--spacer--sm);
  text-align: center;
}

.bs-tkn-pipeline-visualization-step-list__duration {
  flex: 0 0 auto;
  padding-left: var(--pf-t--global--spacer--sm);
  text-align: right;
}
