{% extends 'textdocs/base.html' %}

{% block form_media %}
    {{ title_form.media }}
    {{ content_form.media }}
{% endblock %}

{% block title %}Create a New Document{% endblock %}

{% block content %}
    <h2>Create a New Document</h2>
    <p class="text-muted">You will create the main document and its first version (v1).</p>
    <hr>

    <form method="post">
        {% csrf_token %}

        <!-- Combined error handling for both forms -->
        {% if title_form.errors or content_form.errors %}
            <div class="alert alert-danger">
                <strong>Please correct the errors below:</strong>
                <ul>
                    {% for field, errors in title_form.errors.items %}
                        {% for error in errors %}
                            <li>{{ field|title }}: {{ error }}</li>
                        {% endfor %}
                    {% endfor %}
                    {% for field, errors in content_form.errors.items %}
                        {% for error in errors %}
                            <li>{{ field|title }}: {{ error }}</li>
                        {% endfor %}
                    {% endfor %}
                </ul>
            </div>
        {% endif %}

        <!-- Render the title form part -->
        <div class="mb-3">
            <label for="id_title" class="form-label"><strong>Document Title</strong></label>
            {{ title_form.title }}
        </div>

        <hr>

        <!-- Render the content form part (this will have the TinyMCE editors) -->
        <p><strong>Initial Content (Version 1)</strong></p>
        {{ content_form.as_p }}
        
        <div class="mt-3">
            <button type="submit" class="btn btn-success">Create Document and First Version</button>
            <a href="{% url 'document_list' %}" class="btn btn-secondary">Cancel</a>
        </div>
    </form>
{% endblock %}