/* ============ SPOILS demolition map app ============ */

body.map-page{overflow:hidden; height:100vh; display:flex; flex-direction:column;}
.topbar .refresh-note{
  font-family:var(--font-mono); font-size:11px; color:var(--ink-soft);
  text-align:right; line-height:1.4;
}
.refresh-note b{color:var(--ink); font-weight:700;}

/* ---------- view tabs + filter bar ---------- */
.controlbar{
  border-bottom:2px solid var(--ink);
  background:var(--card);
  padding:10px 16px;
  display:flex; flex-wrap:wrap; gap:8px; align-items:center;
  z-index:1100;
}
.viewtabs{display:flex; border:2px solid var(--ink); border-radius:0; overflow:hidden;}
.viewtabs button{
  border:none; background:var(--white); padding:7px 16px;
  font-family:var(--font-mono); font-size:12.5px;
}
.viewtabs button+button{border-left:1.5px solid var(--ink);}
.viewtabs button.active{background:var(--ink); color:var(--concrete);}

.controlbar input[type=search], .controlbar select{
  font-family:var(--font-mono); font-size:12.5px;
  padding:7px 10px; border:2px solid var(--ink); border-radius:0;
  background:var(--white); color:var(--ink); max-width:170px;
}
.controlbar input[type=search]{min-width:170px;}
.controlbar .chk{
  display:flex; align-items:center; gap:5px;
  font-family:var(--font-mono); font-size:12px;
  border:1.5px solid var(--rule); border-radius:0;
  background:var(--white); padding:6px 10px; user-select:none; cursor:pointer;
}
.controlbar .chk input{accent-color:var(--ink);}
.controlbar .spacer{flex:1;}
.result-count{font-family:var(--font-mono); font-size:12px; color:var(--ink-soft);}

/* ---------- main split ---------- */
.workspace{flex:1; display:flex; min-height:0; position:relative;}
#mapPane{flex:1.4; min-width:0; position:relative;}
#map{position:absolute; inset:0; background:#EFEFEF;}

.results-pane{
  flex:1; min-width:340px; max-width:520px;
  border-left:2px solid var(--ink);
  background:var(--concrete);
  display:flex; flex-direction:column; min-height:0;
  position:relative;
}
.results-scroll{flex:1; overflow-y:auto; padding:12px;}

/* result cards */
.pcard{
  border:2px solid var(--ink); border-radius:0;
  background:var(--white); padding:12px 14px; margin-bottom:10px;
  cursor:pointer; transition:transform .1s;
}
.pcard:hover{transform:translateX(3px);}
.pcard.active{outline:3px solid var(--ink);}
.pcard-top{display:flex; justify-content:space-between; gap:8px; align-items:flex-start;}
.pcard h3{font-family:var(--font-display); font-weight:800; font-size:15.5px; line-height:1.25;}
.pcard .loc{font-family:var(--font-mono); font-size:11.5px; color:var(--ink-soft); margin-top:3px;}
.pcard .meta{margin-top:8px; display:flex; flex-wrap:wrap; gap:5px; align-items:center;}
.score-pip{
  font-family:var(--font-mono); font-size:11px; font-weight:600;
  border-radius:0; padding:2px 7px; border:1px solid var(--ink);
}
.score-pip.hi{background:var(--ink); color:var(--paper); border-color:var(--ink);}
.score-pip.mid{background:var(--paper); color:var(--ink); border:2px solid var(--ink); font-weight:700;}
.score-pip.lo{background:var(--paper); color:var(--grey); border-color:var(--rule);}

/* ---------- detail panel ---------- */
.detail-panel{
  position:absolute; inset:0; z-index:900;
  background:var(--concrete);
  overflow-y:auto; padding:16px;
  display:none; border-left:none;
}
.detail-panel.open{display:block;}
.detail-close{
  position:sticky; top:0; float:right;
  background:var(--ink); color:var(--concrete);
  border:none; font-family:var(--font-mono); font-size:12px;
  padding:6px 12px; border-radius:0; z-index:2;
}
.detail-panel h2{
  font-family:var(--font-display); font-weight:900; font-size:22px;
  line-height:1.15; margin:6px 0 4px; padding-right:70px;
}
.detail-panel .addr{font-family:var(--font-mono); font-size:12px; color:var(--ink-soft);}
.d-badges{margin:10px 0; display:flex; flex-wrap:wrap; gap:6px;}
.d-section{margin-top:16px; border-top:2px solid var(--rule); padding-top:12px;}
.d-section h4{
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--ink); margin-bottom:8px;
}
.kv{display:grid; grid-template-columns:130px 1fr; gap:4px 12px; font-size:13.5px;}
.kv dt{font-family:var(--font-mono); font-size:11.5px; color:var(--ink-soft); padding-top:1px;}
.kv dd{color:var(--ink);}
.why-box{
  background:var(--white); border:2px solid var(--ink); border-left:6px solid var(--ink);
  padding:10px 12px; font-size:13.5px; border-radius:0;
}
.mat-row{
  display:flex; justify-content:space-between; align-items:center;
  font-family:var(--font-mono); font-size:12px;
  padding:5px 0; border-bottom:1px dashed var(--rule);
}
.conf{font-size:10.5px; padding:1px 7px; border-radius:0; border:1px solid var(--rule);}
.conf.high{background:var(--ink); color:var(--paper); border-color:var(--ink);}
.conf.med{background:var(--paper); color:var(--ink); border:1.5px solid var(--ink); font-weight:600;}
.conf.low{color:var(--ink-soft);}
.src-list a{font-size:13px; display:block; padding:3px 0; color:var(--recover-dark); word-break:break-all;}

/* ---------- list view ---------- */
.listview{
  display:none; flex:1; overflow:auto; padding:16px; min-height:0;
}
.listview table{
  width:100%; border-collapse:collapse; background:var(--white);
  border:2px solid var(--ink); font-size:13px;
}
.listview th{
  font-family:var(--font-mono); font-size:11px; letter-spacing:0.08em;
  text-transform:uppercase; text-align:left;
  background:var(--ink); color:var(--concrete); padding:9px 10px;
  position:sticky; top:-16px;
}
.listview td{padding:8px 10px; border-bottom:1px solid var(--rule); vertical-align:top;}
.listview tr{cursor:pointer;}
.listview tr:hover td{background:var(--card);}
.listview td.mono{font-family:var(--font-mono); font-size:12px;}

/* ---------- dashboard view ---------- */
.dashview{display:none; flex:1; overflow:auto; padding:20px; min-height:0;}
.dash-inner{max-width:1100px; margin:0 auto;}
.dash-inner h2{
  font-family:var(--font-display); font-weight:900; font-size:26px;
  text-transform:uppercase; margin-bottom:4px;
}
.pulse{
  font-size:16px; margin:8px 0 20px; max-width:75ch;
  background:var(--white); border:2px solid var(--ink);
  border-left:6px solid var(--ink); padding:12px 14px; border-radius:0;
}
.dash-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:14px;}
.dash-card{border:2px solid var(--ink); background:var(--white); border-radius:0; padding:16px;}
.dash-card h3{
  font-family:var(--font-mono); font-size:11px; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--ink); margin-bottom:10px;
}
.dash-card ol{padding-left:18px; font-size:13.5px;}
.dash-card ol li{margin-bottom:8px; cursor:pointer;}
.dash-card ol li:hover{color:var(--recover-dark);}
.dash-card ol .sub{font-family:var(--font-mono); font-size:11px; color:var(--ink-soft); display:block;}
.hbar{display:flex; align-items:center; gap:8px; margin-bottom:6px; font-family:var(--font-mono); font-size:12px;}
.hbar .bar{height:14px; background:var(--ink); border-radius:1px; min-width:2px;}
.hbar.type .bar{background:var(--ink);}
.hbar .n{color:var(--ink-soft);}

/* ---------- exports ---------- */
.export-row{
  border-top:2px solid var(--ink); background:var(--card);
  padding:8px 12px; display:flex; gap:8px; flex-wrap:wrap; align-items:center;
}
.export-row .note{font-family:var(--font-mono); font-size:10.5px; color:var(--ink-soft); margin-left:auto;}

/* ---------- leaflet overrides ---------- */
.leaflet-container{font-family:var(--font-body);}
.leaflet-popup-content-wrapper{border-radius:0; border:2px solid var(--ink);}
.leaflet-popup-content{margin:10px 12px; font-size:13px;}
.leaflet-popup-content b{font-family:var(--font-display);}
.marker-cluster-custom{
  background:var(--ink); color:var(--paper);
  border:2px solid var(--paper); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono); font-weight:600; font-size:12px;
  box-shadow:0 0 0 2px var(--ink);
}
.pin{
  width:16px; height:16px; border-radius:50%;
  border:2.5px solid var(--ink); background:#9A9A9A;
  box-shadow:0 1px 3px rgba(0,0,0,.35);
}
.pin.new{background:var(--hivis);}
.pin.updated{background:var(--recover);}
.pin.closed{background:var(--rust); opacity:.65;}
.pin.approx{border-style:dashed; border-radius:3px; transform:rotate(45deg);}

/* map legend */
.map-legend{
  position:absolute; left:10px; bottom:10px; z-index:800;
  background:var(--white); border:2px solid var(--ink); border-radius:0;
  padding:8px 12px; font-family:var(--font-mono); font-size:11px;
}
.map-legend div{display:flex; align-items:center; gap:7px; margin:3px 0;}
.map-legend .pin{width:11px; height:11px; border-width:2px; box-shadow:none;}

/* ---------- responsive ---------- */
@media (max-width:900px){
  body.map-page{overflow:auto; height:auto;}
  .workspace{flex-direction:column;}
  #mapPane{height:52vh; flex:none;}
  .results-pane{max-width:none; border-left:none; border-top:2px solid var(--ink); max-height:60vh;}
  .topbar .refresh-note{display:none;}
}
