{% extends "page/base.html" %}

{% block content %}
<div class="app-shell">
    {% block header %}
    {% include "page/header.html" %}
    {% endblock %}

    <main class="app-main">
        <section class="chat-panel">
            <div id="chatThread" class="chat-thread" aria-live="polite"></div>
        </section>

        <section class="composer-panel">
            <div class="composer-inner">
                {% block searchbar %}
                {% include "page/searchbar.html" %}
                {% endblock %}

                <div id="filtersDropdown" class="filters-dropdown hidden">
                    {% block filters %}
                    {% include "page/filters.html" %}
                    {% endblock %}
                </div>
            </div>
        </section>

        <aside id="citationsSidebar" class="citations-sidebar hidden" aria-label="Citations">
            <div class="citations-sidebar-header">
                <h2 class="citations-sidebar-title">Citations</h2>
                <button type="button" class="citations-close icon-btn" aria-label="Close citations">×</button>
            </div>
            <div class="citations-sidebar-content"></div>
        </aside>
    </main>
</div>

<script src="{{ url_for('static', filename='js/main.js') }}"></script>

{% endblock %}