/* =========================================================
   pages.css · 各页面特有样式
   ========================================================= */

/* 首页三栏 */
.overview-main-grid{
  display:grid; grid-template-columns:300px minmax(0,1fr) 380px;
  gap:12px; height:calc(100vh - var(--top-h) - var(--nav-h) - var(--status-h) - 140px);
  min-height:520px;
}

/* 五环闭环条 */
.ring5bar{display:flex; align-items:stretch; gap:0; margin-top:12px; padding:6px 10px;
  background:var(--card-bg);
  border:1px solid var(--bd-soft); border-radius:8px;}
.ring-step{
  flex:1; min-width:0; display:flex; align-items:center; gap:8px; padding:8px 12px;
  background:var(--card-bg);
  border:1px solid var(--bd-soft); border-radius:6px; cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease;
}
.ring-step:hover{transform:translateY(-2px); box-shadow:0 6px 14px rgba(0,0,0,.28);}
.ring-cyan{border-left:3px solid var(--tech-cyan);}
.ring-orange{border-left:3px solid var(--orange);}
.ring-gold{border-left:3px solid var(--wheat-gold);}
.ring-green{border-left:3px solid var(--agri-green);}
.ring-purple{border-left:3px solid var(--ai-purple);}
.ring-step .ic{font-size:18px;}
.ring-step .nm{font-size:12px; color:var(--text-main); font-weight:600;}
.ring-step .dt{font-size:10.5px; color:var(--tx-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ring-step .sep{flex:0 0 18px; align-self:center; color:var(--tx-4); font-size:16px; text-align:center;}

/* 地图容器 */
.map-wrap{position:relative; width:100%; height:100%; min-height:380px;}
.map-svg{width:100%; height:100%; display:block;}
.map-overlay-tl{position:absolute; top:8px; left:8px;}
.map-overlay-bl{position:absolute; bottom:8px; left:8px;}
.map-overlay-br{position:absolute; bottom:8px; right:8px; text-align:right;}
.map-legend{
  background:var(--map-overlay-bg); border:1px solid var(--map-overlay-border);
  border-radius:6px; padding:6px 9px; font-size:11px; color:var(--tx-2);
}
.map-legend .legend-title{font-size:10px; color:var(--tx-3); margin-bottom:4px; letter-spacing:1px;}
.map-legend .legend-row{display:flex; align-items:center; gap:5px; margin:2px 0;}
.map-legend .legend-dot{width:8px; height:8px; border-radius:50%; display:inline-block;}
.legend-dot.r4{background:var(--high);}
.legend-dot.r3{background:var(--orange);}
.legend-dot.r2{background:var(--wheat-gold);}
.legend-dot.r1{background:var(--blue-lvl);}

/* 地图工具条 */
.map-toolbox{display:flex; flex-direction:column; gap:4px;}
.layer-btn{
  padding:3px 9px; background:var(--map-overlay-bg); border:1px solid var(--map-overlay-border);
  border-radius:4px; font-size:11px; color:var(--tx-2); cursor:pointer;
}
.layer-btn:hover{color:#fff; border-color:var(--tech-cyan);}
.layer-btn.on{color:var(--tech-cyan); border-color:var(--tech-cyan);}

/* 地图点 */
.svg-city-dot{fill:#a0b5d0; cursor:pointer; transition:r .15s;}
.svg-city-dot.demo{fill:var(--agri-green); animation:cityPulse 2.4s ease-in-out infinite;}
.svg-city-dot:hover{r:7;}
.svg-county-dot{fill:#7a8aae; cursor:pointer;}
.svg-county-dot.demo{fill:var(--agri-green); animation:cityPulse 2.4s ease-in-out infinite;}
.svg-county-dot.demo:hover{r:6;}
.svg-county-dot:not(.demo){opacity:.45;}
/* v4.5-UI3+ P1-3：全部区县模式下，普通县点进一步变小 + 更低透明度，避免画面变脏 */
body.show-all-counties .svg-county-dot:not(.demo){ r:1.8; opacity:.32; }
.svg-plot-dot{fill:var(--agri-green); cursor:pointer; stroke:#fff; stroke-width:0.8;}
.svg-city-name{fill:var(--map-label); font-size:11.5px;}
.svg-city-name.cap{fill:var(--map-label); font-size:14px; font-weight:700;}
/* v4.5-UI2 P1-3：当前 scope active + 事件涉及区高亮 */
.svg-city-dot.active,
.svg-county-dot.active{stroke:var(--tech-cyan); stroke-width:2; fill:var(--tech-cyan);}
.svg-city-name.active{fill:var(--tech-cyan); font-weight:700;}
.svg-city-dot.event,
.svg-county-dot.event{stroke:rgba(255,138,61,.85); stroke-width:1.5;}
@keyframes cityPulse{0%,100%{opacity:1;} 50%{opacity:.55;}}

/* 子页大标题 */
.sub-title{display:flex; justify-content:space-between; align-items:center; margin:6px 0 10px;}
.sub-title h2{font-size:16px; font-weight:600; color:var(--text-main); display:flex; align-items:center; gap:8px;}
.sub-title h2::before{content:''; width:3px; height:15px; background:linear-gradient(180deg,var(--gov-blue-2),var(--tech-cyan)); border-radius:2px;}
.sub-title .meta{font-size:11px; color:var(--tx-3);}

/* 事件上下文（兼容 v3.4） */
.event-ctx{
  background:var(--modal-bg);
  border-left:3px solid var(--tech-cyan); border-radius:6px; padding:4px 10px;
  height:48px; min-height:48px; overflow:hidden;
}
.event-ctx .ec-top{display:flex; align-items:center; justify-content:space-between; gap:10px; height:20px; margin-bottom:2px;}
.event-ctx .ec-name{font-size:12.5px; color:var(--text-main); flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.event-ctx .ec-name b{color:var(--tech-cyan); font-family:'DIN Alternate',monospace;}
.event-ctx .ec-tag{padding:1px 8px; border-radius:8px; font-size:10.5px;}
.event-ctx .ec-tag.red{background:rgba(255,61,79,.18); color:var(--high); border:1px solid rgba(255,61,79,.4);}
.event-ctx .ec-tag.orange{background:rgba(255,138,61,.18); color:var(--orange); border:1px solid rgba(255,138,61,.4);}
.event-ctx .ec-tag.gold,
.event-ctx .ec-tag.yellow{background:rgba(246,199,97,.18); color:var(--wheat-gold); border:1px solid rgba(246,199,97,.4);}
.event-ctx .ec-meta{font-size:10.5px; color:var(--tx-3); display:flex; gap:8px;}
.event-ctx .ec-meta b{color:var(--tx-1);}
.event-ctx .ec-switch{height:20px; padding:0 8px; font-size:10.5px; background:var(--card-bg); border:1px solid var(--bd); border-radius:10px; color:var(--tx-2);}
.event-ctx .ec-progress{height:18px; display:flex; align-items:center;}
.event-ctx .ec-step{flex:0 0 auto; min-width:60px; display:flex; align-items:center; justify-content:center; gap:4px; font-size:10.5px; color:var(--tx-3); cursor:pointer;}
.event-ctx .ec-step .dot{width:14px; height:14px; border-radius:50%; background:#1a2a52; border:1px solid var(--bd); display:flex; align-items:center; justify-content:center; color:var(--tx-3); font-size:9px; font-weight:600;}
.event-ctx .ec-step.done .dot{background:var(--ok); border-color:transparent; color:#0a1124;}
.event-ctx .ec-step.done{color:var(--ok);}
.event-ctx .ec-step.cur .dot{background:linear-gradient(135deg,var(--tech-cyan),var(--gov-blue)); border-color:transparent; color:#fff; box-shadow:0 0 8px var(--tech-cyan);}
.event-ctx .ec-step.cur{color:var(--text-main); font-weight:600;}
.event-ctx .ec-line{flex:1; min-width:18px; height:1px; margin:0 4px; background:var(--bd-soft);}
.event-ctx .ec-line.done{background:var(--ok);}
.event-ctx .ec-line.cur{background:linear-gradient(90deg,var(--ok),var(--tech-cyan));}

/* AI 卡 */
.ai-card{
  padding:10px; background:linear-gradient(135deg,rgba(169,116,255,.10),var(--card-bg));
  border:1px solid rgba(169,116,255,.30); border-left:3px solid var(--ai-purple);
  border-radius:6px; margin-bottom:8px;
}
.ai-card .ttl{color:var(--ai-purple); font-size:12px; font-weight:600;}

/* 地块清单徽章 */
.insured-tag{display:inline-block; padding:1px 6px; background:rgba(55,201,138,.18); color:var(--ok); border-radius:8px; font-size:10px;}
.insured-tag.no{background:rgba(255,61,79,.18); color:var(--high);}

/* =========================================================
   LIGHT FIX · 省厅端浅色态页面元素对齐市县端业务态（v5 像素级修正）
   ========================================================= */
:root[data-theme="light"] .event-ctx{
  background:#f8fbff;
  border-left-color:var(--gov-blue);
  color:var(--text-soft);
}
:root[data-theme="light"] .event-ctx .ec-name b{ color:var(--gov-blue); }
:root[data-theme="light"] .event-ctx .ec-step .dot{
  background:#eaf0f7;
  border-color:#c7d5e8;
  color:var(--text-mute);
}
:root[data-theme="light"] .event-ctx .ec-step.cur .dot{
  background:linear-gradient(180deg,var(--gov-blue-2),var(--gov-blue));
  border-color:transparent;
  color:#fff;
  box-shadow:none;
}
:root[data-theme="light"] .ai-card{
  background:linear-gradient(135deg,rgba(132,89,230,.04),rgba(31,166,216,.02));
  border-color:rgba(132,89,230,.24);
  border-left-color:var(--ai-purple);
}
:root[data-theme="light"] .ai-card .ttl{ color:var(--ai-purple); }
:root[data-theme="light"] .ring5bar{
  background:#fff;
  border-color:#dde6f2;
}
:root[data-theme="light"] .ring-step{
  background:#fff;
  border-color:#dde6f2;
}
:root[data-theme="light"] .ring-step:hover,
:root[data-theme="light"] .kpi-card:hover{
  box-shadow:0 4px 10px rgba(31,55,98,.10);
}
:root[data-theme="light"] .layer-btn{
  background:#fff;
  border-color:#d8e2f0;
  color:var(--text-soft);
}
:root[data-theme="light"] .layer-btn:hover{
  background:#eef5ff;
  border-color:var(--gov-blue);
  color:var(--gov-blue);
}
:root[data-theme="light"] .layer-btn.on{
  background:rgba(36,87,214,.06);
  border-color:rgba(36,87,214,.35);
  color:var(--gov-blue);
}