{% extends "admin_base.html" %}
{% import "macros/admin_crud_list.html" as crud %}
{% import "macros/modal.html" as modal %}
{% import "macros/loading_spinner.html" as spinner %}

{% block page_title %}Pages{% endblock %}

{% block admin_content %}
<div class="mx-auto w-full max-w-7xl space-y-6" id="admin-pages-config" data-plugin="core-pages"
    data-total-pages="0"
    data-published-pages="0"
    data-homepage-slug="home"
    data-site-homepage-override="{% if site_homepage_override is defined and site_homepage_override %}true{% else %}false{% endif %}">
    {% if site_homepage_override is defined and site_homepage_override %}
    <div class="rounded-xl border border-warning/40 bg-warning/10 px-4 py-3 text-sm text-foreground" role="status">
        Public homepage is overridden by <code class="rounded bg-canvas px-1.5 py-0.5 font-mono text-xs">site/index.html</code>. Set as homepage applies after that file is removed.
    </div>
    {% endif %}
    <div data-pages-notice class="blocks-workspace-notice" role="status" aria-live="polite" tabindex="-1" hidden></div>
    <section class="flex flex-col gap-4 rounded-2xl border border-divider bg-surface p-5 shadow-sm sm:flex-row sm:items-center sm:justify-between sm:p-6">
        <div class="space-y-1">
            <h1 class="text-xl font-semibold text-foreground">Manage your website pages</h1>
            <p class="text-sm text-muted">Create pages, publish them when ready, and compose their content visually.</p>
            <a class="inline-flex min-h-10 items-center text-sm font-medium text-brand underline-offset-4 hover:underline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-brand" href="/admin/getting-started">Open your getting started guide</a>
        </div>
        <a class="blocks-button blocks-button-secondary shrink-0" href="/admin/site-studio">Open Site Studio <span aria-hidden="true">→</span></a>
    </section>
    {{ crud::shell_open(config_url="/plugins/core-pages/assets/admin/pages_page.json", mount_id="admin-pages-header", custom_mount=true) }}
    <div data-crud-toolbar-extra class="grid grid-cols-1 gap-4 sm:grid-cols-2">
        <div class="blocks-metric-card">
            <div class="flex size-11 shrink-0 items-center justify-center rounded-xl bg-brand/10 text-brand" aria-hidden="true"><i class="fas fa-file-alt"></i></div>
            <div class="min-w-0">
                <p class="text-sm text-muted">Total pages</p>
                <p id="pages-total-count" class="mt-1 text-2xl font-semibold text-foreground" aria-live="polite">—</p>
            </div>
        </div>
        <div class="blocks-metric-card">
            <div class="flex size-11 shrink-0 items-center justify-center rounded-xl bg-success/10 text-success" aria-hidden="true"><i class="fas fa-check-circle"></i></div>
            <div class="min-w-0">
                <p class="text-sm text-muted">Published</p>
                <p id="pages-published-count" class="mt-1 text-2xl font-semibold text-foreground" aria-live="polite">—</p>
            </div>
        </div>
    </div>
    {{ crud::shell_close() }}

    {{ crud::shell_open(config_url="/plugins/core-pages/assets/admin/pages_list.json", mount_id="admin-pages-list", custom_mount=true) }}
    <table>
        <thead></thead>
        <tbody id="pages-table-body">
            {{ spinner::table_skeleton(colspan=4, lines=3, label="Loading pages…") }}
        </tbody>
    </table>
    {{ crud::shell_close() }}
</div>

{{ modal::modal(id="createPageModal", title='<h3 id="createPageModalTitle">Create New Page</h3>', body_html='<div data-pages-form-notice class="blocks-workspace-notice" role="status" aria-live="polite" tabindex="-1" hidden></div><div id="create-page-form-fields"></div>') }}
{% endblock %}