/* ==================== Element Plus 冷灰紫主题覆盖 ==================== */

/* -------------------- 输入框 -------------------- */
.el-input__wrapper {
  background-color: var(--surface-3) !important;
  box-shadow: 0 0 0 1px var(--border) inset !important;
  border-radius: var(--radius-md) !important;
}

.el-input__wrapper:hover,
.el-input__wrapper.is-focus {
  box-shadow: 0 0 0 1px var(--primary) inset !important;
}

.el-input__wrapper.is-focus {
  box-shadow: 0 0 0 1px var(--primary) inset, var(--shadow-primary-sm) !important;
}

.el-input__inner {
  color: var(--text-primary) !important;
}

.el-input__inner::placeholder {
  color: var(--text-muted) !important;
}

/* -------------------- 选择器 -------------------- */
.el-select__wrapper {
  background-color: var(--surface-3) !important;
  box-shadow: 0 0 0 1px var(--border) inset !important;
  border-radius: var(--radius-md) !important;
}

.el-select__wrapper:hover,
.el-select__wrapper.is-focused {
  box-shadow: 0 0 0 1px var(--primary) inset !important;
}

.el-select__wrapper.is-focused {
  box-shadow: 0 0 0 1px var(--primary) inset, var(--shadow-primary-sm) !important;
}

.el-select__placeholder {
  color: var(--text-muted) !important;
}

.el-select__caret {
  color: var(--text-secondary) !important;
}

.el-select__caret.is-reverse {
  color: var(--primary) !important;
}

.el-select-dropdown {
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-lg) !important;
  background: var(--surface) !important;
  border-radius: var(--radius-md) !important;
}

.el-select-dropdown__item {
  color: var(--text-secondary) !important;
}

.el-select-dropdown__item:hover {
  background: var(--primary-soft) !important;
  color: var(--primary) !important;
}

.el-select-dropdown__item.is-selected {
  color: var(--primary) !important;
  font-weight: 600;
  background: var(--primary-soft) !important;
}

/* -------------------- 数字输入框 -------------------- */
.el-input-number__decrease,
.el-input-number__increase {
  background: var(--surface-2) !important;
  color: var(--text-secondary) !important;
  border: 1px solid var(--border) !important;
}

.el-input-number__decrease:hover,
.el-input-number__increase:hover {
  background: var(--primary-soft) !important;
  color: var(--primary) !important;
  border-color: var(--primary) !important;
}

.el-input-number__decrease.is-disabled,
.el-input-number__increase.is-disabled {
  color: var(--el-disabled-text) !important;
  border-color: var(--border) !important;
}

.el-input-number__wrapper {
  background-color: var(--surface-3) !important;
  box-shadow: 0 0 0 1px var(--border) inset !important;
}

.el-input-number__wrapper:hover,
.el-input-number__wrapper.is-focus {
  box-shadow: 0 0 0 1px var(--primary) inset !important;
}

/* -------------------- 按钮 -------------------- */
.el-button {
  border: 1px solid var(--border) !important;
  background: var(--surface-2) !important;
  color: var(--text-secondary) !important;
  border-radius: var(--radius-md) !important;
  font-weight: 500;
}

.el-button:hover {
  border-color: var(--primary) !important;
  color: var(--primary) !important;
  background: var(--surface-3) !important;
}

/* 主要按钮 - 深紫实心 */
.el-button--primary {
  background: var(--primary-solid) !important;
  border-color: var(--primary-solid) !important;
  color: white !important;
}

.el-button--primary:hover {
  background: var(--primary-solid-hover) !important;
  border-color: var(--primary-solid-hover) !important;
  box-shadow: var(--shadow-primary-md) !important;
  transform: translateY(-1px);
}

/* 成功按钮 - 青绿 */
.el-button--success {
  background: var(--success) !important;
  border-color: var(--success) !important;
  color: var(--bg) !important;
}

.el-button--success:hover {
  background: #2DD4BF !important;
  border-color: #2DD4BF !important;
  box-shadow: 0 0 20px rgba(34, 197, 94, 0.3) !important;
}

/* 警告按钮 - 橙黄 */
.el-button--warning {
  background: var(--warning) !important;
  border-color: var(--warning) !important;
  color: var(--bg) !important;
}

.el-button--warning:hover {
  background: #FBBF24 !important;
  border-color: #FBBF24 !important;
  box-shadow: 0 0 20px rgba(245, 158, 11, 0.3) !important;
}

/* 危险按钮 - 粉红 */
.el-button--danger {
  background: var(--danger) !important;
  border-color: var(--danger) !important;
  color: white !important;
}

.el-button--danger:hover {
  background: #FCA5A5 !important;
  border-color: #FCA5A5 !important;
  box-shadow: 0 0 20px rgba(251, 113, 133, 0.3) !important;
}

/* 纯文字按钮 */
.el-button--text {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--primary) !important;
}

.el-button--text:hover {
  color: var(--primary-hover) !important;
  background: var(--primary-soft) !important;
}

/* -------------------- 卡片 -------------------- */
.el-card {
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
  background: var(--surface) !important;
  border-radius: var(--radius-lg) !important;
}

.el-card:hover {
  border-color: var(--border-light) !important;
}

.el-card__header {
  border-bottom: 1px solid var(--border) !important;
  padding: 16px 20px;
}

.el-card__body {
  background: transparent !important;
  padding: 20px;
}

/* -------------------- 表格 -------------------- */
.el-table {
  border: 1px solid var(--border) !important;
  background: var(--surface) !important;
  border-radius: var(--radius-lg) !important;
  --el-table-row-hover-bg-color: var(--surface-2);
  --el-table-current-row-bg-color: var(--primary-soft);
  --el-table-header-bg-color: var(--surface-2);
  --el-table-tr-bg-color: var(--surface);
  --el-table-expanded-cell-bg-color: var(--surface);
}

.el-table th.el-table__cell {
  background: var(--surface-2) !important;
  color: var(--text-secondary) !important;
  border-bottom: 1px solid var(--border) !important;
  font-weight: 600;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.el-table td.el-table__cell {
  color: var(--text-primary) !important;
  border-bottom: 1px solid var(--border) !important;
}

.el-table__border-left {
  border-left: 1px solid var(--border) !important;
}

.el-table__border-right {
  border-right: 1px solid var(--border) !important;
}

.el-table tr:hover > td {
  background: var(--surface-2) !important;
}

.el-table__body tr.current-row > td.el-table__cell {
  background: var(--primary-soft) !important;
}

/* 表格行选中左侧高亮条 */
.el-table__body tr.current-row > td.el-table__cell:first-child {
  border-left: 3px solid var(--primary) !important;
}

/* -------------------- 复选框 -------------------- */
.el-checkbox__inner {
  border: 1px solid var(--border) !important;
  background: var(--surface-3) !important;
}

.el-checkbox__inner:hover {
  border-color: var(--primary) !important;
}

.el-checkbox__input.is-checked .el-checkbox__inner {
  background: var(--primary) !important;
  border-color: var(--primary) !important;
}

.el-checkbox__input.is-disabled .el-checkbox__inner {
  background: var(--el-disabled-bg) !important;
  border-color: var(--el-disabled-border) !important;
}

/* -------------------- 分页 -------------------- */
.el-pagination button {
  border: 1px solid var(--border) !important;
  background: var(--surface) !important;
  color: var(--text-secondary) !important;
  border-radius: var(--radius-sm) !important;
}

.el-pagination button:hover {
  background: var(--surface-2) !important;
  border-color: var(--primary) !important;
  color: var(--primary) !important;
}

.el-pagination button:disabled {
  background: var(--surface) !important;
  color: var(--text-muted) !important;
  border-color: var(--border) !important;
}

.el-pager li {
  background: var(--surface) !important;
  color: var(--text-secondary) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-sm) !important;
}

.el-pager li:hover {
  color: var(--primary) !important;
  border-color: var(--primary) !important;
}

.el-pager li.is-active {
  background: var(--primary) !important;
  color: var(--bg) !important;
  border-color: var(--primary) !important;
  font-weight: 600;
}

/* -------------------- 标签 -------------------- */
.el-tag {
  border-radius: var(--radius-sm) !important;
  font-weight: 500;
}

.el-tag--primary {
  background: var(--primary-soft) !important;
  color: var(--primary) !important;
  border-color: rgba(146, 124, 255, 0.3) !important;
}

.el-tag--success {
  background: var(--success-soft) !important;
  color: var(--success) !important;
  border-color: rgba(34, 197, 94, 0.3) !important;
}

.el-tag--warning {
  background: var(--warning-soft) !important;
  color: var(--warning) !important;
  border-color: rgba(245, 158, 11, 0.3) !important;
}

.el-tag--danger {
  background: var(--danger-soft) !important;
  color: var(--danger) !important;
  border-color: rgba(251, 113, 133, 0.3) !important;
}

.el-tag--info {
  background: var(--info-soft) !important;
  color: var(--info) !important;
  border-color: rgba(56, 189, 248, 0.3) !important;
}

/* -------------------- 评分 -------------------- */
.el-rate__icon {
  color: var(--border) !important;
}

.el-rate__icon.hover {
  color: var(--primary) !important;
}

/* -------------------- 对话框 -------------------- */
.el-dialog {
  border: 1px solid var(--border) !important;
  background: var(--surface) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-xl) !important;
}

.el-dialog__header {
  border-bottom: 1px solid var(--border) !important;
  padding: 16px 20px;
  margin: 0;
}

.el-dialog__title {
  color: var(--text-primary) !important;
  font-weight: 600;
}

.el-dialog__body {
  background: transparent !important;
  color: var(--text-secondary) !important;
  padding: 20px;
}

.el-dialog__footer {
  border-top: 1px solid var(--border) !important;
  padding: 16px 20px;
}

/* -------------------- 下拉菜单 -------------------- */
.el-dropdown-menu {
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-lg) !important;
  background: var(--surface) !important;
  border-radius: var(--radius-md) !important;
}

.el-dropdown-menu__item {
  color: var(--text-secondary) !important;
}

.el-dropdown-menu__item:hover {
  background: var(--primary-soft) !important;
  color: var(--primary) !important;
}

/* -------------------- 滚动条 -------------------- */
.el-scrollbar__wrap::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.el-scrollbar__wrap::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: var(--radius-sm);
}

.el-scrollbar__wrap::-webkit-scrollbar-thumb:hover {
  background: var(--primary);
}

/* -------------------- 表单 -------------------- */
.el-form-item__label {
  color: var(--text-secondary) !important;
  font-weight: 500;
}

.el-form-item__error {
  color: var(--danger) !important;
}

/* -------------------- 消息提示 -------------------- */
.el-message {
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-lg) !important;
  background: var(--surface) !important;
  border-radius: var(--radius-md) !important;
}

.el-message--success {
  background: var(--surface) !important;
  border-color: var(--success) !important;
  color: var(--success) !important;
}

.el-message--error {
  background: var(--surface) !important;
  border-color: var(--danger) !important;
  color: var(--danger) !important;
}

.el-message--warning {
  background: var(--surface) !important;
  border-color: var(--warning) !important;
  color: var(--warning) !important;
}

.el-message--info {
  background: var(--surface) !important;
  border-color: var(--primary) !important;
  color: var(--primary) !important;
}

/* -------------------- 消息盒子 -------------------- */
.el-message-box {
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow-xl) !important;
  background: var(--surface) !important;
  border-radius: var(--radius-lg) !important;
}

.el-message-box__header {
  border-bottom: 1px solid var(--border) !important;
}

.el-message-box__title {
  color: var(--text-primary) !important;
  font-weight: 600;
}

.el-message-box__content {
  color: var(--text-secondary) !important;
}

.el-message-box__btns {
  border-top: 1px solid var(--border) !important;
}

/* -------------------- 警告提示 -------------------- */
.el-alert {
  border-radius: var(--radius-md) !important;
}

.el-alert--success {
  background-color: var(--success-soft) !important;
  border: 1px solid rgba(34, 197, 94, 0.3) !important;
  color: var(--success) !important;
}

.el-alert--info {
  background-color: var(--primary-soft) !important;
  border: 1px solid rgba(146, 124, 255, 0.3) !important;
  color: var(--primary) !important;
}

.el-alert--warning {
  background-color: var(--warning-soft) !important;
  border: 1px solid rgba(245, 158, 11, 0.3) !important;
  color: var(--warning) !important;
}

.el-alert--error {
  background-color: var(--danger-soft) !important;
  border: 1px solid rgba(251, 113, 133, 0.3) !important;
  color: var(--danger) !important;
}

/* -------------------- Switch 开关 -------------------- */
.theme-switch.el-switch .el-switch__core {
  background: var(--surface-3);
  border-color: var(--border);
}

.theme-switch.el-switch.is-checked .el-switch__core {
  border-color: var(--primary) !important;
  background-color: var(--primary) !important;
}

/* -------------------- 进度条 -------------------- */
.el-progress-bar__outer {
  background-color: var(--surface-3) !important;
}

.el-progress-bar__inner {
  background: var(--gradient-primary) !important;
}

.el-progress__text {
  color: var(--text-secondary) !important;
}

/* -------------------- 菜单 -------------------- */
.el-menu {
  background: transparent !important;
  border-right: none !important;
}

.el-menu-item {
  color: var(--text-secondary) !important;
  border-radius: var(--radius-md);
  margin: 4px 8px;
}

.el-menu-item:hover {
  background: var(--surface-2) !important;
  color: var(--primary) !important;
}

.el-menu-item.is-active {
  background: var(--primary-soft) !important;
  color: var(--primary) !important;
  font-weight: 600;
}

/* -------------------- Tabs -------------------- */
.el-tabs__nav-wrap::after {
  background-color: var(--border) !important;
}

.el-tabs__item {
  color: var(--text-muted) !important;
}

.el-tabs__item:hover {
  color: var(--primary) !important;
}

.el-tabs__item.is-active {
  color: var(--primary) !important;
}

.el-tabs__active-bar {
  background-color: var(--primary) !important;
}

/* -------------------- Tooltip -------------------- */
.el-tooltip__popper {
  background: var(--surface-2) !important;
  border: 1px solid var(--border) !important;
  color: var(--text-primary) !important;
}