/* ============================================================================
   IOS-Manager 炫彩主题皮肤  theme.css
   ----------------------------------------------------------------------------
   纯样式覆盖层：不修改任何业务逻辑代码。
   回退方式：删掉 index.html 里的 <link ... href="/theme.css..."> 一行即可。
   ============================================================================ */

/* ---------------------------------------------------------------
   1. 调色板
   --------------------------------------------------------------- */
:root {
  --neon-1: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --neon-2: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
  --neon-3: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
  --neon-4: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
  --neon-5: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
  --neon-6: linear-gradient(135deg, #a18cd1 0%, #fbc2eb 100%);
  --neon-7: linear-gradient(135deg, #f6d365 0%, #fda085 100%);
  --neon-8: linear-gradient(135deg, #5ee7df 0%, #b490ca 100%);

  --glow-1: 0 10px 30px rgba(102, 126, 234, .45);
  --glow-2: 0 10px 30px rgba(240, 147, 251, .45);
  --glow-3: 0 10px 30px rgba(79, 172, 254, .45);

  --glass: rgba(255, 255, 255, .82);
  --glass-brd: rgba(255, 255, 255, .65);
  --radius: 14px;
}

/* ---------------------------------------------------------------
   2. 全局动态彩虹背景
   --------------------------------------------------------------- */
html, body, #root {
  background: linear-gradient(125deg,
      #667eea 0%, #764ba2 18%, #f093fb 36%,
      #4facfe 54%, #43e97b 72%, #fa709a 88%, #667eea 100%) !important;
  background-size: 400% 400% !important;
  animation: wbBgShift 22s ease infinite !important;
}

@keyframes wbBgShift {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* 隐藏 ProLayout 自带的阿里云背景图，避免和渐变打架 */
.ant-pro-layout-bg-list { display: none !important; }

/* 内容区透明，让彩虹背景透出来 */
.ant-pro-layout,
.ant-pro-layout-content,
.ant-layout,
.ant-layout-content {
  background: transparent !important;
}

/* ---------------------------------------------------------------
   3. 侧边栏 —— 深紫渐变 + 霓虹菜单
   --------------------------------------------------------------- */
.ant-pro-sider,
.ant-layout-sider,
.ant-pro-sider .ant-layout-sider-children,
.ant-layout-sider .ant-layout-sider-children {
  background: linear-gradient(180deg,
      #1a1440 0%, #2d1b69 35%, #4c1d95 70%, #6d28d9 100%) !important;
  box-shadow: 4px 0 26px rgba(76, 29, 149, .55) !important;
  border-right: none !important;
}

/* Logo 区 */
.ant-pro-sider-logo {
  background: transparent !important;
  border-bottom: 1px solid rgba(255, 255, 255, .12) !important;
}
.ant-pro-sider-logo h1,
.ant-pro-sider-logo a,
.ant-pro-sider-logo > * {
  color: #fff !important;
  text-shadow: 0 0 14px rgba(240, 147, 251, .9) !important;
  font-weight: 700 !important;
}
.ant-pro-sider-logo img {
  filter: drop-shadow(0 0 10px rgba(240, 147, 251, .9)) !important;
}

/* 菜单项 */
.ant-pro-sider .ant-menu {
  background: transparent !important;
  border-inline-end: none !important;
}
.ant-pro-sider .ant-menu-item,
.ant-pro-sider .ant-menu-submenu-title {
  color: rgba(255, 255, 255, .82) !important;
  border-radius: 10px !important;
  margin: 4px 8px !important;
  width: calc(100% - 16px) !important;
  transition: all .22s ease !important;
}
.ant-pro-sider .ant-menu-item:hover,
.ant-pro-sider .ant-menu-submenu-title:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, .12) !important;
  transform: translateX(4px);
}
.ant-pro-sider .ant-menu-item-selected,
.ant-pro-sider .ant-menu-submenu-selected > .ant-menu-submenu-title {
  color: #fff !important;
  background: linear-gradient(90deg, #ec4899 0%, #8b5cf6 55%, #6366f1 100%) !important;
  box-shadow: 0 6px 22px rgba(236, 72, 153, .6) !important;
  font-weight: 600 !important;
}
.ant-pro-sider .ant-menu-item-selected::after {
  display: none !important;
}
.ant-pro-sider .ant-menu-item .anticon,
.ant-pro-sider .ant-menu-submenu-title .anticon {
  font-size: 16px !important;
}

/* ---------------------------------------------------------------
   4. 顶栏 —— 渐变光带
   --------------------------------------------------------------- */
.ant-layout-header,
.ant-pro-global-header,
.ant-pro-layout-header {
  background: linear-gradient(90deg,
      #667eea 0%, #764ba2 30%, #f093fb 60%, #4facfe 100%) !important;
  background-size: 200% 100% !important;
  animation: wbHeaderShift 14s ease infinite !important;
  box-shadow: 0 4px 22px rgba(102, 126, 234, .5) !important;
  border-bottom: none !important;
}
@keyframes wbHeaderShift {
  0%   { background-position: 0% 0; }
  50%  { background-position: 100% 0; }
  100% { background-position: 0% 0; }
}

.ant-pro-global-header *,
.ant-pro-layout-header * {
  color: #fff !important;
}
.ant-pro-global-header .anticon,
.ant-pro-layout-header .anticon {
  color: #fff !important;
}
.ant-pro-global-header .ant-pro-global-header-action:hover,
.ant-pro-layout-header .ant-pro-global-header-action:hover {
  background: rgba(255, 255, 255, .18) !important;
  border-radius: 8px !important;
}

/* ---------------------------------------------------------------
   5. 内容容器 —— 玻璃拟态
   --------------------------------------------------------------- */
.ant-pro-page-container,
.ant-pro-grid-content-children {
  background: transparent !important;
}

/* 页面头部区铺一层半透明深色底：
   面包屑 / 页面标题在主题里是白字，必须保证底色够深才读得清 */
.ant-pro-page-container-warp,
.ant-pro-page-container .ant-page-header {
  background: rgba(26, 20, 64, .34) !important;
  backdrop-filter: blur(10px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(140%) !important;
  border-radius: 14px !important;
}

.ant-pro-page-container .ant-pro-page-container-children-container {
  padding-block-start: 16px !important;
}

/* 面包屑 */
.ant-breadcrumb,
.ant-breadcrumb a,
.ant-breadcrumb-link {
  color: rgba(255, 255, 255, .95) !important;
  text-shadow: 0 1px 6px rgba(0, 0, 0, .25) !important;
}
.ant-pro-page-container .ant-page-header-heading-title,
.ant-pro-page-container .ant-page-header-heading-sub-title {
  color: #fff !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, .3) !important;
}

/* ---------------------------------------------------------------
   6. 卡片 —— 玻璃拟态 + 彩色描边
   --------------------------------------------------------------- */
.ant-pro-card,
.ant-card {
  position: relative !important;
  border-radius: var(--radius) !important;
  background: var(--glass) !important;
  backdrop-filter: blur(14px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(160%) !important;
  border: 1px solid var(--glass-brd) !important;
  box-shadow: 0 8px 28px rgba(31, 38, 135, .18) !important;
  overflow: hidden !important;
  animation: wbFloatUp .45s ease both;
}

.ant-pro-card:hover,
.ant-card:hover {
  box-shadow: 0 14px 40px rgba(31, 38, 135, .3) !important;
}

@keyframes wbFloatUp {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: none; }
}

/* 卡片顶部彩色渐变条 */
.ant-pro-card::before,
.ant-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--neon-1);
  opacity: .9;
}

/* ---- 统计卡片 ----
   先给一个默认渐变兜底（防止 nth-child 结构不匹配时出现「白字白底」），
   再用 nth-child 循环成 7 种颜色。背景与文字色始终绑定在一起。 */
.ant-pro-card:has(.ant-statistic) {
  background: var(--neon-1) !important;
  border: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: var(--glow-1) !important;
  transition: transform .25s ease, box-shadow .25s ease !important;
}

.ant-row > .ant-col:nth-child(7n+1) .ant-pro-card:has(.ant-statistic) { background: var(--neon-1) !important; box-shadow: var(--glow-1) !important; }
.ant-row > .ant-col:nth-child(7n+2) .ant-pro-card:has(.ant-statistic) { background: var(--neon-2) !important; box-shadow: var(--glow-2) !important; }
.ant-row > .ant-col:nth-child(7n+3) .ant-pro-card:has(.ant-statistic) { background: var(--neon-3) !important; box-shadow: var(--glow-3) !important; }
.ant-row > .ant-col:nth-child(7n+4) .ant-pro-card:has(.ant-statistic) { background: var(--neon-4) !important; box-shadow: 0 10px 30px rgba(67, 233, 123, .45) !important; }
.ant-row > .ant-col:nth-child(7n+5) .ant-pro-card:has(.ant-statistic) { background: var(--neon-5) !important; box-shadow: 0 10px 30px rgba(250, 112, 154, .45) !important; }
.ant-row > .ant-col:nth-child(7n+6) .ant-pro-card:has(.ant-statistic) { background: var(--neon-6) !important; box-shadow: 0 10px 30px rgba(161, 140, 209, .45) !important; }
.ant-row > .ant-col:nth-child(7n+7) .ant-pro-card:has(.ant-statistic) { background: var(--neon-7) !important; box-shadow: 0 10px 30px rgba(246, 211, 101, .45) !important; }

.ant-pro-card:has(.ant-statistic):hover {
  transform: translateY(-5px) scale(1.015);
}
.ant-pro-card:has(.ant-statistic)::before { display: none !important; }

/* 统计卡片内的文字全部白色 + 发光 */
.ant-pro-card:has(.ant-statistic) .ant-statistic-title,
.ant-pro-card:has(.ant-statistic) .ant-statistic-content,
.ant-pro-card:has(.ant-statistic) .ant-statistic-content-value,
.ant-pro-card:has(.ant-statistic) .ant-statistic-content-suffix,
.ant-pro-card:has(.ant-statistic) .ant-pro-card-title,
.ant-pro-card:has(.ant-statistic) .ant-pro-card-statistic-description,
.ant-pro-card:has(.ant-statistic) .anticon {
  color: #fff !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .3) !important;
}
.ant-pro-card:has(.ant-statistic) .ant-statistic-content {
  font-weight: 800 !important;
  letter-spacing: .5px !important;
}

/* ---------------------------------------------------------------
   7. 表格 —— 渐变表头 + 彩色斑马纹
   --------------------------------------------------------------- */
.ant-table {
  background: transparent !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
.ant-table-thead > tr > th {
  background: linear-gradient(90deg, #667eea 0%, #764ba2 50%, #8b5cf6 100%) !important;
  color: #fff !important;
  border-bottom: none !important;
  font-weight: 600 !important;
  text-shadow: 0 1px 6px rgba(0, 0, 0, .25) !important;
}
.ant-table-thead > tr > th::before {
  display: none !important;
}
.ant-table-thead > tr > th .ant-table-column-sorter,
.ant-table-thead > tr > th .ant-table-filter-trigger,
.ant-table-thead > tr > th .anticon {
  color: rgba(255, 255, 255, .9) !important;
}
.ant-table-thead > tr > th.ant-table-column-has-sorters:hover {
  background: linear-gradient(90deg, #7c8ff0 0%, #8a5fb8 50%, #9d6ffa 100%) !important;
}

.ant-table-tbody > tr > td {
  border-bottom: 1px solid rgba(102, 126, 234, .14) !important;
  transition: background .18s ease !important;
}
.ant-table-tbody > tr:nth-child(even) > td {
  background: rgba(102, 126, 234, .045) !important;
}
.ant-table-tbody > tr:hover > td {
  background: linear-gradient(90deg,
      rgba(102, 126, 234, .16) 0%,
      rgba(240, 147, 251, .16) 50%,
      rgba(79, 172, 254, .16) 100%) !important;
}
.ant-table-tbody > tr.ant-table-row-selected > td {
  background: linear-gradient(90deg, rgba(236, 72, 153, .18), rgba(139, 92, 246, .18)) !important;
}

/* 空数据 / 加载态 */
.ant-empty-description { color: #6b7280 !important; }

/* 分页 */
.ant-pagination-item {
  border-radius: 9px !important;
  border-color: rgba(102, 126, 234, .35) !important;
}
.ant-pagination-item-active {
  background: var(--neon-1) !important;
  border-color: transparent !important;
  box-shadow: var(--glow-1) !important;
}
.ant-pagination-item-active a { color: #fff !important; }

/* ---------------------------------------------------------------
   8. 按钮 / 标签 / 输入
   --------------------------------------------------------------- */
.ant-btn {
  border-radius: 10px !important;
  font-weight: 600 !important;
  transition: all .22s ease !important;
}
.ant-btn-primary {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
  border: none !important;
  box-shadow: 0 5px 18px rgba(102, 126, 234, .5) !important;
}
.ant-btn-primary:hover {
  background: linear-gradient(135deg, #7c8ff0 0%, #8b5cf6 100%) !important;
  box-shadow: 0 8px 26px rgba(139, 92, 246, .7) !important;
  transform: translateY(-1px);
}
.ant-btn-dangerous {
  background: linear-gradient(135deg, #f5576c 0%, #f093fb 100%) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: 0 5px 18px rgba(245, 87, 108, .5) !important;
}
.ant-btn-link { color: #7c3aed !important; }
.ant-btn-link:hover { color: #ec4899 !important; }

.ant-tag {
  border-radius: 7px !important;
  font-weight: 600 !important;
  border: none !important;
  padding-inline: 9px !important;
}

.ant-input,
.ant-input-affix-wrapper,
.ant-select-selector,
.ant-picker,
.ant-input-number,
.ant-input-search .ant-input {
  border-radius: 10px !important;
  border-color: rgba(102, 126, 234, .3) !important;
}
.ant-input:focus,
.ant-input-affix-wrapper-focused,
.ant-select-focused .ant-select-selector,
.ant-picker-focused {
  border-color: #8b5cf6 !important;
  box-shadow: 0 0 0 3px rgba(139, 92, 246, .18) !important;
}

/* 搜索表单 / 工具条 */
.ant-pro-table-search,
.ant-pro-table-list-toolbar {
  background: var(--glass) !important;
  backdrop-filter: blur(10px) !important;
  border-radius: 12px !important;
  margin-bottom: 12px !important;
}

/* ---------------------------------------------------------------
   9. 弹窗 / 抽屉 / 下拉
   --------------------------------------------------------------- */
.ant-modal-content,
.ant-drawer-content {
  border-radius: 16px !important;
  background: rgba(255, 255, 255, .96) !important;
  backdrop-filter: blur(18px) saturate(160%) !important;
  box-shadow: 0 24px 70px rgba(31, 38, 135, .38) !important;
}
.ant-modal-header {
  background: linear-gradient(90deg, #667eea, #764ba2, #f093fb) !important;
  border-radius: 16px 16px 0 0 !important;
  padding: 14px 22px !important;
  margin: 0 !important;
}
.ant-modal-title {
  color: #fff !important;
  font-weight: 700 !important;
}
.ant-modal-close { color: #fff !important; }
.ant-drawer-header {
  background: linear-gradient(90deg, #667eea, #764ba2) !important;
  border-bottom: none !important;
}
.ant-drawer-title { color: #fff !important; }
.ant-drawer-close { color: #fff !important; }

.ant-dropdown-menu,
.ant-select-dropdown {
  border-radius: 12px !important;
  box-shadow: 0 14px 40px rgba(31, 38, 135, .3) !important;
}
.ant-dropdown-menu-item-selected {
  background: linear-gradient(90deg, rgba(102, 126, 234, .18), rgba(240, 147, 251, .18)) !important;
}

/* ---------------------------------------------------------------
   10. 描述列表（心跳详情弹窗）
   --------------------------------------------------------------- */
.ant-descriptions-bordered .ant-descriptions-view {
  border-radius: 12px !important;
  overflow: hidden !important;
  border-color: rgba(102, 126, 234, .25) !important;
}
.ant-descriptions-bordered .ant-descriptions-item-label {
  background: linear-gradient(90deg, rgba(102, 126, 234, .14), rgba(139, 92, 246, .14)) !important;
  font-weight: 600 !important;
  color: #4c1d95 !important;
}

/* ---------------------------------------------------------------
   11. 登录页
   --------------------------------------------------------------- */
.ant-pro-form-login-container {
  background: transparent !important;
}
.ant-pro-form-login-main {
  background: rgba(255, 255, 255, .9) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border-radius: 22px !important;
  padding: 40px 34px !important;
  box-shadow: 0 26px 80px rgba(31, 38, 135, .45) !important;
  border: 1px solid rgba(255, 255, 255, .7) !important;
}
.ant-pro-form-login-title,
.ant-pro-form-login-desc {
  color: #1f2937 !important;
}
.ant-pro-form-login-logo img {
  filter: drop-shadow(0 6px 18px rgba(139, 92, 246, .6)) !important;
}

/* ---------------------------------------------------------------
   12. 滚动条 / 细节
   --------------------------------------------------------------- */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: rgba(255, 255, 255, .25); border-radius: 10px; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #667eea 0%, #f093fb 100%);
  border-radius: 10px;
  border: 2px solid rgba(255, 255, 255, .3);
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #8b5cf6 0%, #ec4899 100%);
}

/* 头像 */
.ant-avatar {
  box-shadow: 0 0 0 2px rgba(255, 255, 255, .7), 0 4px 14px rgba(139, 92, 246, .5) !important;
}

/* 徽标 */
.ant-badge-count {
  background: linear-gradient(135deg, #f5576c, #f093fb) !important;
  box-shadow: 0 3px 12px rgba(245, 87, 108, .6) !important;
}

/* 卡片标题 */
.ant-pro-card-title,
.ant-card-head-title {
  font-weight: 700 !important;
  color: #312e81 !important;
}

/* 空状态 */
.ant-empty .ant-empty-image { opacity: .55; }

/* ---------------------------------------------------------------
   13. 尊重「减少动效」偏好
   --------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  html, body, #root,
  .ant-layout-header, .ant-pro-global-header, .ant-pro-layout-header,
  .ant-pro-card, .ant-card {
    animation: none !important;
  }
}