{% extends 'admin/base_admin.html' %}

{% block title %}
    {% if object %}Edit FAQ{% else %}Add FAQ{% endif %} | ChatLab
{% endblock %}
{% block admin_faq_active %}active{% endblock %}

{% block workspace %}
<div class="page-header">
    <div>
        <h2 class="page-title">{% if object %}Edit FAQ Question{% else %}Add FAQ Question{% endif %}</h2>
        <p class="page-subtitle">Configure instantaneous quick replies.</p>
    </div>
    <a href="{% url 'admin_faq_list' %}" class="btn btn-secondary">
        &larr; Back to FAQ List
    </a>
</div>

<div class="glass-card form-container" style="padding: 2.5rem; margin-top: 1rem;">
    <form method="post">
        {% csrf_token %}
        
        <div class="form-group">
            <label for="id_question" class="form-label">Visitor Question</label>
            <input type="text" name="question" id="id_question" class="form-input" placeholder="e.g. What is your refund policy?" required value="{% if object %}{{ object.question }}{% endif %}">
            <span style="font-size: 0.75rem; color: var(--text-muted); margin-top: 0.35rem;">
                This text will appear as a clickable quick reply button for visitors.
            </span>
        </div>
        
        <div class="form-group">
            <label for="id_answer" class="form-label">Immediate Response</label>
            <textarea name="answer" id="id_answer" class="form-textarea" placeholder="Provide a concise reply. (e.g. 'We offer a 30-day full refund policy on all purchases...')" required style="min-height: 150px;">{% if object %}{{ object.answer }}{% endif %}</textarea>
            <span style="font-size: 0.75rem; color: var(--text-muted); margin-top: 0.35rem;">
                This content will print directly in the chat logs without calling LLMs. Supports plain text.
            </span>
        </div>
        
        <div class="form-actions">
            <button type="submit" class="btn btn-primary">
                Save FAQ Question
            </button>
            <a href="{% url 'admin_faq_list' %}" class="btn btn-secondary">
                Cancel
            </a>
        </div>
    </form>
</div>
{% endblock %}