acud/es/tag/style/index.css

acg react 组件库

/* color */
/* 默认颜色 */
/* 通用-icon */
/* 标签 */
/* 默认颜色 */
/* 其他颜色 */
/* 通用 */
/* 水平 */
/* 垂直 */
/* 序号水平 */
/* 序号垂直 */
.acud-tag {
  margin: 0;
  padding: 0;
  display: inline-block;
  height: auto;
  margin-right: 8px;
  padding: 0 8px;
  font-size: 12px;
  white-space: nowrap;
  background: #F7F7F9;
  border-radius: 2px;
  transition: all 0.3s;
  color: #151B26;
}
.acud-tag:hover {
  color: #151B26;
}
.acud-tag:focus,
.acud-tag:active {
  color: #151B26;
}
.acud-tag[disabled],
.acud-tag[aria-disabled="true"],
.acud-tag[disabled]:hover,
.acud-tag[aria-disabled="true"]:hover,
.acud-tag[disabled]:focus,
.acud-tag[aria-disabled="true"]:focus,
.acud-tag[disabled]:active,
.acud-tag[aria-disabled="true"]:active {
  color: #B8BABF;
}
.acud-tag > a:first-child:last-child {
  display: inline-block;
  margin: 0 -8px;
  padding: 0 8px;
}
.acud-tag-close-icon {
  font-size: 16px;
  cursor: pointer;
  transition: all 0.3s;
  margin-left: 4px;
}
.acud-tag-close-icon > svg {
  vertical-align: middle;
}
.acud-tag .acudicon {
  color: #84868C;
  line-height: 100%;
}
.acud-tag .acudicon:hover {
  color: #5C5F66;
}
.acud-tag .acudicon:focus,
.acud-tag .acudicon:active {
  color: #303540;
}
.acud-tag .acudicon[disabled],
.acud-tag .acudicon[aria-disabled="true"],
.acud-tag .acudicon[disabled]:hover,
.acud-tag .acudicon[aria-disabled="true"]:hover,
.acud-tag .acudicon[disabled]:focus,
.acud-tag .acudicon[aria-disabled="true"]:focus,
.acud-tag .acudicon[disabled]:active,
.acud-tag .acudicon[aria-disabled="true"]:active {
  color: #B8BABF;
}
.acud-tag-has-color {
  border-color: transparent;
}
.acud-tag-has-color,
.acud-tag-has-color a,
.acud-tag-has-color a:hover,
.acud-tag-has-color .acudicon-close,
.acud-tag-has-color .acudicon-close:hover {
  color: #151B26;
}
.acud-tag-checkable {
  color: #151B26;
  background-color: #F7F7F9;
  border-color: transparent;
  cursor: pointer;
}
.acud-tag-checkable:hover {
  color: #151B26;
}
.acud-tag-checkable:focus,
.acud-tag-checkable:active {
  color: #151B26;
}
.acud-tag-checkable[disabled],
.acud-tag-checkable[aria-disabled="true"],
.acud-tag-checkable[disabled]:hover,
.acud-tag-checkable[aria-disabled="true"]:hover,
.acud-tag-checkable[disabled]:focus,
.acud-tag-checkable[aria-disabled="true"]:focus,
.acud-tag-checkable[disabled]:active,
.acud-tag-checkable[aria-disabled="true"]:active {
  color: #B8BABF;
}
.acud-tag-checkable:hover {
  background-color: #F2F2F4;
}
.acud-tag-checkable:focus,
.acud-tag-checkable:active {
  background-color: #F2F2F4;
}
.acud-tag-checkable[disabled],
.acud-tag-checkable[aria-disabled="true"],
.acud-tag-checkable[disabled]:hover,
.acud-tag-checkable[aria-disabled="true"]:hover,
.acud-tag-checkable[disabled]:focus,
.acud-tag-checkable[aria-disabled="true"]:focus,
.acud-tag-checkable[disabled]:active,
.acud-tag-checkable[aria-disabled="true"]:active {
  background-color: #F7F7F9;
}
.acud-tag-checkable:hover {
  border-color: transparent;
}
.acud-tag-checkable:focus,
.acud-tag-checkable:active {
  border-color: transparent;
}
.acud-tag-checkable[disabled],
.acud-tag-checkable[aria-disabled="true"],
.acud-tag-checkable[disabled]:hover,
.acud-tag-checkable[aria-disabled="true"]:hover,
.acud-tag-checkable[disabled]:focus,
.acud-tag-checkable[aria-disabled="true"]:focus,
.acud-tag-checkable[disabled]:active,
.acud-tag-checkable[aria-disabled="true"]:active {
  border-color: transparent;
}
.acud-tag-checkable-checked {
  color: #FFFFFF;
  background-color: #2468F2;
  border-color: transparent;
  cursor: pointer;
}
.acud-tag-checkable-checked:hover {
  color: #FFFFFF;
}
.acud-tag-checkable-checked:focus,
.acud-tag-checkable-checked:active {
  color: #FFFFFF;
}
.acud-tag-checkable-checked[disabled],
.acud-tag-checkable-checked[aria-disabled="true"],
.acud-tag-checkable-checked[disabled]:hover,
.acud-tag-checkable-checked[aria-disabled="true"]:hover,
.acud-tag-checkable-checked[disabled]:focus,
.acud-tag-checkable-checked[aria-disabled="true"]:focus,
.acud-tag-checkable-checked[disabled]:active,
.acud-tag-checkable-checked[aria-disabled="true"]:active {
  color: #FFFFFF;
}
.acud-tag-checkable-checked:hover {
  background-color: #528EFF;
}
.acud-tag-checkable-checked:focus,
.acud-tag-checkable-checked:active {
  background-color: #144BCC;
}
.acud-tag-checkable-checked[disabled],
.acud-tag-checkable-checked[aria-disabled="true"],
.acud-tag-checkable-checked[disabled]:hover,
.acud-tag-checkable-checked[aria-disabled="true"]:hover,
.acud-tag-checkable-checked[disabled]:focus,
.acud-tag-checkable-checked[aria-disabled="true"]:focus,
.acud-tag-checkable-checked[disabled]:active,
.acud-tag-checkable-checked[aria-disabled="true"]:active {
  background-color: #E8E9EB;
}
.acud-tag-checkable-checked:hover {
  border-color: transparent;
}
.acud-tag-checkable-checked:focus,
.acud-tag-checkable-checked:active {
  border-color: transparent;
}
.acud-tag-checkable-checked[disabled],
.acud-tag-checkable-checked[aria-disabled="true"],
.acud-tag-checkable-checked[disabled]:hover,
.acud-tag-checkable-checked[aria-disabled="true"]:hover,
.acud-tag-checkable-checked[disabled]:focus,
.acud-tag-checkable-checked[aria-disabled="true"]:focus,
.acud-tag-checkable-checked[disabled]:active,
.acud-tag-checkable-checked[aria-disabled="true"]:active {
  border-color: transparent;
}
.acud-tag-transparent-checkable {
  color: #151B26;
  background-color: transparent;
  border-color: transparent;
  cursor: pointer;
}
.acud-tag-transparent-checkable:hover {
  color: #151B26;
}
.acud-tag-transparent-checkable:focus,
.acud-tag-transparent-checkable:active {
  color: #151B26;
}
.acud-tag-transparent-checkable[disabled],
.acud-tag-transparent-checkable[aria-disabled="true"],
.acud-tag-transparent-checkable[disabled]:hover,
.acud-tag-transparent-checkable[aria-disabled="true"]:hover,
.acud-tag-transparent-checkable[disabled]:focus,
.acud-tag-transparent-checkable[aria-disabled="true"]:focus,
.acud-tag-transparent-checkable[disabled]:active,
.acud-tag-transparent-checkable[aria-disabled="true"]:active {
  color: #B8BABF;
}
.acud-tag-transparent-checkable:hover {
  background-color: #F2F2F4;
}
.acud-tag-transparent-checkable:focus,
.acud-tag-transparent-checkable:active {
  background-color: #F2F2F4;
}
.acud-tag-transparent-checkable[disabled],
.acud-tag-transparent-checkable[aria-disabled="true"],
.acud-tag-transparent-checkable[disabled]:hover,
.acud-tag-transparent-checkable[aria-disabled="true"]:hover,
.acud-tag-transparent-checkable[disabled]:focus,
.acud-tag-transparent-checkable[aria-disabled="true"]:focus,
.acud-tag-transparent-checkable[disabled]:active,
.acud-tag-transparent-checkable[aria-disabled="true"]:active {
  background-color: #F7F7F9;
}
.acud-tag-transparent-checkable:hover {
  border-color: transparent;
}
.acud-tag-transparent-checkable:focus,
.acud-tag-transparent-checkable:active {
  border-color: transparent;
}
.acud-tag-transparent-checkable[disabled],
.acud-tag-transparent-checkable[aria-disabled="true"],
.acud-tag-transparent-checkable[disabled]:hover,
.acud-tag-transparent-checkable[aria-disabled="true"]:hover,
.acud-tag-transparent-checkable[disabled]:focus,
.acud-tag-transparent-checkable[aria-disabled="true"]:focus,
.acud-tag-transparent-checkable[disabled]:active,
.acud-tag-transparent-checkable[aria-disabled="true"]:active {
  border-color: transparent;
}
.acud-tag-transparent-checkable-checked {
  color: #FFFFFF;
  background-color: #2468F2;
  border-color: transparent;
  cursor: pointer;
}
.acud-tag-transparent-checkable-checked:hover {
  color: #FFFFFF;
}
.acud-tag-transparent-checkable-checked:focus,
.acud-tag-transparent-checkable-checked:active {
  color: #FFFFFF;
}
.acud-tag-transparent-checkable-checked[disabled],
.acud-tag-transparent-checkable-checked[aria-disabled="true"],
.acud-tag-transparent-checkable-checked[disabled]:hover,
.acud-tag-transparent-checkable-checked[aria-disabled="true"]:hover,
.acud-tag-transparent-checkable-checked[disabled]:focus,
.acud-tag-transparent-checkable-checked[aria-disabled="true"]:focus,
.acud-tag-transparent-checkable-checked[disabled]:active,
.acud-tag-transparent-checkable-checked[aria-disabled="true"]:active {
  color: #FFFFFF;
}
.acud-tag-transparent-checkable-checked:hover {
  background-color: #528EFF;
}
.acud-tag-transparent-checkable-checked:focus,
.acud-tag-transparent-checkable-checked:active {
  background-color: #144BCC;
}
.acud-tag-transparent-checkable-checked[disabled],
.acud-tag-transparent-checkable-checked[aria-disabled="true"],
.acud-tag-transparent-checkable-checked[disabled]:hover,
.acud-tag-transparent-checkable-checked[aria-disabled="true"]:hover,
.acud-tag-transparent-checkable-checked[disabled]:focus,
.acud-tag-transparent-checkable-checked[aria-disabled="true"]:focus,
.acud-tag-transparent-checkable-checked[disabled]:active,
.acud-tag-transparent-checkable-checked[aria-disabled="true"]:active {
  background-color: #E8E9EB;
}
.acud-tag-transparent-checkable-checked:hover {
  border-color: transparent;
}
.acud-tag-transparent-checkable-checked:focus,
.acud-tag-transparent-checkable-checked:active {
  border-color: transparent;
}
.acud-tag-transparent-checkable-checked[disabled],
.acud-tag-transparent-checkable-checked[aria-disabled="true"],
.acud-tag-transparent-checkable-checked[disabled]:hover,
.acud-tag-transparent-checkable-checked[aria-disabled="true"]:hover,
.acud-tag-transparent-checkable-checked[disabled]:focus,
.acud-tag-transparent-checkable-checked[aria-disabled="true"]:focus,
.acud-tag-transparent-checkable-checked[disabled]:active,
.acud-tag-transparent-checkable-checked[aria-disabled="true"]:active {
  border-color: transparent;
}
.acud-tag-hidden {
  display: none;
}
.acud-tag > .acudicon + span,
.acud-tag > span + .acudicon {
  margin-left: 8px;
}
.acud-tag-active-enhance {
  color: #FFFFFF;
  background-color: #2468F2;
}
.acud-tag-active-enhance .acudicon {
  color: #FFFFFF;
}
.acud-tag-active-enhance .acudicon:hover {
  color: #FFFFFF;
}
.acud-tag-active-enhance:hover {
  color: #FFFFFF;
}
.acud-tag-active-enhance[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-processing-enhance {
  color: #FFFFFF;
  background-color: #FAD000;
}
.acud-tag-processing-enhance .acudicon {
  color: #FFFFFF;
}
.acud-tag-processing-enhance .acudicon:hover {
  color: #FFFFFF;
}
.acud-tag-processing-enhance:hover {
  color: #FFFFFF;
}
.acud-tag-processing-enhance[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-success-enhance {
  color: #FFFFFF;
  background-color: #30BF13;
}
.acud-tag-success-enhance .acudicon {
  color: #FFFFFF;
}
.acud-tag-success-enhance .acudicon:hover {
  color: #FFFFFF;
}
.acud-tag-success-enhance:hover {
  color: #FFFFFF;
}
.acud-tag-success-enhance[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-error-enhance {
  color: #FFFFFF;
  background-color: #F33E3E;
}
.acud-tag-error-enhance .acudicon {
  color: #FFFFFF;
}
.acud-tag-error-enhance .acudicon:hover {
  color: #FFFFFF;
}
.acud-tag-error-enhance:hover {
  color: #FFFFFF;
}
.acud-tag-error-enhance[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-warning-enhance {
  color: #FFFFFF;
  background-color: #FF9326;
}
.acud-tag-warning-enhance .acudicon {
  color: #FFFFFF;
}
.acud-tag-warning-enhance .acudicon:hover {
  color: #FFFFFF;
}
.acud-tag-warning-enhance:hover {
  color: #FFFFFF;
}
.acud-tag-warning-enhance[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-inactive-enhance {
  color: #FFFFFF;
  background-color: #B8BABF;
}
.acud-tag-inactive-enhance .acudicon {
  color: #FFFFFF;
}
.acud-tag-inactive-enhance .acudicon:hover {
  color: #FFFFFF;
}
.acud-tag-inactive-enhance:hover {
  color: #FFFFFF;
}
.acud-tag-inactive-enhance[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-active {
  color: #2468F2;
  font-size: 12px;
  border-radius: 2px;
  background-color: #E6F0FF;
}
.acud-tag-active .acudicon {
  color: #2468F2;
}
.acud-tag-active .acudicon:hover {
  color: #2468F2;
}
.acud-tag-active:hover {
  color: #2468F2;
}
.acud-tag-active[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-processing {
  color: #FAD000;
  font-size: 12px;
  border-radius: 2px;
  background-color: #FFFDE6;
}
.acud-tag-processing .acudicon {
  color: #FAD000;
}
.acud-tag-processing .acudicon:hover {
  color: #FAD000;
}
.acud-tag-processing:hover {
  color: #FAD000;
}
.acud-tag-processing[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-success {
  color: #30BF13;
  font-size: 12px;
  border-radius: 2px;
  background-color: #ECFFE6;
}
.acud-tag-success .acudicon {
  color: #30BF13;
}
.acud-tag-success .acudicon:hover {
  color: #30BF13;
}
.acud-tag-success:hover {
  color: #30BF13;
}
.acud-tag-success[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-error {
  color: #F33E3E;
  font-size: 12px;
  border-radius: 2px;
  background-color: #FFE8E6;
}
.acud-tag-error .acudicon {
  color: #F33E3E;
}
.acud-tag-error .acudicon:hover {
  color: #F33E3E;
}
.acud-tag-error:hover {
  color: #F33E3E;
}
.acud-tag-error[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-warning {
  color: #FF9326;
  font-size: 12px;
  border-radius: 2px;
  background-color: #FFF4E6;
}
.acud-tag-warning .acudicon {
  color: #FF9326;
}
.acud-tag-warning .acudicon:hover {
  color: #FF9326;
}
.acud-tag-warning:hover {
  color: #FF9326;
}
.acud-tag-warning[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-inactive {
  color: #151B26;
  font-size: 12px;
  border-radius: 2px;
  background-color: #F7F7F9;
}
.acud-tag-inactive .acudicon {
  color: #151B26;
}
.acud-tag-inactive .acudicon:hover {
  color: #151B26;
}
.acud-tag-inactive:hover {
  color: #151B26;
}
.acud-tag-inactive[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-active-outline {
  color: #2468F2;
  font-size: 12px;
  border-radius: 2px;
  background-color: #E6F0FF;
  border: 1px solid #A8CAFF;
}
.acud-tag-active-outline .acudicon {
  color: #2468F2;
}
.acud-tag-active-outline .acudicon:hover {
  color: #2468F2;
}
.acud-tag-active-outline:hover {
  color: #2468F2;
}
.acud-tag-active-outline[disabled] {
  border-width: 0;
}
.acud-tag-active-outline[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-processing-outline {
  color: #FAD000;
  font-size: 12px;
  border-radius: 2px;
  background-color: #FFFDE6;
  border: 1px solid #FFF291;
}
.acud-tag-processing-outline .acudicon {
  color: #FAD000;
}
.acud-tag-processing-outline .acudicon:hover {
  color: #FAD000;
}
.acud-tag-processing-outline:hover {
  color: #FAD000;
}
.acud-tag-processing-outline[disabled] {
  border-width: 0;
}
.acud-tag-processing-outline[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-success-outline {
  color: #30BF13;
  font-size: 12px;
  border-radius: 2px;
  background-color: #ECFFE6;
  border: 1px solid #A5E693;
}
.acud-tag-success-outline .acudicon {
  color: #30BF13;
}
.acud-tag-success-outline .acudicon:hover {
  color: #30BF13;
}
.acud-tag-success-outline:hover {
  color: #30BF13;
}
.acud-tag-success-outline[disabled] {
  border-width: 0;
}
.acud-tag-success-outline[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-error-outline {
  color: #F33E3E;
  font-size: 12px;
  border-radius: 2px;
  background-color: #FFE8E6;
  border: 1px solid #FFB6B3;
}
.acud-tag-error-outline .acudicon {
  color: #F33E3E;
}
.acud-tag-error-outline .acudicon:hover {
  color: #F33E3E;
}
.acud-tag-error-outline:hover {
  color: #F33E3E;
}
.acud-tag-error-outline[disabled] {
  border-width: 0;
}
.acud-tag-error-outline[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-warning-outline {
  color: #FF9326;
  font-size: 12px;
  border-radius: 2px;
  background-color: #FFF4E6;
  border: 1px solid #FFD8A8;
}
.acud-tag-warning-outline .acudicon {
  color: #FF9326;
}
.acud-tag-warning-outline .acudicon:hover {
  color: #FF9326;
}
.acud-tag-warning-outline:hover {
  color: #FF9326;
}
.acud-tag-warning-outline[disabled] {
  border-width: 0;
}
.acud-tag-warning-outline[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-inactive-outline {
  color: #151B26;
  font-size: 12px;
  border-radius: 2px;
  background-color: #F7F7F9;
  border: 1px solid #D4D6D9;
}
.acud-tag-inactive-outline .acudicon {
  color: #151B26;
}
.acud-tag-inactive-outline .acudicon:hover {
  color: #151B26;
}
.acud-tag-inactive-outline:hover {
  color: #151B26;
}
.acud-tag-inactive-outline[disabled] {
  border-width: 0;
}
.acud-tag-inactive-outline[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-processing-status {
  color: #528EFF;
  background-color: #E6F0FF;
}
.acud-tag-processing-status .acudicon {
  color: #528EFF;
}
.acud-tag-processing-status .acudicon:hover {
  color: #528EFF;
}
.acud-tag-processing-status:hover {
  color: #528EFF;
}
.acud-tag-processing-status[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-success-status {
  color: #30BF13;
  background-color: #ECFFE6;
}
.acud-tag-success-status .acudicon {
  color: #30BF13;
}
.acud-tag-success-status .acudicon:hover {
  color: #30BF13;
}
.acud-tag-success-status:hover {
  color: #30BF13;
}
.acud-tag-success-status[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-error-status {
  color: #F33E3E;
  background-color: #FFE8E6;
}
.acud-tag-error-status .acudicon {
  color: #F33E3E;
}
.acud-tag-error-status .acudicon:hover {
  color: #F33E3E;
}
.acud-tag-error-status:hover {
  color: #F33E3E;
}
.acud-tag-error-status[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-warning-status {
  color: #FF9326;
  background-color: #FFF4E6;
}
.acud-tag-warning-status .acudicon {
  color: #FF9326;
}
.acud-tag-warning-status .acudicon:hover {
  color: #FF9326;
}
.acud-tag-warning-status:hover {
  color: #FF9326;
}
.acud-tag-warning-status[disabled] .acudicon {
  color: #B8BABF;
}
.acud-tag-status {
  line-height: 20px;
  color: #FFFFFF;
}
.acud-tag-type-marketing {
  position: relative;
  width: 50px;
  height: 16px !important;
  background: transparent;
  border-top: 0px solid transparent;
  border-bottom: 15px solid green;
  border-left: 16px solid transparent;
  border-right: 16px solid transparent;
  transform: rotate(-46deg);
  padding: 0;
  overflow: visible;
}
.acud-tag-type-business {
  color: #fff;
  position: relative;
  padding-left: 10px;
}
.acud-tag-type-business:hover {
  color: #fff;
}
.acud-tag-type-business .business-icon {
  position: absolute;
  width: 20px;
  height: 20px;
  left: -10px;
}
.acud-tag-type-subscription {
  background: transparent;
}
.acud-tag-type-subscription span {
  color: #84868C;
}
.acud-tag-type-subscription span:hover {
  color: #5C5F66;
}
.acud-tag-type-subscription span:focus,
.acud-tag-type-subscription span:active {
  color: #FF9326;
}
.acud-tag-type-subscription span[disabled],
.acud-tag-type-subscription span[aria-disabled="true"],
.acud-tag-type-subscription span[disabled]:hover,
.acud-tag-type-subscription span[aria-disabled="true"]:hover,
.acud-tag-type-subscription span[disabled]:focus,
.acud-tag-type-subscription span[aria-disabled="true"]:focus,
.acud-tag-type-subscription span[disabled]:active,
.acud-tag-type-subscription span[aria-disabled="true"]:active {
  color: transparent;
}
.acud-tag-type-edit {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  padding-right: 4px;
  line-height: 24px;
}
.acud-tag-type-edit[disabled],
.acud-tag-type-edit[disabled]:hover {
  color: #84868C;
  background-color: #E8E9EB;
  padding-right: 8px;
}
.acud-tag-type-edit[disabled] .acudicon,
.acud-tag-type-edit[disabled]:hover .acudicon {
  display: none;
}
.acud-tag-render-container {
  display: flex;
  align-items: center;
}
.acud-tag-render-container .circle {
  width: 12px;
  height: 12px;
  border-radius: 12px;
  margin-right: 6px;
  position: relative;
}
.acud-tag-render-container .circle::after {
  display: block;
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 8px;
  position: absolute;
  left: 2px;
  top: 2px;
}
.acud-tag .circle.status-inactive::after {
  background: #D4D6D9;
}
.acud-tag .circle.status-active::after {
  background: #2468F2;
}
.acud-tag .circle.status-processing::after {
  background: #528EFF;
}
.acud-tag .circle.status-success::after {
  background: #30BF13;
}
.acud-tag .circle.status-error::after {
  background: #F33E3E;
}
.acud-tag .circle.status-warning::after {
  background: #FF9326;
}
.acud-tag .circle.status-processing::after {
  animation: flash 0.4s ease-in infinite alternate;
}
@keyframes flash {
  from {
    transform: scale(0.7);
    box-shadow: 0 0 0 3px #d4e5ff;
  }
  to {
    transform: scale(1);
    box-shadow: 0 0 0 0px #d4e5ff;
  }
}
.acud-tag-list-order-color-1 {
  color: #001E80;
}
.acud-tag-list-order-bg-color-1 {
  background-color: #E6F0FF;
}
.acud-tag-list-order-bg-color-1-enhance {
  color: #fff;
  background-color: #2468F2;
}
.acud-tag-list-order-bg-color-1-enhance:hover {
  color: #fff;
}
.acud-tag-list-order-border-color-1 {
  border-width: 1px;
  border-style: solid;
  border-color: #A8CAFF;
}
.acud-tag-list-order-color-2 {
  color: #00454D;
}
.acud-tag-list-order-bg-color-2 {
  background-color: #E6FFFD;
}
.acud-tag-list-order-bg-color-2-enhance {
  color: #fff;
  background-color: #57D9D4;
}
.acud-tag-list-order-bg-color-2-enhance:hover {
  color: #fff;
}
.acud-tag-list-order-border-color-2 {
  border-width: 1px;
  border-style: solid;
  border-color: #C2F2EF;
}
.acud-tag-list-order-color-3 {
  color: #41078C;
}
.acud-tag-list-order-bg-color-3 {
  background-color: #ECE6FF;
}
.acud-tag-list-order-bg-color-3-enhance {
  color: #fff;
  background-color: #8F5CFF;
}
.acud-tag-list-order-bg-color-3-enhance:hover {
  color: #fff;
}
.acud-tag-list-order-border-color-3 {
  border-width: 1px;
  border-style: solid;
  border-color: #C5ADFF;
}
.acud-tag-list-order-color-4 {
  color: #8C3800;
}
.acud-tag-list-order-bg-color-4 {
  background-color: #FFF4E6;
}
.acud-tag-list-order-bg-color-4-enhance {
  color: #fff;
  background-color: #FFAB52;
}
.acud-tag-list-order-bg-color-4-enhance:hover {
  color: #fff;
}
.acud-tag-list-order-border-color-4 {
  border-width: 1px;
  border-style: solid;
  border-color: #FFD8A8;
}
.acud-tag-list-order-color-5 {
  color: #730635;
}
.acud-tag-list-order-bg-color-5 {
  background-color: #FFE6EC;
}
.acud-tag-list-order-bg-color-5-enhance {
  color: #fff;
  background-color: #F25788;
}
.acud-tag-list-order-bg-color-5-enhance:hover {
  color: #fff;
}
.acud-tag-list-order-border-color-5 {
  border-width: 1px;
  border-style: solid;
  border-color: #FFADC5;
}
.acud-tag-list-order-color-6 {
  color: #004173;
}
.acud-tag-list-order-bg-color-6 {
  background-color: #E6F9FF;
}
.acud-tag-list-order-bg-color-6-enhance {
  color: #fff;
  background-color: #0099E6;
}
.acud-tag-list-order-bg-color-6-enhance:hover {
  color: #fff;
}
.acud-tag-list-order-border-color-6 {
  border-width: 1px;
  border-style: solid;
  border-color: #99E2FF;
}
.acud-tag-list-order-color-7 {
  color: #800D18;
}
.acud-tag-list-order-bg-color-7 {
  background-color: #FFE8E6;
}
.acud-tag-list-order-bg-color-7-enhance {
  color: #fff;
  background-color: #FF908C;
}
.acud-tag-list-order-bg-color-7-enhance:hover {
  color: #fff;
}
.acud-tag-list-order-border-color-7 {
  border-width: 1px;
  border-style: solid;
  border-color: #FFB6B3;
}
.acud-tag-list-order-color-8 {
  color: #054D00;
}
.acud-tag-list-order-bg-color-8 {
  background-color: #ECFFE6;
}
.acud-tag-list-order-bg-color-8-enhance {
  color: #fff;
  background-color: #7BD964;
}
.acud-tag-list-order-bg-color-8-enhance:hover {
  color: #fff;
}
.acud-tag-list-order-border-color-8 {
  border-width: 1px;
  border-style: solid;
  border-color: #A5E693;
}
.acud-tag-list-order-color-9 {
  color: #21158C;
}
.acud-tag-list-order-bg-color-9 {
  background-color: #E6E8FF;
}
.acud-tag-list-order-bg-color-9-enhance {
  color: #fff;
  background-color: #4D4DFF;
}
.acud-tag-list-order-bg-color-9-enhance:hover {
  color: #fff;
}
.acud-tag-list-order-border-color-9 {
  border-width: 1px;
  border-style: solid;
  border-color: #B8BBFF;
}
.acud-tag-list-order-color-10 {
  color: #876300;
}
.acud-tag-list-order-bg-color-10 {
  background-color: #FFFDE6;
}
.acud-tag-list-order-bg-color-10-enhance {
  color: #fff;
  background-color: #FAD000;
}
.acud-tag-list-order-bg-color-10-enhance:hover {
  color: #fff;
}
.acud-tag-list-order-border-color-10 {
  border-width: 1px;
  border-style: solid;
  border-color: #FFF291;
}
.acud-tag-md {
  height: 20px;
  line-height: 20px;
  border-radius: 2px;
  font-size: 12px;
}
.acud-tag-md-text-hidden span.text-hidden {
  max-width: 132px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.acud-tag-md-has-icon .acudicon {
  height: 14px;
}
.acud-tag-md-has-icon .acudicon svg {
  width: 14px;
}
.acud-tag-md-has-icon img {
  height: 14px;
  width: 14px;
}
.acud-tag-md-has-icon .acudicon + span,
.acud-tag-md-has-icon img + span {
  margin-left: 4px;
}
.acud-tag-md-only-icon {
  padding-right: 2px;
  padding-left: 2px;
}
.acud-tag-md-has-icon > .acudicon {
  height: 16px;
  font-size: 16px;
}
.acud-tag-md-outline {
  height: 20px;
  line-height: 18px;
  border-radius: 2px;
  font-size: 12px;
}
.acud-tag-md-outline-text-hidden span.text-hidden {
  max-width: 132px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.acud-tag-md-outline-has-icon .acudicon {
  height: 14px;
}
.acud-tag-md-outline-has-icon .acudicon svg {
  width: 14px;
}
.acud-tag-md-outline-has-icon img {
  height: 14px;
  width: 14px;
}
.acud-tag-md-outline-has-icon .acudicon + span,
.acud-tag-md-outline-has-icon img + span {
  margin-left: 4px;
}
.acud-tag-md-outline-only-icon {
  padding-right: 1px;
  padding-left: 1px;
}
.acud-tag-md-outline-has-icon > .acudicon {
  height: 16px;
  font-size: 16px;
}
.acud-tag-lg {
  height: 24px;
  line-height: 24px;
  border-radius: 2px;
  font-size: 12px;
}
.acud-tag-lg-text-hidden span.text-hidden {
  max-width: 132px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.acud-tag-lg-has-icon .acudicon {
  height: 14px;
}
.acud-tag-lg-has-icon .acudicon svg {
  width: 14px;
}
.acud-tag-lg-has-icon img {
  height: 14px;
  width: 14px;
}
.acud-tag-lg-has-icon .acudicon + span,
.acud-tag-lg-has-icon img + span {
  margin-left: 4px;
}
.acud-tag-lg-only-icon {
  padding-right: 4px;
  padding-left: 4px;
}
.acud-tag-lg-has-icon > .acudicon {
  height: 16px;
  font-size: 16px;
}
.acud-tag-lg-outline {
  height: 24px;
  line-height: 22px;
  border-radius: 2px;
  font-size: 12px;
}
.acud-tag-lg-outline-text-hidden span.text-hidden {
  max-width: 132px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.acud-tag-lg-outline-has-icon .acudicon {
  height: 14px;
}
.acud-tag-lg-outline-has-icon .acudicon svg {
  width: 14px;
}
.acud-tag-lg-outline-has-icon img {
  height: 14px;
  width: 14px;
}
.acud-tag-lg-outline-has-icon .acudicon + span,
.acud-tag-lg-outline-has-icon img + span {
  margin-left: 4px;
}
.acud-tag-lg-outline-only-icon {
  padding-right: 3px;
  padding-left: 3px;
}
.acud-tag-lg-outline-has-icon > .acudicon {
  height: 16px;
  font-size: 16px;
}
.acud-tag-sm {
  height: 16px;
  line-height: 16px;
  border-radius: 2px;
  font-size: 10px;
}
.acud-tag-sm-text-hidden span.text-hidden {
  max-width: 132px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.acud-tag-sm-has-icon .acudicon {
  height: 12px;
}
.acud-tag-sm-has-icon .acudicon svg {
  width: 12px;
}
.acud-tag-sm-has-icon img {
  height: 12px;
  width: 12px;
}
.acud-tag-sm-has-icon .acudicon + span,
.acud-tag-sm-has-icon img + span {
  margin-left: 4px;
}
.acud-tag-sm-only-icon {
  padding-right: 0px;
  padding-left: 0px;
}
.acud-tag-sm-has-icon > .acudicon {
  height: 16px;
  font-size: 16px;
}
.acud-tag-sm-outline {
  height: 16px;
  line-height: 14px;
  border-radius: 2px;
  font-size: 10px;
}
.acud-tag-sm-outline-text-hidden span.text-hidden {
  max-width: 132px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.acud-tag-sm-outline-has-icon .acudicon {
  height: 12px;
}
.acud-tag-sm-outline-has-icon .acudicon svg {
  width: 12px;
}
.acud-tag-sm-outline-has-icon img {
  height: 12px;
  width: 12px;
}
.acud-tag-sm-outline-has-icon .acudicon + span,
.acud-tag-sm-outline-has-icon img + span {
  margin-left: 4px;
}
.acud-tag-sm-outline-only-icon {
  padding-right: -1px;
  padding-left: -1px;
}
.acud-tag-sm-outline-has-icon > .acudicon {
  height: 16px;
  font-size: 16px;
}
.acud-tag,
.acud-tag:active,
.acud-tag:focus {
  outline: 0;
}
.acud-tag:not([disabled]):hover {
  text-decoration: none;
}
.acud-tag:not([disabled]):active {
  outline: 0;
  box-shadow: none;
}
.acud-tag[disabled] {
  cursor: not-allowed;
  background-color: #E8E9EB;
}
.acud-tag[disabled] > * {
  pointer-events: none;
}
.acud-tag.acud-tag-rtl {
  margin-right: 0;
  margin-left: 8px;
  direction: rtl;
  text-align: right;
}
.acud-tag-has-icon .acudicon {
  color: red;
}
.acud-tag-rtl .acud-tag-close-icon {
  margin-right: 3px;
  margin-left: 0;
}
.acud-tag-rtl.acud-tag > .acudicon + span,
.acud-tag-rtl.acud-tag > span + .acudicon {
  margin-right: 7px;
  margin-left: 0;
}