{% extends "base.html" %}

{% block head %}
<link rel="stylesheet" href="/plugins/customizer/assets/css/customizer.ui.css">
{% endblock %}

{% block content %}
<div class="blocks-workspace cz-container mx-auto w-full max-w-7xl px-4 py-6 sm:px-6" id="customizer-fulfill"
     data-refresh="{{ refresh_seconds | default(value=15) }}">

{% if is_not_enrolled %}
<div class="cz-access-denied grid justify-items-center gap-4 py-12 text-center">
    <h1 class="mb-0 text-2xl font-bold">Access restricted</h1>
    <p class="m-0 text-muted">Fulfillment role required.</p>
</div>
{% else %}
<div class="cz-page-header">
    <h1 class="cz-title">Fulfillment</h1>
    <p class="m-0 text-muted">Mark custom line items ready when production completes.</p>
</div>
<div id="cz-fulfillment-list" class="cz-fulfillment-list"></div>
{% endif %}
</div>
<script src="/plugins/customizer/assets/js/fulfill.js" defer></script>
{% endblock %}