.el-button {
  --el-button-font-weight: 400;
  --el-button-text-color: var(--el-text-color-primary);

  --el-button-border-color: #999;
  --el-button-hover-text-color: var(--seemusic-text-hover);
  --el-button-hover-bg-color: none;
  // TODO plain 支持
  --el-button-hover-border-color: var(--seemusic-text-hover);

  --el-button-active-text-color: var(--el-color-primary);
  --el-button-disabled-border-color: var(--el-disabled-border-color);
  --el-button-disabled-bg-color: var(--el-disabled-bg-color);

  &--primary {
    --el-button-border-color: var(--el-color-primary);
    --el-button-hover-text-color: #FFF;
    --el-button-hover-bg-color: var(--seemusic-text-hover);
    --el-button-active-text-color: #FFF;
    --el-button-active-border-color: var(--el-color-primary);
    --el-button-active-bg-color: var(--el-color-primary);

    --el-button-disabled-text-color: var(--el-disabled-text-color);
    --el-button-disabled-border-color: var(--el-disabled-bg-color);
  }

  // TODO 验证
  &--danger {
    --el-button-border-color: var(--el-color-danger);

    &:hover {
      color: var(--el-color-danger);
      border-color: var(--el-color-danger);
    }
  }

  &--primary,
  &--danger {
    --el-button-text-color: #FFF;
  }

  padding: 0 11px;
  font-size: var(--sop-font-size);

  & + & {
    margin-left: 8px;
  }
  // TODO
  // 失去焦点的顺序有些问题，按钮 hover -> mousedown => mouseup 都有颜色区分，需要覆写
  // &,
  // &:focus {
  // }

  // &:hover {
  // }

  // &:active {
  // }
}
