.ty-tag {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  display: none;
  margin-right: 8px;
  padding: 0 7px;
  font-size: 12px;
  border: 1px solid #d9d9d9;
  border-radius: 3px;
  color: rgba(0, 0, 0, 0.65);
  background: #fafafa; }
  .ty-tag a,
  .ty-tag a:hover {
    color: rgba(0, 0, 0, 0.65); }
  .ty-tag_visible {
    display: inline-block; }
  .ty-tag__close-btn {
    cursor: pointer;
    font-size: 10px;
    margin-left: 5px;
    line-height: 1;
    -webkit-transition: all 300ms;
    transition: all 300ms; }
    .ty-tag__close-btn:hover {
      opacity: 0.8; }
  .ty-tag_magenta {
    color: #eb2f96;
    background: #fff0f6;
    border-color: #ffadd2; }
  .ty-tag_red {
    color: #f5222d;
    background: #fff1f0;
    border-color: #ffa39e; }
  .ty-tag_volcano {
    color: #fa541c;
    background: #fff2e8;
    border-color: #ffbb96; }
  .ty-tag_orange {
    color: #fa8c16;
    background: #fff7e6;
    border-color: #ffd591; }
  .ty-tag_gold {
    color: #faad14;
    background: #fffbe6;
    border-color: #ffe58f; }
  .ty-tag_lime {
    color: #a0d911;
    background: #fcffe6;
    border-color: #eaff8f; }
  .ty-tag_green {
    color: #52c41a;
    background: #f6ffed;
    border-color: #b7eb8f; }
  .ty-tag_cyan {
    color: #13c2c2;
    background: #e6fffb;
    border-color: #87e8de; }
  .ty-tag_blue {
    color: #1890ff;
    background: #e6f7ff;
    border-color: #91d5ff; }
  .ty-tag_geekblue {
    color: #2f54eb;
    background: #f0f5ff;
    border-color: #adc6ff; }
  .ty-tag_purple {
    color: #722ed1;
    background: #f9f0ff;
    border-color: #d3adf7; }

.ty-checkable-tag {
  background-color: #fff;
  color: #4DBDB9;
  border-color: #fff;
  -webkit-transition: all 300ms;
  transition: all 300ms;
  cursor: pointer; }
  .ty-checkable-tag_checked {
    background-color: #4DBDB9;
    color: #fff;
    border-color: #4DBDB9; }