/* =====================================================================
   妙联-油田AI运营管理平台 · 大屏（油田AI运营平台）
   ===================================================================== */
.oil-dash {
  position: fixed; inset: 0; display: flex; flex-direction: column;
  background: radial-gradient(1200px 600px at 50% -10%, #0a2a6e 0%, #061540 45%, #030c26 100%);
  color: #cfe7ff; overflow: hidden; z-index: 1;
}
.oil-dash::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background:
    repeating-linear-gradient(0deg, rgba(61,217,255,0.025) 0 1px, transparent 1px 42px),
    repeating-linear-gradient(90deg, rgba(61,217,255,0.025) 0 1px, transparent 1px 42px);
}
/* 顶部 */
.oil-top { display: flex; align-items: center; gap: 18px; padding: 14px 22px 6px; position: relative; z-index: 2; }
.oil-top-cell { flex: 1; display: flex; align-items: center; gap: 14px; }
.oil-top-center { flex: 0 0 auto; flex-direction: column; gap: 4px; }
.oil-title-wrap { display: flex; align-items: center; gap: 14px; }
.oil-title-wrap h1 {
  margin: 0; font-size: 30px; letter-spacing: 8px; font-weight: 700; color: #eaf6ff;
  text-shadow: 0 0 18px rgba(61,156,255,0.9), 0 0 42px rgba(24,121,255,0.5);
  white-space: nowrap;
}
.ot-deco { width: 130px; height: 14px; }
.ot-deco.l { background: linear-gradient(90deg, transparent, #2f8bff); clip-path: polygon(0 50%, 100% 0, 100% 100%); }
.ot-deco.r { background: linear-gradient(270deg, transparent, #2f8bff); clip-path: polygon(0 0, 100% 50%, 0 100%); }
.oil-top-sub { display: flex; gap: 26px; font-size: 13px; color: #8fb8e8; }
.oil-top-sub b { color: #eaf6ff; font-weight: 600; }
.oil-price i { font-style: normal; color: #ffd257; font-size: 17px; font-weight: 700; }
/* 顶部六边KPI */
.oil-kpi-hex { display: flex; align-items: center; gap: 10px; padding: 8px 14px;
  background: linear-gradient(160deg, rgba(24,80,200,0.35), rgba(10,32,90,0.55));
  border: 1px solid rgba(64,150,255,0.4); clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%); }
.oil-kpi-hex .okh-icon { font-size: 22px; filter: drop-shadow(0 0 6px rgba(61,217,255,0.8)); }
.oil-kpi-hex span { display: block; font-size: 12px; color: #8fb8e8; }
.oil-kpi-hex b { font-size: 22px; color: #4ee1ff; font-family: 'Consolas', monospace; }
.oil-kpi-hex b i { font-style: normal; }
.oil-kpi-hex b em { font-style: normal; font-size: 12px; color: #8fb8e8; margin-left: 3px; }
/* 运行状态 */
.oil-run-state { list-style: none; display: flex; gap: 10px; margin: 0; padding: 0; font-size: 13px; }
.oil-run-state .dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 5px; }
.oil-run-state .dot.g { background: #35e08d; box-shadow: 0 0 8px #35e08d; }
.oil-run-state .dot.y { background: #ffc53d; box-shadow: 0 0 8px #ffc53d; }
.oil-run-state .dot.r { background: #ff5b5b; box-shadow: 0 0 8px #ff5b5b; }
.oil-run-state b { color: #4ee1ff; margin-left: 3px; }
.ob-btn { background: rgba(24,80,200,0.35); color: #cfe7ff; border: 1px solid rgba(64,150,255,0.5);
  padding: 6px 12px; border-radius: 4px; font-size: 12.5px; cursor: pointer; transition: all .2s; }
.ob-btn:hover { background: rgba(47,139,255,0.55); }
.ob-btn.warn { border-color: rgba(255,107,107,0.55); color: #ffb3b3; }
.ob-user { font-size: 13px; color: #eaf6ff; }
/* 主体三列 */
.oil-main { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 24%) minmax(0, 1fr) minmax(0, 24%); gap: 14px; padding: 8px 18px 16px; position: relative; z-index: 2; overflow: hidden; }
.oil-col { display: flex; flex-direction: column; gap: 12px; min-height: 0; min-width: 0; overflow: hidden; }
.oil-panel {
  position: relative; background: linear-gradient(170deg, rgba(16,52,130,0.45), rgba(8,26,72,0.65));
  border: 1px solid rgba(64,150,255,0.35); padding: 10px 12px 12px; min-height: 0; min-width: 0;
  display: flex; flex-direction: column; overflow: hidden;
}
.oil-panel::before, .oil-panel::after { content: ''; position: absolute; width: 14px; height: 14px; border: 2px solid #3DD9FF; }
.oil-panel::before { top: -1px; left: -1px; border-right: none; border-bottom: none; }
.oil-panel::after { bottom: -1px; right: -1px; border-left: none; border-top: none; }
.oil-panel.tall { flex: 0 0 auto; }
.oil-panel.grow { flex: 1; }
.oil-panel-tt {
  font-size: 14px; font-weight: 600; color: #eaf6ff; letter-spacing: 2px; margin-bottom: 8px;
  display: flex; align-items: center; flex-wrap: wrap; row-gap: 4px; gap: 6px;
  background: linear-gradient(90deg, rgba(47,139,255,0.35), transparent);
  padding: 4px 8px; border-left: 3px solid #3DD9FF;
}
.oil-panel-tt i { font-style: normal; color: #3DD9FF; font-size: 12px; }
/* 累计处理量 */
.oil-acc-list { display: flex; flex-direction: column; gap: 6px; }
.oil-acc { display: flex; align-items: center; gap: 10px; padding: 6px 10px;
  background: rgba(24,80,200,0.18); border: 1px solid rgba(64,150,255,0.25); }
.oil-acc .oa-ic { font-size: 20px; filter: drop-shadow(0 0 8px rgba(61,217,255,0.7)); }
.oil-acc label { display: block; font-size: 12px; color: #8fb8e8; }
.oil-acc b { font-size: 20px; color: #ffd257; font-family: 'Consolas', monospace; }
.oil-acc b i { font-style: normal; }
.oil-acc b em { font-style: normal; font-size: 12px; color: #8fb8e8; margin-left: 3px; }
/* 今日分布 */
.oil-dist-wrap { flex: 1; min-height: 0; display: flex; gap: 8px; }
.oil-dist-chart { flex: 1; min-height: 140px; }
.oil-dist-list { flex: 0 0 118px; list-style: none; margin: 0; padding: 0; overflow-y: auto; font-size: 12px; }
.oil-dist-list li { display: flex; align-items: center; gap: 5px; padding: 2px 0; color: #a9cdf5; }
.oil-dist-list li i.dot { width: 8px; height: 8px; border-radius: 2px; flex-shrink: 0; }
.oil-dist-list li b { margin-left: auto; color: #eaf6ff; }
/* TOP8 */
.oil-top8 { flex: 1; min-height: 0; overflow: hidden; }
.oil-top8-row { display: flex; align-items: center; gap: 8px; margin-bottom: 7px; font-size: 12px; }
.oil-top8-row .rk { flex: 0 0 16px; text-align: center; color: #8fb8e8; }
.oil-top8-row:nth-child(1) .rk, .oil-top8-row:nth-child(2) .rk, .oil-top8-row:nth-child(3) .rk { color: #ffd257; }
.oil-top8-row .on-name { flex: 0 0 128px; color: #cfe7ff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oil-top8-row .on-bar { flex: 1; height: 12px; background: rgba(24,80,200,0.3); border-radius: 2px; overflow: hidden; }
.oil-top8-row .on-bar i { display: block; height: 100%; border-radius: 2px;
  background: linear-gradient(90deg, #18b0ff, #4ee1ff); box-shadow: 0 0 8px rgba(78,225,255,0.8); }
.oil-top8-row .on-val { flex: 0 0 58px; text-align: right; color: #ffd257; font-family: 'Consolas', monospace; }
/* 地图 & 表格 */
.oil-center-top { display: grid; grid-template-columns: 1.6fr 1fr; gap: 12px; flex: 0 0 52%; min-height: 0; }
.oil-map { flex: 1; min-height: 120px; }
.oil-table { width: 100%; border-collapse: collapse; font-size: 12.5px; table-layout: fixed; }
.oil-table th { color: #7fd4ff; font-weight: 600; padding: 6px 8px; text-align: left;
  background: rgba(47,139,255,0.25); border-bottom: 1px solid rgba(64,150,255,0.4); white-space: nowrap; }
.oil-table td { color: #cfe7ff; padding: 6.5px 8px; border-bottom: 1px dashed rgba(64,150,255,0.18); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oil-table tbody tr:hover td { background: rgba(47,139,255,0.12); }
.oil-tag { display: inline-block; padding: 1px 8px; border-radius: 2px; font-size: 11.5px; }
.oil-tag.ok { color: #6ef2b3; background: rgba(53,224,141,0.15); border: 1px solid rgba(53,224,141,0.4); }
.oil-tag.warn { color: #ffd257; background: rgba(255,197,61,0.12); border: 1px solid rgba(255,197,61,0.4); }
.oil-tag.err { color: #ff8b8b; background: rgba(255,91,91,0.12); border: 1px solid rgba(255,91,91,0.4); }
.tbl-scroll { flex: 1; min-height: 0; overflow-y: auto; }
/* 状态卡（紧凑横条 · 切角科技感，原六边形大卡已压缩） */
.oil-hex-row { display: flex; justify-content: space-between; gap: 8px; margin: 6px 0; flex: 0 0 auto; }
.oil-hex { flex: 1; display: flex; align-items: center; gap: 6px; padding: 5px 8px; cursor: default; min-width: 0;
  background: linear-gradient(160deg, rgba(24,80,200,0.38), rgba(8,26,72,0.55));
  clip-path: polygon(9px 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%, 0 9px);
  border: 1px solid rgba(64,150,255,0.3); transition: transform .2s, background .2s; }
.oil-hex:hover { transform: translateY(-2px); background: linear-gradient(160deg, rgba(30,96,224,0.5), rgba(10,32,86,0.65)); }
.oil-hex .hx-ic { flex: 0 0 auto; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center;
  font-size: 14px; border-radius: 7px; background: rgba(61,217,255,0.14); border: 1px solid rgba(61,217,255,0.35);
  filter: drop-shadow(0 0 5px rgba(61,217,255,0.6)); }
.oil-hex .hx-body { flex: 1; min-width: 0; text-align: left; }
.oil-hex .hx-name { font-size: 12px; color: #cfe7ff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oil-hex .hx-state { flex: 0 0 auto; font-size: 11px; padding: 1px 8px; border-radius: 9px; white-space: nowrap;
  color: #06224d; background: linear-gradient(90deg, #35e08d, #7cf5c2); font-weight: 600; }
.oil-hex .hx-state.off { color: #a9cdf5; background: rgba(143,184,232,0.18); }
.oil-hex .hx-dot { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; margin-left: auto; }
.oil-hex .hx-cnt { font-size: 10.5px; color: #8fb8e8; margin-top: 1px; white-space: nowrap; }
.oil-hex .hx-cnt b { color: #4ee1ff; }
.oil-chart { flex: 1; min-height: 0; }
/* 右列 */
.oil-stat-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.oil-stat { display: flex; align-items: center; gap: 10px; padding: 10px;
  background: rgba(24,80,200,0.18); border: 1px solid rgba(64,150,255,0.25); }
.oil-stat .os-ic { font-size: 22px; }
.oil-stat label { display: block; font-size: 12px; color: #8fb8e8; }
.oil-stat b { font-size: 22px; color: #4ee1ff; font-family: 'Consolas', monospace; }
.oil-stat b i { font-style: normal; }
.oil-stat b em { font-style: normal; font-size: 12px; color: #8fb8e8; }
.oil-gauge-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
.oil-gauge { height: 118px; }
.oil-table thead th { position: sticky; top: 0; z-index: 1; }
.tbl-panel .oil-panel-tt, .oil-panel .tbl-scroll { min-height: 0; }
.oil-alarm-mini { flex: 1; min-height: 0; list-style: none; margin: 0; padding: 0; overflow-y: auto; }
.oil-alarm-mini li { padding: 7px 4px; border-bottom: 1px dashed rgba(64,150,255,0.2); font-size: 12.5px; }
.oil-alarm-mini .am-head { display: flex; gap: 8px; align-items: center; }
.oil-alarm-mini .am-time { margin-left: auto; color: #8fb8e8; font-size: 11px; }
.oil-alarm-mini .am-body { color: #a9cdf5; margin-top: 3px; line-height: 1.5; }
.oil-alarm-mini::-webkit-scrollbar, .oil-dist-list::-webkit-scrollbar, .tbl-scroll::-webkit-scrollbar { width: 4px; }
.oil-alarm-mini::-webkit-scrollbar-thumb, .oil-dist-list::-webkit-scrollbar-thumb, .tbl-scroll::-webkit-scrollbar-thumb { background: rgba(64,150,255,0.4); border-radius: 2px; }
/* GIS 地图页点位 */
.gis-pin { position: absolute; transform: translate(-50%, -100%); cursor: pointer; text-align: center; }
.gis-pin .gp-dot { width: 14px; height: 14px; border-radius: 50%; margin: 0 auto; border: 2px solid rgba(255,255,255,0.7); }
.gis-pin.online .gp-dot { background: #35e08d; box-shadow: 0 0 8px #35e08d; }
.gis-pin.warning .gp-dot { background: #ffc53d; box-shadow: 0 0 8px #ffc53d; }
.gis-pin.offline .gp-dot { background: #6b7a99; }
.gis-pin .gp-label { margin-top: 2px; font-size: 11px; color: #cfe7ff; background: rgba(8,26,72,0.75); padding: 0 4px; border-radius: 2px; white-space: nowrap; }
/* 弹窗小卡 */
.confirm-card { width: 420px; }
.dm-ctrl-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.dm-ctrl-item { border: 1px solid #e8ecf3; border-radius: 6px; padding: 12px; }
.dm-ctrl-item h5 { margin: 0 0 8px; font-size: 13px; color: #333; }
#toastBox { position: fixed; top: 70px; left: 50%; transform: translateX(-50%); z-index: 9999; display: flex; flex-direction: column; gap: 8px; }
.wb-toast { padding: 9px 20px; border-radius: 4px; color: #fff; font-size: 13px; box-shadow: 0 6px 24px rgba(0,0,0,0.25); animation: wbtoast .25s; }
.wb-toast.ok { background: #35b46d; } .wb-toast.err { background: #e05252; } .wb-toast.info { background: #2b6bf2; }
@keyframes wbtoast { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
/* 大屏全屏模式 */
.oil-dash.fullscreen .oil-title-wrap h1 { font-size: 38px; }

/* ---------------- 后台补充工具类 ---------------- */
.ad-tag.ok, .ad-tag.success { background: #e5f7ee; color: #22b573; }
.ad-tag.err, .ad-tag.danger { background: #ffeded; color: #ff4d4f; }
.ad-tag.warn { background: #fff4e6; color: #ff9900; }
.ad-tag.off, .ad-tag.info { background: #f0f2f6; color: #97a3b6; }
.ad-btn-sm { padding: 3px 10px; font-size: 12px; }
.ad-table-compact td { padding: 6px 10px; font-size: 12.5px; }
.ad-pg-dots { color: #97a3b6; padding: 0 4px; }
.dm-item { background: #f8fafd; border: 1px solid #eef1f6; border-radius: 6px; padding: 10px 12px; }
.dm-item label { display: block; font-size: 11.5px; color: #8a97ab; margin-bottom: 4px; }
.dm-item b { font-size: 17px; color: #1f2d3d; font-family: 'Consolas', monospace; }
.dm-item b i { font-style: normal; font-size: 11px; color: #97a3b6; margin-left: 2px; }
.dm-ctrl-item .ad-btn[disabled] { opacity: .45; cursor: not-allowed; }

/* ===================== V3.1 · 三屏切换与收油调度 ===================== */
.oil-screen-tabs { display: flex; gap: 8px; margin-top: 6px; }
.oil-screen-tabs .ost {
  background: rgba(24,80,200,0.28); color: #8fb8e8; border: 1px solid rgba(64,150,255,0.4);
  padding: 4px 16px; border-radius: 3px; font-size: 13px; cursor: pointer; letter-spacing: 2px;
  transition: all .2s; font-family: inherit;
}
.oil-screen-tabs .ost i { font-style: normal; color: #4ee1ff; margin-right: 4px; }
.oil-screen-tabs .ost:hover { background: rgba(47,139,255,0.4); color: #eaf6ff; }
.oil-screen-tabs .ost.active {
  background: linear-gradient(160deg, rgba(47,139,255,0.65), rgba(24,80,200,0.55));
  color: #fff; border-color: #3DD9FF; box-shadow: 0 0 12px rgba(61,217,255,0.4);
}
.oc-red b { color: #ff8b8b !important; }
/* 电子联单面板 */
.oc-mf-wrap { flex: 1; min-height: 0; display: flex; align-items: center; gap: 6px; }
.oc-mf-wrap .oil-gauge { flex: 1; height: 130px; }
.oc-mf-wrap .oil-dist-list { flex: 0 0 110px; }
/* 路线列表 */
.route-item { padding: 7px 8px; border: 1px solid rgba(64,150,255,0.25); background: rgba(24,80,200,0.15); margin-bottom: 7px; }
.route-item .ri-head { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: #eaf6ff; }
.route-item .ri-head b { color: #4ee1ff; }
.route-item .ri-meta { display: flex; gap: 12px; font-size: 11px; color: #8fb8e8; margin-top: 3px; }
.route-item .ri-prog { flex: 1; height: 5px; background: rgba(24,80,200,0.35); border-radius: 2px; overflow: hidden; }
.route-item .ri-prog i { display: block; height: 100%; background: linear-gradient(90deg, #18b0ff, #4ee1ff); }
.urg-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 4px; }
.urg-dot.red { background: #ff5b5b; box-shadow: 0 0 6px #ff5b5b; }
.urg-dot.orange { background: #ffc53d; box-shadow: 0 0 6px #ffc53d; }
.urg-dot.green { background: #35e08d; box-shadow: 0 0 6px #35e08d; }

/* ===================== 真实地图组件（oilmap.js） ===================== */
.oim-root { position: relative; overflow: hidden; background: #061540; user-select: none; }
.oim-root.oim-dark { background: #04102e; }
.oim-tiles { position: absolute; inset: 0; }
.oim-root.oim-dark .oim-tiles {
  filter: invert(1) hue-rotate(185deg) brightness(0.78) contrast(0.88) saturate(1.35);
}
.oim-tile { position: absolute; width: 256px; height: 256px; pointer-events: none; }
.oim-canvas { position: absolute; inset: 0; pointer-events: none; }
.oim-overlays { position: absolute; inset: 0; }
.oim-ovl { position: absolute; left: 0; top: 0; will-change: transform; }
.oim-grabbing { cursor: grabbing !important; }
.oim-tip {
  position: absolute; z-index: 30; pointer-events: none; max-width: 280px;
  background: rgba(6,21,64,0.92); color: #eaf6ff; font-size: 12px; line-height: 1.5;
  border: 1px solid rgba(64,150,255,0.55); border-radius: 4px; padding: 5px 9px;
  box-shadow: 0 4px 14px rgba(0,0,0,0.4);
}
.ad-page .oim-tip, .ad-card .oim-tip { background: rgba(255,255,255,0.97); color: #243244; border-color: #c6d4e8; box-shadow: 0 4px 14px rgba(30,60,120,0.18); }
/* 区县气泡（大屏/监控中心） */
.oim-district {
  transform-origin: center; cursor: pointer; white-space: nowrap;
}
.oim-district .od-bubble {
  border-radius: 50%; margin: 0 auto;
  background: radial-gradient(circle at 35% 30%, rgba(120,220,255,0.95), rgba(24,120,255,0.55));
  box-shadow: 0 0 16px rgba(78,200,255,0.75); border: 1px solid rgba(190,235,255,0.8);
}
.oim-district .od-label {
  margin-top: 3px; text-align: center; font-size: 11.5px; color: #eaf6ff;
  background: rgba(6,21,64,0.72); border-radius: 3px; padding: 1px 6px;
  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
}
.ad-page .oim-district .od-label { color: #243244; background: rgba(255,255,255,0.85); text-shadow: none; border: 1px solid #dbe5f2; }
/* 网点标签（监控中心 zoom 大时） */
.oim-store-label { font-size: 11px; color: #243244; background: rgba(255,255,255,0.9); border: 1px solid #cfd9e6; border-radius: 3px; padding: 0 5px; white-space: nowrap; transform: translate(8px,-50%); pointer-events: none; }
.oil-dash .oim-store-label { color: #eaf6ff; background: rgba(6,21,64,0.75); border-color: rgba(64,150,255,0.5); }
/* 地图图例 */
.oim-legend {
  position: absolute; right: 10px; bottom: 10px; z-index: 25;
  background: rgba(255,255,255,0.94); border: 1px solid #d7e0ec; border-radius: 6px;
  padding: 8px 12px; font-size: 12px; color: #33455e; line-height: 1.9; box-shadow: 0 4px 12px rgba(30,60,120,0.12);
}
.oil-dash .oim-legend { background: rgba(6,21,64,0.85); color: #bfe0ff; border-color: rgba(64,150,255,0.4); }
.oim-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; }
.oim-scale { position: absolute; left: 10px; bottom: 8px; z-index: 25; font-size: 11px; color: #5b7192; }
.oil-dash .oim-scale { color: #8fb8e8; }

/* ===================== 远程控制下拉分页 ===================== */
.ad-pager select.ad-pagesize {
  margin: 0 8px; padding: 3px 6px; border: 1px solid #d4dcea; border-radius: 4px; font-size: 12.5px; color: #33455e;
}
.ad-pager { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }

/* ===================== 区域管理 ===================== */
.region-wrap { display: flex; gap: 14px; min-height: 560px; }
.region-tree {
  flex: 0 0 300px; border: 1px solid #e3e9f2; border-radius: 8px; background: #fbfcfe;
  padding: 10px; overflow: auto; max-height: 680px;
}
.region-tree .rt-node { }
.rt-row { display: flex; align-items: center; gap: 6px; padding: 4px 6px; border-radius: 5px; cursor: pointer; font-size: 13px; color: #2c3a52; }
.rt-row:hover { background: #eef4fd; }
.rt-row.active { background: #e3eeff; color: #1a56db; font-weight: 600; }
.rt-toggle { width: 16px; text-align: center; color: #8aa0bd; font-size: 11px; cursor: pointer; }
.rt-icn { font-size: 13px; }
.rt-cnt { margin-left: auto; font-size: 11px; color: #8aa0bd; background: #eef1f6; border-radius: 8px; padding: 0 7px; }
.region-detail { flex: 1; min-width: 0; }
.region-toolbar { display: flex; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; align-items: center; }
/* 维度切换 */
.dim-tabs { display: flex; gap: 6px; margin-bottom: 10px; flex-wrap: wrap; }
.dim-tabs .dt { border: 1px solid #d4dcea; background: #fff; color: #445269; padding: 4px 14px; border-radius: 14px; font-size: 12.5px; cursor: pointer; }
.dim-tabs .dt.active { background: #2b6bf2; border-color: #2b6bf2; color: #fff; }

/* ===================== 通用表单弹窗（新增策略/新增区域） ===================== */
.ax-modal {
  position: fixed; inset: 0; z-index: 2000; display: none; align-items: center; justify-content: center;
  background: rgba(15,28,52,0.45);
}
.ax-modal.show { display: flex; }
.ax-modal-card {
  width: 560px; max-width: 94vw; max-height: 88vh; overflow: auto;
  background: #fff; border-radius: 10px; box-shadow: 0 18px 60px rgba(20,40,80,0.35);
}
.ax-modal-card .am-head { display: flex; justify-content: space-between; align-items: center; padding: 14px 18px; border-bottom: 1px solid #edf1f7; }
.ax-modal-card .am-head b { font-size: 15px; color: #22344e; }
.ax-modal-card .am-close { cursor: pointer; font-size: 20px; color: #90a2bb; line-height: 1; }
.ax-modal-card .am-body { padding: 16px 18px; }
.ax-modal-card .am-foot { padding: 12px 18px; border-top: 1px solid #edf1f7; display: flex; justify-content: flex-end; gap: 10px; }
.ax-form-row { display: flex; align-items: center; margin-bottom: 12px; gap: 10px; }
.ax-form-row > label { flex: 0 0 96px; text-align: right; color: #445269; font-size: 13px; }
.ax-form-row > input, .ax-form-row > select { flex: 1; padding: 6px 9px; border: 1px solid #d4dcea; border-radius: 5px; font-size: 13px; color: #2c3a52; }
.ax-form-grid { display: flex; gap: 10px; }
.ax-form-grid .ax-form-row { flex: 1; }
.ax-form-grid .ax-form-row > label { flex: 0 0 84px; }
.ax-cond-preview { background: #f4f8ff; border: 1px dashed #b9d0f5; border-radius: 6px; padding: 9px 12px; font-size: 12.5px; color: #2c4a7c; margin-top: 4px; line-height: 1.7; }

/* ===================== 登录页演示账户 ===================== */
.demo-accounts { margin-top: 14px; text-align: left; }
.demo-accounts .da-title { font-size: 12px; color: #7fa8d8; margin-bottom: 6px; }
.demo-accounts .da-list { display: flex; flex-wrap: wrap; gap: 6px; }
.demo-accounts .da-chip {
  border: 1px solid rgba(64,150,255,0.45); background: rgba(24,80,200,0.22); color: #cfe7ff;
  font-size: 11.5px; padding: 2.5px 9px; border-radius: 12px; cursor: pointer; transition: all .18s;
}
.demo-accounts .da-chip:hover { background: rgba(47,139,255,0.45); color: #fff; }

/* ===================== 清单定位高亮 ===================== */
@keyframes gisRowFlash { 0% { background: #fff3c4; } 100% { background: transparent; } }
tr.gis-located td { animation: gisRowFlash 2.2s ease-out; background: #fffbe8; }

/* ===================== 数据看板报表区（合并数据中心） ===================== */
.dash-report-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; margin-top: 14px; }
.dash-report-grid .ad-chart { height: 300px; }
@media (max-width: 1280px) { .dash-report-grid { grid-template-columns: 1fr; } }

/* 权限提示 */
.ad-role-banner { background: #eef4ff; border: 1px solid #cfe0fb; color: #2c4a7c; border-radius: 6px; padding: 7px 12px; font-size: 12.5px; margin-bottom: 12px; }

/* ===================== V4.1 布局全面优化 ===================== */
/* 内容区双轴可滚,防止横向/纵向显示不全 */
.ad-page { overflow: auto; }
.ad-main { overflow: hidden; }
.ad-card { max-width: 100%; }
/* 表格长内容换行,避免列挤压溢出 */
.ad-table th, .ad-table td { word-break: break-word; }
.ad-table td .ad-btn { white-space: nowrap; }
/* 页签过多时可滚动并高亮提示 */
.ad-tabs { scrollbar-width: thin; }
.ad-tabs::-webkit-scrollbar { height: 5px; }
.ad-tabs::-webkit-scrollbar-thumb { background: #c3cede; border-radius: 3px; }
/* 通用弹窗超长内容纵向滚动 */
.ax-modal-card { max-height: 86vh; overflow-y: auto; }
/* 设备详情弹窗内容超长滚动 */
.dm-body-scroll { max-height: 70vh; overflow-y: auto; }

/* ===================== V4.1 大屏一：全宽真实地图 + 区域筛选 ===================== */
.oil-center-top-full { grid-template-columns: 1fr; }
.map-panel .oil-map { min-height: 0; }
/* 浅色真实地图容器 */
#obMap { background: #e8ecf0; border-radius: 4px; overflow: hidden; }
/* 区域筛选条 */
.bs-scope { margin-left: auto; display: flex; align-items: center; flex: 0 0 auto; gap: 5px; }
.bs-sc-btn { background: rgba(24,80,200,0.45); color: #bfe3ff; border: 1px solid rgba(64,150,255,0.45);
  padding: 2px 10px; font-size: 11.5px; border-radius: 3px; cursor: pointer; white-space: nowrap; }
.bs-sc-btn.active { background: linear-gradient(90deg, #18b0ff, #2f8bff); color: #fff; border-color: #4ee1ff; }
.bs-scope select { background: rgba(8,26,72,0.85); color: #cfe7ff; border: 1px solid rgba(64,150,255,0.4);
  font-size: 11.5px; padding: 2px 4px; border-radius: 3px; max-width: 110px; }
.bs-scope select option { background: #0a1c48; color: #cfe7ff; }
/* 紧凑状态卡行（原六边形大卡已改为横条，占位压缩） */
.oil-hex-row { min-height: 0; padding: 0 2px; }
/* 大屏三·告警级别加大卡（告警字典版块移除后左列加高） */
.oil-stat-cards-lg { flex: 1; align-content: start; gap: 10px; margin-top: 6px; }
.oil-stat-cards-lg .oil-stat { padding: 11px 12px; }
.oil-stat-cards-lg .oil-stat label { font-size: 12px; }
.oil-stat-cards-lg .oil-stat b { font-size: 23px; }

/* ===================== V4.1 交互组件 ===================== */
.ad-btn-xs { padding: 2px 8px; font-size: 12px; }
.ad-btn.danger { color: #e05252; border-color: #eec4c4; background: #fff; }
.ad-btn.danger:hover { background: #fdf0f0; }
.ad-table-title { display: flex; justify-content: space-between; align-items: center; }
.ax-form-row > textarea { flex: 1; padding: 6px 9px; border: 1px solid #d4dcea; border-radius: 5px; font-size: 13px; color: #2c3a52; font-family: inherit; }
.sp-pack.sel { border-color: #2b6bf2 !important; background: #f5f8ff; }
.sp-ch.sel { font-weight: 700; }
@keyframes pulseRed { 0%,100% { box-shadow: 0 0 0 0 rgba(224,82,82,0.5); } 50% { box-shadow: 0 0 0 6px rgba(224,82,82,0); } }