@import "../vars.less";

.hive-tag {
  position: relative;
  display: inline-block;
  font-size: @font-size-base;
  line-height: @tag-line-height;
  background: #f6f6f6;
  padding: 2px 9px;
  min-width: 70px;
  text-align: center;
  color: @text-color-lighter-1;
  border-radius: @tag-border-radius-default;
  &+& {
    margin-left: 8px;
  }

  &--closable {
    padding-right: 9px + 16px + 4px;
  }
  &__close {
    position: absolute;
    top: 5px;
    right: 5px;
    font-size: 14px;
    color: @text-color-lighter-1;
    cursor: pointer;
  }
  &:hover {
    background: @primary-color;
    color: #fff;
    .hive-tag {
      &__close {
        color: #fff;
      }
    }
  }
}