{% extends 'textdocs/base.html' %}
{% block content %}
    <div class="card">
        <div class="card-header d-flex justify-content-between align-items-center">
            <h2>{{ document.title }}</h2>
            <a href="{% url 'document_list' %}" class="btn btn-primary">Back to List</a>

            <a href="{% url 'document_update' pk=document.pk %}" class="btn btn-secondary">Edit</a>
            <a href="{% url 'document_delete' pk=document.pk %}" class="btn btn-danger">Delete</a>

            <a href="{% url 'generate_pdf' pk=document.pk %}" class="btn btn-info">Export to PDF</a>
        </div>
        <div class="card-body">
            <h4 class="card-title">Introduction</h4>
            <div>{{ document.introduction|safe }}</div> <!-- UPDATED -->
            <hr>
            <h4 class="card-title">Main Body</h4>
            <div>{{ document.main_body|safe }}</div> <!-- UPDATED -->
            <hr>
            <h4 class="card-title">Conclusion</h4>
            <div>{{ document.conclusion|safe }}</div> <!-- UPDATED -->
        </div>
    </div>
{% endblock %}