@import (reference) '../../styles/index.less';

.tag {
  box-sizing: border-box;
  margin: 0;
  color: #000000d9;
  font-size: 14px;
  font-variant: tabular-nums;
  line-height: 1.5715;
  list-style: none;
  font-feature-settings: "tnum";
  display: inline-block;
  height: auto;
  padding: 0 7px;
  font-size: 12px;
  line-height: 20px;
  white-space: nowrap;
  background: var(--rs-tag-bg);
  border: 1px solid #d9d9d9;
  border-radius: @border-radius-base;
  opacity: 1;
  transition: all .3s
}

.magenta {
  color: var(--rs-tag-magenta);
  background: var(--rs-tag-magenta-background);
  border-color: var(--rs-tag-magenta-border);
}

.red {
  color: var(--rs-tag-red);
  background: var(--rs-tag-red-background);
  border-color: var(--rs-tag-red-border);
}

.volcano {
  color: var(--rs-tag-volcano);
  background: var(--rs-tag-volcano-background);
  border-color: var(--rs-tag-volcano-border);
}

.orange {
  color: var(--rs-tag-orange);
  background: var(--rs-tag-orange-background);
  border-color: var(--rs-tag-orange-border);
}

.gold {
  color: var(--rs-tag-gold);
  background: var(--rs-tag-gold-background);
  border-color: var(--rs-tag-gold-border);
}

.cyan {
  color: var(--rs-tag-cyan);
  background: var(--rs-tag-cyan-background);
  border-color: var(--rs-tag-cyan-border);
}

.lime {
  color: var(--rs-tag-lime);
  background: var(--rs-tag-lime-background);
  border-color: var(--rs-tag-lime-border);
}

.green {
  color: var(--rs-tag-green);
  background: var(--rs-tag-green-background);
  border-color: var(--rs-tag-green-border);
}

.blue {
  color: var(--rs-tag-blue);
  background: var(--rs-tag-blue-background);
  border-color: var(--rs-tag-blue-border);
}

.geekblue {
  color: var(--rs-tag-geekblue);
  background: var(--rs-tag-geekblue-background);
  border-color: var(--rs-tag-geekblue-border);
}

.purple {
  color: var(--rs-tag-purple);
  background: var(--rs-tag-purple-background);
  border-color: var(--rs-tag-purple-border);
}