{% extends "base.html" %}
{% block title %}Tactical SIGINT — SignalOps{% endblock %}
{% block extra_style %}
/* ═══════════════════════════════════════════════
   TACTICAL SIGINT PANEL — real-time threat-focused UI
   Distinct from SIGINT Map (passive/historical overview)
   ═══════════════════════════════════════════════ */
.tac-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 18px; background: linear-gradient(135deg,rgba(138, 122, 184,0.08),rgba(194, 103, 103,0.04));
  border: 1px solid rgba(138, 122, 184,0.2); border-radius: 10px; margin-bottom: 16px;
}
.tac-header .pulse-dot {
  width:10px; height:10px; background:#74B095; border-radius:50%;
  box-shadow:0 0 8px #74B095; animation:tac-pulse 1.8s ease-in-out infinite;
  display:inline-block; margin-right:8px; vertical-align:middle;
}
@keyframes tac-pulse {
  0%,100% { opacity:1; transform:scale(1); }
  50%     { opacity:0.5; transform:scale(1.3); }
}
.tac-chip {
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 11px; border-radius:20px; font-size:11px; font-weight:600;
  font-family:'Rajdhani',sans-serif; letter-spacing:1px; cursor:pointer;
  transition:all 0.15s; user-select:none;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.02);
  color:var(--tm);
}
.tac-chip.active {
  background:rgba(138, 122, 184,0.2); color:#C3B8E2;
  border-color:rgba(138, 122, 184,0.5);
  box-shadow:0 0 10px rgba(138, 122, 184,0.3);
}
.tac-chip:hover { border-color:rgba(138, 122, 184,0.4); color:#C3B8E2; }
.tac-chip.danger.active {
  background:rgba(194, 103, 103,0.18); color:#E0A4A4;
  border-color:rgba(194, 103, 103,0.5);
  box-shadow:0 0 10px rgba(194, 103, 103,0.3);
}
.tac-chip.warning.active {
  background:rgba(201, 161, 90,0.15); color:#D9BD8C;
  border-color:rgba(201, 161, 90,0.45);
  box-shadow:0 0 10px rgba(201, 161, 90,0.3);
}
.tac-chip .count {
  background:rgba(0,0,0,0.3); padding:1px 6px; border-radius:10px;
  font-size:10px; font-weight:700;
}
.radius-slider {
  -webkit-appearance: none; appearance: none;
  width: 100%; height: 4px; border-radius: 2px;
  background: linear-gradient(90deg, rgba(138, 122, 184,0.5) 0%, rgba(138, 122, 184,0.1) 100%);
  outline: none;
}
.radius-slider::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 14px; height: 14px; border-radius: 50%;
  background: #B4A8D6; cursor: pointer;
  box-shadow: 0 0 8px rgba(138, 122, 184,0.6);
}
.device-card {
  background: var(--s);
  border: 1px solid rgba(255,255,255,0.05);
  border-left: 3px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  padding: 14px 16px;
  margin-bottom: 8px;
  transition: all 0.15s;
  position: relative;
  overflow: hidden;
}
.device-card:hover {
  border-color: rgba(138, 122, 184,0.3);
  border-left-color: rgba(138, 122, 184,0.6);
  transform: translateX(2px);
}
.device-card.is-new {
  border-left-color: #74B095;
  background: linear-gradient(90deg, rgba(116, 176, 149,0.08) 0%, var(--s) 30%);
}
.device-card.is-new::before {
  content: 'NEW'; position: absolute; top: 0; right: 0;
  background: #74B095; color: #0F1014; font-weight: 800;
  font-size: 9px; letter-spacing: 1.5px; padding: 2px 8px;
  border-radius: 0 8px 0 8px;
}
.device-card.is-suspicious {
  border-left-color: #C77B7B;
  background: linear-gradient(90deg, rgba(199, 123, 123,0.08) 0%, var(--s) 30%);
}
.device-card.is-watchlist {
  border-left-color: #FB7185;
  box-shadow: 0 0 12px rgba(251,113,133,0.15);
  animation: watchlist-pulse 2s ease-in-out infinite;
}
@keyframes watchlist-pulse {
  0%,100% { box-shadow: 0 0 12px rgba(251,113,133,0.15); }
  50%     { box-shadow: 0 0 20px rgba(251,113,133,0.4); }
}
.device-row {
  display: grid;
  grid-template-columns: 38px 1fr auto auto;
  gap: 12px; align-items: center;
}
.device-icon {
  width: 38px; height: 38px;
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.05);
}
.risk-pill {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 9px; border-radius: 12px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px; font-weight: 700;
  background: rgba(0,0,0,0.3);
  border: 1px solid;
}
.metric-card {
  background: linear-gradient(135deg, rgba(255,255,255,0.02) 0%, transparent 100%);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  padding: 12px 14px;
  text-align: center;
}
.metric-card .v {
  font-family: 'Rajdhani', sans-serif;
  font-size: 24px; font-weight: 700;
  line-height: 1.2;
}
.metric-card .l {
  font-size: 9px; color: var(--tm);
  letter-spacing: 1.5px; margin-top: 2px;
}
.btn-profile {
  background: rgba(138, 122, 184,0.1);
  color: #B4A8D6;
  border: 1px solid rgba(138, 122, 184,0.3);
  border-radius: 5px;
  padding: 4px 10px;
  font-size: 10px; font-weight: 600;
  letter-spacing: 1px;
  cursor: pointer;
  font-family: 'Rajdhani', sans-serif;
  transition: all 0.15s;
}
.btn-profile:hover {
  background: rgba(138, 122, 184,0.2);
  color: #C3B8E2;
}
.btn-profile.saved {
  background: rgba(116, 176, 149,0.1);
  color: #74B095;
  border-color: rgba(116, 176, 149,0.3);
}
/* ── Responsive (mobile/tablet only; desktop >900px unchanged) ── */
@media (max-width:900px){
  .tac-header{flex-wrap:wrap;gap:8px}
  .tac-header #tac-last-scan{text-align:left!important}
  .tac-header .tac-right{justify-content:flex-start!important}
  #metrics-row{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .s-ctrl-row>div{min-width:0}
  .s-ctrl-btns .btn{min-height:36px}
  .s-sources-note{overflow-wrap:anywhere}
  #tac-filters .tac-chip{min-height:32px}
  .device-card:hover{transform:none}
  .device-row>div:nth-child(2){overflow-wrap:anywhere}
  .btn-profile{min-height:32px}
  #rogue-list>div>div:first-child{flex-wrap:wrap;gap:4px}
  #rogue-list>div,#tracker-list>div,#gem-text{overflow-wrap:anywhere}
  #rf-threats-panel>div:first-child,#gemini-panel>div:first-child{flex-wrap:wrap;gap:6px}
}
@media (max-width:600px){
  .tac-header{padding:12px 14px}
  .tac-title{font-size:18px!important}
  .s-ctrl-row>div{min-width:0!important;flex:1 1 100%!important}
  .s-ctrl-btns .btn{flex:1 1 0;padding-left:10px;padding-right:10px}
  #metrics-row .metric-card{padding:10px 6px}
  #metrics-row .metric-card .v{font-size:20px}
  .s-filter-type{margin-left:0!important}
  #type-filter{flex:1 1 120px}
  #text-filter{width:100%!important;flex:1 1 100%}
  #s-export-btn{min-height:36px}
  .device-card{padding:12px}
  .device-row{grid-template-columns:38px minmax(0,1fr) auto;gap:10px}
  .device-row>div:nth-child(4){grid-column:1/-1;flex-direction:row!important;flex-wrap:wrap}
  .device-row>div:nth-child(4) .btn-profile{flex:1 1 0;min-height:36px}
  #no-data{padding:48px 16px!important}
}
{% endblock %}
{% block content %}

<div class="tac-header">
  <div>
    <div style="font-family:'Rajdhani',sans-serif;font-size:11px;letter-spacing:3px;color:var(--tm);margin-bottom:2px">
      <span class="pulse-dot"></span>Tactical SIGINT panel
    </div>
    <div class="tac-title" style="font-family:'Rajdhani',sans-serif;font-size:22px;font-weight:700;color:var(--t)">
      Real-time threat detection · Device fingerprinting
    </div>
  </div>
  <div class="tac-right" style="display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:flex-end">
  <span id="so-case-bar"></span>
  <div id="tac-last-scan" style="text-align:right;font-size:11px;color:var(--tm);font-family:'JetBrains Mono',monospace">
    <div style="color:var(--td)">Awaiting scan...</div>
  </div>
  </div>
</div>

<!-- SCAN CONTROL -->
<div class="card" style="margin-bottom:16px">
  <div class="s-ctrl-row" style="display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap">
    <div style="flex:1;min-width:220px">
      <div style="font-size:10px;color:var(--tm);letter-spacing:2px;margin-bottom:6px">Target coordinates</div>
      <div style="display:flex;gap:6px">
        <input id="s-lat" placeholder="Latitude" style="width:49%">
        <input id="s-lon" placeholder="Longitude" style="width:49%">
      </div>
    </div>
    <div style="min-width:220px">
      <div style="font-size:10px;color:var(--tm);letter-spacing:2px;margin-bottom:6px">
        Scan radius: <span id="radius-label" style="color:#B4A8D6">500m</span>
      </div>
      <input type="range" id="s-radius" class="radius-slider" min="100" max="5000" value="500" step="100">
    </div>
    <div class="s-ctrl-btns" style="display:flex;gap:8px">
      <button class="btn btn-p" id="s-scan-btn"> Full scan</button>
      <button class="btn btn-g" id="s-geo-btn"><svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 21s-7-6.2-7-11a7 7 0 0 1 14 0c0 4.8-7 11-7 11z"/><circle cx="12" cy="10" r="2.5"/></svg> My Area</button>
    </div>
  </div>
  <div class="s-sources-note" style="margin-top:10px;font-size:10px;color:var(--tm);letter-spacing:1px">
    Full scan: WiGLE WiFi+BT+Cell · OpenCellID · Shodan · Censys · Hunterhow · Netlas · LeakIX · ADSB · OpenSky · FOFA · BinaryEdge · Windy · OSM · Insecam — filtered by scan radius
  </div>
</div>

<!-- METRICS BAR -->
<div id="metrics-row" style="display:none;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:16px">
  <div class="metric-card"><div class="v" id="m-total" style="color:#B4A8D6">0</div><div class="l">Total</div></div>
  <div class="metric-card"><div class="v" id="m-new" style="color:#74B095">0</div><div class="l">NEW</div></div>
  <div class="metric-card"><div class="v" id="m-suspicious" style="color:#C77B7B">0</div><div class="l">Suspicious</div></div>
  <div class="metric-card"><div class="v" id="m-watchlist" style="color:#FB7185">0</div><div class="l">Watchlist</div></div>
  <div class="metric-card"><div class="v" id="m-high-risk" style="color:#C9A15A">0</div><div class="l">High risk</div></div>
  <div class="metric-card"><div class="v" id="m-threat-score" style="color:#B4A8D6">—</div><div class="l">Threat lvl</div></div>
</div>

<!-- QUICK FILTERS -->
<div id="tac-filters" style="display:none;margin-bottom:14px">
  <div style="display:flex;gap:8px;flex-wrap:wrap;align-items:center">
    <span style="font-size:10px;color:var(--tm);letter-spacing:2px;margin-right:6px">Quick filter:</span>
    <span class="tac-chip active" data-filter="all">ALL <span class="count" id="fc-all">0</span></span>
    <span class="tac-chip danger"  data-filter="suspicious"><svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 3l9.5 17h-19z"/><path d="M12 10v4M12 17.5v.01"/></svg> Suspicious <span class="count" id="fc-suspicious">0</span></span>
    <span class="tac-chip"         data-filter="new"> NEW <span class="count" id="fc-new">0</span></span>
    <span class="tac-chip danger"  data-filter="watchlist"><svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="9"/><circle cx="12" cy="12" r="4"/><path d="M12 2v3M12 19v3M2 12h3M19 12h3"/></svg> Watchlist <span class="count" id="fc-watchlist">0</span></span>
    <span class="tac-chip warning" data-filter="high-risk"><svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M13 2L4 14h7l-1 8 9-12h-7z"/></svg> High risk <span class="count" id="fc-high-risk">0</span></span>
    <span class="s-filter-type" style="margin-left:16px;font-size:10px;color:var(--tm);letter-spacing:2px">Type:</span>
    <select id="type-filter" style="width:130px;padding:5px 10px;font-size:11px">
      <option value="">All types</option>
      <option value="router">WiFi</option>
      <option value="camera">Camera</option>
      <option value="cell_tower">Cell Tower</option>
      <option value="drone">Drone</option>
      <option value="bluetooth">Bluetooth</option>
      <option value="iot_device">IoT</option>
      <option value="aircraft">Aircraft</option>
    </select>
    <input id="text-filter" placeholder="Search by name / IP / BSSID..." style="width:220px;padding:5px 10px;font-size:11px">
    <button class="btn btn-outline" id="s-export-btn" style="padding:5px 12px;font-size:11px;margin-left:auto"><svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 4v12M7 11l5 5 5-5M5 20h14"/></svg> JSON</button>
  </div>
</div>

<!-- RF THREAT PANEL -->
<div id="rf-threats-panel" style="display:none;background:rgba(199, 123, 123,0.04);border:1px solid rgba(199, 123, 123,0.25);border-radius:8px;padding:18px;margin-bottom:16px">
  <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:14px">
    <div class="section-hdr" style="margin:0;color:#C77B7B"><svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 3l9.5 17h-19z"/><path d="M12 10v4M12 17.5v.01"/></svg> RF Threat Analysis</div>
    <span id="rf-threat-count" class="badge badge-err"></span>
  </div>
  <div id="rogue-section" style="margin-bottom:14px;display:none">
    <div style="font-family:'Rajdhani',sans-serif;font-size:12px;font-weight:700;letter-spacing:2px;color:var(--td);margin-bottom:8px">ROGUE ACCESS POINTS (possible Evil Twin / rogue AP)</div>
    <div id="rogue-list" style="display:flex;flex-direction:column;gap:6px"></div>
  </div>
  <div id="tracker-section" style="display:none">
    <div style="font-family:'Rajdhani',sans-serif;font-size:12px;font-weight:700;letter-spacing:2px;color:var(--td);margin-bottom:8px">UNKNOWN BLUETOOTH TRACKERS (AirTag / Tile / SmartTag)</div>
    <div id="tracker-list" style="display:flex;flex-direction:column;gap:6px"></div>
  </div>
</div>

<!-- GEMINI ANALYSIS -->
<div id="gemini-panel" style="display:none;background:rgba(138, 122, 184,0.04);border:1px solid rgba(138, 122, 184,0.25);border-radius:8px;padding:20px;margin-bottom:16px">
  <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:12px">
    <div class="section-hdr" style="margin:0"> AI Tactical Assessment</div>
    <span id="gem-risk" class="badge"></span>
  </div>
  <div id="gem-text" style="font-size:12px;color:var(--td);line-height:1.8;white-space:pre-wrap"></div>
</div>

<!-- DEVICE LIST -->
<div id="device-list-container">
  <div id="no-data" style="text-align:center;padding:80px 20px;color:var(--tm);background:var(--s);border-radius:10px">
    <div style="font-size:42px;margin-bottom:14px;opacity:0.2"><svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 19a10 10 0 0 1 0-14"/><path d="M8.5 15.5a5 5 0 0 1 0-7"/><circle cx="12" cy="12" r="1.5"/><path d="M15.5 8.5a5 5 0 0 1 0 7"/><path d="M19 5a10 10 0 0 1 0 14"/></svg></div>
    <div style="font-family:'Rajdhani',sans-serif;letter-spacing:3px;font-size:15px">Awaiting target coordinates</div>
    <div style="font-size:11px;margin-top:8px;color:var(--tm)">Enter lat/lon and press SCAN — or tap MY AREA for GPS</div>
  </div>
  <div id="device-list" style="display:none"></div>
</div>

{% endblock %}
{% block scripts %}
<script src="/static/js/so-cases.js" defer></script>
<script>
// ══════════════════════════════════════════════
// TACTICAL SIGINT PANEL
// ══════════════════════════════════════════════
let allDevices = [];
let currentFilter = 'all';
let scanCenter = null;
let watchlistHits = new Set();

function loadSeen(){ try { return new Set(JSON.parse(localStorage.getItem('sigops_seen_devs')||'[]')); } catch(e){ return new Set(); } }
function saveSeen(s){ try { localStorage.setItem('sigops_seen_devs', JSON.stringify(Array.from(s).slice(-2000))); } catch(e){} }
let seenDevices = loadSeen();

const typeColor = {
  router:'#60A5FA', camera:'#EF4444', dashcam:'#F97316', cell_tower:'#C084FC',
  drone:'#A78BFA', bluetooth:'#3B82F6', ble:'#3B82F6', iot_device:'#FBBF24',
  tracker:'#FB7185', aircraft:'#38BDF8', tv:'#4ADE80', car:'#FACC15',
  headphone:'#22D3EE', obd:'#FB923C'
};
const typeIcon = {
  router:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M2 9a15 15 0 0 1 20 0"/><path d="M5.5 12.5a10 10 0 0 1 13 0"/><path d="M9 16a5 5 0 0 1 6 0"/><path d="M12 19.5v.01"/></svg>',
  camera:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="2" y="6" width="14" height="12" rx="2"/><path d="M16 10l6-3v10l-6-3"/></svg>',
  dashcam:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="2" y="6" width="14" height="12" rx="2"/><path d="M16 10l6-3v10l-6-3"/></svg>',
  cell_tower:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 10v12"/><path d="M8 22l4-12 4 12"/><path d="M7.5 6.5a6.4 6.4 0 0 1 9 0"/><path d="M5 4a10 10 0 0 1 14 0"/></svg>',
  drone:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="5" cy="5" r="2.5"/><circle cx="19" cy="5" r="2.5"/><circle cx="5" cy="19" r="2.5"/><circle cx="19" cy="19" r="2.5"/><path d="M7 7l3 3M17 7l-3 3M7 17l3-3M17 17l-3-3"/><rect x="9.5" y="9.5" width="5" height="5" rx="1"/></svg>',
  bluetooth:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 7l10 10-5 5V2l5 5L7 17"/></svg>',
  ble:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 7l10 10-5 5V2l5 5L7 17"/></svg>',
  iot_device:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="6" y="6" width="12" height="12" rx="2"/><path d="M9 2v4M15 2v4M9 18v4M15 18v4M2 9h4M2 15h4M18 9h4M18 15h4"/></svg>',
  tracker:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 12l-8 8-9-9V3h8z"/><circle cx="7.5" cy="7.5" r="1.5"/></svg>',
  aircraft:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 15.5l-8-4.5V5a1.5 1.5 0 0 0-3 0v6l-8 4.5V17l8-2.5V19l-2 1.5V22l3.5-1 3.5 1v-1.5L13 19v-4.5l8 2.5z"/></svg>',
  tv:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="2" y="5" width="20" height="13" rx="2"/><path d="M8 21h8"/></svg>',
  car:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 17h14v-5l-2-5H7l-2 5z"/><circle cx="8" cy="17" r="2"/><circle cx="16" cy="17" r="2"/></svg>',
  headphone:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 15v-3a8 8 0 0 1 16 0v3"/><rect x="3" y="14" width="4" height="6" rx="1"/><rect x="17" y="14" width="4" height="6" rx="1"/></svg>',
  obd:'<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 2v6M15 2v6M6 8h12v4a6 6 0 0 1-12 0z"/><path d="M12 18v4"/></svg>'
};

// SUSPICIOUSNESS SCORING — tactical-specific logic
function computeSuspicion(d){
  let score = 0;
  const reasons = [];
  const enc = (d.encryption||'').toUpperCase();

  if(enc === 'OPEN' || enc === 'NONE' || enc === ''){
    if(d.type === 'router'){ score += 25; reasons.push('Open WiFi (no encryption)'); }
  }
  if(enc === 'WEP'){ score += 35; reasons.push('Weak WEP encryption (deprecated 2004)'); }

  const suspPatterns = /^(free[\s_-]?wifi|public[\s_-]?wifi|guest[\s_-]?wifi|xfinity.*free|starbucks.*free|att.*guest)/i;
  if(suspPatterns.test(d.ssid||'')){ score += 20; reasons.push('Generic honeypot-like SSID'); }

  if(!d.ssid && d.type === 'router' && d.signal && d.signal > -65){
    score += 15; reasons.push('Hidden SSID + strong signal (possible surveillance)');
  }

  if(d.signal != null && d.signal > -55 && (d.type==='router'||d.type==='bluetooth'||d.type==='ble')){
    score += 15; reasons.push('Very close signal (<50m, ' + d.signal + ' dBm)');
  }

  if(d.bssid){
    const firstByte = parseInt(d.bssid.split(':')[0], 16);
    if(!isNaN(firstByte) && (firstByte & 0x02)){
      score += 10; reasons.push('Randomized MAC (privacy / anti-tracking)');
    }
  }

  if(d.type === 'tracker'){ score += 40; reasons.push('Bluetooth tracker (AirTag/Tile/SmartTag)'); }
  if(d.type === 'drone'){ score += 30; reasons.push('Drone RF signature'); }
  if(d.type === 'camera' && d.auth === false){
    score += 35; reasons.push('Unauthenticated camera (publicly accessible)');
  }

  return { score: Math.min(score, 100), reasons };
}

// Haversine
function distMeters(lat1, lon1, lat2, lon2){
  if(lat1==null||lon1==null||lat2==null||lon2==null) return null;
  const R = 6371000;
  const toRad = d => d * Math.PI / 180;
  const dLat = toRad(lat2 - lat1);
  const dLon = toRad(lon2 - lon1);
  const a = Math.sin(dLat/2)**2 + Math.cos(toRad(lat1))*Math.cos(toRad(lat2))*Math.sin(dLon/2)**2;
  return 2 * R * Math.asin(Math.sqrt(a));
}

async function doScan(){
  const lat = parseFloat(document.getElementById('s-lat').value);
  const lon = parseFloat(document.getElementById('s-lon').value);
  if(isNaN(lat)||isNaN(lon)){ alert('Enter valid coordinates'); return; }

  scanCenter = {lat, lon};
  const btn = document.getElementById('s-scan-btn');
  const origBtnText = btn.innerHTML;
  btn.innerHTML = '◌ SCANNING...';
  btn.disabled = true;

  document.getElementById('no-data').innerHTML = `
    <div style="font-size:28px;animation:spin 1s linear infinite;display:inline-block;color:#A78BFA;margin-bottom:10px">◌</div>
    <div style="font-family:'Rajdhani',sans-serif;letter-spacing:2.5px;color:#A78BFA">COLLECTING RF DATA...</div>
    <div style="font-size:10px;color:var(--tm);margin-top:8px">WiGLE · OpenCellID · Shodan · Censys · FOFA · BinaryEdge · Windy · OSM · Insecam · ADSB</div>`;
  document.getElementById('no-data').style.display = 'block';
  document.getElementById('device-list').style.display = 'none';
  document.getElementById('gemini-panel').style.display = 'none';
  document.getElementById('rf-threats-panel').style.display = 'none';
  document.getElementById('metrics-row').style.display = 'none';
  document.getElementById('tac-filters').style.display = 'none';

  try {
    // Full scan — backend returns everything: WiFi, BT, Cell, IoT, Aircraft, Cameras
    const res = await fetch(`/nearby?lat=${lat}&lon=${lon}&mode=wifi`);
    let data = {};
    try { data = await res.json(); } catch(_){ data = {}; }
    if(!res.ok) throw new Error((data && data.error) || ('HTTP ' + res.status));

    allDevices = Array.isArray(data.devices) ? data.devices : [];
    const rogue = Array.isArray(data.rogue) ? data.rogue : [];
    const trackers = Array.isArray(data.trackers) ? data.trackers : [];

    allDevices.forEach(d => {
      const key = d.bssid || d.ip || d.cell_id || d.ssid;
      if(key){
        d._key = String(key).toLowerCase();
        d.is_new = !seenDevices.has(d._key);
        seenDevices.add(d._key);
      }
      const susp = computeSuspicion(d);
      d.suspicion = susp.score;
      d.suspicion_reasons = susp.reasons;
      // Yaklaşık konumlu cihazlar için mesafe anlamsız (arama noktasının yanına konuldular)
      if(scanCenter && d.lat!=null && d.lon!=null && d.loc_quality !== 'approx'){
        d.distance = distMeters(scanCenter.lat, scanCenter.lon, d.lat, d.lon);
      }
    });
    saveSeen(seenDevices);

    // Watchlist check (backend endpoint)
    try {
      const wres = await fetch('/api/watchlist/check', {
        method: 'POST', headers: {'Content-Type':'application/json'},
        body: JSON.stringify({devices: allDevices, scan_source: 'surveillance'})
      });
      if(wres.ok){
        const wdata = await wres.json();
        // Backend returns hits as: {entry_id, type, value, device:{...}, priority, note, ...}
        // Extract device identifiers from each hit
        watchlistHits = new Set((wdata.hits||[]).map(h => {
          const dev = h.device || {};
          return String(dev.bssid || dev.ip || dev.ssid || h.value || '').toLowerCase();
        }));
        allDevices.forEach(d => { d.is_watchlist = watchlistHits.has(d._key || ''); });
      }
    } catch(e){ /* watchlist is optional */ }

    document.getElementById('tac-last-scan').innerHTML = `
      <div style="color:#4ADE80;font-weight:700">● SCAN COMPLETE</div>
      <div style="color:var(--tm);font-size:10px">${new Date().toLocaleTimeString()} · ${lat.toFixed(4)},${lon.toFixed(4)}</div>`;

    const metrics = {
      total:       allDevices.length,
      new_:        allDevices.filter(d => d.is_new).length,
      suspicious:  allDevices.filter(d => d.suspicion >= 40).length,
      watchlist:   allDevices.filter(d => d.is_watchlist).length,
      highRisk:    allDevices.filter(d => (d.risk||0) >= 70).length,
    };
    document.getElementById('m-total').textContent = metrics.total;
    document.getElementById('m-new').textContent = metrics.new_;
    document.getElementById('m-suspicious').textContent = metrics.suspicious;
    document.getElementById('m-watchlist').textContent = metrics.watchlist;
    document.getElementById('m-high-risk').textContent = metrics.highRisk;

    const threatScore = Math.min(100,
      metrics.suspicious * 10 +
      metrics.watchlist * 20 +
      metrics.highRisk * 8 +
      (rogue.length * 15) +
      (trackers.length * 10));
    const lvl = threatScore >= 70 ? 'CRITICAL' : threatScore >= 40 ? 'HIGH' : threatScore >= 20 ? 'MEDIUM' : 'LOW';
    const lvlColor = lvl==='CRITICAL'?'#F87171':lvl==='HIGH'?'#FB7185':lvl==='MEDIUM'?'#FBBF24':'#4ADE80';
    const lvlEl = document.getElementById('m-threat-score');
    lvlEl.textContent = lvl;
    lvlEl.style.color = lvlColor;

    document.getElementById('fc-all').textContent = metrics.total;
    document.getElementById('fc-new').textContent = metrics.new_;
    document.getElementById('fc-suspicious').textContent = metrics.suspicious;
    document.getElementById('fc-watchlist').textContent = metrics.watchlist;
    document.getElementById('fc-high-risk').textContent = metrics.highRisk;

    document.getElementById('metrics-row').style.display = 'grid';
    document.getElementById('tac-filters').style.display = 'block';
    document.getElementById('no-data').style.display = 'none';

    try {
      // Store the CURRENT scan's values (not a running max) so counters can go down
      let agg = {};
      try { agg = JSON.parse(localStorage.getItem('sigops_threat_agg') || '{}') || {}; } catch(_){ agg = {}; }
      if(typeof agg !== 'object' || Array.isArray(agg)) agg = {};
      agg.rogue          = rogue.length;
      agg.trackers       = trackers.length;
      agg.suspicious     = metrics.suspicious;
      agg.watchlist_hits = metrics.watchlist;
      agg.ts             = Date.now();
      localStorage.setItem('sigops_threat_agg', JSON.stringify(agg));
    } catch(e){}

    renderRFThreats(rogue, trackers);
    renderDeviceList();

    if(allDevices.length > 0){
      analyzeWithGemini(allDevices, lat, lon);
    }
  } catch(e){
    console.error(e);
    document.getElementById('no-data').innerHTML = '<div style="color:var(--danger)">✗ Connection failed: '+ escapeHtml(e && e.message) +'</div>';
  } finally {
    btn.innerHTML = origBtnText;
    btn.disabled = false;
  }
}

function renderDeviceList(){
  const radius = parseInt(document.getElementById('s-radius').value, 10);
  const typeF = document.getElementById('type-filter').value;
  const textF = (document.getElementById('text-filter').value||'').toLowerCase();

  let list = allDevices.filter(d => {
    if(scanCenter && d.distance != null && d.distance > radius) return false;
    if(typeF && d.type !== typeF) return false;
    if(currentFilter === 'suspicious' && d.suspicion < 40) return false;
    if(currentFilter === 'new' && !d.is_new) return false;
    if(currentFilter === 'watchlist' && !d.is_watchlist) return false;
    if(currentFilter === 'high-risk' && (d.risk||0) < 70) return false;
    if(textF){
      const hay = JSON.stringify(d).toLowerCase();
      if(!hay.includes(textF)) return false;
    }
    return true;
  });

  list.sort((a,b) => {
    const sa = (a.is_watchlist?1000:0) + (a.suspicion||0) + (a.is_new?30:0) + (a.risk||0)*0.3;
    const sb = (b.is_watchlist?1000:0) + (b.suspicion||0) + (b.is_new?30:0) + (b.risk||0)*0.3;
    return sb - sa;
  });

  const container = document.getElementById('device-list');
  if(list.length === 0){
    container.innerHTML = `<div style="text-align:center;padding:60px;color:var(--tm);background:var(--s);border-radius:8px">
      <div style="font-size:30px;opacity:0.2;margin-bottom:10px"></div>
      <div style="font-family:'Rajdhani',sans-serif;letter-spacing:2px">NO DEVICES MATCH CURRENT FILTERS</div>
      <div style="font-size:11px;margin-top:6px">Try expanding radius or clearing filters</div>
    </div>`;
    container.style.display = 'block';
    return;
  }

  const savedProfiles = getSavedProfileKeys();

  container.innerHTML = list.map((d,idx) => {
    const name = getDeviceName(d);
    const color = typeColor[d.type] || '#9896AE';
    const icon = typeIcon[d.type] || '<svg class="so-ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="M12 8v5M12 16.5v.01"/></svg>';
    const riskColor = (d.risk||0) >= 70 ? '#F87171' : (d.risk||0) >= 40 ? '#FBBF24' : '#4ADE80';
    const suspColor = d.suspicion >= 60 ? '#F87171' : d.suspicion >= 30 ? '#FBBF24' : '#9896AE';
    const dist = d.distance != null ? formatDistance(d.distance) : null;

    let cardClass = 'device-card';
    if(d.is_watchlist) cardClass += ' is-watchlist';
    else if(d.suspicion >= 40) cardClass += ' is-suspicious';
    else if(d.is_new) cardClass += ' is-new';

    const devKey = d._key || '';
    const isSaved = savedProfiles.has(devKey);

    // Store device index so profile button can look it up
    return `<div class="${cardClass}" data-idx="${idx}">
      <div class="device-row" data-toggle-idx="${idx}" style="cursor:pointer">
        <div class="device-icon" style="color:${color};border-color:${color}40;background:${color}15">${icon}</div>
        <div style="min-width:0">
          <div style="display:flex;align-items:center;gap:8px;margin-bottom:3px;flex-wrap:wrap">
            <span style="font-family:'Rajdhani',sans-serif;font-weight:700;color:var(--t);font-size:14px">${escapeHtml(name)}</span>
            ${d.is_watchlist ? '<span class="badge" style="background:#FB7185;color:#0F1014;font-weight:700">WATCHLIST</span>' : ''}
            <span style="background:${color}22;color:${color};font-size:9px;padding:2px 7px;border-radius:10px;letter-spacing:1px;font-weight:700">${escapeHtml(String(d.type||'?').toUpperCase())}</span>
          </div>
          <div style="font-size:10px;color:var(--tm);font-family:'JetBrains Mono',monospace;line-height:1.5">
            ${d.bssid ? `BSSID: ${escapeHtml(d.bssid)} · ` : ''}${d.ip ? `IP: ${escapeHtml(d.ip)} · ` : ''}${d.vendor ? `${escapeHtml(d.vendor)} · ` : ''}${d.source ? `src: ${escapeHtml(d.source)}` : ''}
          </div>
          ${d.suspicion >= 30 ? `
            <div style="margin-top:6px;font-size:10px;color:${suspColor};line-height:1.5">
              <span style="font-weight:700">Suspicion ${d.suspicion}/100:</span> ${d.suspicion_reasons.slice(0,2).map(escapeHtml).join(' · ')}
            </div>` : ''}
        </div>
        <div style="text-align:right;font-size:10px;color:var(--tm);line-height:1.6">
          ${dist ? `<div style="color:#C4B5FD">${dist}</div>` : ''}
          ${d.loc_quality === 'approx' ? `<div style="color:#FBBF24" title="Kaynak koordinat vermedi">≈ approx loc</div>` : ''}
          ${d.signal != null ? `<div>${escapeHtml(d.signal)} dBm</div>` : ''}
          ${d.encryption ? `<div style="color:${d.encryption==='OPEN'||d.encryption==='WEP'?'#F87171':'var(--tm)'}">${escapeHtml(d.encryption)}</div>` : ''}
          <span class="risk-pill" style="color:${riskColor};border-color:${riskColor}60">R:${escapeHtml(d.risk||0)}</span>
        </div>
        <div style="display:flex;flex-direction:column;gap:4px" onclick="event.stopPropagation()">
          <button class="btn-profile ${isSaved?'saved':''}" data-save-idx="${idx}">${isSaved ? '✓ SAVED' : '+ PROFILE'}</button>
          <button class="btn-profile" data-expand-idx="${idx}" style="background:rgba(96,165,250,0.1);color:#60A5FA;border-color:rgba(96,165,250,0.3)">▼ DETAILS</button>
        </div>
      </div>
      <div class="device-detail" id="dev-detail-${idx}" style="display:none;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,0.06)">
        ${renderDeviceDetail(d)}
      </div>
    </div>`;
  }).join('');
  container.style.display = 'block';

  // Bind profile save buttons
  container.querySelectorAll('.btn-profile[data-save-idx]').forEach(b => {
    b.addEventListener('click', (e) => {
      e.stopPropagation();
      const i = parseInt(b.dataset.saveIdx, 10);
      saveToProfile(list[i]);
    });
  });

  // Bind expand buttons + row-click toggle
  const toggleDetail = (idx, btn) => {
    const el = document.getElementById('dev-detail-' + idx);
    if(!el) return;
    const open = el.style.display !== 'none';
    el.style.display = open ? 'none' : 'block';
    if(btn) btn.innerHTML = open ? '▼ DETAILS' : '▲ HIDE';
  };
  container.querySelectorAll('.btn-profile[data-expand-idx]').forEach(b => {
    b.addEventListener('click', (e) => {
      e.stopPropagation();
      toggleDetail(parseInt(b.dataset.expandIdx, 10), b);
    });
  });
  container.querySelectorAll('.device-row[data-toggle-idx]').forEach(row => {
    row.addEventListener('click', () => {
      const idx = parseInt(row.dataset.toggleIdx, 10);
      const btn = row.parentElement.querySelector('[data-expand-idx="'+idx+'"]');
      toggleDetail(idx, btn);
    });
  });
}

// Render the full detail panel for a device — shows every field the backend gave us
function renderDeviceDetail(d){
  // Group fields into sections for readability
  const identity = [
    ['SSID',      d.ssid],
    ['BSSID',     d.bssid],
    ['IP',        d.ip],
    ['Port',      d.port],
    ['Cell ID',   d.cell_id],
    ['Hostname',  d.hostname],
    ['Vendor',    d.vendor],
    ['Org / ISP', d.org],
    ['Organization', d.organization],
  ];
  const location = [
    ['Latitude',   d.lat != null ? Number(d.lat).toFixed(5) : null],
    ['Longitude',  d.lon != null ? Number(d.lon).toFixed(5) : null],
    ['Country',    d.country],
    ['Country ISO',d.country_iso],
    ['City',       d.city],
    ['Region',     d.region],
    ['Distance',   d.distance != null ? formatDistance(d.distance) : null],
    ['Location quality', d.loc_quality === 'approx' ? '≈ Approximate — source gave no coordinates'
                       : d.loc_quality === 'ip' ? 'IP geolocation (city-level)'
                       : d.loc_quality === 'exact' ? 'Reported by source' : null],
  ];
  const technical = [
    ['Type',        d.type],
    ['Radio',       d.radio],
    ['MCC',         d.mcc],
    ['MNC',         d.mnc],
    ['LAC/TAC',     d.lac],
    ['Operator',    d.operator],
    ['Encryption',  d.encryption],
    ['Signal',      d.signal != null ? d.signal + ' dBm' : null],
    ['Channel',     d.channel],
    ['Frequency',   d.frequency],
    ['Product',     d.product],
    ['OS',          d.os],
    ['Protocol',    d.protocol],
  ];
  const meta = [
    ['Source',      d.source],
    ['Risk Score',  d.risk != null ? d.risk + '/100' : null],
    ['Suspicion',   d.suspicion != null ? d.suspicion + '/100' : null],
    ['Timestamp',   d.timestamp],
    ['First seen',  d.first_seen],
    ['Last seen',   d.last_seen],
    ['Auth required', d.auth === false ? 'NO (publicly accessible)' : d.auth === true ? 'YES' : null],
    ['Is New',      d.is_new ? 'YES (first time seen)' : null],
    ['Is Tracker',  d.is_tracker ? 'YES' : null],
    ['IMSI Suspect',d.imsi_suspect ? 'YES (' + (d.imsi_level||'') + ')' : null],
    ['Rogue AP',    d.rogue_level || null],
  ];

  const renderSection = (title, fields, color) => {
    const visible = fields.filter(f => f[1] !== null && f[1] !== undefined && f[1] !== '');
    if(!visible.length) return '';
    return `
      <div style="margin-bottom:14px">
        <div style="font-family:'Rajdhani',sans-serif;font-size:10px;letter-spacing:2px;color:${color};margin-bottom:8px;font-weight:700">${title}</div>
        <div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px 16px;font-size:11px">
          ${visible.map(f => `
            <div style="display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid rgba(255,255,255,0.03)">
              <span style="color:var(--tm);font-family:'JetBrains Mono',monospace;font-size:10px">${f[0]}</span>
              <span style="color:var(--t);text-align:right;word-break:break-word;max-width:60%">${escapeHtml(String(f[1]))}</span>
            </div>`).join('')}
        </div>
      </div>`;
  };

  // Suspicion reasons (full list, not just first 2)
  const suspReasonsBlock = (d.suspicion_reasons && d.suspicion_reasons.length) ? `
    <div style="margin-bottom:14px;background:rgba(248,113,113,0.05);border:1px solid rgba(248,113,113,0.2);border-radius:6px;padding:10px 14px">
      <div style="font-family:'Rajdhani',sans-serif;font-size:10px;letter-spacing:2px;color:#F87171;margin-bottom:6px;font-weight:700">SUSPICION ANALYSIS — ${d.suspicion}/100</div>
      <ul style="margin:0;padding-left:16px;color:var(--td);font-size:11px;line-height:1.7">
        ${d.suspicion_reasons.map(r => '<li>' + escapeHtml(r) + '</li>').join('')}
      </ul>
    </div>` : '';

  // CVE/Vulnerabilities (Shodan may return a dict keyed by CVE id)
  const vulnList = Array.isArray(d.vulns) ? d.vulns : (d.vulns && typeof d.vulns === 'object' ? Object.keys(d.vulns) : []);
  const tagList = Array.isArray(d.tags) ? d.tags : [];
  const vulnsBlock = vulnList.length ? `
    <div style="margin-bottom:14px;background:rgba(251,191,36,0.05);border:1px solid rgba(251,191,36,0.2);border-radius:6px;padding:10px 14px">
      <div style="font-family:'Rajdhani',sans-serif;font-size:10px;letter-spacing:2px;color:#FBBF24;margin-bottom:6px;font-weight:700">CVE VULNERABILITIES (${vulnList.length})</div>
      <div style="display:flex;flex-wrap:wrap;gap:4px">
        ${vulnList.map(v => `<span style="font-family:'JetBrains Mono',monospace;font-size:10px;background:rgba(251,191,36,0.15);color:#FDE68A;padding:2px 7px;border-radius:4px">${escapeHtml(v)}</span>`).join('')}
      </div>
    </div>` : '';

  // Tags from Shodan / Censys
  const tagsBlock = tagList.length ? `
    <div style="margin-bottom:14px">
      <div style="font-family:'Rajdhani',sans-serif;font-size:10px;letter-spacing:2px;color:var(--tm);margin-bottom:6px;font-weight:700">TAGS</div>
      <div style="display:flex;flex-wrap:wrap;gap:4px">
        ${tagList.map(t => `<span style="font-size:10px;background:rgba(139,92,246,0.1);color:#C4B5FD;padding:2px 7px;border-radius:4px">${escapeHtml(t)}</span>`).join('')}
      </div>
    </div>` : '';

  // Banner (raw service output)
  const bannerBlock = d.banner ? `
    <div style="margin-bottom:14px">
      <div style="font-family:'Rajdhani',sans-serif;font-size:10px;letter-spacing:2px;color:var(--tm);margin-bottom:6px;font-weight:700">BANNER / RAW DATA</div>
      <div style="background:rgba(0,0,0,0.3);border:1px solid rgba(255,255,255,0.04);border-radius:4px;padding:10px 12px;font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--td);max-height:120px;overflow-y:auto;white-space:pre-wrap;word-break:break-all">${escapeHtml(d.banner)}</div>
    </div>` : '';

  // External verification links
  const _u = v => encodeURIComponent(String(v));
  const _ip = d.ip ? String(d.ip) : '';
  const mapsUrl = (d.lat && d.lon) ? escapeHtml(`https://www.google.com/maps/@${_u(d.lat)},${_u(d.lon)},18z`) : null;
  const shodanUrl = _ip && !_ip.includes(':') ? escapeHtml(`https://www.shodan.io/host/${_u(_ip)}`) : null;
  const censysUrl = _ip && !_ip.includes(':') ? escapeHtml(`https://search.censys.io/hosts/${_u(_ip)}`) : null;
  const ocidUrl = (d.type === 'cell_tower' && d.mcc && d.mnc && d.lac && d.cell_id)
    ? escapeHtml(`https://opencellid.org/#zoom=15&lat=${_u(d.lat)}&lon=${_u(d.lon)}&mcc=${_u(d.mcc)}&mnc=${_u(d.mnc)}&lac=${_u(d.lac)}&cid=${_u(d.cell_id)}`) : null;

  const linksBlock = (mapsUrl || shodanUrl || censysUrl || ocidUrl) ? `
    <div style="display:flex;gap:6px;flex-wrap:wrap;margin-top:10px">
      ${mapsUrl ? `<a href="${mapsUrl}" target="_blank" rel="noopener" class="btn-profile" style="text-decoration:none">Maps</a>` : ''}
      ${shodanUrl ? `<a href="${shodanUrl}" target="_blank" rel="noopener" class="btn-profile" style="text-decoration:none;background:rgba(248,113,113,0.1);color:#F87171;border-color:rgba(248,113,113,0.3)">Shodan</a>` : ''}
      ${censysUrl ? `<a href="${censysUrl}" target="_blank" rel="noopener" class="btn-profile" style="text-decoration:none;background:rgba(251,113,133,0.1);color:#FB7185;border-color:rgba(251,113,133,0.3)">Censys</a>` : ''}
      ${ocidUrl ? `<a href="${ocidUrl}" target="_blank" rel="noopener" class="btn-profile" style="text-decoration:none;background:rgba(192,132,252,0.1);color:#C084FC;border-color:rgba(192,132,252,0.3)">OpenCellID</a>` : ''}
    </div>` : '';

  return `
    ${suspReasonsBlock}
    ${vulnsBlock}
    ${renderSection('IDENTITY', identity, '#A78BFA')}
    ${renderSection('LOCATION', location, '#60A5FA')}
    ${renderSection('TECHNICAL', technical, '#4ADE80')}
    ${renderSection('METADATA', meta, '#C084FC')}
    ${tagsBlock}
    ${bannerBlock}
    ${linksBlock}
  `;
}

function getDeviceName(d){
  const ssid = (d.ssid||'').trim();
  if(ssid && !/^[0-9a-f:]+$/i.test(ssid)) return ssid;
  if(d.vendor && d.vendor.toLowerCase() !== 'unknown'){
    const tLabel = {car:'Vehicle',tv:'Smart TV',dashcam:'Dashcam',headphone:'Audio',
      tracker:'Tracker',camera:'Camera',drone:'Drone',bluetooth:'BT',ble:'BLE'}[d.type] || 'Device';
    return d.vendor + ' ' + tLabel;
  }
  if(d.ip) return d.ip;
  if(d.bssid) return d.bssid.toUpperCase();
  if(d.cell_id) return 'Cell ' + d.cell_id;
  return 'Unknown ' + (d.type||'Node');
}

function formatDistance(m){
  if(m < 1000) return Math.round(m) + 'm';
  return (m/1000).toFixed(1) + 'km';
}

function escapeHtml(s){
  if(s==null) return '';
  return String(s).replace(/[&<>"']/g, c => ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c]));
}

// ──────────────────────────────────────────────
// PROFILE SAVING
// ──────────────────────────────────────────────
// Profiller artık sunucuda (/api/profiles). localStorage yalnızca sunucu yazımı başarısız olursa yedek.
let serverProfiles = new Map();   // kimlik (bssid|ip|cell_id|ssid, küçük harf) → dev_key
function _profIdent(p){ return String((p && (p.bssid||p.ip||p.cell_id||p.ssid)) || '').toLowerCase(); }
function _localProfiles(){
  try {
    const v = JSON.parse(localStorage.getItem('sigint_profiles') || '[]');
    return Array.isArray(v) ? v.filter(p => p && typeof p === 'object') : [];
  } catch(e){ return []; }
}
async function loadServerProfiles(){
  try {
    const r = await fetch('/api/profiles', {headers:{'Accept':'application/json'}});
    if(!r.ok) return;
    const j = await r.json();
    serverProfiles = new Map((j.profiles || []).map(p => [_profIdent(p.data), p.dev_key]).filter(x => x[0]));
    if(allDevices.length) renderDeviceList();
  } catch(e){}
}
function getSavedProfileKeys(){
  const set = new Set(serverProfiles.keys());
  _localProfiles().forEach(p => { const k = _profIdent(p); if(k) set.add(k); });
  return set;
}
async function saveToProfile(d){
  const key = _profIdent(d);
  try {
    const local = _localProfiles();
    const inLocal = !!key && local.some(p => _profIdent(p) === key);
    if(key && serverProfiles.has(key)){
      const r = await fetch('/api/profiles?key=' + encodeURIComponent(serverProfiles.get(key)), {method:'DELETE'});
      if(r.ok || r.status === 404) serverProfiles.delete(key);
      if(inLocal) localStorage.setItem('sigint_profiles', JSON.stringify(local.filter(p => _profIdent(p) !== key)));
    } else if(inLocal){
      localStorage.setItem('sigint_profiles', JSON.stringify(local.filter(p => _profIdent(p) !== key)));
    } else {
      let ok = false;
      try {
        const r = await fetch('/api/profiles', {method:'POST', headers:{'Content-Type':'application/json'},
                                                body: JSON.stringify({device: d})});
        if(r.ok){
          const j = await r.json();
          if(key && j && j.profile) serverProfiles.set(key, j.profile.dev_key);
          ok = true;
        }
      } catch(_){}
      if(!ok){                      // yedek: tarayıcıya yaz (eski davranış)
        d.saved_at = Date.now();
        local.push(d);
        localStorage.setItem('sigint_profiles', JSON.stringify(local));
      }
    }
  } catch(e){
    console.error(e);
    if(e && e.name === 'QuotaExceededError') alert('Profile storage is full — remove some saved profiles first.');
  }
  renderDeviceList();
}
loadServerProfiles();

function _fmtBssids(list){
  if(!Array.isArray(list) || !list.length) return '';
  const shown = list.slice(0,3).map(String).join(', ');
  return list.length > 3 ? `${shown} +${list.length-3}` : shown;
}

function renderRFThreats(rogue, trackers){
  const panel = document.getElementById('rf-threats-panel');
  const rogueSection = document.getElementById('rogue-section');
  const trackerSection = document.getElementById('tracker-section');

  if(!rogue.length && !trackers.length){ panel.style.display='none'; return; }
  panel.style.display='block';
  document.getElementById('rf-threat-count').textContent = (rogue.length + trackers.length) + ' detected';

  if(rogue.length){
    rogueSection.style.display='block';
    document.getElementById('rogue-list').innerHTML = rogue.map(r => `
      <div style="background:var(--s);border:1px solid rgba(248,113,113,0.25);border-left:3px solid #F87171;border-radius:6px;padding:10px 12px">
        <div style="display:flex;justify-content:space-between;font-family:'Rajdhani',sans-serif;font-weight:700;font-size:13px;color:var(--t)">
          <span>${escapeHtml(r.ssid||'Unnamed')}</span>
          <span style="color:#F87171;font-size:11px">${escapeHtml(r.level||'')} · ${escapeHtml(r.severity||'')}/100</span>
        </div>
        <div style="font-size:10px;color:var(--tm);margin-top:4px;font-family:'JetBrains Mono',monospace">
          ${escapeHtml(_fmtBssids(r.bssids))} · ${escapeHtml(r.count||(Array.isArray(r.bssids)?r.bssids.length:0)||2)} copies detected
        </div>
        <ul style="font-size:10px;color:var(--td);margin:4px 0 0;padding-left:16px">
          ${(Array.isArray(r.reasons)?r.reasons:[]).map(x => '<li>'+escapeHtml(x)+'</li>').join('')}
        </ul>
      </div>`).join('');
  } else { rogueSection.style.display='none'; }

  if(trackers.length){
    trackerSection.style.display='block';
    document.getElementById('tracker-list').innerHTML = trackers.map(t => `
      <div style="background:var(--s);border:1px solid rgba(251,113,133,0.25);border-left:3px solid #FB7185;border-radius:6px;padding:10px 12px">
        <div style="font-family:'Rajdhani',sans-serif;font-weight:700;font-size:13px;color:var(--t)">${escapeHtml(t.brand||'Tracker')}</div>
        <div style="font-size:10px;color:var(--tm);margin-top:4px;font-family:'JetBrains Mono',monospace">
          ${escapeHtml(t.bssid||t.ssid||'')}
        </div>
      </div>`).join('');
  } else { trackerSection.style.display='none'; }
}

async function analyzeWithGemini(devices, lat, lon){
  try {
    const res = await fetch('/api/analyze', {
      method: 'POST',
      headers: {'Content-Type':'application/json'},
      body: JSON.stringify({devices, lat, lon, context: 'tactical_surveillance'})
    });
    if(!res.ok) return;
    const d = await res.json();
    if(d.analysis){
      document.getElementById('gem-text').textContent = d.analysis;
      const riskEl = document.getElementById('gem-risk');
      const lvl = d.risk_level || 'LOW';
      riskEl.textContent = 'Gemini: ' + lvl;
      riskEl.style.color = lvl==='HIGH'||lvl==='CRITICAL'?'#F87171':lvl==='MEDIUM'?'#FBBF24':'#4ADE80';
      document.getElementById('gemini-panel').style.display = 'block';
    }
  } catch(e){}
}

function useMyLocation(){
  const btn = document.getElementById('s-geo-btn');
  const orig = btn.innerHTML;
  btn.textContent = '…';
  btn.disabled = true;
  const apply = (lat, lon) => {
    document.getElementById('s-lat').value = lat.toFixed(5);
    document.getElementById('s-lon').value = lon.toFixed(5);
    try { localStorage.setItem('sigops_last_coords', JSON.stringify({lat, lon})); } catch(e){}
    btn.innerHTML = orig; btn.disabled = false;
    doScan();
  };
  if(navigator.geolocation){
    navigator.geolocation.getCurrentPosition(
      p => apply(p.coords.latitude, p.coords.longitude),
      () => {
        try {
          const saved = JSON.parse(localStorage.getItem('sigops_last_coords') || 'null');
          if(saved){ apply(saved.lat, saved.lon); return; }
        } catch(e){}
        btn.innerHTML = orig; btn.disabled = false;
        alert('Location denied and no cached coords');
      },
      {timeout: 8000}
    );
  } else {
    btn.innerHTML = orig; btn.disabled = false;
    alert('Geolocation not supported');
  }
}

function exportJSON(){
  if(!allDevices.length){ alert('Nothing to export yet'); return; }
  const blob = new Blob([JSON.stringify({scan_center:scanCenter,devices:allDevices,timestamp:new Date().toISOString()},null,2)],
    {type:'application/json'});
  const a = document.createElement('a');
  a.href = URL.createObjectURL(blob);
  a.download = 'sigint_scan_' + Date.now() + '.json';
  a.click();
}

function _bindSurveillanceHandlers(){
  document.getElementById('s-scan-btn').addEventListener('click', doScan);
  document.getElementById('s-geo-btn').addEventListener('click', useMyLocation);
  document.getElementById('s-export-btn').addEventListener('click', exportJSON);
  document.getElementById('type-filter').addEventListener('change', renderDeviceList);
  document.getElementById('text-filter').addEventListener('input', renderDeviceList);

  const rSlider = document.getElementById('s-radius');
  const rLabel = document.getElementById('radius-label');
  rSlider.addEventListener('input', () => {
    const v = parseInt(rSlider.value, 10);
    rLabel.textContent = v < 1000 ? (v + 'm') : ((v/1000).toFixed(1) + 'km');
    if(allDevices.length) renderDeviceList();
  });

  document.querySelectorAll('.tac-chip[data-filter]').forEach(chip => {
    chip.addEventListener('click', () => {
      currentFilter = chip.dataset.filter;
      document.querySelectorAll('.tac-chip[data-filter]').forEach(c => c.classList.remove('active'));
      chip.classList.add('active');
      renderDeviceList();
    });
  });

  try {
    const saved = JSON.parse(localStorage.getItem('sigops_last_coords') || 'null');
    if(saved && saved.lat){
      document.getElementById('s-lat').value = saved.lat.toFixed(5);
      document.getElementById('s-lon').value = saved.lon.toFixed(5);
    }
  } catch(e){}

  console.log('[surveillance] tactical panel ready');
}

window.doScan = doScan;
window.useMyLocation = useMyLocation;
window.saveToProfile = saveToProfile;

// Vaka araç çubuğu (Save to case / Export) — so-cases.js defer ile yüklenir
document.addEventListener('DOMContentLoaded', () => {
  if(window.SignalOpsCase) SignalOpsCase.attach(document.getElementById('so-case-bar'), {
    kind: 'nearby', title: 'Tactical SIGINT',
    getDevices: () => allDevices,
    getCenter: () => scanCenter,
  });
});

if(document.readyState === 'loading'){
  document.addEventListener('DOMContentLoaded', _bindSurveillanceHandlers);
} else {
  _bindSurveillanceHandlers();
}
</script>
{% endblock %}