.j-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 15px;
  border-radius: 4px;
  border: 1px solid transparent;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.3s ease;
  outline: none;
  line-height: 1;
}

.j-btn-default {
  background-color: var(--j-color-white);
  border-color: var(--j-border-color-base);
  color: var(--j-color-text-regular);
}

.j-btn-default:hover {
  background-color: #ecf5ff;
  border-color: var(--j-color-primary-light-5);
  color: var(--j-color-primary);
}

.j-btn-primary {
  background-color: var(--j-color-primary);
  border-color: var(--j-color-primary);
  color: var(--j-color-white);
}

.j-btn-primary:hover {
  background-color: var(--j-color-primary-light-2);
  border-color: var(--j-color-primary-light-2);
}

.j-btn-success {
  background-color: var(--j-color-success);
  border-color: var(--j-color-success);
  color: var(--j-color-white);
}

.j-btn-success:hover {
  background-color: #85ce61;
  border-color: #85ce61;
}

.j-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.j-btn-small {
  padding: 6px 11px;
  font-size: 12px;
}

.j-btn-medium {
  padding: 7px 10px;
  font-size: 14px;
}

.j-icon {
  margin-right: 5px;
}

.j-btn-info {
  background-color: var(--j-color-info);
  border-color: var(--j-color-info);
  color: var(--j-color-white);
}

.j-btn-info:hover {
  background-color: #a6a9ad;
  border-color: #a6a9ad;
}

.j-btn-warning {
  background-color: var(--j-color-warning);
  border-color: var(--j-color-warning);
  color: var(--j-color-white);
}

.j-btn-warning:hover {
  background-color: #ebb563;
  border-color: #ebb563;
}

.j-btn-danger {
  background-color: var(--j-color-danger);
  border-color: var(--j-color-danger);
  color: var(--j-color-white);
}

.j-btn-danger:hover {
  background-color: #f78989;
  border-color: #f78989;
}

.j-btn-plain {
  background-color: transparent !important;
  border-color: currentColor !important;
}
.j-btn-plain:hover {
 opacity: 0.6; 
}

/* 为每种类型添加plain样式 */
.j-btn-default.j-btn-plain {
  color: var(--j-color-text-regular);
  border-color: var(--j-border-color-base);
}

.j-btn-primary.j-btn-plain {
  color: var(--j-color-primary);
  border-color: var(--j-color-primary-light-5);
}

.j-btn-success.j-btn-plain {
  color: var(--j-color-success);
  border-color: #b3e19d;
}

.j-btn-info.j-btn-plain {
  color: var(--j-color-info);
  border-color: #c8c9cc;
}

.j-btn-warning.j-btn-plain {
  color: var(--j-color-warning);
  border-color: #f3d19e;
}

.j-btn-danger.j-btn-plain {
  color: var(--j-color-danger);
  border-color: #f9a7a7;
}

/* 新增round样式 */
.j-btn-round {
  border-radius: 20px;
}