// 渐变主按钮 —— 通过额外 class 使用
.el-button--primary.is-gradient {
  border: none;
  background: var(--btn-primary-gradient);
  color: #fff;
  // box-shadow: 0 4px 15px var(--btn-primary-shadow);

  &:hover {
    background: var(--btn-primary-gradient-hover);
    // box-shadow: 0 6px 20px var(--btn-primary-shadow);
  }

  // &:active {
  //   background: var(--el-color-primary-dark);
  // }

  &.is-disabled {
    opacity: 0.6;
    transform: none;
    cursor: not-allowed;
  }
}

// 普通主按钮 —— 纯色背景，不使用渐变色
.el-button--primary.is-solid {
  border: none;
  background: var(--admin-btn-bg);
  color: #fff;

  // &:hover {
  //   background: var(--el-color-primary-light-3);
  // }

  // &:active {
  //   background: var(--el-color-primary-dark-2);
  // }

  &.is-disabled {
    color: rgba(255, 255, 255, 0.5);
    transform: none;
    cursor: not-allowed;
    background: var(--admin-btn-bg);
  }
}

// 使用 :root 提高优先级，覆盖 Element Plus 默认样式
:root .el-card {
  border: none;
  border-radius: 10px;
}

:root .el-dialog {
  border-radius: 12px;
  padding: 0;

  .el-dialog__header {
    background: #8077ff;
    margin-right: 0;
    padding: 16px 20px;
    border-radius: 12px 12px 0 0;
  }
  .el-dialog__title {
    color: #fff;
  }
  .el-dialog__headerbtn .el-dialog__close {
    color: #fff;
  }
  .el-dialog__body {
    padding: 20px;
  }
  .el-dialog__footer {
    padding: 20px;
    border-radius: 0 0 12px 12px;
  }
}

:root .el-table {
  border: 1px solid var(--admin-border-color);
  border-radius: 8px;
  .el-table__header-wrapper,
  .el-table__fixed-header-wrapper {
    th {
      background: var(--admin-table-header-bg);
      white-space: nowrap;
    }
  }

  // 修复固定列背景色透明问题
  .el-table__fixed,
  .el-table__fixed-right {
    background-color: var(--el-bg-color);

    // 固定列表头背景色
    .el-table__fixed-header-wrapper {
      th {
        background: var(--admin-table-header-bg);
      }
    }

    // 固定列单元格背景色
    .el-table__body-wrapper {
      td {
        background-color: var(--el-bg-color);
      }

      // 条纹样式
      .el-table__row--striped td {
        background-color: var(--el-fill-color-light);
      }
    }
  }
}
