<div class="summary">
    <sdx-card layout="notification" notification-type="confirmation" icon-name="icon-check-mark-circle-filled"
        label="Order confirmation" label-aria-level="4">
        Your order has been confirmed.
        Shipping number: {{ order.shippingNumber }}
    </sdx-card>
    <!-- show shipping number and summary of whole order -->
    <sdx-card layout="notification" notification-type="confirmation" icon-name="icon-check-mark-circle-filled"
        label="Order summary" label-aria-level="4">
        {{ order.product?.name }}
        <br>
        Gesamtpreis: {{ totalPrice }} CHF
        <h5>Added ingredients</h5>
        @if(order.config?.extraBacon){
        <sdx-input-item type="checkbox" checked disabled>
            Extra Bacon
        </sdx-input-item>
        }
        @else {
        <sdx-input-item type="checkbox" disabled>
            Extra Bacon
        </sdx-input-item>
        }

        <p>Salad amount: {{ order.config?.saladAmount || 'normal' }}</p>
        <h3>Shipping Number:</h3>
        <h4>{{ order.shippingNumber }}</h4>
    </sdx-card>
</div>