/* =====================================================================
 * 崇成云后台 UI 升级 · theme.css
 * ---------------------------------------------------------------------
 * 纯 CSS 换肤：不改动任何业务代码，仅覆盖 vue-element-admin 布局类
 * 与 Element UI 2.x 组件样式。
 * 主题：浅色 / 白底黑字侧栏 / 靛蓝品牌色。
 * 部署：把本文件放到线上 dist/static/css/theme.css，并在 index.html
 *       的 </head> 前加一行 <link rel="stylesheet" href="/static/css/theme.css">
 * ===================================================================*/

:root {
  --brand: #4f6ef7;
  --brand-grad: linear-gradient(135deg, #5b7cfa 0%, #4460f1 100%);
  --page-bg: #eef1f8;
  --card-radius: 14px;
  --soft-shadow: 0 6px 24px rgba(31, 45, 80, .07);
  --soft-shadow-hover: 0 12px 34px rgba(31, 45, 80, .13);
}

/* ---------- 全局底色 & 字体 ---------- */
body,
.app-wrapper,
.main-container {
  background-color: var(--page-bg) !important;
  font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", -apple-system,
    BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
}
.app-main { background: transparent !important; }

/* ---------- 顶栏 navbar ---------- */
.navbar,
.navbar.fixed-header {
  background: #ffffff !important;
  box-shadow: 0 2px 14px rgba(31, 45, 80, .06) !important;
  border-bottom: none !important;
  position: relative !important;
}
.navbar .hamburger-container:hover { background: rgba(79, 110, 247, .08) !important; }
.navbar .navbar-right,
.navbar .navbar-right-menu { display: flex; align-items: center; }
/* 顶栏右侧文字（原设计为白色，白底不可见）→ 深色 */
.navbar .navbar-right,
.navbar .navbar-right span,
.navbar .navbar-right-menu-wrapper,
.navbar .navbar-right .el-dropdown { color: #2b3452 !important; font-weight: 500 !important; }
.navbar .navbar-right .el-badge__content { color: #fff !important; }
.navbar .navbar-right-menu-wrapper {
  align-items: center !important;
  background: #f8fafc !important;
  border: 1px solid #e3e9f4 !important;
  border-radius: 10px !important;
  display: inline-flex !important;
  height: 36px !important;
  margin-right: 8px !important;
  padding: 0 10px !important;
  transition: background .2s, border-color .2s, color .2s !important;
}
.navbar .navbar-right-menu-wrapper:hover {
  background: #f1f4ff !important;
  border-color: #cfdafe !important;
}
.navbar .navbar-right-menu-wrapper:hover,
.navbar .navbar-right-menu-wrapper:hover span { color: var(--brand) !important; }
.navbar .navbar-right-menu-wrapper i,
.navbar .navbar-right-menu-wrapper svg,
.navbar .navbar-right-menu-wrapper .svg-icon {
  color: #1f2a44 !important;
  fill: currentColor !important;
  opacity: .96 !important;
}
.navbar .navbar-right-menu-wrapper img {
  filter: brightness(0) saturate(100%) invert(15%) sepia(16%) saturate(1033%) hue-rotate(183deg) brightness(93%) contrast(91%) !important;
  opacity: .9 !important;
}
.navbar .navbar-right-menu-wrapper:last-child .navbar-right-menu::before {
  color: #1f2a44 !important;
  content: '个人资料';
  font-weight: 600 !important;
  margin-right: 6px !important;
}
/* 顶栏品牌 logo（填充左侧空白） */
.navbar::before {
  content: '崇成云';
  position: absolute; left: 24px; top: 50%; transform: translateY(-50%);
  font-size: 19px; font-weight: 800; letter-spacing: 1px;
  background: var(--brand-grad); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent; pointer-events: none;
}

/* ---------- 侧栏 sidebar（白底黑字） ---------- */
.sidebar-container {
  background: #ffffff !important;
  box-shadow: 1px 0 0 #ebedf3, 2px 0 16px rgba(31, 45, 80, .04) !important;
}
.sidebar-container .el-scrollbar__wrap,
.sidebar-container .el-menu { background: #ffffff !important; border-right: none !important; }

.sidebar-container .el-menu-item,
.sidebar-container .el-submenu__title {
  color: #46506b !important;
  height: 50px !important;
  line-height: 50px !important;
  margin: 5px 12px !important;
  border-radius: 10px !important;
  background-color: transparent !important;
  transition: background .25s, color .25s, transform .25s !important;
}
/* 菜单图标为 svg，fill 跟随文字色 */
.sidebar-container .el-menu-item i,
.sidebar-container .el-submenu__title i,
.sidebar-container .el-menu-item svg,
.sidebar-container .el-submenu__title svg { color: inherit !important; fill: currentColor !important; }

.sidebar-container .el-menu-item:hover,
.sidebar-container .el-submenu__title:hover { background: #f1f4ff !important; color: var(--brand) !important; transform: translateX(4px); }

/* 展开的子菜单 */
.sidebar-container .el-submenu .el-menu { background: #f8fafd !important; border-radius: 10px; margin: 0 8px; }
.sidebar-container .el-submenu .el-menu-item { margin: 3px 8px !important; height: 44px !important; line-height: 44px !important; background-color: transparent !important; }
.sidebar-container .el-submenu .el-menu-item:hover { background: #eef2ff !important; color: var(--brand) !important; }

/* 选中态：品牌色浅底 + 品牌字 + 左侧高亮条 */
.sidebar-container .el-menu-item.is-active,
.sidebar-container .el-submenu.is-active > .el-submenu__title {
  background: linear-gradient(90deg, rgba(79,110,247,.15), rgba(79,110,247,.04)) !important;
  color: var(--brand) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  position: relative;
}
.sidebar-container .el-menu-item.is-active::before {
  content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 3px; height: 22px; border-radius: 0 3px 3px 0; background: var(--brand);
}
/* 折叠时 hover 弹出的子菜单 */
.el-menu--vertical .el-menu-item.is-active { background: rgba(79,110,247,.12) !important; color: var(--brand) !important; }

/* ---------- 卡片 el-card ---------- */
.el-card {
  border: none !important;
  border-radius: var(--card-radius) !important;
  box-shadow: var(--soft-shadow) !important;
  transition: transform .28s ease, box-shadow .28s ease !important;
}
.el-card:hover { transform: translateY(-3px); box-shadow: var(--soft-shadow-hover) !important; }
.el-card__header { border-bottom: 1px solid #f0f2f7 !important; font-weight: 600; }
/* 概况统计卡片（图标是内嵌图片，仅优化容器质感） */
.overview-item { border-radius: 12px !important; transition: transform .28s ease, box-shadow .28s ease !important; }
.overview-item:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(31, 45, 80, .12) !important; }

/* ---------- 按钮 ---------- */
.el-button { border-radius: 8px !important; font-weight: 500; }
.el-button--primary {
  background: var(--brand-grad) !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(79, 110, 247, .32) !important;
}
.el-button--primary:hover { filter: brightness(1.06); box-shadow: 0 6px 18px rgba(79, 110, 247, .42) !important; }
.el-button--text { color: var(--brand) !important; }
.el-button:hover { transform: translateY(-1px); }

/* ---------- 表格 ---------- */
.el-table th.el-table__cell,
.el-table th { background: #f5f7fd !important; color: #4a5578 !important; font-weight: 600 !important; }
.el-table--striped .el-table__body tr.el-table__row--striped td { background: #fafbff !important; }
.el-table__body tr:hover > td { background: #eef2ff !important; }

/* ---------- Tabs / 分页 / 表单 / 开关 ---------- */
.el-tabs__item.is-active { color: var(--brand) !important; }
.el-tabs__active-bar { background-color: var(--brand) !important; }
.el-pagination.is-background .el-pager li:not(.disabled).active { background-color: var(--brand) !important; }
.el-input__inner:focus,
.el-textarea__inner:focus { border-color: var(--brand) !important; }
.el-radio__input.is-checked .el-radio__inner,
.el-checkbox__input.is-checked .el-checkbox__inner { background-color: var(--brand) !important; border-color: var(--brand) !important; }
.el-switch.is-checked .el-switch__core { background-color: var(--brand) !important; border-color: var(--brand) !important; }
.el-link.el-link--primary { color: var(--brand) !important; }

/* ---------- 页签栏 tags-view ---------- */
.tags-view-container {
  background: #ffffff !important;
  border-bottom: 1px solid #e6ecf5 !important;
  box-shadow: 0 2px 12px rgba(31,45,80,.04) !important;
}
.tags-view-container .tags-view-item {
  background: #f8fafc !important;
  border-color: #e0e7f2 !important;
  border-radius: 6px !important;
  color: #475569 !important;
  font-weight: 600 !important;
}
.tags-view-container .tags-view-item.active {
  background: #ffffff !important;
  border-color: #b9c8ff !important;
  box-shadow: inset 0 -2px 0 var(--brand) !important;
  color: var(--brand) !important;
}

/* ---------- 滚动条 ---------- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: rgba(79, 110, 247, .28); border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: rgba(79, 110, 247, .45); }
::-webkit-scrollbar-track { background: transparent; }

/* ---------- 丝滑动效 ---------- */
.el-menu-item, .el-submenu__title, .el-card, .el-button, .overview-item,
.el-table__body tr td, .tags-view-item, .el-tabs__item, .el-input__inner {
  transition: background-color .28s ease, color .28s ease, transform .28s cubic-bezier(.4,0,.2,1), box-shadow .28s ease, border-color .28s ease !important;
}
.app-main { animation: cc-fade-up .45s cubic-bezier(.4,0,.2,1); }
@keyframes cc-fade-up { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.overview-wrapper .overview-item { animation: cc-fade-up .5s both; }
.overview-wrapper .overview-item:nth-child(1){animation-delay:.04s}
.overview-wrapper .overview-item:nth-child(2){animation-delay:.10s}
.overview-wrapper .overview-item:nth-child(3){animation-delay:.16s}
.overview-wrapper .overview-item:nth-child(4){animation-delay:.22s}
.overview-wrapper .overview-item:nth-child(5){animation-delay:.28s}
.overview-wrapper .overview-item:nth-child(6){animation-delay:.34s}
.overview-wrapper .overview-item:nth-child(7){animation-delay:.40s}

/* ---------- 顶部加载进度条 nprogress ---------- */
#nprogress .bar { background: var(--brand-grad) !important; height: 3px !important; }
#nprogress .peg { box-shadow: 0 0 12px #4f6ef7, 0 0 6px #4f6ef7 !important; }
#nprogress .spinner-icon { border-top-color: #4f6ef7 !important; border-left-color: #4f6ef7 !important; }

/* ---------- 设备监测 · 数据点卡片 ---------- */
.card-view-item { padding: 7px !important; }
.card-view-item__content {
  background: #ffffff !important;
  border: 1px solid #edeff5 !important;
  border-radius: 12px !important;
  padding: 18px 14px 14px !important;
  box-shadow: 0 2px 10px rgba(31, 45, 80, .05) !important;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
  position: relative !important;
  overflow: hidden !important;
}
.card-view-item__content:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 12px 28px rgba(31, 45, 80, .13) !important;
  border-color: #dbe3ff !important;
}
.card-view-item__content::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, #5b7cfa, #6b8cff); opacity: .9;
}
.card-view-item__content .value { font-size: 23px !important; font-weight: 700 !important; letter-spacing: .3px; line-height: 1.25 !important; }
.card-view-item__content .title { color: #8b93a9 !important; font-size: 13px !important; margin-top: 2px !important; }
.card-view-item__content .ds-icon { opacity: .8; }
.card-view-item__content > div:last-child { color: #aab0c0 !important; font-size: 12px !important; margin-top: 5px !important; }

/* ---------- 在线监测 · 列表监测深度 UI ---------- */
.app-container > .el-card > .el-card__body > .action-bar {
  align-items: center !important;
  background: #f8fafc !important;
  border: 1px solid #e5ebf6 !important;
  border-radius: 10px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75) !important;
  margin: 0 0 14px !important;
  padding: 12px 14px !important;
}

.app-container > .el-card > .el-card__body > .action-bar .action-bar__filter {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-wrap: wrap !important;
  gap: 10px 12px !important;
  margin: 0 !important;
}

.app-container > .el-card > .el-card__body > .action-bar .el-form-item {
  align-items: center !important;
  display: flex !important;
  margin: 0 !important;
}

.app-container > .el-card > .el-card__body > .action-bar .el-form-item__label {
  color: #526079 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 32px !important;
  padding-right: 8px !important;
}

.app-container > .el-card > .el-card__body > .action-bar .el-input__inner,
.app-container > .el-card > .el-card__body > .action-bar .el-select .el-input__inner {
  background: #ffffff !important;
  border-color: #d9e1ee !important;
  border-radius: 8px !important;
  color: #26324c !important;
  height: 34px !important;
  line-height: 34px !important;
}

.app-container > .el-card > .el-card__body > .action-bar .el-button {
  height: 34px !important;
  padding: 8px 14px !important;
}

.list-dp-card.dp-card {
  background: #ffffff !important;
  border: 1px solid #e3e9f4 !important;
  border-radius: 10px !important;
  box-shadow: 0 6px 18px rgba(31,45,80,.06) !important;
  margin: 0 0 12px !important;
  overflow: hidden !important;
  transform: none !important;
}

.list-dp-card.dp-card:hover {
  border-color: #cfdafe !important;
  box-shadow: 0 14px 30px rgba(31,45,80,.11) !important;
}

.list-dp-card.dp-card > .el-card__header {
  background: linear-gradient(90deg, #ffffff 0%, #f6f8ff 100%) !important;
  border-bottom: 1px solid #e7edf7 !important;
  color: #26324c !important;
  padding: 12px 16px !important;
}

.list-dp-card .header {
  align-items: center !important;
  display: grid !important;
  gap: 10px 16px !important;
  grid-template-columns: minmax(180px, 1.05fr) minmax(220px, .95fr) minmax(240px, 1.2fr) !important;
  width: 100% !important;
}

.list-dp-card .header > .nowrap {
  color: #536079 !important;
  font-size: 13px !important;
  line-height: 28px !important;
  min-width: 0 !important;
}

.list-dp-card .header > .nowrap:not(.dev-title) {
  background: #f2f5fb !important;
  border: 1px solid #e7edf7 !important;
  border-radius: 999px !important;
  padding: 0 11px !important;
}

.list-dp-card .dev-title {
  align-items: center !important;
  color: #1f2a44 !important;
  display: inline-flex !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  gap: 8px !important;
  line-height: 28px !important;
}

.list-dp-card .dev-title img {
  background: #edf4ff !important;
  border: 1px solid #dce8ff !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  height: 24px !important;
  padding: 4px !important;
  width: 24px !important;
}

.list-dp-card.dp-card > .el-card__body {
  background: #fbfcff !important;
  padding: 14px 16px 16px !important;
}

.list-dp-card .data-wrapper {
  background: transparent !important;
  border: 0 !important;
  box-sizing: border-box !important;
  padding: 0 !important;
  width: 100% !important;
}

.list-dp-card .data-wrapper > div {
  box-sizing: border-box !important;
  width: 100% !important;
}

.list-dp-card .card-view-wrapper {
  display: grid !important;
  gap: 12px !important;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
  max-height: none !important;
  overflow: visible !important;
}

.list-dp-card .card-view-item {
  min-width: 0 !important;
  padding: 0 !important;
  width: auto !important;
}

.list-dp-card .card-view-item__content {
  background: #ffffff !important;
  border: 1px solid #e6ecf5 !important;
  border-radius: 10px !important;
  box-shadow: 0 5px 14px rgba(31,45,80,.07) !important;
  min-height: 76px !important;
  padding: 14px 8px 11px !important;
}

.list-dp-card .card-view-item__content::before {
  background: linear-gradient(90deg, #14b8a6, #4f6ef7) !important;
  height: 3px !important;
}

.list-dp-card .card-view-item__content:hover {
  border-color: #b9c8ff !important;
  box-shadow: 0 12px 24px rgba(31,45,80,.12) !important;
  transform: translateY(-2px) !important;
}

.list-dp-card .card-view-item__content > .success,
.list-dp-card .card-view-item__content span.success {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
}

.list-dp-card .card-view-item__content .value {
  color: #17a34a !important;
  display: block !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  line-height: 1.15 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  width: 100% !important;
}

.list-dp-card .card-view-item__content .unit {
  color: #3b82f6 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  margin-left: 2px !important;
  vertical-align: baseline !important;
}

.list-dp-card .card-view-item__content .title {
  align-items: center !important;
  color: #647084 !important;
  display: flex !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  gap: 4px !important;
  justify-content: center !important;
  margin-top: 7px !important;
  min-width: 0 !important;
}

.list-dp-card .card-view-item__content .ds-icon,
.list-dp-card .card-view-item__content .ds-icon img {
  height: 13px !important;
  opacity: .7 !important;
  width: 13px !important;
}

.list-dp-card .card-view-item__content span[style*="96, 98, 102"] {
  color: #98a2b3 !important;
  font-weight: 700 !important;
}

.list-dp-card .sdev-card {
  background: #ffffff !important;
  border: 1px solid #e1e8f3 !important;
  border-radius: 10px !important;
  display: grid !important;
  grid-template-columns: 106px minmax(0, 1fr) !important;
  overflow: hidden !important;
}

.list-dp-card .sdev-card__title {
  align-items: center !important;
  background: linear-gradient(180deg, #eef7ff 0%, #f8fbff 100%) !important;
  border-right: 1px solid #e1e8f3 !important;
  color: #34405c !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-height: 116px !important;
  padding: 12px 10px !important;
}

.list-dp-card .sdev-card__title_sub {
  background: transparent !important;
  color: #536079 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  width: auto !important;
}

.list-dp-card .sdev-card__title_main {
  align-items: center !important;
  background: #ffffff !important;
  border: 1px solid #dce8ff !important;
  border-radius: 999px !important;
  box-shadow: 0 4px 12px rgba(79,110,247,.12) !important;
  color: var(--brand) !important;
  display: flex !important;
  height: 38px !important;
  justify-content: center !important;
  width: 38px !important;
}

.list-dp-card .sdev-card__title_text {
  font-size: 16px !important;
  font-weight: 800 !important;
}

.list-dp-card .sdev-card__content {
  min-width: 0 !important;
  padding: 12px !important;
}

.app-container > .el-card > .el-card__body > .pagination,
.app-container > .el-card .pagination {
  background: #ffffff !important;
  border: 1px solid #e5ebf6 !important;
  border-radius: 10px !important;
  margin-top: 14px !important;
  padding: 10px 12px !important;
}

.empty-text {
  background: #ffffff !important;
  border: 1px dashed #cfd8e8 !important;
  border-radius: 10px !important;
  color: #7a859a !important;
  height: auto !important;
  margin: 22px 0 !important;
  padding: 30px 16px !important;
}

@media (max-width: 1180px) {
  .list-dp-card .header {
    grid-template-columns: 1fr !important;
  }
  .list-dp-card .header > .nowrap:not(.dev-title) {
    border-radius: 8px !important;
  }
}

@media (max-width: 760px) {
  .app-container > .el-card > .el-card__body > .action-bar .action-bar__filter,
  .app-container > .el-card > .el-card__body > .action-bar .el-form-item__content,
  .app-container > .el-card > .el-card__body > .action-bar .el-input,
  .app-container > .el-card > .el-card__body > .action-bar .el-select {
    width: 100% !important;
  }
  .app-container > .el-card > .el-card__body > .action-bar .el-form-item {
    display: block !important;
    width: 100% !important;
  }
  .app-container > .el-card > .el-card__body > .action-bar .el-form-item__label {
    display: block !important;
    line-height: 20px !important;
    padding: 0 0 6px !important;
    text-align: left !important;
    width: 100% !important;
  }
  .list-dp-card.dp-card > .el-card__header {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 10px 12px !important;
  }
  .list-dp-card.dp-card > .el-card__header .clearfix,
  .list-dp-card .header {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  .list-dp-card .header {
    gap: 8px !important;
  }
  .list-dp-card .header > .nowrap,
  .list-dp-card .dev-title {
    box-sizing: border-box !important;
    display: flex !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    width: 100% !important;
  }
  .list-dp-card .header > .nowrap:not(.dev-title) {
    margin-top: 0 !important;
    line-height: 20px !important;
    padding: 7px 10px !important;
  }
  .list-dp-card .sdev-card {
    grid-template-columns: 1fr !important;
  }
  .list-dp-card .sdev-card__title {
    border-bottom: 1px solid #e1e8f3 !important;
    border-right: 0 !important;
    flex-direction: row !important;
    gap: 10px !important;
    justify-content: flex-start !important;
    min-height: 0 !important;
  }
  .list-dp-card .card-view-wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ---------- 在线监测 · 设备监测深度 UI ---------- */
.hideSidebar .sidebar-container {
  width: 64px !important;
}

.hideSidebar .main-container {
  margin-left: 64px !important;
}

.hideSidebar .sidebar-container .el-scrollbar__wrap,
.hideSidebar .sidebar-container .el-menu {
  width: 64px !important;
}

.hideSidebar .sidebar-container .el-menu-item,
.hideSidebar .sidebar-container .el-submenu__title {
  align-items: center !important;
  display: flex !important;
  height: 44px !important;
  justify-content: center !important;
  line-height: 44px !important;
  margin: 6px 10px !important;
  padding: 0 !important;
  width: 44px !important;
}

.hideSidebar .sidebar-container .el-menu-item span,
.hideSidebar .sidebar-container .el-submenu__title span,
.hideSidebar .sidebar-container .el-submenu__icon-arrow {
  display: none !important;
}

.hideSidebar .sidebar-container .svg-icon,
.hideSidebar .sidebar-container i {
  font-size: 20px !important;
  margin: 0 !important;
}

.hideSidebar .sidebar-trigger {
  background: #ffffff !important;
  border: 1px solid #dbe5f6 !important;
  border-left: 0 !important;
  border-radius: 0 12px 12px 0 !important;
  box-shadow: 0 8px 22px rgba(31,45,80,.14) !important;
  color: var(--brand) !important;
  left: 10px !important;
  width: 26px !important;
}

.hideSidebar .sidebar-trigger i {
  color: var(--brand) !important;
  font-weight: 700 !important;
}

.app-container > .bd-row {
  align-items: flex-start !important;
  background: #ffffff !important;
  border: 1px solid #e6ecf5 !important;
  border-radius: 10px !important;
  display: flex !important;
  gap: 12px !important;
  padding: 10px !important;
}

.app-container > .bd-row > .bd-col.bd-col-6 {
  flex: 0 0 300px !important;
  max-width: 300px !important;
  min-width: 280px !important;
}

.app-container > .bd-row > .bd-col.flex-1 {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

.app-container > .bd-row .el-card {
  border: 1px solid #e6ecf5 !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 24px rgba(31,45,80,.06) !important;
  transform: none !important;
}

.app-container > .bd-row .el-card:hover {
  box-shadow: 0 12px 28px rgba(31,45,80,.1) !important;
  transform: none !important;
}

.app-container > .bd-row > .bd-col-6 > .el-card > .el-card__header {
  background: #ffffff !important;
  border-bottom: 1px solid #eef2f8 !important;
  padding: 14px 14px 12px !important;
}

.app-container > .bd-row > .bd-col-6 > .el-card > .el-card__header .mb10 {
  color: #1f2a44 !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  margin-bottom: 10px !important;
}

.app-container > .bd-row > .bd-col-6 .input-selector,
.app-container > .bd-row > .bd-col-6 .search-input .el-input__inner {
  border-color: #d9e1ee !important;
  border-radius: 8px !important;
  height: 32px !important;
  line-height: 32px !important;
}

.app-container > .bd-row > .bd-col-6 .input-button {
  display: flex !important;
  gap: 8px !important;
  width: 100% !important;
}

.app-container > .bd-row > .bd-col-6 .search-wrapper {
  display: flex !important;
  gap: 8px !important;
  width: 100% !important;
}

.app-container > .bd-row > .bd-col-6 .search-input {
  flex: 1 1 auto !important;
}

.app-container > .bd-row > .bd-col-6 .search-btn {
  flex: 0 0 auto !important;
  height: 32px !important;
  padding: 7px 12px !important;
}

.app-container > .bd-row > .bd-col-6 .el-radio-group {
  background: #f7f9fd !important;
  border: 1px solid #e6ecf5 !important;
  border-radius: 999px !important;
  display: flex !important;
  gap: 4px !important;
  padding: 4px !important;
}

.app-container > .bd-row > .bd-col-6 .el-radio {
  border-radius: 999px !important;
  color: #5b667c !important;
  line-height: 24px !important;
  margin: 0 !important;
  padding: 0 8px !important;
}

.app-container > .bd-row > .bd-col-6 .el-radio__input {
  display: none !important;
}

.app-container > .bd-row > .bd-col-6 .el-radio.is-checked {
  background: #ffffff !important;
  box-shadow: 0 3px 10px rgba(31,45,80,.08) !important;
  color: var(--brand) !important;
}

.app-container > .bd-row > .bd-col-6 .el-card__body {
  padding: 10px 14px 12px !important;
}

.app-container > .bd-row > .bd-col-6 .el-table {
  background: transparent !important;
}

.app-container > .bd-row > .bd-col-6 .el-table::before {
  display: none !important;
}

.app-container > .bd-row > .bd-col-6 .el-table__body {
  border-collapse: separate !important;
  border-spacing: 0 6px !important;
}

.app-container > .bd-row > .bd-col-6 .el-table__body tr > td {
  background: #f9fbff !important;
  border-bottom: 0 !important;
  padding: 7px 0 !important;
}

.app-container > .bd-row > .bd-col-6 .el-table__body tr > td:first-child {
  border-radius: 10px 0 0 10px !important;
}

.app-container > .bd-row > .bd-col-6 .el-table__body tr > td:last-child {
  border-radius: 0 10px 10px 0 !important;
}

.app-container > .bd-row > .bd-col-6 .el-table__body tr.current-row > td,
.app-container > .bd-row > .bd-col-6 .el-table__body tr:hover > td {
  background: #eef4ff !important;
}

.app-container > .bd-row > .bd-col-6 .el-table .cell {
  line-height: 18px !important;
}

.app-container > .bd-row > .bd-col-6 .el-table .nowrap:first-child {
  color: #23304a !important;
  font-weight: 700 !important;
}

.app-container > .bd-row > .bd-col-6 .el-table .nowrap + .nowrap {
  color: #8390a6 !important;
  font-size: 12px !important;
  margin-top: 2px !important;
}

.app-container > .bd-row > .bd-col-6 .pagination {
  align-items: center !important;
  display: flex !important;
  gap: 4px !important;
  margin-top: 8px !important;
}

.app-container > .bd-row > .bd-col-6 .pagination .total {
  color: #34405c !important;
  font-weight: 600 !important;
  margin-right: auto !important;
}

.app-container > .bd-row > .bd-col-6 .pagination button,
.app-container > .bd-row > .bd-col-6 .pagination .btn-prev,
.app-container > .bd-row > .bd-col-6 .pagination .btn-next {
  background: #f3f6fb !important;
  border: 1px solid #e2e8f3 !important;
  border-radius: 7px !important;
  color: #67748a !important;
  height: 24px !important;
  min-width: 24px !important;
}

.app-container > .bd-row > .bd-col.flex-1 > .el-card > .el-card__body {
  padding: 0 !important;
}

.app-container > .bd-row > .bd-col.flex-1 > .el-card .el-tabs__header {
  background: #ffffff !important;
  border: 1px solid #e6ecf5 !important;
  border-bottom-color: #dce4f2 !important;
  border-radius: 10px 10px 0 0 !important;
  box-shadow: 0 4px 16px rgba(31,45,80,.05) !important;
  margin: 0 !important;
  padding: 9px 12px !important;
}

.app-container > .bd-row > .bd-col.flex-1 > .el-card .el-tabs__nav-wrap::after,
.app-container > .bd-row > .bd-col.flex-1 > .el-card .el-tabs__active-bar {
  display: none !important;
}

.app-container > .bd-row > .bd-col.flex-1 > .el-card .el-tabs__nav {
  display: flex !important;
  gap: 6px !important;
  white-space: nowrap !important;
}

.app-container > .bd-row > .bd-col.flex-1 > .el-card .el-tabs__item {
  align-items: center !important;
  background: #ffffff !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  color: #26324c !important;
  display: inline-flex !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  height: 34px !important;
  line-height: 34px !important;
  padding: 0 11px !important;
}

.app-container > .bd-row > .bd-col.flex-1 > .el-card .el-tabs__item:hover {
  background: #f5f8ff !important;
  border-color: #dbe5ff !important;
  color: var(--brand) !important;
}

.app-container > .bd-row > .bd-col.flex-1 > .el-card .el-tabs__item span {
  align-items: center !important;
  display: inline-flex !important;
  gap: 5px !important;
}

.app-container > .bd-row > .bd-col.flex-1 > .el-card .el-tabs__item .svg-icon {
  height: 14px !important;
  width: 14px !important;
}

.app-container > .bd-row > .bd-col.flex-1 > .el-card .el-tabs__item.is-active {
  background: #ffffff !important;
  border-color: #b9c8ff !important;
  box-shadow: inset 0 -2px 0 var(--brand), 0 4px 12px rgba(79,110,247,.12) !important;
  color: var(--brand) !important;
}

.app-container > .bd-row > .bd-col.flex-1 > .el-card .el-tabs__content {
  padding: 12px !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-tab-pane .bd-row.mb10 {
  gap: 12px !important;
  margin-bottom: 12px !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-tab-pane .el-card__header {
  background: #ffffff !important;
  border-bottom: 1px solid #edf1f7 !important;
  color: #1f2a44 !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  padding: 12px 14px !important;
}

.app-container > .bd-row > .bd-col.flex-1 .info-card-body {
  height: 170px !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding-right: 0 !important;
}

.app-container > .bd-row > .bd-col.flex-1 .info-card-body .el-form-item {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  margin-bottom: 10px !important;
  padding: 0 !important;
}

.app-container > .bd-row > .bd-col.flex-1 .info-card-body .el-form-item__label {
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  width: 72px !important;
}

.app-container > .bd-row > .bd-col.flex-1 .info-card-body .el-form-item__content {
  color: inherit !important;
  font-weight: inherit !important;
  line-height: 1 !important;
}

.app-container > .bd-row > .bd-col.flex-1 .map-container {
  border-radius: 8px !important;
  overflow: hidden !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height {
  background: transparent !important;
  border-radius: 10px !important;
  overflow: visible !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height::before {
  display: none !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-table__body-wrapper {
  background: transparent !important;
  max-height: none !important;
  overflow: visible !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-table__body {
  border-collapse: separate !important;
  border-spacing: 0 8px !important;
  width: 100% !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-table__body tr {
  box-shadow: 0 5px 16px rgba(31,45,80,.06) !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-table__body tr > td {
  background: #ffffff !important;
  border-bottom: 0 !important;
  padding: 10px 0 !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-table__body tr > td:first-child {
  border-radius: 10px 0 0 10px !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-table__body tr > td:last-child {
  border-radius: 0 10px 10px 0 !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-table__body tr:hover > td {
  background: #f5f8ff !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-image {
  background: #eef6ff !important;
  border: 1px solid #dce8ff !important;
  border-radius: 50% !important;
  padding: 4px !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .table-label {
  color: #8a95a8 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  margin-bottom: 4px !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .title-3 {
  color: #1f2a44 !important;
  font-size: 15px !important;
  font-weight: 800 !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .value {
  color: #16a34a !important;
  font-size: 21px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .unit {
  color: #3b82f6 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .time {
  color: #16a34a !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

.app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-button--text {
  background: #eef4ff !important;
  border-radius: 999px !important;
  color: var(--brand) !important;
  font-weight: 700 !important;
  padding: 6px 10px !important;
}

@media (max-width: 1180px) {
  .app-container > .bd-row {
    flex-direction: column !important;
  }
  .app-container > .bd-row > .bd-col.bd-col-6,
  .app-container > .bd-row > .bd-col.flex-1 {
    flex: 1 1 auto !important;
    max-width: none !important;
    width: 100% !important;
  }
}

@media (max-width: 760px) {
  .app-container > .bd-row > .bd-col.flex-1 .el-tab-pane .bd-row.mb10 {
    flex-direction: column !important;
  }
  .app-container > .bd-row > .bd-col.flex-1 .el-tab-pane .bd-col,
  .app-container > .bd-row > .bd-col.flex-1 .el-tab-pane .bd-col.flex-1 {
    flex: 1 1 auto !important;
    max-width: none !important;
    width: 100% !important;
  }
  .app-container > .bd-row > .bd-col.flex-1 .info-card-body {
    height: 170px !important;
    max-height: none !important;
  }
  .app-container > .bd-row > .bd-col.flex-1 .map-container {
    height: 220px !important;
  }
  .app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height {
    overflow: visible !important;
  }
  .app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height colgroup {
    display: none !important;
  }
  .app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height table,
  .app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height tbody,
  .app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height tr,
  .app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height td {
    display: block !important;
    width: 100% !important;
  }
  .app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-table__body {
    border-spacing: 0 !important;
  }
  .app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-table__body tr {
    background: #ffffff !important;
    border: 1px solid #e6ecf5 !important;
    border-radius: 10px !important;
    box-shadow: 0 5px 16px rgba(31,45,80,.08) !important;
    margin-bottom: 10px !important;
    padding: 10px 12px !important;
  }
  .app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .el-table__body tr > td {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 5px 0 !important;
  }
  .app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .cell {
    align-items: center !important;
    display: flex !important;
    justify-content: space-between !important;
    min-width: 0 !important;
  }
  .app-container > .bd-row > .bd-col.flex-1 .el-table--fluid-height .table-label {
    margin: 0 12px 0 0 !important;
  }
}

/* ---------- 稳定性修正：关闭会导致老页面反复重绘闪烁的动效 ---------- */
.app-main,
.overview-wrapper .overview-item {
  animation: none !important;
}

.el-card,
.el-card:hover,
.overview-item,
.overview-item:hover,
.card-view-item__content,
.card-view-item__content:hover,
.list-dp-card.dp-card,
.list-dp-card.dp-card:hover,
.list-dp-card .card-view-item__content,
.list-dp-card .card-view-item__content:hover,
.app-container > .bd-row .el-card,
.app-container > .bd-row .el-card:hover {
  transform: none !important;
}

.el-button,
.el-button:hover {
  transform: none !important;
}

.el-menu-item,
.el-submenu__title,
.el-card,
.el-button,
.overview-item,
.card-view-item__content,
.list-dp-card.dp-card,
.tags-view-item,
.el-tabs__item,
.el-input__inner {
  transition: background-color .16s ease, color .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

.el-table__body tr,
.el-table__body tr > td,
.el-table__body tr:hover > td {
  transition: background-color .12s ease, color .12s ease !important;
}

/* ---------- 品牌与折叠菜单修正 ---------- */
.navbar .title {
  opacity: 0 !important;
  pointer-events: none !important;
}

.navbar::before {
  z-index: 2 !important;
}

.sidebar-container {
  padding-bottom: 46px !important;
}

.sidebar-container::after {
  background: #ffffff !important;
  border-top: 1px solid #eef2f7 !important;
  bottom: 0 !important;
  box-sizing: border-box !important;
  color: #8a94a8 !important;
  content: 'V1.0.1' !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  height: 42px !important;
  left: 0 !important;
  letter-spacing: .2px !important;
  line-height: 42px !important;
  position: fixed !important;
  text-align: center !important;
  width: 210px !important;
  z-index: 1002 !important;
}

.hideSidebar .main-container,
.hideSidebar .app-main,
.hideSidebar .app-container {
  background: #ffffff !important;
}

.hideSidebar .sidebar-container,
.hideSidebar .sidebar-container .el-menu {
  width: 54px !important;
}

.hideSidebar .sidebar-container::after {
  font-size: 10px !important;
  width: 54px !important;
}

.hideSidebar .sidebar-container .el-menu-item,
.hideSidebar .sidebar-container .el-submenu__title {
  align-items: center !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
  display: flex !important;
  height: 42px !important;
  justify-content: center !important;
  line-height: 42px !important;
  margin: 6px !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 42px !important;
}

.hideSidebar .sidebar-container .el-menu-item span,
.hideSidebar .sidebar-container .el-submenu__title span,
.hideSidebar .sidebar-container .el-submenu__icon-arrow {
  display: none !important;
}

.hideSidebar .sidebar-container .el-menu-item i,
.hideSidebar .sidebar-container .el-submenu__title i,
.hideSidebar .sidebar-container .el-menu-item svg,
.hideSidebar .sidebar-container .el-submenu__title svg,
.hideSidebar .sidebar-container .svg-icon {
  color: inherit !important;
  display: block !important;
  flex: 0 0 auto !important;
  font-size: 19px !important;
  height: 20px !important;
  margin: 0 !important;
  max-height: 20px !important;
  max-width: 20px !important;
  min-height: 20px !important;
  min-width: 20px !important;
  overflow: visible !important;
  width: 20px !important;
}

.hideSidebar .sidebar-container .el-menu-item:hover,
.hideSidebar .sidebar-container .el-submenu__title:hover {
  background: #eef2ff !important;
  color: var(--brand) !important;
  transform: none !important;
}

.el-menu--vertical,
.el-menu--vertical .el-menu {
  background: #ffffff !important;
  border-radius: 10px !important;
  box-shadow: 0 10px 30px rgba(31,45,80,.14) !important;
}

.el-menu--vertical .el-menu-item,
.el-menu--vertical .el-submenu__title {
  background: transparent !important;
  color: #46506b !important;
}

.el-menu--vertical .el-menu-item:hover,
.el-menu--vertical .el-submenu__title:hover,
.el-menu--vertical .el-menu-item.is-active {
  background: #eef2ff !important;
  color: var(--brand) !important;
}

body .app-wrapper.hideSidebar .sidebar-container {
  min-width: 56px !important;
  width: 56px !important;
}

body .app-wrapper.hideSidebar .main-container {
  margin-left: 56px !important;
}

body .app-wrapper.hideSidebar .sidebar-container .el-menu,
body .app-wrapper.hideSidebar .sidebar-container .menu-wrapper {
  min-width: 56px !important;
  width: 56px !important;
}

body .app-wrapper.hideSidebar .sidebar-container::after {
  width: 56px !important;
}

body .app-wrapper.hideSidebar .sidebar-container .el-menu-item,
body .app-wrapper.hideSidebar .sidebar-container .el-submenu__title {
  margin: 6px 7px !important;
  padding: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 42px !important;
}

body .app-wrapper.hideSidebar .sidebar-container li.el-menu-item.submenu-title-noDropdown,
body .app-wrapper.hideSidebar .sidebar-container li.el-menu-item.submenu-title-noDropdown[style] {
  padding: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body .app-wrapper.hideSidebar .sidebar-container li.el-menu-item.submenu-title-noDropdown > .el-tooltip,
body .app-wrapper.hideSidebar .sidebar-container li.el-menu-item.submenu-title-noDropdown > .el-tooltip[style] {
  align-items: center !important;
  box-sizing: border-box !important;
  display: flex !important;
  height: 42px !important;
  justify-content: center !important;
  left: 0 !important;
  padding: 0 !important;
  top: 0 !important;
  width: 42px !important;
}

body .app-wrapper.hideSidebar .sidebar-container .el-menu-item span,
body .app-wrapper.hideSidebar .sidebar-container .el-submenu__title span,
body .app-wrapper.hideSidebar .sidebar-container .el-submenu__icon-arrow {
  display: none !important;
}

body .app-wrapper.hideSidebar .sidebar-container .el-menu-item i,
body .app-wrapper.hideSidebar .sidebar-container .el-submenu__title i,
body .app-wrapper.hideSidebar .sidebar-container .el-menu-item svg,
body .app-wrapper.hideSidebar .sidebar-container .el-submenu__title svg,
body .app-wrapper.hideSidebar .sidebar-container .svg-icon {
  height: 20px !important;
  margin: 0 !important;
  max-height: 20px !important;
  max-width: 20px !important;
  min-height: 20px !important;
  min-width: 20px !important;
  overflow: visible !important;
  width: 20px !important;
}

body .el-menu--vertical,
body .el-menu--vertical .el-menu {
  background: #ffffff !important;
  color: #46506b !important;
}

body .el-menu--vertical .el-menu-item:hover,
body .el-menu--vertical .el-submenu__title:hover {
  background: #eef2ff !important;
  color: var(--brand) !important;
}

html body #app .app-wrapper.hideSidebar .sidebar-container .el-menu li.el-menu-item.submenu-title-noDropdown,
html body #app .app-wrapper.hideSidebar .sidebar-container .el-menu li.el-menu-item.submenu-title-noDropdown[style] {
  padding: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

html body #app .app-wrapper.hideSidebar .sidebar-container .el-menu li.el-menu-item.submenu-title-noDropdown > div.el-tooltip,
html body #app .app-wrapper.hideSidebar .sidebar-container .el-menu li.el-menu-item.submenu-title-noDropdown > div.el-tooltip[style] {
  padding: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}