{% if preview.errors %}
    <div class="ops-note ops-note--error"><span class="ui-icon">error</span><div><strong>Błędy blokujące</strong><ul>{% for error in preview.errors %}<li>{{ error }}</li>{% endfor %}</ul></div></div>
{% else %}
    <div class="ops-note ops-note--info"><span class="ui-icon">check_circle</span><p><strong>Realizacja jest gotowa.</strong> Po kliknięciu finalnego przycisku powstaną snapshoty oraz próba dispatchu.</p></div>
{% endif %}
{% if preview.warnings %}
    <div class="ops-note ops-note--warm"><span class="ui-icon">warning</span><div><strong>Ostrzeżenia</strong><ul>{% for warning in preview.warnings %}<li>{{ warning }}</li>{% endfor %}</ul></div></div>
{% endif %}

<div class="fulfillment-summary-grid">
    <article class="ops-card ops-card--flat">
        <div class="ops-card__head"><span class="ops-card__eyebrow">Dostawca</span><h3>{{ preview.provider.name }}</h3></div>
        <p>{{ provider_readiness.typeLabel|capitalize }} · {{ provider_readiness.modeLabel }}</p>
        <span class="ops-status {{ provider_readiness.canDispatch ? 'is-green' : 'is-red' }}">{{ provider_readiness.statusLabel }}</span>
    </article>
    <article class="ops-card ops-card--flat">
        <div class="ops-card__head"><span class="ops-card__eyebrow">Odbiorca</span><h3>{{ (preview.recipient.firstname ~ ' ' ~ preview.recipient.lastname)|trim ?: preview.recipient.company }}</h3></div>
        <p>{{ preview.recipient.address1 }}{% if preview.recipient.address2 %}, {{ preview.recipient.address2 }}{% endif %}<br>{{ preview.recipient.postcode }} {{ preview.recipient.city }} · {{ preview.recipient.countryCode }}</p>
        <p>{{ preview.recipient.email }} · {{ preview.recipient.phone }}</p>
    </article>
    <article class="ops-card ops-card--flat">
        <div class="ops-card__head"><span class="ops-card__eyebrow">Dostawa</span><h3>{{ preview.delivery.methodName ?: preview.delivery.type }}</h3></div>
        <p>Typ: {{ preview.delivery.type }}</p>
        {% if preview.delivery.pickupPoint.code %}<p>Punkt/Paczkomat: <strong>{{ preview.delivery.pickupPoint.provider }} / {{ preview.delivery.pickupPoint.code }}</strong></p>{% endif %}
    </article>
    {% if duplicate_of %}
        <article class="ops-card ops-card--flat">
            <div class="ops-card__head"><span class="ops-card__eyebrow">Ponowienie zamówienia</span><h3>Nowa realizacja</h3></div>
            <p>Duplikat audytowy realizacji #{{ duplicate_of.id }}. Nowy payload otrzyma nowy <code>job_id</code>.</p>
            {% if allow_already_fulfilled %}<span class="ops-badge ops-badge--warning">Wymuszone ilości już zrealizowane</span>{% endif %}
        </article>
    {% endif %}
</div>

<div class="fulfillment-summary-items">
    {% for row in preview.items %}
        <article class="fulfillment-summary-item {{ row.valid ? 'is-valid' : 'is-invalid' }}">
            <div>
                <strong>{{ row.salesOrderItem.name }}</strong>
                <small>{{ row.productionVariantLabel ?: 'Brak wariantu produkcyjnego' }}</small>
            </div>
            <div><strong>{{ row.quantity }} szt.</strong><small>SKU: {{ row.providerSku ?: 'brak' }}</small></div>
            <div class="fulfillment-summary-item__resources">
                {% for placement, art in row.artwork %}
                    <span class="ops-badge {{ art.resolved ? 'ops-badge--success' : 'ops-badge--danger' }}">ART {{ placement|upper }}: {{ art.resolved ? (art.label|default('gotowy')) : 'brak' }}</span>
                {% endfor %}
                <span class="ops-badge {{ row.mockup.ready ? 'ops-badge--success' : 'ops-badge--danger' }}">Mockup: {{ row.mockup.ready ? 'gotowy' : row.mockup.status }}{% if row.mockup.assetId|default(null) %} · asset #{{ row.mockup.assetId }}{% endif %}{% if row.mockup.sourceType|default(null) %} · {{ row.mockup.sourceType }}{% endif %}</span>
            </div>
            {% if row.errors %}<ul class="form-errors">{% for error in row.errors %}<li>{{ error }}</li>{% endfor %}</ul>{% endif %}
        </article>
    {% endfor %}
</div>