{% extends "base.html" %}
{% block content %}
  <section class="card">
    <div id="msf-indicator" class="msf-indicator">
      <span class="msf-dot" id="msf-dot"></span>
      <span id="msf-label">Metasploit: checking…</span>
      <span id="msf-sessions" class="msf-sessions">0</span>
    </div>
    <div id="msf-session-list"></div>
    <h2>Tool Catalog</h2>
    <div id="catalog"></div>

    <div id="view-tabs" class="view-tabs">
      <button class="view-tab active" data-view="recent">Recent</button>
      <button class="view-tab" data-view="tree">Tree</button>
      <button class="view-tab" data-view="loot">Loot</button>
      <button class="view-tab" data-view="chain">Chain</button>
      <button class="view-tab" data-view="ai">AI</button>
      <button class="view-tab" data-view="approvals">Approvals</button>
    </div>

    <div id="view-recent" class="view-pane active">
      <div id="history"></div>
    </div>

    <div id="view-tree" class="view-pane">
      <div id="tree"></div>
    </div>

    <div id="view-loot" class="view-pane">
      <div id="loot"></div>
    </div>

    <div id="view-chain" class="view-pane">
      <div id="chain"></div>
    </div>

    <div id="view-ai" class="view-pane">
      <div id="ai-runs"></div>
    </div>

    <div id="view-approvals" class="view-pane">
      <div id="approvals-list"></div>
    </div>
  </section>

  <section class="card">
    <div class="selected-label" id="selected-label">selected: (none)</div>
    <div class="row">
      <input type="text" id="target" placeholder="host or URL, e.g. 127.0.0.1">
      <input type="text" id="extra" placeholder="extra args (optional)">
      <button id="run">Run</button>
      <button id="cancel" class="danger" disabled>Cancel</button>
    </div>
    <div id="status">ready</div>
    <div id="findings"></div>
    <details id="output-wrap">
      <summary>Raw output</summary>
      <div id="output"></div>
    </details>
  </section>

  <div id="scope-modal" class="modal-backdrop" style="display:none">
    <div class="modal">
      <h2>Out of scope</h2>
      <p><strong id="scope-target"></strong> does not match any in-scope rule.</p>
      <table class="scope-info">
        <tr><td>Reason</td><td id="scope-reason"></td></tr>
        <tr><td>Rule</td><td id="scope-rule"></td></tr>
        <tr><td>Engagement</td><td id="scope-engagement"></td></tr>
      </table>
      <p class="hint">Overrides are logged. Only proceed if you have written authorization.</p>
      <div class="modal-actions">
        <button id="scope-cancel" class="danger">Cancel</button>
        <button id="scope-override">Run anyway (log this)</button>
      </div>
    </div>
  </div>
{% endblock %}