/* ============================================================
   LI-Tool 后台全局美化 (admin-polish.css)
   设计语言：与主页一致的浅灰背景 + 白色圆角卡片 + 柔和阴影
   - 统一主题变量（修复未定义的 --bg-secondary 等）
   - 所有管理页面容器统一为 12px 圆角白卡
   - TDesign 组件全局精修：按钮/表格/输入框/标签/弹窗/分页
   - 微交互：悬浮上浮、焦点光圈、入场动画
   仅覆盖视觉层，不改动任何功能逻辑
   ============================================================ */

/* ==================== 0. 主题变量统一 ==================== */
:root {
  /* 应用自定义变量（页面 scoped 样式引用） */
  --bg-primary: #ffffff;
  --bg-secondary: #ffffff;
  --bg-color-page: #f5f7fa;
  --border-color: #ececec;
  --text-primary: #333333;
  --text-secondary: #8c8f9c;

  /* TDesign 品牌色统一为 #0099ff 蓝 */
  --td-brand-color: #0099ff;
  --td-brand-color-hover: #33adff;
  --td-brand-color-active: #0080e0;
  --td-brand-color-focus: #0099ff;
  --td-brand-color-light: #e6f4ff;
  --td-brand-color-light-hover: #d0ebff;
  --td-brand-color-disabled: #a6d9ff;
}

/* ==================== 1. 全局基础 ==================== */
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
    'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection {
  background: rgba(0, 153, 255, 0.16);
}

/* 细滚动条 */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-thumb {
  background: #d0d5dd;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #b8c0cc;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-corner {
  background: transparent;
}

/* ==================== 2. 管理页面容器：统一白色圆角卡片 ==================== */
.account-generate-container,
.announcement-management-container,
.archive-query-container,
.balance-card-container,
.balance-log-container,
.login-log-container,
.package-management-container,
.password-container,
.prop-management-container,
.recharge-card-container,
.recharge-container,
.recharge-log-container,
.register-card-container,
.task-query-container,
.type-management-container,
.user-management-container {
  background: #ffffff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 20px !important;
  box-shadow: 0 2px 8px rgba(31, 45, 61, 0.06) !important;
}

/* ==================== 3. 页面标题：左侧渐变竖条 ==================== */
.page-header h2 {
  position: relative !important;
  padding-left: 13px !important;
  font-size: 19px !important;
  font-weight: 700 !important;
  color: #333333 !important;
  letter-spacing: 0.3px;
}

.page-header h2::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 4px !important;
  height: 18px !important;
  border-radius: 2px !important;
  background: linear-gradient(180deg, #33adff 0%, #0080e0 100%) !important;
}

/* ==================== 4. 搜索栏 / 批量操作栏 ==================== */
.search-filter {
  background: #fafbfc !important;
  border: 1px solid #ececec !important;
  border-radius: 10px !important;
  padding: 14px 16px !important;
}

/* 批量操作栏：浅蓝提示色 */
.batch-actions {
  background: #eef8ff !important;
  border: 1px solid #d4ecff !important;
  border-radius: 10px !important;
  padding: 12px 16px !important;
}

.selected-count {
  color: #0a7ecb !important;
}

/* 信息提示条 */
.info-tip .t-alert {
  border-radius: 10px !important;
}

/* ==================== 5. 按钮精修 ==================== */
.t-button {
  border-radius: 8px !important;
  font-weight: 500 !important;
  transition: all 0.2s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.t-button:focus-visible {
  outline: 2px solid rgba(0, 153, 255, 0.45) !important;
  outline-offset: 2px !important;
}

/* 主按钮：带光晕 + 悬浮上浮 */
.t-button--theme-primary {
  box-shadow: 0 2px 6px rgba(0, 153, 255, 0.28) !important;
}

.t-button--theme-primary:hover {
  box-shadow: 0 4px 12px rgba(0, 153, 255, 0.38) !important;
  transform: translateY(-1px) !important;
}

.t-button--theme-primary:active {
  transform: translateY(0) !important;
  box-shadow: 0 2px 6px rgba(0, 153, 255, 0.22) !important;
}

/* 幽灵/文字按钮悬浮 */
.t-button--variant-outline:hover,
.t-button--variant-dashed:hover {
  background: #f0f9ff !important;
  border-color: #33adff !important;
  color: #0080e0 !important;
}

.t-button--variant-text:hover {
  background: rgba(0, 153, 255, 0.08) !important;
}

/* 危险按钮悬浮 */
.t-button--theme-danger:hover {
  background: #ff7875 !important;
  border-color: #ff7875 !important;
  color: #fff !important;
}

/* ==================== 6. 表格精修 ==================== */
.t-table {
  border-radius: 10px !important;
}

/* 表头：浅灰底 + 加粗灰字 */
.t-table thead th,
.t-table__th,
.t-table__header th,
.t-table .t-table__header {
  background: #f7f9fc !important;
}

.t-table thead th .t-table__th-cell-inner,
.t-table thead th {
  font-weight: 600 !important;
  color: #4a5568 !important;
}

/* 行悬浮：浅蓝高亮 */
.t-table__row--hover td,
.t-table__row:hover td {
  background: #f5faff !important;
}

/* 单元格文字颜色与紧凑过渡 */
.t-table__cell {
  color: #333333 !important;
  transition: background 0.15s ease !important;
}

/* 分页器 */
.t-pagination {
  margin-top: 18px !important;
}

.t-pagination .t-pagination__btn,
.t-pagination button {
  border-radius: 6px !important;
  transition: all 0.15s ease !important;
}

.t-pagination .t-is-current {
  background: #0099ff !important;
  color: #ffffff !important;
  border-radius: 6px !important;
}

/* 表格内操作按钮微调 */
.t-table .t-button--variant-text {
  font-weight: 500 !important;
}

/* ==================== 7. 输入控件精修 ==================== */
.t-input,
.t-textarea__inner,
.t-input-number,
.t-select,
.t-input__wrap {
  border-radius: 8px !important;
}

.t-input:hover:not(.t-is-disabled),
.t-select:hover:not(.t-is-disabled),
.t-input-number:hover:not(.t-is-disabled) {
  border-color: #b8d9f5 !important;
}

/* 焦点光圈 */
.t-input.t-is-focused,
.t-select.t-is-focused,
.t-input-number.t-is-focused {
  border-color: #0099ff !important;
  box-shadow: 0 0 0 3px rgba(0, 153, 255, 0.12) !important;
}

.t-textarea__inner:focus {
  border-color: #0099ff !important;
  box-shadow: 0 0 0 3px rgba(0, 153, 255, 0.12) !important;
}

/* 表单标签 */
.t-form__label {
  color: #333333 !important;
  font-weight: 500 !important;
}

/* 复选框/单选选中色 */
.t-checkbox.t-is-checked .t-checkbox__input,
.t-radio.t-is-checked .t-radio__input {
  border-color: #0099ff !important;
  background: #0099ff !important;
}

/* ==================== 8. 标签精修 ==================== */
.t-tag {
  border-radius: 6px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
}

/* ==================== 9. 弹窗精修 ==================== */
.t-dialog {
  border-radius: 12px !important;
  box-shadow: 0 16px 48px rgba(31, 45, 61, 0.16) !important;
  overflow: hidden !important;
}

.t-dialog__header {
  font-weight: 600 !important;
  padding: 18px 24px !important;
  border-bottom: 1px solid #f0f0f0 !important;
}

.t-dialog__body {
  padding: 20px 24px !important;
}

.t-dialog__footer {
  padding: 14px 24px !important;
  border-top: 1px solid #f0f0f0 !important;
}

/* 弹窗关闭按钮 */
.t-dialog__close:hover {
  background: #f0f2f5 !important;
  color: #333 !important;
}

/* ==================== 10. 下拉/浮层精修 ==================== */
.t-popup,
.t-select__dropdown,
.t-date-picker__panel,
.t-cascader__panel {
  border-radius: 10px !important;
  box-shadow: 0 8px 24px rgba(31, 45, 61, 0.12) !important;
}

/* 下拉选中项 */
.t-select-option.t-is-selected {
  color: #0099ff !important;
  font-weight: 600 !important;
  background: #f0f9ff !important;
}

.t-select-option:hover:not(.t-is-selected) {
  background: #f7f9fc !important;
}

/* 全局消息提示 */
.t-message {
  border-radius: 10px !important;
  box-shadow: 0 6px 20px rgba(31, 45, 61, 0.14) !important;
}

.t-notification {
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(31, 45, 61, 0.14) !important;
}

/* ==================== 11. 详情弹窗内元素(用户列表等) ==================== */
.detail-item {
  border-bottom: 1px dashed #f0f0f0 !important;
}

.detail-label {
  color: #999999 !important;
}

.detail-value {
  color: #333333 !important;
}

.dialog-footer {
  border-top: 1px solid #f0f0f0 !important;
}

/* 红色余额数字 */
.balance-value-red {
  color: #f5222d !important;
  font-weight: 700 !important;
}

/* ==================== 12. 页面入场动画 ==================== */
.content-wrapper > * {
  animation: pageIn 0.35s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes pageIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ==================== 13. 空状态 / 加载 ==================== */
.t-empty__description {
  color: #999999 !important;
}

.t-loading__wrap-text {
  color: #666666 !important;
}

/* ==================== 14. 响应式与无障碍 ==================== */
@media (max-width: 768px) {
  .account-generate-container,
  .announcement-management-container,
  .archive-query-container,
  .balance-card-container,
  .balance-log-container,
  .login-log-container,
  .package-management-container,
  .password-container,
  .prop-management-container,
  .recharge-card-container,
  .recharge-container,
  .recharge-log-container,
  .register-card-container,
  .task-query-container,
  .type-management-container,
  .user-management-container {
    padding: 14px !important;
  }

  .page-header {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }

  .search-filter {
    flex-direction: column !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .content-wrapper > *,
  .t-button,
  .t-table__cell {
    animation: none !important;
    transition: none !important;
  }
}