.l-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  height: 22px;
  padding: 0 8px;
  font-size: 12px;
  line-height: 1;
  border: 1px solid var(--l-tag-border-color, #999);
  border-radius: 4px;
  background: var(--l-tag-bg, #fff);
  white-space: nowrap;
  color: var(--l-tag-color, #333);
}
.l-tag--primary {
  --l-tag-border-color: var(--l-primary-color-light3, #b7eb8f);
  --l-tag-bg: var(--l-primary-color-light5, #f6ffed);
  --l-tag-color: var(--l-primary-color-light3, #b7eb8f);
}
.l-tag--error {
  --l-tag-color: var(--l-error-color, #ed3f13);
  --l-tag-bg: var(--l-error-color-light5, #fff1f0);
  --l-tag-border-color: var(--l-error-color, #ed3f13);
}
.l-tag--success {
  --l-tag-color: var(--l-success-color, #a0d911);
  --l-tag-bg: var(--l-success-color-light5, #fcffe6);
  --l-tag-border-color: var(--l-success-color, #a0d911);
}
.l-tag--info {
  --l-tag-color: var(--l-info-color, #999999);
  --l-tag-bg: var(--l-info-color-light9, #f5f5f5);
  --l-tag-border-color: var(--l-border-color, #dedede);
}
.l-tag--close {
  margin-left: 5px;
  font-size: 12px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
}
.l-tag--close:hover {
  background-color: var(--l-tag-color, #1890ff);
  color: #ffffff;
}