icdev 0.0.3__py3-none-any.whl

tools/dashboard/templates/pr_intelligence.html

@@ -0,0 +1,151 @@
+{% extends "base.html" %}
+{% block title %}{{ app_name }} — PR Intelligence{% endblock %}
+{% block content %}
+
+<h1>PR Intelligence — Automated Review Analysis</h1>
+
+<div class="intro-panel">
+    <h2>Security + Compliance in Every PR</h2>
+    <p>Analyze pull requests for security issues, compliance flags, and code quality before merge. Get actionable findings with severity ratings and remediation guidance.</p>
+    <div class="intro-steps">
+        <div class="intro-step"><span class="step-num">1</span><span class="step-text">Submit PR</span></div>
+        <div class="intro-step"><span class="step-num">2</span><span class="step-text">Analyze</span></div>
+        <div class="intro-step"><span class="step-num">3</span><span class="step-text">Review Report</span></div>
+    </div>
+</div>
+
+<div class="stat-grid">
+    <div class="stat-card">
+        <div class="label">PRs Analyzed</div>
+        <div class="value blue" id="pr-analyzed">0</div>
+    </div>
+    <div class="stat-card">
+        <div class="label">Security Issues</div>
+        <div class="value red" id="pr-security">0</div>
+    </div>
+    <div class="stat-card">
+        <div class="label">Compliance Flags</div>
+        <div class="value orange" id="pr-compliance">0</div>
+    </div>
+    <div class="stat-card">
+        <div class="label">Pass Rate</div>
+        <div class="value green" id="pr-pass-rate">—</div>
+    </div>
+</div>
+
+<!-- PR Analysis Form -->
+<div class="section-card">
+    <h2>Analyze Pull Request</h2>
+    <form id="pr-analyze-form" style="display: grid; gap: 12px; max-width: 600px;">
+        <div><label>Project ID</label><input type="text" id="pr-project-id" value="sparkpilot" class="input-field" style="width:100%"></div>
+        <div><label>PR Reference</label><input type="text" id="pr-reference" placeholder="e.g. #42 or branch name" class="input-field" style="width:100%"></div>
+        <div><label>Project Directory</label><input type="text" id="pr-project-dir" value="." class="input-field" style="width:100%"></div>
+        <button type="submit" class="btn btn-primary">Analyze PR</button>
+    </form>
+    <div id="pr-analyze-result" style="margin-top: 12px;"></div>
+</div>
+
+<!-- Analysis Results -->
+<div class="section-card">
+    <h2>Analysis Results</h2>
+    <table class="data-table">
+        <thead>
+            <tr>
+                <th>Report ID</th>
+                <th>PR Ref</th>
+                <th>Security</th>
+                <th>Compliance</th>
+                <th>Quality</th>
+                <th>Verdict</th>
+                <th>Actions</th>
+            </tr>
+        </thead>
+        <tbody id="pr-results-body">
+            <tr><td colspan="7" style="text-align:center; color: #888;">No analyses yet. Submit a PR above.</td></tr>
+        </tbody>
+    </table>
+</div>
+
+<script>
+const PROJECT_ID = 'sparkpilot';
+let analysisResults = [];
+
+function verdictBadge(verdict) {
+    const map = { pass: 'badge-green', fail: 'badge-red', warn: 'badge-orange', pending: 'badge-blue' };
+    return `<span class="badge ${map[verdict] || 'badge-gray'}">${verdict || 'unknown'}</span>`;
+}
+
+function severityBadge(count, label) {
+    if (count === 0) return `<span class="badge badge-green">0 ${label}</span>`;
+    if (count <= 2) return `<span class="badge badge-orange">${count} ${label}</span>`;
+    return `<span class="badge badge-red">${count} ${label}</span>`;
+}
+
+function renderResults() {
+    const tbody = document.getElementById('pr-results-body');
+    if (analysisResults.length === 0) return;
+    document.getElementById('pr-analyzed').textContent = analysisResults.length;
+    const secTotal = analysisResults.reduce((s, r) => s + (r.security_issues || 0), 0);
+    const compTotal = analysisResults.reduce((s, r) => s + (r.compliance_flags || 0), 0);
+    const passCount = analysisResults.filter(r => r.verdict === 'pass').length;
+    document.getElementById('pr-security').textContent = secTotal;
+    document.getElementById('pr-compliance').textContent = compTotal;
+    document.getElementById('pr-pass-rate').textContent = ((passCount / analysisResults.length) * 100).toFixed(0) + '%';
+
+    tbody.innerHTML = analysisResults.map(r => `<tr>
+        <td><code>${r.report_id || '—'}</code></td>
+        <td>${r.pr_reference || '—'}</td>
+        <td>${severityBadge(r.security_issues || 0, 'issues')}</td>
+        <td>${severityBadge(r.compliance_flags || 0, 'flags')}</td>
+        <td>${r.quality_score != null ? r.quality_score + '/100' : '—'}</td>
+        <td>${verdictBadge(r.verdict)}</td>
+        <td>${r.report_id ? '<button class="btn" onclick="viewReport(\'' + r.report_id + '\')">View</button>' : '—'}</td>
+    </tr>`).join('');
+}
+
+document.getElementById('pr-analyze-form').addEventListener('submit', async (e) => {
+    e.preventDefault();
+    const result = document.getElementById('pr-analyze-result');
+    result.innerHTML = '<em>Analyzing PR...</em>';
+    try {
+        const resp = await fetch('/api/pr-intel/analyze', {
+            method: 'POST',
+            headers: {'Content-Type': 'application/json'},
+            body: JSON.stringify({
+                project_id: document.getElementById('pr-project-id').value,
+                pr_reference: document.getElementById('pr-reference').value,
+                project_dir: document.getElementById('pr-project-dir').value,
+            }),
+        });
+        const data = await resp.json();
+        if (data.report_id) {
+            analysisResults.unshift(data);
+            renderResults();
+            result.innerHTML = `<div class="alert alert-success">Analysis complete — Report: ${data.report_id}</div>`;
+        } else {
+            result.innerHTML = `<div class="alert alert-error">Error: ${JSON.stringify(data.errors || data.error || data)}</div>`;
+        }
+    } catch (err) {
+        result.innerHTML = `<div class="alert alert-error">${err.message}</div>`;
+    }
+});
+
+async function viewReport(reportId) {
+    try {
+        const data = await fetch(`/api/pr-intel/report/${reportId}`).then(r => r.json());
+        const result = document.getElementById('pr-analyze-result');
+        const findings = data.findings || [];
+        result.innerHTML = `<div class="card" style="margin-top:12px;">
+            <h3>Report: ${reportId}</h3>
+            <p>Verdict: ${verdictBadge(data.verdict)} | Security: ${data.security_issues || 0} | Compliance: ${data.compliance_flags || 0}</p>
+            ${findings.length > 0 ? '<table class="data-table"><thead><tr><th>Category</th><th>Severity</th><th>Description</th></tr></thead><tbody>' +
+                findings.map(f => '<tr><td>' + f.category + '</td><td><span class="badge badge-' + (f.severity === 'critical' || f.severity === 'high' ? 'red' : f.severity === 'medium' ? 'orange' : 'blue') + '">' + f.severity + '</span></td><td>' + f.description + '</td></tr>').join('') +
+            '</tbody></table>' : '<p>No findings.</p>'}
+        </div>`;
+    } catch (err) {
+        console.error('Report load error:', err);
+    }
+}
+</script>
+
+{% endblock %}

tools/dashboard/templates/proposals/detail.html

@@ -0,0 +1,300 @@
+{% extends "base.html" %}
+{% block title %}{{ app_name }} — {{ opportunity.title or 'Proposal' }}{% endblock %}
+{% block content %}
+<div style="display: flex; align-items: center; gap: 12px; margin-bottom: 8px;">
+    <a href="/govcon/proposals" style="color: #60a5fa; font-size: 13px;">&larr; Back to Proposals</a>
+</div>
+
+<div style="display: flex; justify-content: space-between; align-items: center;">
+    <h1>{{ opportunity.title or 'Proposal' }}</h1>
+    <span class="badge {% if opportunity.status == 'submitted' %}badge-green{% elif opportunity.status == 'draft' %}badge-blue{% else %}badge-orange{% endif %}"
+          style="padding: 6px 14px; border-radius: 12px; font-size: 12px; font-weight: 600;">
+        {{ (opportunity.status or 'intake')|upper }}
+    </span>
+</div>
+
+{% if error %}
+<div class="alert" style="background: #7f1d1d; border: 1px solid #991b1b; padding: 12px 16px; border-radius: 8px; margin-bottom: 16px; color: #fca5a5;">
+    {{ error }}
+</div>
+{% endif %}
+
+<!-- Proposal Metadata -->
+<div class="stat-grid" style="grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); margin-bottom: 20px;">
+    <div class="stat-card">
+        <div class="label">Solicitation</div>
+        <div class="value blue" style="font-size: 14px;">{{ opportunity.solicitation_number or 'N/A' }}</div>
+    </div>
+    <div class="stat-card">
+        <div class="label">Agency</div>
+        <div class="value" style="font-size: 14px;">{{ opportunity.agency or 'N/A' }}</div>
+    </div>
+    <div class="stat-card">
+        <div class="label">Due Date</div>
+        <div class="value orange" style="font-size: 14px;">{{ opportunity.due_date or 'TBD' }}</div>
+    </div>
+    <div class="stat-card">
+        <div class="label">NAICS</div>
+        <div class="value" style="font-size: 14px;">{{ opportunity.naics_code or 'N/A' }}</div>
+    </div>
+    <div class="stat-card">
+        <div class="label">Type</div>
+        <div class="value" style="font-size: 14px;">{{ opportunity.proposal_type or 'FFP' }}</div>
+    </div>
+    <div class="stat-card">
+        <div class="label">Set-Aside</div>
+        <div class="value" style="font-size: 14px;">{{ opportunity.set_aside_type or 'None' }}</div>
+    </div>
+</div>
+
+{% if module_enabled('proposalai') %}
+<!-- Batch Generation Progress Panel -->
+<div id="batch-panel" style="display: none; margin-bottom: 16px;">
+    <div class="card" style="padding: 16px;">
+        <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
+            <h3 style="margin: 0; font-size: 14px; color: #93c5fd;">Generating All Sections</h3>
+            <span id="batch-status" style="font-size: 12px; color: #94a3b8;">Starting...</span>
+        </div>
+        <div style="background: #1e293b; border-radius: 6px; height: 8px; margin-bottom: 12px; overflow: hidden;">
+            <div id="batch-bar" style="background: #3b82f6; height: 100%; width: 0%; transition: width 0.3s;"></div>
+        </div>
+        <div id="batch-counter" style="font-size: 12px; color: #94a3b8; margin-bottom: 8px;">0 / 0 sections</div>
+        <div id="batch-steps" style="max-height: 200px; overflow-y: auto; font-size: 12px; font-family: monospace;"></div>
+    </div>
+</div>
+{% endif %}
+
+<!-- Volumes & Sections -->
+<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
+    <h2 style="margin: 0;">Volumes & Sections</h2>
+    <div style="display: flex; gap: 8px;">
+        {% if module_enabled('proposalai') %}
+        <button class="btn" onclick="generateAll()" id="btn-generate-all"
+                style="font-size: 13px; background: #065f46; color: #6ee7b7;">Generate All</button>
+        {% else %}
+        <span style="font-size: 12px; color: #64748b; padding: 6px 12px;">ProposalAI module required for AI drafting</span>
+        {% endif %}
+        <button class="btn btn-primary" onclick="addVolume()" style="font-size: 13px;">+ Add Volume</button>
+    </div>
+</div>
+
+{% for volume in volumes %}
+<div class="card" style="padding: 16px; margin-bottom: 12px;">
+    <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px;">
+        <h3 style="margin: 0; color: #93c5fd;">Vol {{ volume.volume_number }}: {{ volume.title }}</h3>
+        <button class="btn" onclick="addSection('{{ volume.id }}')"
+                style="font-size: 12px; padding: 4px 12px; background: #1e3a5f; color: #93c5fd;">+ Add Section</button>
+    </div>
+
+    {% set secs = sections_by_volume.get(volume.id, []) %}
+    {% if secs %}
+    <table style="width: 100%; border-collapse: collapse;">
+        <thead>
+            <tr style="border-bottom: 1px solid #1e293b;">
+                <th style="text-align: left; padding: 8px; font-size: 11px; color: #64748b; text-transform: uppercase;">Section</th>
+                <th style="text-align: left; padding: 8px; font-size: 11px; color: #64748b; text-transform: uppercase;">Status</th>
+                <th style="text-align: left; padding: 8px; font-size: 11px; color: #64748b; text-transform: uppercase;">Content</th>
+                <th style="text-align: right; padding: 8px; font-size: 11px; color: #64748b; text-transform: uppercase;">Actions</th>
+            </tr>
+        </thead>
+        <tbody>
+            {% for sec in secs %}
+            <tr style="border-bottom: 1px solid #0f172a;">
+                <td style="padding: 10px 8px;">
+                    <a href="/proposals/{{ opportunity.id }}/sections/{{ sec.id }}"
+                       style="color: #60a5fa; text-decoration: none; font-size: 13px;">
+                        {{ sec.title }}
+                    </a>
+                </td>
+                <td style="padding: 10px 8px;">
+                    <span style="font-size: 12px; font-weight: 600;
+                                 color: {% if sec.draft_status == 'approved' %}#4ade80{% elif sec.draft_status == 'reviewed' %}#60a5fa{% elif sec.draft_content %}#fbbf24{% else %}#64748b{% endif %};">
+                        {% if sec.draft_status %}{{ sec.draft_status|upper }}{% elif sec.draft_content %}DRAFTED{% else %}EMPTY{% endif %}
+                    </span>
+                </td>
+                <td style="padding: 10px 8px; color: #94a3b8; font-size: 12px;">
+                    {% if sec.draft_content %}{{ sec.draft_content[:80] }}...{% else %}No content yet{% endif %}
+                </td>
+                <td style="padding: 10px 8px; text-align: right; white-space: nowrap;">
+                    {% if module_enabled('proposalai') %}
+                    <button class="btn" onclick="quickGenerate('{{ sec.id }}')"
+                            id="gen-{{ sec.id }}"
+                            style="font-size: 12px; padding: 4px 12px; background: #065f46; color: #6ee7b7; border: none; cursor: pointer;">Generate</button>
+                    {% endif %}
+                    <a href="/proposals/{{ opportunity.id }}/sections/{{ sec.id }}"
+                       class="btn" style="font-size: 12px; padding: 4px 12px; background: #334155;">Edit</a>
+                </td>
+            </tr>
+            {% endfor %}
+        </tbody>
+    </table>
+    {% else %}
+    <p style="color: #64748b; font-size: 13px; text-align: center; padding: 12px;">No sections yet. Click "+ Add Section" to start.</p>
+    {% endif %}
+</div>
+{% endfor %}
+
+{% if not volumes %}
+<div class="card" style="padding: 32px; text-align: center; color: #64748b;">
+    No volumes yet. Click "+ Add Volume" to create your first volume (e.g., Technical, Management, Past Performance).
+</div>
+{% endif %}
+
+<style>
+.badge-orange { background: #78350f; color: #fbbf24; }
+.badge-green { background: #065f46; color: #6ee7b7; }
+.badge-blue { background: #1e3a5f; color: #93c5fd; }
+</style>
+
+<script>
+const OPP_ID = '{{ opportunity.id }}';
+
+function addVolume() {
+    const title = prompt('Volume title (e.g., Technical Volume, Management Volume):');
+    if (!title) return;
+    const num = prompt('Volume number:', '1');
+
+    fetch(`/api/govcon/proposals/${OPP_ID}/volumes`, {
+        method: 'POST',
+        headers: {'Content-Type': 'application/json'},
+        body: JSON.stringify({title: title, volume_number: parseInt(num) || 1})
+    })
+    .then(r => r.json())
+    .then(data => {
+        if (data.status === 'ok') location.reload();
+        else alert(data.message || 'Failed to add volume');
+    });
+}
+
+{% if module_enabled('proposalai') %}
+function quickGenerate(sectionId) {
+    const btn = document.getElementById('gen-' + sectionId);
+    btn.disabled = true;
+    btn.textContent = 'Generating...';
+
+    fetch(`/api/govcon/sections/${sectionId}/generate-draft`, {
+        method: 'POST',
+        headers: {'Content-Type': 'application/json'},
+        body: JSON.stringify({opportunity_id: OPP_ID})
+    })
+    .then(r => r.json())
+    .then(data => {
+        btn.disabled = false;
+        btn.textContent = 'Generate';
+        if (data.status === 'ok') {
+            btn.style.background = '#14532d';
+            btn.textContent = 'Done!';
+            setTimeout(() => location.reload(), 1500);
+        } else {
+            alert(data.message || 'Generation failed');
+        }
+    })
+    .catch(err => {
+        btn.disabled = false;
+        btn.textContent = 'Generate';
+        alert('Network error: ' + err.message);
+    });
+}
+{% endif %}
+
+function addSection(volumeId) {
+    const title = prompt('Section title (e.g., Executive Summary, Technical Approach):');
+    if (!title) return;
+
+    fetch(`/api/govcon/proposals/${OPP_ID}/sections`, {
+        method: 'POST',
+        headers: {'Content-Type': 'application/json'},
+        body: JSON.stringify({volume_id: volumeId, title: title})
+    })
+    .then(r => r.json())
+    .then(data => {
+        if (data.status === 'ok') location.reload();
+        else alert(data.message || 'Failed to add section');
+    });
+}
+
+{% if module_enabled('proposalai') %}
+function generateAll() {
+    const btn = document.getElementById('btn-generate-all');
+    btn.disabled = true;
+    btn.textContent = 'Starting...';
+
+    document.getElementById('batch-panel').style.display = 'block';
+
+    fetch(`/api/govcon/proposals/${OPP_ID}/generate-all`, {
+        method: 'POST',
+        headers: {'Content-Type': 'application/json'},
+        body: JSON.stringify({force_regenerate: false})
+    })
+    .then(r => r.json())
+    .then(data => {
+        if (data.status !== 'ok') {
+            btn.disabled = false;
+            btn.textContent = 'Generate All';
+            document.getElementById('batch-status').textContent = 'Error: ' + (data.message || 'Failed');
+            document.getElementById('batch-status').style.color = '#f87171';
+            return;
+        }
+        btn.textContent = 'Generating...';
+        pollJobProgress(data.job_id);
+    })
+    .catch(err => {
+        btn.disabled = false;
+        btn.textContent = 'Generate All';
+        alert('Network error: ' + err.message);
+    });
+}
+
+let pollInterval = null;
+function pollJobProgress(jobId) {
+    pollInterval = setInterval(() => {
+        fetch(`/api/govcon/jobs/${jobId}/progress`)
+        .then(r => r.json())
+        .then(data => {
+            if (data.status !== 'ok') return;
+
+            const total = data.total_sections || 1;
+            const completed = data.completed_sections || 0;
+            const pct = Math.round((completed / total) * 100);
+
+            document.getElementById('batch-bar').style.width = pct + '%';
+            document.getElementById('batch-counter').textContent = `${completed} / ${total} sections`;
+
+            const currentTitle = data.current_section_title || '';
+            const currentStep = data.current_step || '';
+            document.getElementById('batch-status').textContent =
+                data.job_status === 'completed' ? 'Complete!' :
+                `${currentTitle} — ${currentStep}`;
+
+            // Render step log
+            const steps = data.steps || [];
+            const stepsHtml = steps.slice(-10).map(s => {
+                const color = s.status === 'completed' ? '#4ade80' :
+                              s.status === 'failed' ? '#f87171' :
+                              s.status === 'skipped' ? '#94a3b8' : '#fbbf24';
+                return `<div style="padding: 2px 0; color: ${color};">[${s.step}] ${s.detail}</div>`;
+            }).join('');
+            document.getElementById('batch-steps').innerHTML = stepsHtml;
+
+            if (data.job_status === 'completed' || data.job_status === 'failed') {
+                clearInterval(pollInterval);
+                document.getElementById('batch-bar').style.width = '100%';
+                document.getElementById('batch-bar').style.background =
+                    data.job_status === 'completed' ? '#22c55e' : '#ef4444';
+                document.getElementById('batch-status').style.color =
+                    data.job_status === 'completed' ? '#4ade80' : '#f87171';
+
+                const btn = document.getElementById('btn-generate-all');
+                btn.disabled = false;
+                btn.textContent = 'Generate All';
+
+                if (data.job_status === 'completed') {
+                    setTimeout(() => location.reload(), 2000);
+                }
+            }
+        });
+    }, 2000);
+}
+{% endif %}
+</script>
+{% endblock %}

tools/dashboard/templates/proposals/list.html

@@ -0,0 +1,52 @@
+{% extends "base.html" %}
+{% block title %}{{ app_name }} — Proposals{% endblock %}
+{% block content %}
+<div style="display: flex; align-items: center; gap: 12px; margin-bottom: 8px;">
+    <a href="/govcon" style="color: #60a5fa; font-size: 13px;">&larr; Back to GovCon</a>
+</div>
+
+<div style="display: flex; justify-content: space-between; align-items: center;">
+    <h1>Proposal Pipeline</h1>
+    <a href="/govcon" class="btn btn-primary" style="font-size: 13px;">+ New from SAM.gov</a>
+</div>
+
+{% if error %}
+<div class="alert" style="background: #7f1d1d; border: 1px solid #991b1b; padding: 12px 16px; border-radius: 8px; margin-bottom: 16px; color: #fca5a5;">
+    {{ error }}
+</div>
+{% endif %}
+
+{% if proposals %}
+<div class="stat-grid" style="grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));">
+    {% for p in proposals %}
+    <a href="/govcon/proposals/{{ p.id }}" class="card" style="padding: 20px; text-decoration: none; color: inherit; display: block;">
+        <div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px;">
+            <h3 style="margin: 0; color: #f1f5f9; font-size: 15px;">{{ p.title[:60] }}</h3>
+            <span class="badge {% if p.status == 'submitted' %}badge-green{% elif p.status == 'draft' %}badge-blue{% else %}badge-orange{% endif %}"
+                  style="padding: 3px 8px; border-radius: 8px; font-size: 11px; font-weight: 600; white-space: nowrap;">
+                {{ p.status|upper }}
+            </span>
+        </div>
+        <div style="font-size: 12px; color: #64748b; margin-bottom: 12px;">
+            {{ p.solicitation_number or 'No Sol #' }} &middot; {{ p.agency or 'Unknown Agency' }}
+        </div>
+        <div style="display: flex; gap: 16px; font-size: 12px; color: #94a3b8;">
+            <span>{{ p.volume_count }} volumes</span>
+            <span>{{ p.section_count }} sections</span>
+            {% if p.due_date %}<span style="color: #fbbf24;">Due: {{ p.due_date }}</span>{% endif %}
+        </div>
+    </a>
+    {% endfor %}
+</div>
+{% else %}
+<div class="card" style="padding: 32px; text-align: center; color: #64748b;">
+    No proposals yet. Scan SAM.gov opportunities and create your first proposal.
+</div>
+{% endif %}
+
+<style>
+.badge-orange { background: #78350f; color: #fbbf24; }
+.badge-green { background: #065f46; color: #6ee7b7; }
+.badge-blue { background: #1e3a5f; color: #93c5fd; }
+</style>
+{% endblock %}

tools/dashboard/templates/proposals/sam_detail.html

@@ -0,0 +1,132 @@
+{% extends "base.html" %}
+{% block title %}{{ app_name }} — RFP: {{ sam_opp.title or 'Opportunity' }}{% endblock %}
+{% block content %}
+<div style="display: flex; align-items: center; gap: 12px; margin-bottom: 8px;">
+    <a href="/govcon" style="color: #60a5fa; font-size: 13px;">&larr; Back to GovCon</a>
+</div>
+
+<h1>RFP Intake</h1>
+
+{% if error %}
+<div class="alert" style="background: #7f1d1d; border: 1px solid #991b1b; padding: 12px 16px; border-radius: 8px; margin-bottom: 16px; color: #fca5a5;">
+    {{ error }}
+</div>
+{% endif %}
+
+{% if sam_opp %}
+<div class="card" style="padding: 20px; margin-bottom: 16px;">
+    <div style="display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 16px;">
+        <div>
+            <h2 style="margin: 0 0 4px 0; color: #f1f5f9;">{{ sam_opp.title }}</h2>
+            <span style="font-size: 12px; color: #64748b;">{{ sam_opp.solicitation_number }}</span>
+        </div>
+        <span class="badge badge-blue" style="padding: 4px 10px; border-radius: 12px; font-size: 11px; font-weight: 600;">
+            {{ sam_opp.notice_type or 'SAM.gov' }}
+        </span>
+    </div>
+
+    <div class="stat-grid" style="grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); margin-bottom: 16px;">
+        <div class="stat-card">
+            <div class="label">Agency</div>
+            <div class="value" style="font-size: 13px;">{{ sam_opp.agency or 'N/A' }}</div>
+        </div>
+        <div class="stat-card">
+            <div class="label">NAICS</div>
+            <div class="value blue" style="font-size: 16px;">{{ sam_opp.naics_code or 'N/A' }}</div>
+        </div>
+        <div class="stat-card">
+            <div class="label">Posted</div>
+            <div class="value" style="font-size: 13px;">{{ sam_opp.posted_date or 'N/A' }}</div>
+        </div>
+        <div class="stat-card">
+            <div class="label">Response Deadline</div>
+            <div class="value orange" style="font-size: 13px;">{{ sam_opp.response_deadline or 'TBD' }}</div>
+        </div>
+        <div class="stat-card">
+            <div class="label">Set-Aside</div>
+            <div class="value" style="font-size: 13px;">{{ sam_opp.set_aside_type or 'None' }}</div>
+        </div>
+        <div class="stat-card">
+            <div class="label">Classification Code</div>
+            <div class="value" style="font-size: 13px;">{{ sam_opp.classification_code or 'N/A' }}</div>
+        </div>
+    </div>
+
+    {% if sam_opp.description %}
+    <div style="margin-bottom: 16px;">
+        <h3 style="margin: 0 0 8px 0; color: #94a3b8; font-size: 13px; text-transform: uppercase;">Description</h3>
+        <p style="color: #e2e8f0; font-size: 13px; line-height: 1.6;">{{ sam_opp.description[:500] }}</p>
+    </div>
+    {% endif %}
+</div>
+
+<!-- Create Proposal Button -->
+{% if sam_opp.proposal_opportunity_id %}
+<div class="card" style="padding: 16px; text-align: center;">
+    <span style="color: #4ade80; font-weight: 600;">&#10003; Proposal already created</span>
+    <a href="/govcon/proposals/{{ sam_opp.proposal_opportunity_id }}"
+       class="btn btn-primary" style="margin-left: 12px; font-size: 13px;">View Proposal</a>
+</div>
+{% else %}
+<div class="card" style="padding: 20px; text-align: center;">
+    <p style="color: #94a3b8; margin-bottom: 12px;">Ready to respond to this RFP?</p>
+    <button class="btn btn-success" onclick="createProposal()" id="btn-create"
+            style="font-size: 15px; padding: 10px 24px;">
+        Create Proposal from this RFP
+    </button>
+    <div id="create-status" style="display: none; margin-top: 8px; font-size: 13px;"></div>
+</div>
+{% endif %}
+{% endif %}
+
+<style>
+.badge-blue { background: #1e3a5f; color: #93c5fd; }
+</style>
+
+<script>
+function createProposal() {
+    const btn = document.getElementById('btn-create');
+    const status = document.getElementById('create-status');
+    btn.disabled = true;
+    btn.textContent = 'Creating...';
+    status.style.display = 'block';
+    status.textContent = 'Setting up proposal structure...';
+    status.style.color = '#94a3b8';
+
+    fetch('/api/govcon/proposals/create', {
+        method: 'POST',
+        headers: {'Content-Type': 'application/json'},
+        body: JSON.stringify({
+            sam_opportunity_id: '{{ sam_opp.id }}',
+            title: '{{ sam_opp.title|replace("'", "\\'") }}',
+            solicitation_number: '{{ sam_opp.solicitation_number }}',
+            agency: '{{ sam_opp.agency|replace("'", "\\'") }}',
+            naics_code: '{{ sam_opp.naics_code }}',
+            due_date: '{{ sam_opp.response_deadline or "" }}',
+            set_aside_type: '{{ sam_opp.set_aside_type }}'
+        })
+    })
+    .then(r => r.json())
+    .then(data => {
+        if (data.status === 'ok') {
+            status.textContent = 'Proposal created! Redirecting...';
+            status.style.color = '#4ade80';
+            setTimeout(() => {
+                window.location.href = '/govcon/proposals/' + data.opportunity_id;
+            }, 800);
+        } else {
+            btn.disabled = false;
+            btn.textContent = 'Create Proposal from this RFP';
+            status.textContent = data.message || 'Failed';
+            status.style.color = '#f87171';
+        }
+    })
+    .catch(err => {
+        btn.disabled = false;
+        btn.textContent = 'Create Proposal from this RFP';
+        status.textContent = err.message;
+        status.style.color = '#f87171';
+    });
+}
+</script>
+{% endblock %}