.toolbar-dropdown.open .pr-badge {
  background: $gray-300;
}

.toolbar-dropdown:not(.open) .pr-badge {
  background: $gray-700;
}

.pr-badge {
  display: flex;
  flex-direction: row;
  height: 18px;

  align-items: center;

  border-radius: var(--border-radius);
  border-width: 0;

  margin-right: var(--spacing);
  margin-left: var(--spacing);
  padding: var(--spacing-half);

  .number {
    font-size: var(--font-size-sm);
    line-height: 12px;
    margin-right: var(--spacing-half);
  }
}

.toolbar-dropdown.open .ci-status-pending {
  color: $orange-800;
}

.toolbar-dropdown.open .ci-status-failure {
  color: $red-500;
}

.toolbar-dropdown.open .ci-status-success {
  color: $green-700;
}

.toolbar-dropdown.open .pr-badge {
  background: $gray-300;
}

.toolbar-dropdown:not(.open) .pr-badge {
  background: $gray-700;
}

.pr-badge {
  --height: 18px;

  display: flex;
  flex-direction: row;
  height: var(--height);

  align-items: center;

  border-radius: var(--border-radius);
  border-width: 0;

  margin-right: var(--spacing);
  margin-left: var(--spacing);
  padding: var(--spacing-half);

  .number {
    font-size: var(--font-size-sm);
    line-height: var(--height);
    margin-right: var(--spacing-half);
  }
}

.toolbar-dropdown.open .ci-status-pending {
  color: $orange-800;
}

.toolbar-dropdown.open .ci-status-failure {
  color: $red-500;
}

.toolbar-dropdown.open .ci-status-success {
  color: $green-700;
}

Use the height of the container as the line height
Use the height of the container as the line height
