| {% if env.kind.value == 'grounded' %} |
| <article class="pp-card pp-fade overflow-hidden"> |
| |
| <div class="flex flex-wrap items-center justify-between gap-3 border-b border-slate-200/70 px-6 py-4 dark:border-slate-800/70"> |
| <div class="flex items-center gap-2 text-sm font-medium text-slate-500 dark:text-slate-400"> |
| <svg class="h-4 w-4 text-brand-500" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg> |
| <span class="truncate">{{ env.question }}</span> |
| </div> |
| <div class="flex items-center gap-2"> |
| <span class="text-[11px] font-semibold uppercase tracking-wider text-slate-400">Confidence</span> |
| <div class="pp-meter w-24"><span style="width: {{ (env.confidence * 100)|round|int }}%"></span></div> |
| <span class="text-xs font-semibold text-slate-600 dark:text-slate-300">{{ (env.confidence * 100)|round|int }}%</span> |
| </div> |
| </div> |
|
|
| |
| <div class="px-6 py-5"> |
| <span class="inline-flex items-center gap-1.5 rounded-full bg-emerald-50 px-2.5 py-0.5 text-[11px] font-semibold text-emerald-700 ring-1 ring-inset ring-emerald-200 dark:bg-emerald-500/10 dark:text-emerald-300 dark:ring-emerald-500/20"> |
| <svg class="h-3 w-3" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg> |
| Grounded answer |
| </span> |
| <p class="mt-3 text-[15px] leading-7 text-slate-800 dark:text-slate-100">{{ env.answer|linkify_citations(env.citations)|safe }}</p> |
| </div> |
|
|
| |
| {% if env.citations %} |
| <div class="border-t border-slate-200/70 bg-slate-50/50 px-6 py-4 dark:border-slate-800/70 dark:bg-slate-900/40"> |
| <h3 class="text-[11px] font-semibold uppercase tracking-wider text-slate-400">Sources</h3> |
| <ol class="mt-2 space-y-2"> |
| {% for c in env.citations %} |
| <li class="flex items-start gap-2.5 text-sm"> |
| <span class="pp-cite mt-0.5 !static !align-baseline">{{ c.marker }}</span> |
| <a href="{{ c.url }}" target="_blank" rel="noopener" class="group min-w-0"> |
| <span class="font-medium text-slate-700 group-hover:text-brand-600 dark:text-slate-200 dark:group-hover:text-brand-400">{{ c.publisher }}</span> |
| <span class="text-slate-400"> · {{ c.title }}</span> |
| <span class="block truncate text-xs text-slate-400">{{ c.snippet }}</span> |
| <span class="text-[10px] text-slate-400">Retrieved {{ c.retrieved }}</span> |
| </a> |
| </li> |
| {% endfor %} |
| </ol> |
| </div> |
| {% endif %} |
|
|
| |
| <div class="flex items-start gap-2 border-t border-slate-200/70 px-6 py-3 text-xs text-slate-500 dark:border-slate-800/70 dark:text-slate-400"> |
| <svg class="mt-0.5 h-3.5 w-3.5 shrink-0 text-amber-500" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg> |
| <span><strong>Legal information, not legal advice.</strong> {{ env.disclaimer }}</span> |
| </div> |
| </article> |
|
|
| {% else %} |
| |
| <article class="pp-card pp-fade overflow-hidden border-amber-300/60 dark:border-amber-500/30"> |
| <div class="flex items-start gap-3 border-b border-amber-200/60 bg-amber-50/60 px-6 py-4 dark:border-amber-500/20 dark:bg-amber-500/5"> |
| <span class="grid h-9 w-9 shrink-0 place-items-center rounded-lg bg-amber-100 text-amber-600 dark:bg-amber-500/15 dark:text-amber-300"> |
| <svg class="h-5 w-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/></svg> |
| </span> |
| <div> |
| <h3 class="font-semibold text-slate-900 dark:text-slate-50"> |
| {% if env.kind.value == 'refusal_advice' %}I can't give legal advice |
| {% elif env.kind.value == 'refusal_scope' %}That's outside ParaPilot's scope |
| {% else %}I don't have a grounded answer{% endif %} |
| </h3> |
| <p class="text-sm text-slate-500 dark:text-slate-400">{{ env.question }}</p> |
| </div> |
| </div> |
|
|
| <div class="px-6 py-5"> |
| <p class="text-[15px] leading-7 text-slate-700 dark:text-slate-200">{{ env.answer }}</p> |
| </div> |
|
|
| |
| <div class="border-t border-slate-200/70 bg-slate-50/50 px-6 py-4 dark:border-slate-800/70 dark:bg-slate-900/40"> |
| <h3 class="flex items-center gap-1.5 text-sm font-semibold text-slate-700 dark:text-slate-200"> |
| <svg class="h-4 w-4 text-emerald-500" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"/><path d="M13.73 21a2 2 0 0 1-3.46 0"/></svg> |
| Get real legal help |
| </h3> |
| <p class="mt-1 text-sm text-slate-500 dark:text-slate-400">{{ env.escalation.message }}</p> |
| <div class="mt-3 flex flex-wrap gap-2"> |
| <a href="{{ env.escalation.legal_aid_url }}" target="_blank" rel="noopener" |
| class="inline-flex items-center gap-1.5 rounded-lg bg-brand-600 px-3.5 py-2 text-sm font-semibold text-white shadow-sm transition hover:bg-brand-700"> |
| {{ env.escalation.legal_aid_name }} |
| <svg class="h-3.5 w-3.5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></svg> |
| </a> |
| <a href="{{ env.escalation.lawyer_finder_url }}" target="_blank" rel="noopener" |
| class="inline-flex items-center gap-1.5 rounded-lg border border-slate-300 px-3.5 py-2 text-sm font-semibold text-slate-700 transition hover:bg-slate-50 dark:border-slate-700 dark:text-slate-200 dark:hover:bg-slate-800"> |
| {{ env.escalation.lawyer_finder_name }} |
| </a> |
| </div> |
| </div> |
|
|
| <div class="flex items-start gap-2 border-t border-slate-200/70 px-6 py-3 text-xs text-slate-500 dark:border-slate-800/70 dark:text-slate-400"> |
| <svg class="mt-0.5 h-3.5 w-3.5 shrink-0 text-amber-500" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg> |
| <span><strong>Legal information, not legal advice.</strong> {{ env.disclaimer }}</span> |
| </div> |
| </article> |
| {% endif %} |
|
|
