@import '../index.less';
@btri-badge: ~'@{ant-prefix}-btri-badge';

.@{btri-badge} {
  &-box {
    .@{ant-prefix}-badge-count {
      border: 1px solid var(--bg-2);
    }
    .@{ant-prefix}-btri-badge-text {
      border: 1px solid var(--bg-2);
    }
    .@{ant-prefix}-badge-count {
      box-shadow: none;
    }
    .@{ant-prefix}-scroll-number.@{ant-prefix}-badge-multiple-words {
      transform: translate(calc(100% - 8px), -12px);
    }
    .@{ant-prefix}-badge-multiple-words {
      padding: 0 6px;
    }
    .@{ant-prefix}-badge-count-sm.@{ant-prefix}-scroll-number.@{ant-prefix}-badge-multiple-words {
      transform: translate(calc(100% - 6px), -10px);
    }
  }
  &-box {
    .@{btri-badge}-text {
      position: absolute;
      top: -12px;
      left: calc(100% - 8px);
      border-radius: 10px;
      padding: 0 6px;
      line-height: 20px;
      color: var(--white);
      background-color: var(--red-6);
    }
    &.@{ant-prefix}-badge-dot {
      width: 8px;
      min-width: 8px;
      height: 8px;
      background: var(--red-6);
      box-shadow: none;
    }
    &.@{ant-prefix}-badge-count {
      z-index: auto;
      background: var(--red-6);
      box-shadow: none;
      transform: translate(60%, -50%);
    }
    &.@{ant-prefix}-badge-count-sm {
      min-width: 16px;
      height: 16px;
      font-size: 12px;
      line-height: 16px;
      border-radius: 8px;
    }
    &.@{btri-badge}-success {
      .@{ant-prefix}-badge-count {
        background-color: var(--green-6);
      }
      .@{btri-badge}-text {
        background-color: var(--green-6);
      }
    }
    &.@{btri-badge}-warning {
      .@{ant-prefix}-badge-count {
        background-color: var(--alarm-warning);
      }
      .@{btri-badge}-text {
        background-color: var(--alarm-warning);
      }
    }
    &.@{btri-badge}-error {
      .@{ant-prefix}-badge-count {
        background-color: var(--red-6);
      }
      .@{btri-badge}-text {
        background-color: var(--red-6);
      }
    }
    &.@{btri-badge}-default {
      .@{ant-prefix}-badge-count {
        background-color: var(--gray-3);
      }
      .@{btri-badge}-text {
        background-color: var(--gray-3);
      }
    }
    &.@{btri-badge}-processing {
      .@{ant-prefix}-badge-count {
        background-color: var(--primary-6);
      }
      .@{btri-badge}-text {
        background-color: var(--primary-6);
      }
      .@{ant-prefix}-badge-status-processing {
        position: absolute;
      }
    }
    &.@{ant-prefix}-badge-status-success {
      background-color: var(--green-6);
    }
    &.@{ant-prefix}-badge-status-warning {
      background-color: var(--alarm-warning);
    }
    &.@{ant-prefix}-badge-status-error {
      background-color: var(--error);
    }
    &.@{ant-prefix}-badge-status-default {
      background-color: var(--gray-3);
    }
    &.@{ant-prefix}-badge-status-processing {
      background-color: var(--primary-6);
    }
    &.@{ant-prefix}-badge-count-sm {
      min-width: 16px;
      height: 16px;
      line-height: 16px;
      border-radius: 8px;
    }
  }
}
