<style nonce="{{ csp_nonce }}">
.search-result-card table td a {
color: var(--accent, #4f8ff7);
text-decoration: underline;
}
.search-result-card table td a:hover {
color: #7ab0ff;
}
/* Property Intelligence Panel */
.intel-panel {
display: grid;
grid-template-columns: 1fr;
gap: 12px;
margin-bottom: 16px;
}
@media (min-width: 640px) {
.intel-panel {
grid-template-columns: 1fr 1fr 1fr;
gap: 16px;
}
}
.intel-col {
padding: 12px 14px;
background: var(--surface, #1a1d27);
border: 1px solid var(--border, #333749);
border-radius: 10px;
}
.intel-col-label {
font-size: 0.7rem;
color: var(--text-muted, #8b8fa3);
text-transform: uppercase;
letter-spacing: 0.06em;
margin-bottom: 6px;
}
.intel-col-value {
font-size: 1.15rem;
font-weight: 700;
}
.intel-col-detail {
font-size: 0.78rem;
color: var(--text-muted, #8b8fa3);
margin-top: 2px;
}
</style>
{# Default context vars — callers that don't pass these get safe no-op values #}
{% set project_context = project_context if project_context is defined else none %}
{% set violation_counts = violation_counts if violation_counts is defined else none %}
{% set active_businesses = active_businesses if active_businesses is defined else [] %}
{% set show_quick_actions = show_quick_actions if show_quick_actions is defined else false %}
{% set address_intel = address_intel if address_intel is defined else none %}
<div class="result-card search-result-card glass-card">
<div class="search-echo" style="display: flex; justify-content: space-between; align-items: center;">
<span>{{ query_echo }}</span>
{% if watch_data %}
<span class="watch-container">
{% if existing_watch_id %}
{% include 'fragments/watch_confirmation.html' %}
{% elif g.user %}
{% include 'fragments/watch_button.html' %}
{% else %}
{% include 'fragments/login_prompt.html' %}
{% endif %}
</span>
{% endif %}
</div>
{# Quick Actions - only on address/parcel searches, not on complaint/violation results #}
{% if show_quick_actions and not no_results and (report_url or street_address) %}
<div class="glass-card" style="margin-top:var(--space-4);margin-bottom:var(--space-4);">
<div style="font-weight: 600; margin-bottom: var(--space-3); color: var(--text-primary);">Quick Actions</div>
<div style="display: flex; flex-wrap: wrap; gap: 10px;">
<!-- Primary: View Property Report -->
{% if report_url %}
<a href="{{ report_url }}" class="obsidian-btn obsidian-btn-primary"
style="display:inline-flex;align-items:center;gap:6px;text-decoration:none;">
📊 View Property Report
</a>
{% endif %}
<!-- Analyze Project (prefill with real permit data if available) -->
{% if street_address %}
<form hx-post="/ask" hx-target="#search-results" hx-swap="innerHTML"
hx-indicator="#search-loading" style="display:inline;margin:0;">
<input type="hidden" name="analyze" value="1">
<input type="hidden" name="address" value="{{ street_address or '' }}">
{% if project_context %}
<input type="hidden" name="q" value="{{ project_context.description }}">
<input type="hidden" name="estimated_cost" value="{{ project_context.estimated_cost or '' }}">
<input type="hidden" name="neighborhood" value="{{ project_context.neighborhood or '' }}">
{% else %}
<input type="hidden" name="q" value="I want to analyze a project at {{ street_address }}">
{% endif %}
<button type="submit" class="obsidian-btn obsidian-btn-outline"
style="display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:inherit;">
🔍 {% if project_context %}Analyze: {{ project_context.label }}{% else %}Analyze Project{% endif %}
</button>
</form>
{% endif %}
<!-- Check Violations — 3 visual states based on data availability -->
{% if street_address %}
<form hx-post="/ask" hx-target="#search-results" hx-swap="innerHTML"
hx-indicator="#search-loading" style="display:inline;margin:0;">
<input type="hidden" name="q" value="Are there any violations at {{ street_address }}?">
<button type="submit" class="obsidian-btn obsidian-btn-outline"
style="display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:inherit;
{% if violation_counts and violation_counts.total > 0 %}
background:rgba(239,68,68,0.1);color:var(--signal-red);border-color:rgba(239,68,68,0.35);
{% elif violation_counts %}
background:rgba(52,211,153,0.08);color:var(--signal-green);border-color:rgba(52,211,153,0.25);
{% endif %}
">
{% if violation_counts and violation_counts.total > 0 %}
⚠️ Check Violations · {{ violation_counts.total }} open
{% elif violation_counts %}
✓ No open violations
{% else %}
⚠️ Check Violations
{% endif %}
</button>
</form>
{% endif %}
<!-- Who's Here — only shown when businesses data is available -->
{% if active_businesses and street_address %}
<form hx-post="/ask" hx-target="#search-results" hx-swap="innerHTML"
hx-indicator="#search-loading" style="display:inline;margin:0;">
<input type="hidden" name="q" value="Who is operating at {{ street_address }}?">
<button type="submit" class="obsidian-btn obsidian-btn-outline"
style="display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-family:inherit;">
🏢 Who's Here
{% if active_businesses|length == 1 %}· {{ active_businesses[0].name[:22] }}
{% else %}· {{ active_businesses|length }} businesses{% endif %}
</button>
</form>
{% endif %}
</div>
</div>
{% endif %}
{# ===== Property Intelligence Panel ===== #}
{% if address_intel and show_quick_actions and not no_results %}
<div class="intel-panel">
{# Column 1: Enforcement #}
<div class="intel-col"{% if address_intel.enforcement_total and address_intel.enforcement_total > 0 %} style="background:rgba(239,68,68,0.07);border-color:rgba(239,68,68,0.25);"{% endif %}>
<div class="intel-col-label">Enforcement</div>
{% if address_intel.enforcement_total is not none %}
{% if address_intel.enforcement_total > 0 %}
<div class="intel-col-value" style="color:#f87171;">{{ address_intel.enforcement_total }} open</div>
<div class="intel-col-detail" style="color:#f87171;">
{% if address_intel.open_violations %}{{ address_intel.open_violations }} violation{{ 's' if address_intel.open_violations != 1 else '' }}{% endif %}{% if address_intel.open_violations and address_intel.open_complaints %}, {% endif %}{% if address_intel.open_complaints %}{{ address_intel.open_complaints }} complaint{{ 's' if address_intel.open_complaints != 1 else '' }}{% endif %}
</div>
{% else %}
<div class="intel-col-value" style="color:var(--success, #34d399);">✓ Clear</div>
<div class="intel-col-detail">No open violations</div>
{% endif %}
{% else %}
<div class="intel-col-value" style="color:var(--text-muted);">—</div>
<div class="intel-col-detail">No parcel data</div>
{% endif %}
</div>
{# Column 2: Businesses #}
<div class="intel-col">
<div class="intel-col-label">Businesses</div>
{% if address_intel.business_count > 0 %}
<div class="intel-col-value" style="color:var(--text);">{{ address_intel.business_count }} active</div>
<div class="intel-col-detail">
{{ address_intel.active_businesses[0].name[:28] }}{% if address_intel.business_count > 1 %} +{{ address_intel.business_count - 1 }}{% endif %}
</div>
{% elif address_intel.business_count == 0 and address_intel.active_businesses is defined %}
<div class="intel-col-value" style="color:var(--text-muted);">None</div>
<div class="intel-col-detail">No registered businesses</div>
{% else %}
<div class="intel-col-value" style="color:var(--text-muted);">—</div>
<div class="intel-col-detail">Parcel search only</div>
{% endif %}
</div>
{# Column 3: Permits #}
<div class="intel-col">
<div class="intel-col-label">Permits</div>
{% if address_intel.total_permits is not none %}
<div class="intel-col-value" style="color:var(--text);">
{{ address_intel.total_permits }}
<span style="font-size:0.75rem;font-weight:400;color:var(--text-muted);">total</span>
</div>
<div class="intel-col-detail">
{% if address_intel.active_permits %}{{ address_intel.active_permits }} active{% else %}None active{% endif %}{% if address_intel.latest_permit_type %} · {{ address_intel.latest_permit_type }}{% endif %}
</div>
{% if address_intel.routing_total and address_intel.routing_total > 0 %}
<div style="margin-top:8px;padding-top:8px;border-top:1px solid var(--border, #333749);">
<div class="intel-col-label">Plan Review</div>
{% set pct = ((address_intel.routing_complete or 0) * 100 / address_intel.routing_total) | int %}
<div style="display:flex;align-items:center;gap:8px;">
<div style="flex:1;height:6px;background:rgba(255,255,255,0.08);border-radius:3px;overflow:hidden;">
<div style="width:{{ pct }}%;height:100%;background:{% if pct == 100 %}var(--success, #34d399){% elif pct >= 50 %}var(--accent, #4f8ff7){% else %}#f59e0b{% endif %};border-radius:3px;"></div>
</div>
<span style="font-size:0.78rem;font-weight:600;color:var(--text);white-space:nowrap;">{{ address_intel.routing_complete }}/{{ address_intel.routing_total }}</span>
</div>
{% if address_intel.routing_latest_station %}
<div class="intel-col-detail" style="margin-top:4px;">
{% if address_intel.routing_latest_result and 'approv' in address_intel.routing_latest_result|lower %}
<span style="color:var(--success, #34d399);">✓</span>
{% elif address_intel.routing_latest_result and 'comment' in address_intel.routing_latest_result|lower %}
<span style="color:#f59e0b;">💬</span>
{% endif %}
{{ address_intel.routing_latest_station }}{% if address_intel.routing_latest_date %} · {{ address_intel.routing_latest_date }}{% endif %}
</div>
{% endif %}
</div>
{% endif %}
{% else %}
<div class="intel-col-value" style="color:var(--text-muted);">—</div>
<div class="intel-col-detail">No permit data</div>
{% endif %}
</div>
</div>
{% endif %}
{{ result_html | safe }}
{% if no_results and no_results_address %}
<div class="glass-card" style="margin-top: var(--space-5)">
{# ===== Fuzzy suggestions: "Did you mean...?" ===== #}
{% if fuzzy_suggestions %}
<div style="font-weight: 600; margin-bottom: 10px;">Did you mean?</div>
<div style="display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px;">
{% for s in fuzzy_suggestions %}
<form method="POST" action="/ask" style="display:inline;margin:0;padding:0;">
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
<input type="hidden" name="q" value="{{ s.street_number }} {{ s.full_name }}">
<button type="submit"
style="display:inline-flex;align-items:center;gap:8px;color:#4f8ff7;background:none;border:none;cursor:pointer;padding:4px 0;font-family:inherit;font-size:0.95rem;text-align:left;">
<span style="font-size:0.9rem;">➤</span>
{{ s.street_number }} {{ s.full_name }}
<span style="color:#8b8fa3;font-size:0.8rem;">({{ s.count }} permits)</span>
</button>
</form>
{% endfor %}
</div>
<div style="border-top:1px solid rgba(79,143,247,0.15);padding-top:12px;margin-top:4px;">
{% endif %}
<div style="font-weight: 600; margin-bottom: 8px;">What you can do next</div>
<div style="display: flex; flex-direction: column; gap: 10px;">
{% if report_url %}
<a href="{{ report_url }}"
style="display: inline-flex; align-items: center; gap: 8px; color: #4f8ff7; text-decoration: none; font-weight: 600; font-size: 0.95rem;">
<span style="font-size: 1.1rem;">📊</span> Run Property Report
</a>
{% endif %}
<a href="/?q={{ no_results_address }}"
style="display: inline-flex; align-items: center; gap: 8px; color: #8b8fa3; text-decoration: none; font-size: 0.9rem;">
<span style="font-size: 1.1rem;">🔍</span> Try a different search
</a>
<span style="color: #8b8fa3; font-size: 0.85rem; margin-top: 4px;">
No permit history doesn't mean no permits are required — it may just mean no permits have been filed yet at this address.
</span>
</div>
{% if fuzzy_suggestions %}
</div>
{% endif %}
</div>
{% elif not no_results %}
{# ===== Neighborhood stats card ===== #}
{% if hood_stats %}
<div class="glass-card" style="margin-top:var(--space-3);">
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;">
<span style="font-weight:600;font-size:0.9rem;color:var(--text, #e4e6eb);">{{ hood_stats.name }}</span>
<span style="font-size:0.75rem;color:var(--text-muted, #8b8fa3);">neighborhood</span>
</div>
<div style="display:flex;gap:20px;flex-wrap:wrap;">
<div>
<div style="font-size:1.1rem;font-weight:700;color:var(--accent, #4f8ff7);">{{ "{:,}".format(hood_stats.total_permits) }}</div>
<div style="font-size:0.7rem;color:var(--text-muted, #8b8fa3);text-transform:uppercase;">total permits</div>
</div>
<div>
<div style="font-size:1.1rem;font-weight:700;color:var(--success, #34d399);">{{ "{:,}".format(hood_stats.active_permits) }}</div>
<div style="font-size:0.7rem;color:var(--text-muted, #8b8fa3);text-transform:uppercase;">active</div>
</div>
{% if hood_stats.top_types %}
<div style="flex:1;min-width:160px;">
<div style="font-size:0.7rem;color:var(--text-muted, #8b8fa3);text-transform:uppercase;margin-bottom:4px;">top permit types</div>
{% for t in hood_stats.top_types %}
<div style="font-size:0.8rem;color:var(--text, #e4e6eb);display:flex;justify-content:space-between;gap:8px;">
<span style="overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">{{ t.type }}</span>
<span style="color:var(--text-muted, #8b8fa3);flex-shrink:0;">{{ "{:,}".format(t.count) }}</span>
</div>
{% endfor %}
</div>
{% endif %}
</div>
</div>
{% endif %}
{% endif %}
{% if show_primary_prompt and prompt_street_number %}
{% include 'fragments/primary_address_prompt.html' %}
{% endif %}
</div>
