/* ==================================================================
 * GEO 总管理站 / 代理端 品牌视觉覆盖层（2026-10-19）
 * ------------------------------------------------------------------
 * 为什么只做 CSS：public/webthinkadmin/assets/*.js 是 Vite 构建产物（无源码），
 * 改压缩 chunk 风险极高（历史上多次白屏）。本文件只覆盖样式，不碰任何 JS，
 * 出问题删掉这一行 <link> 即完整回滚。
 *
 * 引入位置：必须在 index-B3PBoaWI.css（Element Plus 产物）之后 —— 见 index.html。
 * 口径与企业端 public/admin 保持一致：品牌蓝 #3b82f6、圆角 8/10/14、柔和阴影。
 * ================================================================== */

/* 用 :root:root 提高特异性（0,2,0）：页面的 Element Plus 样式是运行时由 JS 动态注入到
   <head> 末尾的，必然晚于本文件的 <link>；同为 :root 时后注入者胜出，品牌色会被冲掉。 */
:root:root {
  /* Element Plus 品牌色：默认是 #409EFF，与企业端品牌蓝不一致 */
  --el-color-primary: #3b82f6;
  --el-color-primary-light-3: #74a7f9;
  --el-color-primary-light-5: #a5c4fb;
  --el-color-primary-light-7: #cbdcfd;
  --el-color-primary-light-8: #dbe7fe;
  --el-color-primary-light-9: #edf3ff;
  --el-color-primary-dark-2: #2f68c4;

  /* 尺度：圆角/阴影/边框色，全站组件统一 */
  --el-border-radius-base: 8px;
  --el-border-radius-small: 6px;
  --el-border-radius-round: 999px;
  --el-border-color: #e4e9f2;
  --el-border-color-light: #eef1f7;
  --el-border-color-lighter: #f4f6fa;
  --el-box-shadow-light: 0 2px 8px rgba(16, 24, 40, .06);
  --el-box-shadow: 0 4px 14px rgba(16, 24, 40, .08);
  --el-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter',
                    'PingFang SC', 'HarmonyOS Sans SC', 'Microsoft YaHei', Arial, sans-serif;

  /* 页面底色：EP 默认纯白，与企业端同源的浅灰蓝更透气 */
  --el-bg-color-page: #f3f5f9;
}

body {
  background: #f3f5f9;
  font-family: var(--el-font-family);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 文本选中色 */
::selection { background: rgba(59, 130, 246, .18); }

/* 细滚动条 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, .45);
  border-radius: 4px;
  border: 2px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover { background: rgba(100, 116, 139, .7); }
::-webkit-scrollbar-track { background: transparent; }

/* —— 按钮：主按钮渐变 + 发光；默认按钮 hover 走品牌描边 —— */
.el-button {
  border-radius: 8px;
  font-weight: 500;
  transition: background .24s cubic-bezier(.22, .9, .3, 1),
              border-color .24s, color .24s, box-shadow .24s, transform .24s;
}
.el-button--primary {
  background-image: linear-gradient(135deg, #3b82f6, #6366f1);
  border-color: transparent;
  box-shadow: 0 2px 8px rgba(59, 130, 246, .30);
}
.el-button--primary:hover, .el-button--primary:focus {
  background-image: linear-gradient(135deg, #4b8df8, #7275f5);
  box-shadow: 0 6px 16px rgba(59, 130, 246, .38);
  transform: translateY(-1px);
}
.el-button--primary.is-plain {
  background-image: none;
  background-color: rgba(59, 130, 246, .06);
  color: #3b82f6;
  border-color: rgba(59, 130, 246, .45);
  box-shadow: none;
  transform: none;
}
.el-button:active:not(.is-disabled) { filter: brightness(.94); }
.el-button.is-link, .el-button--text { font-weight: 500; }

/* —— 表单控件：聚焦光环（比单纯加粗描边更现代） —— */
.el-input__wrapper, .el-textarea__inner {
  border-radius: 8px;
  transition: box-shadow .2s, border-color .2s;
}
.el-input__wrapper.is-focus, .el-textarea__inner:focus {
  box-shadow: 0 0 0 3px rgba(59, 130, 246, .15);
}
.el-select__wrapper.is-focused { box-shadow: 0 0 0 3px rgba(59, 130, 246, .15); }

/* —— 表格：表头浅底渐变、竖线降噪、行悬浮带主色指示条 —— */
.el-table { font-size: 14px; }
.el-table thead th.el-table__cell {
  background: linear-gradient(180deg, #f8faff, #f2f6fc) !important;
  color: #5b6472;
  font-weight: 600;
}
.el-table td.el-table__cell { padding: 11px 0; }
.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
  background: #fbfcfe;
}
.el-table__body tr:hover > td.el-table__cell {
  background: linear-gradient(90deg, rgba(59, 130, 246, .07), rgba(59, 130, 246, .03));
}
.el-table__body tr:hover > td.el-table__cell:first-child {
  box-shadow: inset 3px 0 0 #3b82f6;
}
.el-table__empty-block { min-height: 180px; }
.el-table__empty-text { color: #98a2b3; line-height: 1.8; }

/* —— 卡片：大圆角 + 分层阴影 —— */
.el-card {
  border-radius: 14px;
  border-color: rgba(226, 232, 240, .9);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 4px 14px rgba(16, 24, 40, .05);
}
.el-card__header { font-weight: 600; }

/* —— 标签：浅底 + 细描边（密集列表更透气） —— */
.el-tag {
  border-radius: 6px;
  font-weight: 500;
}
.el-tag--info, .el-tag--primary {
  background: #f0f5ff;
  border-color: rgba(59, 130, 246, .28);
  color: #3b82f6;
}
.el-tag--success { background: #f6ffed; border-color: #b7eb8f; color: #17a34a; }
.el-tag--warning { background: #fffbe6; border-color: #ffe58f; color: #c47d0b; }
.el-tag--danger  { background: #fff2f0; border-color: #fde2e2; color: #dc4b40; }

/* —— 分页：胶囊化 + 激活渐变 —— */
.el-pager li, .el-pagination button {
  border-radius: 8px;
  font-weight: 500;
  transition: all .24s cubic-bezier(.22, .9, .3, 1);
}
.el-pager li.is-active {
  background: linear-gradient(135deg, #3b82f6, #6366f1);
  color: #fff;
  box-shadow: 0 8px 24px -6px rgba(59, 130, 246, .38);
}

/* —— 弹窗 / 消息：圆角 + 遮罩模糊 —— */
.el-dialog { border-radius: 16px; box-shadow: 0 8px 16px rgba(16, 24, 40, .05), 0 24px 56px -12px rgba(31, 41, 61, .22); }
.el-dialog__header { padding: 16px 20px; border-bottom: 1px solid #eef0f4; }
.el-dialog__title { font-weight: 600; }
.el-dialog__footer { padding: 12px 20px; border-top: 1px solid #eef0f4; }
.el-overlay { backdrop-filter: blur(3px); }
.el-message { border-radius: 8px; border: none; box-shadow: 0 6px 20px rgba(20, 26, 40, .12); }
.el-message-box { border-radius: 14px; border: none; box-shadow: 0 24px 56px -12px rgba(31, 41, 61, .22); }

/* —— 进度条 / 面包屑 / 提示条 —— */
.el-progress-bar__outer { background: #f4f6fa; border-radius: 999px; }
.el-progress-bar__inner { border-radius: 999px; background-image: linear-gradient(90deg, #3b82f6, #6366f1); }
.el-alert { border-radius: 10px; }
.el-breadcrumb__inner.is-link { font-weight: 500; }

/* —— 数字等宽：统计/金额跳动时不左右抖 —— */
.el-descriptions__body .el-descriptions__label { font-weight: 500; color: #5b6472; }

/* —— 减弱动效偏好 —— */
@media (prefers-reduced-motion: reduce) {
  .el-button--primary:hover, .el-button--primary:focus { transform: none; }
  .el-button { transition: none; }
}
