Transform your default Shopify staff order emails into a clear, cafe-friendly format. By customizing this template, you can highlight crucial details like pickup dates, fulfillment times, and ordered items at a glance - an essential upgrade for merchants leveraging our Online Ordering features.
Setup Instructions
Follow these steps to format and customize your staff order email notifications in Shopify:
- From your Shopify admin, go to Settings.
- Select Notifications from the settings menu.
- Select Staff notifications.
- Ensure the email address intended to receive these notifications is present in the Recipients list. If it isn't, click Add recipient to include it.
-
In the Add recipient popup, enter your email address. Then, choose which types of notifications
you wish to receive:
- All Orders: Receive notifications for both your Online Orders and POS orders.
- Online Orders: Select a specific location or online channel to receive notifications exclusively for Online Orders.
- Once your recipients are securely configured, scroll to find the templates and select New order.
- Click on Edit code.
- In the template editor, fully highlight and delete all existing code within the Email body (HTML) section.
- Copy the custom POS Cafe code snippet provided at the bottom of this guide, and paste it into the now-empty Email body (HTML) editor.
Order Notification Email
{% comment %}
POS Cafe - Order Email Notifications v1.1
{% endcomment %}
{% assign delivery_method_types = delivery_agreements | map: 'delivery_method_type' | uniq %}
{% if delivery_method_types.size > 1 %}
{% assign has_split_cart = true %}
{% else %}
{% assign has_split_cart = false %}
{% endif %}
{% comment %} POS Cafe: Detect cafe items, collect prep areas, extract order attributes {% endcomment %}
{% assign poscafe_label = "POS Cafe" %}
{% assign modifier_label = "Modifier" %}
{% assign has_poscafe = false %}
{% assign pc_unique_prep_areas = "" %}
{% assign pc_hidden_keys = "Item Type,Prep Area,Channel,Order Type,Name,Notes,Cafe Discount,item_type,prep_area" | split: "," %}
{% assign pc_order_type = "" %}
{% assign pc_delivery_date = "" %}
{% assign pc_delivery_time = "" %}
{% assign pc_timing_choice = "" %}
{% assign pc_time_12h = "" %}
{% for attr in attributes %}
{% if attr.first == "Order Type" %}{% assign pc_order_type = attr.last %}{% endif %}
{% if attr.first == "delivery_date" %}{% assign pc_delivery_date = attr.last %}{% endif %}
{% if attr.first == "delivery_time" %}{% assign pc_delivery_time = attr.last %}{% endif %}
{% if attr.first == "timing_choice" %}{% assign pc_timing_choice = attr.last %}{% endif %}
{% endfor %}
{% if pc_delivery_time != blank %}
{% assign pc_time_parts = pc_delivery_time | split: ":" %}
{% assign pc_hour = pc_time_parts[0] | plus: 0 %}
{% assign pc_minute = pc_time_parts[1] %}
{% if pc_hour >= 12 %}
{% assign pc_ampm = "PM" %}
{% if pc_hour > 12 %}{% assign pc_hour_12 = pc_hour | minus: 12 %}{% else %}{% assign pc_hour_12 = pc_hour %}{% endif %}
{% else %}
{% assign pc_ampm = "AM" %}
{% if pc_hour == 0 %}{% assign pc_hour_12 = 12 %}{% else %}{% assign pc_hour_12 = pc_hour %}{% endif %}
{% endif %}
{% assign pc_time_12h = pc_hour_12 | append: ":" | append: pc_minute | append: " " | append: pc_ampm %}
{% endif %}
{% for line in line_items %}
{% assign pc_item_type = line.properties["Item Type"] %}
{% if pc_item_type == poscafe_label %}
{% assign has_poscafe = true %}
{% assign pc_prep = line.properties["Prep Area"] %}
{% if pc_prep != blank %}
{% unless pc_unique_prep_areas contains pc_prep %}
{% if pc_unique_prep_areas == "" %}
{% assign pc_unique_prep_areas = pc_prep %}
{% else %}
{% assign pc_unique_prep_areas = pc_unique_prep_areas | append: "|||" | append: pc_prep %}
{% endif %}
{% endunless %}
{% endif %}
{% endif %}
{% endfor %}
{% assign pc_prep_areas_array = pc_unique_prep_areas | split: "|||" | sort %}
<!DOCTYPE html>
<html lang="en">
<head>
<title>{{ email_title }}</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" media="screen" href="/assets/admin/merchant_mailer/style.css">
<style data-premailer="ignore">
.button__cell { background: {{ shop.email_accent_color }}; }
a, a:hover, a:active, a:visited { color: {{ shop.email_accent_color }}; }
@media print{
body {
color: black !important;
}
.subtitle-lines,
.subtotal-line__title,
.subtotal-line__value {
padding: 0 !important;
margin: 0 !important;
}
.subtotal-table {
margin: 0 !important;
}
}
</style>
</head>
<body>
<table class="row">
<tr class="mail-priority-indicator mail-priority-indicator--{% if fulfillment_aborted or has_high_risks? %}high{% else %}low{% endif %}">
<td></td>
</tr>
</table>
<table class="body">
<tr>
<td>
{% if fulfillment_aborted %}
<center>
<table class="row banner-container banner-alert__table">
<tr>
<td class="banner-alert__cell">
<img src="{{ 'mailer/merchant/critical_alert.png' | cdn_asset_url }}" alt="Critical Alert" width="20px">
</td>
<td class="banner-description__cell">
<strong class="banner-alert__title">Order was not fulfilled automatically</strong>
High risk of fraud detected. Before fulfilling this order or capturing payment, please review the Risk Analysis and determine if this order is fraudulent.
</td>
</tr>
</table>
</center>
{% endif %}
{% if has_high_risks? %}
<center>
<table class="row banner-container banner-alert__table">
<tr>
<td class="banner-alert__cell">
<img src="{{ 'mailer/merchant/critical_alert.png' | cdn_asset_url }}" alt="Critical Alert" width="20px">
</td>
<td class="banner-description__cell">
<strong class="banner-alert__title">High risk of fraud detected</strong>
Before fulfilling this order or capturing payment, please review the Risk Analysis and determine if this order is fraudulent.
</td>
</tr>
</table>
</center>
{% endif %}
<table class="row">
<tr>
<td class="section__cell">
<center>
<table class="container section">
<tr>
<td>
<table class="row content">
<tr>
<td class="content__cell {% if no_top_border == 'hide_border' %}no_top__border{% endif %}">
<center>
<table class="container">
<tr>
<td>
<table class="row">
<tr>
<td>
{% assign current_date = date | date: "%b %d" %}
{% assign current_time = date | date: "%l:%M %P" %}
{% if customer.name %}
{{ customer.name }} placed order {{ name }} on {{ current_date }} at {{ current_time | strip }}.
{% else %}
Someone placed order {{ name }} on {{ current_date }} at {{ current_time | strip }}.
{% endif %}
<table class="row actions" style="width: auto;">
<tr>
<td class="empty-line"> </td>
</tr>
<tr>
<td class="actions__cell">
<table class="button main-action-cell">
<tr>
<td><a href="https://{{ shop.permanent_domain }}/admin/orders/{{ id }}" class="mail-button" style="margin-right:5px">View order</a></td>
</tr>
</table>
</td>
</tr>
</table>
{% comment %} POS Cafe: Order info banner (Order Type, Pickup Date/Time, Location, Delivery) {% endcomment %}
{% if has_poscafe and pc_order_type != blank %}
<table class="row" style="width: 100%; margin-top: 10px;">
<tr>
<td style="padding: 12px 16px; background: #f7f7f7; border: 1px solid #e0e0e0;">
<strong>Order Type:</strong> {{ pc_order_type }}
{% if pc_timing_choice == "later" %}
{% if pc_delivery_date != blank %}
<br/><strong>Pickup Date:</strong> {{ pc_delivery_date | date: "%B %d, %Y" }}
{% endif %}
{% if pc_time_12h != blank %}
<br/><strong>Pickup Time:</strong> {{ pc_time_12h }}
{% endif %}
{% endif %}
{% if shipping_methods.first %}
<br/><strong>Delivery Method:</strong> {{ shipping_methods.first.title }}
{% endif %}
{% if location %}
<br/><strong>Location:</strong> {{ location.name }}
{% endif %}
</td>
</tr>
</table>
{% endif %}
</td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
<table class="row content">
<tr>
<td class="content__cell {% if no_top_border == 'hide_border' %}no_top__border{% endif %}">
<center>
<table class="container">
<tr>
<td>
<strong class="order-list__summary-title">Order summary</strong>
<br>
<br>
{% if has_split_cart %}
<table class="row">
{% for line in subtotal_line_items %}
{% unless line.delivery_agreement %}
{% if line.groups.size == 0 %}
{% assign legacy_separator = true %}
{% comment %} Skip child add-ons since they will be rendered under the parent line item {% endcomment %}
{% unless line.nested_line_child? %}
{% comment %} POS Cafe: Skip modifier line items {% endcomment %}
{% assign pc_line_type = line.properties["Item Type"] %}
{% unless pc_line_type == modifier_label %}
{% assign is_parent = false %}
{% assign is_nested_line_parent = line.nested_line_parent? %}
{% if line.bundle_parent? or line.nested_line_parent? %}
{% assign is_parent = true %}
{% endif %}
{% if is_nested_line_parent %}
{% assign css_order_list_cell_nested_line_parent_class = 'order-list__parent-cell' %}
{% assign css_order_list_parent_image_cell_nested_line_parent_class = 'order-list__nested-parent-image-cell' %}
{% endif %}
<tr class="order-list__item">
<td class="order-list__item__cell {{ css_order_list_cell_nested_line_parent_class }}">
<table height="100%">
<td style="padding-bottom: 0px;">
<table height="100%">
<tr valign="top">
{% if false and is_parent %}
<td class="order-list__parent-image-cell {{ css_order_list_parent_image_cell_nested_line_parent_class }}">
{% if line.image %}
<img src="{{ line | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
{% else %}
<td class="order-list__image-cell" valign="top" style="vertical-align: top;">
{% if line.image %}
<img src="{{ line | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="60" height="60" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
{% endif %}
</tr>
{% if is_nested_line_parent %}
<tr height="100%">
<td style="padding: 0px;" height="100%">
<table height="100%">
<tr>
<td height="100%" class="nested-line-item-spacer-cell">
<div class="nested-line-item-spacer"></div>
</td>
<td height="100%" class="parent-vertical-line__cell">
<div class="parent-vertical-line__content"></div>
</td>
</tr>
</table>
</td>
</tr>
{% endif %}
</table>
</td>
<td class="order-list__product-description-cell">
{% if line.presentment_title %}
{% assign line_title = line.presentment_title %}
{% elsif line.title %}
{% assign line_title = line.title %}
{% else %}
{% assign line_title = line.product.title %}
{% endif %}
{% if line.quantity < line.quantity %}
{% capture line_display %}
{{ line.quantity }} of {{ line.quantity }}
{% endcapture %}
{% else %}
{% assign line_display = line.quantity %}
{% endif %}
<span class="order-list__item-title">{{ line_title }} × {{ line_display }}</span><br/>
{% if pc_line_type != poscafe_label %}
{% if line.variant.title != 'Default Title' and is_parent == false %}
<span class="order-list__item-variant">{{ line.variant.title }}</span><br/>
{% elsif line.variant.title != 'Default Title' and line.nested_line_parent? %}
<span class="order-list__item-variant">{{ line.variant.title }}</span><br/>
{% elsif line.variant.title != 'Default Title' and line.bundle_parent? and false == false %}
<span class="order-list__item-variant">{{ line.variant.title }}</span><br/>
{% endif %}
{% endif %}
{% comment %} POS Cafe: Show prep area label and modifier properties (value only) {% endcomment %}
{% if pc_line_type == poscafe_label %}
{% assign pc_line_prep = line.properties["Prep Area"] %}
{% if pc_line_prep != blank %}
<span class="order-list__item-variant" style="font-weight:bold;">Prep area: {{ pc_line_prep }}</span><br/>
{% endif %}
{% for p in line.properties %}
{% assign pc_prop_key = p.first | strip %}
{% assign pc_first_char = pc_prop_key | slice: 0 %}
{% unless pc_first_char == "_" or pc_hidden_keys contains pc_prop_key %}
{% if p.last != blank and p.last != "Default Title" %}
<span class="order-list__item-variant">{{ p.last }}</span><br/>
{% endif %}
{% endunless %}
{% endfor %}
{% endif %}
{% if false %}
{% for child_line in line.bundle_components %}
{% if true %}
{% assign css_class = 'order-list__bundle-item' %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign css_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign css_class = 'order-list__deliverable-item_abandoned' %}
{% assign css_image_class = 'order-list__image-cell--nested-line-item' %}
{% assign css_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if false %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<table height="100%">
<tr class="order-list__item">
<td class="{{ css_class }}" height="100%">
<table height="100%">
<td class="{{ css_image_class }}">
{% if child_line.image %}
<img src="{{ child_line | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image small"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ css_description_class }}">
{% if child_line.product.title %}
{% assign item_title = child_line.product.title %}
{% else %}
{% assign item_title = child_line.title %}
{% endif %}
{% assign item_display = child_line.quantity %}
<span class="order-list__item-title">{{ item_display }} × {{ item_title }}</span><br>
{% if child_line.variant.title != 'Default Title'%}
<span class="order-list__item-variant">{{ child_line.variant.title }}</span><br/>
{% endif %}
{% if child_line.selling_plan_allocation %}
<span class="order-list__item-variant">{{ child_line.selling_plan_allocation.selling_plan.name }}</span>
{% endif %}
</td>
</table>
</td>
</tr>
</table>
{% endfor %}
{% else %}
{% for group in line.groups %}
{% if group.deliverable? %}
<span class="order-list__item-variant">For: {{ group.display_title }}</span><br/>
{% else %}
<span class="order-list__item-variant">Part of: {{ group.display_title }}</span><br/>
{% endif %}
{% endfor %}
{% endif %}
{% if line.selling_plan_allocation %}
<span class="order-list__item-variant">{{ line.selling_plan_allocation.selling_plan.name }}</span><br/>
{% endif %}
{% if line.refunded_quantity > 0 %}
<span class="order-list__item-refunded">Refunded</span>
{% endif %}
{% if line.discount_allocations %}
{% for discount_allocation in line.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
</td>
{% if false and is_parent %}
<td class="order-list__parent-price-cell">
{% else %}
<td class="order-list__price-cell">
{% endif %}
{% if line.original_line_price != line.final_line_price %}
<del class="order-list__item-original-price">{{ line.original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if line.final_line_price > 0 %}
{{ line.final_line_price | money }}
{% if line.unit_price_measurement %}
<div class="order-list__unit-price">
{{- line.unit_price | unit_price_with_measurement: line.unit_price_measurement -}}
</div>
{% endif %}
{% else %}
Free
{% endif %}
</p>
</td>
{% if line.nested_line_parent? %}
{% for child_line in line.nested_lines %}
{% if false %}
{% assign css_class = 'order-list__bundle-item' %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign css_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign css_class = 'order-list__deliverable-item_abandoned' %}
{% assign css_image_class = 'order-list__image-cell--nested-line-item' %}
{% assign css_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if forloop.last %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<table height="100%">
<tr class="order-list__item">
<td class="{{ css_class }}" height="100%">
<table height="100%">
<td class="nested-line-item-spacer-cell"style="padding: 1px;">
<div class="nested-line-item-spacer"></div>
</td>
<td class="curved-line-cell-container" valign="top">
<div style="width: 0px;">
<table>
<tr>
<td class="{{ css_curved_line_cell_container_cell__no_padding_class }}" style="mso-padding-right-alt: 10px;">
<div class="curved-line-cell-container__top-spacer {{ css_curved_line_cell_container_class }}"></div>
</td>
</tr>
<tr>
<td class="curved-line-cell-container__curvedLine-cell">
<div class="curved-line-cell-container__curvedLine-cell__curvedLine"></div>
</td>
</tr>
</table>
</div>
</td>
<td class="vertical-line" height="100%">
<div class="vertical-line__content {{ css_hide_vertical_line_class }}"></div>
</td>
<td class="nested-line-item-spacer-cell--right">
<div class="nested-line-item-spacer"></div>
</td>
<td class="{{ css_image_class }}">
{% if child_line.image %}
<img src="{{ child_line | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image small"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ css_description_class }}">
{% if child_line.product.title %}
{% assign item_title = child_line.product.title %}
{% else %}
{% assign item_title = child_line.title %}
{% endif %}
{% assign item_display = child_line.quantity %}
<span class="order-list__item-title">{{ item_title }} × {{ item_display }}</span><br>
{% if child_line.variant.title != 'Default Title'%}
<span class="order-list__item-variant">{{ child_line.variant.title }}</span><br/>
{% endif %}
{% if child_line.selling_plan_allocation %}
<span class="order-list__item-variant">{{ child_line.selling_plan_allocation.selling_plan.name }}</span>
{% endif %}
</td>
</table>
</td>
</tr>
</table>
{% endfor %}
{% endif %}
</table>
</td>
</tr>
{% endunless %}{% comment %} POS Cafe: end modifier skip {% endcomment %}
{% endunless %}
{% endif %}
{% endunless %}
{% endfor %}
{% for line_item_group in line_item_groups %}
{% comment %} POS Cafe: Skip line_item_groups that belong to POS Cafe {% endcomment %}
{% assign pc_is_poscafe_group = false %}
{% for component in line_item_group.components %}
{% if component.properties["Item Type"] == poscafe_label or component.properties["Item Type"] == modifier_label %}
{% assign pc_is_poscafe_group = true %}
{% break %}
{% endif %}
{% endfor %}
{% unless pc_is_poscafe_group %}
{% unless line_item_group.components.first.delivery_agreement %}
{% assign legacy_separator = true %}
{% assign final_line_price = 0 %}
{% assign original_line_price = 0 %}
{% assign discount_keys_str = "" %}
{% assign parent_line_item = nil %}
{% if line_item_group.deliverable? == false %}
{% assign line_item_group_class = "order-list__item__cell" %}
{% for component in line_item_group.components %}
{% assign final_line_price = final_line_price | plus: component.final_line_price %}
{% assign original_line_price = original_line_price | plus: component.original_line_price %}
{% for da in component.discount_allocations %}
{% if da.discount_application.target_selection != 'all' %}
{% assign discount_key = da.discount_application.title | append: da.discount_application.type %}
{% assign discount_keys_str = discount_keys_str | append: discount_key | append: "," %}
{% endif %}
{% endfor %}
{% endfor %}
{% endif %}
{% if line_item_group.deliverable? %}
{% assign parent_line_item = line_item_group.parent_sales_line_item %}
{% assign final_line_price = parent_line_item.final_line_price %}
{% assign original_line_price = parent_line_item.original_line_price %}
{% assign line_item_group_class = "order-list__parent_item__cell" %}
{% assign padding_bottom_none_class = "padding-bottom-none" %}
{% endif %}
{% assign discount_keys = discount_keys_str | split: "," | uniq %}
<tr class="order-list__item">
<td class="{{ line_item_group_class }}" style="padding: 15px 0 0px 1px;">
<table height="100%">
<td class="order-list__parent-image-cell" valign="top" style="vertical-align: top;">
<table height="100%">
<tr>
<td class="{{ padding_bottom_none_class }}" valign="top">
{% if parent_line_item and parent_line_item.image %}
<img src="{{ parent_line_item | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% elsif line_item_group.image %}
<img src="{{ line_item_group | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="30" height="30" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
</tr>
{% if line_item_group.deliverable? == true %}
<tr height="100%">
<td height="100%" class="parent-vertical-line__cell">
<table height="100%" style="width: auto;">
<tr>
<td height="100%" class="nested-line-item-spacer-cell">
<div style="width: 6px;"></div>
</td>
<td height="100%" class="parent-vertical-line__cell">
<div class="parent-vertical-line__content"></div>
</td>
</tr>
</table>
</td>
</tr>
{% endif %}
</table>
</td>
<td class="order-list__product-description-cell">
<table>
<tr>
<td class="order-list__product-description-cell" colspan="2">
<span class="order-list__item-title">{{ line_item_group.display_title }} × {{ line_item_group.quantity }}</span><br/>
{% if line_item_group.variant and line_item_group.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ line_item_group.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if parent_line_item.discount_allocations %}
{% for discount_allocation in parent_line_item.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% else %}
{% for discount_key in discount_keys %}
{% assign discount_amount = 0 %}
{% for component in line_item_group.components %}
{% for da in component.discount_allocations %}
{% assign key = da.discount_application.title | append: da.discount_application.type %}
{% if da.discount_application.target_selection != 'all' and key == discount_key %}
{% assign discount_amount = discount_amount | plus: da.amount %}
{% assign discount_title = da.discount_application.title %}
{% endif %}
{% endfor %}
{% endfor %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_title | upcase }}
(-{{ discount_amount | money }})
</span>
</span>
</p>
{% endfor %}
{% endif %}
</td>
<td class="order-list__parent_price-cell">
{% if original_line_price != final_line_price %}
<del class="order-list__item-original-price">{{ original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if final_line_price > 0 %}
{{ final_line_price | money }}
{% else %}
{{ 'notifications.views.mailers.notifications.discount_free' | t }}
{% endif %}
</p>
</td>
</tr>
{% if line_item_group.deliverable? == false %}
{% for component in line_item_group.components %}
{% if true %}
{% assign order_list_item_class = "order-list__bundle-item" %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign order_list_product_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign order_list_product_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if false %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<tr height="100%">
<td class="{{ order_list_item_class }} {{ css_image_class }}" valign="top">
{% if component.image %}
<img src="{{ component | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ order_list_product_description_class }}" valign="top">
{% if component.product.title %}
{% assign component_title = component.product.title %}
{% else %}
{% assign component_title = component.title %}
{% endif %}
{% if line_item_group.deliverable? %}
<span class="order-list__item-title">{{ component_title }} × {{ component.quantity }}</span>
{% else %}
<span class="order-list__item-title">{{ component.quantity }} × {{ component_title }}</span>
{% endif %}
<br>
{% if component.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ component.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if component.discount_allocations %}
{% for discount_allocation in component.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
</td>
{% if line_item_group.deliverable? %}
<td class="order-list__price-cell">
{% if component.original_line_price != component.final_line_price %}
<del class="order-list__item-original-price">{{ component.original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if component.final_line_price > 0 %}
{{ component.final_line_price | money }}
{% else %}
Free
{% endif %}
</p>
</td>
{% endif %}
</tr>
{% endfor %}
{% endif %}
</table>
</td>
</table>
{% if line_item_group.deliverable? %}
<td height="100%">
{% for component in line_item_group.components %}
<tr>
<td class="order-list__deliverable-item" height="100%" style="padding: 0;">
<table height="100%">
{% if false %}
{% assign order_list_item_class = "order-list__bundle-item" %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign order_list_product_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign order_list_product_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if forloop.last %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<tr height="100%">
<td class="nested-line-item-spacer-cell" style="padding: 1px;">
<div class="nested-line-item-spacer"></div>
</td>
<td class="curved-line-cell-container" valign="top">
<div style="width: 0px;">
<table>
<tr>
<td class="{{ css_curved_line_cell_container_cell__no_padding_class }}" style="mso-padding-right-alt: 10px;">
<div class="curved-line-cell-container__top-spacer {{ css_curved_line_cell_container_class }}"></div>
</td>
</tr>
<tr>
<td class="curved-line-cell-container__curvedLine-cell">
<div class="curved-line-cell-container__curvedLine-cell__curvedLine"></div>
</td>
</tr>
</table>
</div>
</td>
<td class="vertical-line" height="100%">
<div class="vertical-line__content {{ css_hide_vertical_line_class }}"></div>
</td>
<td class="nested-line-item-spacer-cell--right">
<div class="nested-line-item-spacer"></div>
</td>
<td class="{{ order_list_item_class }} {{ css_image_class }}" valign="top">
{% if component.image %}
<img src="{{ component | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ order_list_product_description_class }}" valign="top">
{% if component.product.title %}
{% assign component_title = component.product.title %}
{% else %}
{% assign component_title = component.title %}
{% endif %}
{% if line_item_group.deliverable? %}
<span class="order-list__item-title">{{ component_title }} × {{ component.quantity }}</span>
{% else %}
<span class="order-list__item-title">{{ component.quantity }} × {{ component_title }}</span>
{% endif %}
<br>
{% if component.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ component.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if component.discount_allocations %}
{% for discount_allocation in component.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
</td>
{% if line_item_group.deliverable? %}
<td class="order-list__price-cell">
{% if component.original_line_price != component.final_line_price %}
<del class="order-list__item-original-price">{{ component.original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if component.final_line_price > 0 %}
{{ component.final_line_price | money }}
{% else %}
Free
{% endif %}
</p>
</td>
{% endif %}
</tr>
</table>
</td>
</tr>
{% endfor %}
</td>
{% endif %}
</td>
</tr>
{% endunless %}
{% endunless %}{% comment %} POS Cafe: end line_item_group skip {% endcomment %}
{% endfor %}
</table>
{% if legacy_separator %}
<hr class="order-list__delivery-method-type-separator">
{% endif %}
{% for delivery_agreement in delivery_agreements %}
{% if delivery_agreement.line_items != blank %}
{% if delivery_agreements.size > 1 %}
<h4 class="order-list__delivery-method-type">
{{ delivery_agreement.delivery_method_name }} items
</h4>
{% endif %}
<table class="row">
{% for line in delivery_agreement.non_parent_line_items %}
{% if line.groups.size == 0 %}
{% comment %} Skip child add-ons since they will be rendered under the parent line item {% endcomment %}
{% unless line.nested_line_child? %}
{% comment %} POS Cafe: Skip modifier line items {% endcomment %}
{% assign pc_line_type = line.properties["Item Type"] %}
{% unless pc_line_type == modifier_label %}
{% assign is_parent = false %}
{% assign is_nested_line_parent = line.nested_line_parent? %}
{% if line.bundle_parent? or line.nested_line_parent? %}
{% assign is_parent = true %}
{% endif %}
{% if is_nested_line_parent %}
{% assign css_order_list_cell_nested_line_parent_class = 'order-list__parent-cell' %}
{% assign css_order_list_parent_image_cell_nested_line_parent_class = 'order-list__nested-parent-image-cell' %}
{% endif %}
<tr class="order-list__item">
<td class="order-list__item__cell {{ css_order_list_cell_nested_line_parent_class }}">
<table height="100%">
<td style="padding-bottom: 0px;">
<table height="100%">
<tr valign="top">
{% if false and is_parent %}
<td class="order-list__parent-image-cell {{ css_order_list_parent_image_cell_nested_line_parent_class }}">
{% if line.image %}
<img src="{{ line | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
{% else %}
<td class="order-list__image-cell" valign="top" style="vertical-align: top;">
{% if line.image %}
<img src="{{ line | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="60" height="60" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
{% endif %}
</tr>
{% if is_nested_line_parent %}
<tr height="100%">
<td style="padding: 0px;" height="100%">
<table height="100%">
<tr>
<td height="100%" class="nested-line-item-spacer-cell">
<div class="nested-line-item-spacer"></div>
</td>
<td height="100%" class="parent-vertical-line__cell">
<div class="parent-vertical-line__content"></div>
</td>
</tr>
</table>
</td>
</tr>
{% endif %}
</table>
</td>
<td class="order-list__product-description-cell">
{% if line.presentment_title %}
{% assign line_title = line.presentment_title %}
{% elsif line.title %}
{% assign line_title = line.title %}
{% else %}
{% assign line_title = line.product.title %}
{% endif %}
{% if line.quantity < line.quantity %}
{% capture line_display %}
{{ line.quantity }} of {{ line.quantity }}
{% endcapture %}
{% else %}
{% assign line_display = line.quantity %}
{% endif %}
<span class="order-list__item-title">{{ line_title }} × {{ line_display }}</span><br/>
{% if pc_line_type != poscafe_label %}
{% if line.variant.title != 'Default Title' and is_parent == false %}
<span class="order-list__item-variant">{{ line.variant.title }}</span><br/>
{% elsif line.variant.title != 'Default Title' and line.nested_line_parent? %}
<span class="order-list__item-variant">{{ line.variant.title }}</span><br/>
{% elsif line.variant.title != 'Default Title' and line.bundle_parent? and false == false %}
<span class="order-list__item-variant">{{ line.variant.title }}</span><br/>
{% endif %}
{% endif %}
{% comment %} POS Cafe: Show prep area label and modifier properties (value only) {% endcomment %}
{% if pc_line_type == poscafe_label %}
{% assign pc_line_prep = line.properties["Prep Area"] %}
{% if pc_line_prep != blank %}
<span class="order-list__item-variant" style="font-weight:bold;">Prep area: {{ pc_line_prep }}</span><br/>
{% endif %}
{% for p in line.properties %}
{% assign pc_prop_key = p.first | strip %}
{% assign pc_first_char = pc_prop_key | slice: 0 %}
{% unless pc_first_char == "_" or pc_hidden_keys contains pc_prop_key %}
{% if p.last != blank and p.last != "Default Title" %}
<span class="order-list__item-variant">{{ p.last }}</span><br/>
{% endif %}
{% endunless %}
{% endfor %}
{% endif %}
{% if false %}
{% for child_line in line.bundle_components %}
{% if true %}
{% assign css_class = 'order-list__bundle-item' %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign css_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign css_class = 'order-list__deliverable-item_abandoned' %}
{% assign css_image_class = 'order-list__image-cell--nested-line-item' %}
{% assign css_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if false %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<table height="100%">
<tr class="order-list__item">
<td class="{{ css_class }}" height="100%">
<table height="100%">
<td class="{{ css_image_class }}">
{% if child_line.image %}
<img src="{{ child_line | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image small"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ css_description_class }}">
{% if child_line.product.title %}
{% assign item_title = child_line.product.title %}
{% else %}
{% assign item_title = child_line.title %}
{% endif %}
{% assign item_display = child_line.quantity %}
<span class="order-list__item-title">{{ item_display }} × {{ item_title }}</span><br>
{% if child_line.variant.title != 'Default Title'%}
<span class="order-list__item-variant">{{ child_line.variant.title }}</span><br/>
{% endif %}
{% if child_line.selling_plan_allocation %}
<span class="order-list__item-variant">{{ child_line.selling_plan_allocation.selling_plan.name }}</span>
{% endif %}
</td>
</table>
</td>
</tr>
</table>
{% endfor %}
{% else %}
{% for group in line.groups %}
{% if group.deliverable? %}
<span class="order-list__item-variant">For: {{ group.display_title }}</span><br/>
{% else %}
<span class="order-list__item-variant">Part of: {{ group.display_title }}</span><br/>
{% endif %}
{% endfor %}
{% endif %}
{% if line.selling_plan_allocation %}
<span class="order-list__item-variant">{{ line.selling_plan_allocation.selling_plan.name }}</span><br/>
{% endif %}
{% if line.refunded_quantity > 0 %}
<span class="order-list__item-refunded">Refunded</span>
{% endif %}
{% if line.discount_allocations %}
{% for discount_allocation in line.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
</td>
{% if false and is_parent %}
<td class="order-list__parent-price-cell">
{% else %}
<td class="order-list__price-cell">
{% endif %}
{% if line.original_line_price != line.final_line_price %}
<del class="order-list__item-original-price">{{ line.original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if line.final_line_price > 0 %}
{{ line.final_line_price | money }}
{% if line.unit_price_measurement %}
<div class="order-list__unit-price">
{{- line.unit_price | unit_price_with_measurement: line.unit_price_measurement -}}
</div>
{% endif %}
{% else %}
Free
{% endif %}
</p>
</td>
{% if line.nested_line_parent? %}
{% for child_line in line.nested_lines %}
{% if false %}
{% assign css_class = 'order-list__bundle-item' %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign css_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign css_class = 'order-list__deliverable-item_abandoned' %}
{% assign css_image_class = 'order-list__image-cell--nested-line-item' %}
{% assign css_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if forloop.last %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<table height="100%">
<tr class="order-list__item">
<td class="{{ css_class }}" height="100%">
<table height="100%">
<td class="nested-line-item-spacer-cell"style="padding: 1px;">
<div class="nested-line-item-spacer"></div>
</td>
<td class="curved-line-cell-container" valign="top">
<div style="width: 0px;">
<table>
<tr>
<td class="{{ css_curved_line_cell_container_cell__no_padding_class }}" style="mso-padding-right-alt: 10px;">
<div class="curved-line-cell-container__top-spacer {{ css_curved_line_cell_container_class }}"></div>
</td>
</tr>
<tr>
<td class="curved-line-cell-container__curvedLine-cell">
<div class="curved-line-cell-container__curvedLine-cell__curvedLine"></div>
</td>
</tr>
</table>
</div>
</td>
<td class="vertical-line" height="100%">
<div class="vertical-line__content {{ css_hide_vertical_line_class }}"></div>
</td>
<td class="nested-line-item-spacer-cell--right">
<div class="nested-line-item-spacer"></div>
</td>
<td class="{{ css_image_class }}">
{% if child_line.image %}
<img src="{{ child_line | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image small"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ css_description_class }}">
{% if child_line.product.title %}
{% assign item_title = child_line.product.title %}
{% else %}
{% assign item_title = child_line.title %}
{% endif %}
{% assign item_display = child_line.quantity %}
<span class="order-list__item-title">{{ item_title }} × {{ item_display }}</span><br>
{% if child_line.variant.title != 'Default Title'%}
<span class="order-list__item-variant">{{ child_line.variant.title }}</span><br/>
{% endif %}
{% if child_line.selling_plan_allocation %}
<span class="order-list__item-variant">{{ child_line.selling_plan_allocation.selling_plan.name }}</span>
{% endif %}
</td>
</table>
</td>
</tr>
</table>
{% endfor %}
{% endif %}
</table>
</td>
</tr>
{% endunless %}{% comment %} POS Cafe: end modifier skip {% endcomment %}
{% endunless %}
{% endif %}
{% endfor %}
{% for line_item_group in delivery_agreement.line_item_groups %}
{% comment %} POS Cafe: Skip line_item_groups that belong to POS Cafe {% endcomment %}
{% assign pc_is_poscafe_group = false %}
{% for component in line_item_group.components %}
{% if component.properties["Item Type"] == poscafe_label or component.properties["Item Type"] == modifier_label %}
{% assign pc_is_poscafe_group = true %}
{% break %}
{% endif %}
{% endfor %}
{% unless pc_is_poscafe_group %}
{% if line_item_group.deliverable? == false %}
{% assign final_line_price = 0 %}
{% assign original_line_price = 0 %}
{% assign discount_keys_str = "" %}
{% assign parent_line_item = nil %}
{% if line_item_group.deliverable? == false %}
{% assign line_item_group_class = "order-list__item__cell" %}
{% for component in line_item_group.components %}
{% assign final_line_price = final_line_price | plus: component.final_line_price %}
{% assign original_line_price = original_line_price | plus: component.original_line_price %}
{% for da in component.discount_allocations %}
{% if da.discount_application.target_selection != 'all' %}
{% assign discount_key = da.discount_application.title | append: da.discount_application.type %}
{% assign discount_keys_str = discount_keys_str | append: discount_key | append: "," %}
{% endif %}
{% endfor %}
{% endfor %}
{% endif %}
{% if line_item_group.deliverable? %}
{% assign parent_line_item = line_item_group.parent_sales_line_item %}
{% assign final_line_price = parent_line_item.final_line_price %}
{% assign original_line_price = parent_line_item.original_line_price %}
{% assign line_item_group_class = "order-list__parent_item__cell" %}
{% assign padding_bottom_none_class = "padding-bottom-none" %}
{% endif %}
{% assign discount_keys = discount_keys_str | split: "," | uniq %}
<tr class="order-list__item">
<td class="{{ line_item_group_class }}" style="padding: 15px 0 0px 1px;">
<table height="100%">
<td class="order-list__parent-image-cell" valign="top" style="vertical-align: top;">
<table height="100%">
<tr>
<td class="{{ padding_bottom_none_class }}" valign="top">
{% if parent_line_item and parent_line_item.image %}
<img src="{{ parent_line_item | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% elsif line_item_group.image %}
<img src="{{ line_item_group | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="30" height="30" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
</tr>
{% if line_item_group.deliverable? == true %}
<tr height="100%">
<td height="100%" class="parent-vertical-line__cell">
<table height="100%" style="width: auto;">
<tr>
<td height="100%" class="nested-line-item-spacer-cell">
<div style="width: 6px;"></div>
</td>
<td height="100%" class="parent-vertical-line__cell">
<div class="parent-vertical-line__content"></div>
</td>
</tr>
</table>
</td>
</tr>
{% endif %}
</table>
</td>
<td class="order-list__product-description-cell">
<table>
<tr>
<td class="order-list__product-description-cell" colspan="2">
<span class="order-list__item-title">{{ line_item_group.display_title }} × {{ line_item_group.quantity }}</span><br/>
{% if line_item_group.variant and line_item_group.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ line_item_group.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if parent_line_item.discount_allocations %}
{% for discount_allocation in parent_line_item.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% else %}
{% for discount_key in discount_keys %}
{% assign discount_amount = 0 %}
{% for component in line_item_group.components %}
{% for da in component.discount_allocations %}
{% assign key = da.discount_application.title | append: da.discount_application.type %}
{% if da.discount_application.target_selection != 'all' and key == discount_key %}
{% assign discount_amount = discount_amount | plus: da.amount %}
{% assign discount_title = da.discount_application.title %}
{% endif %}
{% endfor %}
{% endfor %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_title | upcase }}
(-{{ discount_amount | money }})
</span>
</span>
</p>
{% endfor %}
{% endif %}
</td>
<td class="order-list__parent_price-cell">
{% if original_line_price != final_line_price %}
<del class="order-list__item-original-price">{{ original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if final_line_price > 0 %}
{{ final_line_price | money }}
{% else %}
{{ 'notifications.views.mailers.notifications.discount_free' | t }}
{% endif %}
</p>
</td>
</tr>
{% if line_item_group.deliverable? == false %}
{% for component in line_item_group.components %}
{% if true %}
{% assign order_list_item_class = "order-list__bundle-item" %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign order_list_product_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign order_list_product_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if false %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<tr height="100%">
<td class="{{ order_list_item_class }} {{ css_image_class }}" valign="top">
{% if component.image %}
<img src="{{ component | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ order_list_product_description_class }}" valign="top">
{% if component.product.title %}
{% assign component_title = component.product.title %}
{% else %}
{% assign component_title = component.title %}
{% endif %}
{% if line_item_group.deliverable? %}
<span class="order-list__item-title">{{ component_title }} × {{ component.quantity }}</span>
{% else %}
<span class="order-list__item-title">{{ component.quantity }} × {{ component_title }}</span>
{% endif %}
<br>
{% if component.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ component.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if component.discount_allocations %}
{% for discount_allocation in component.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
</td>
{% if line_item_group.deliverable? %}
<td class="order-list__price-cell">
{% if component.original_line_price != component.final_line_price %}
<del class="order-list__item-original-price">{{ component.original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if component.final_line_price > 0 %}
{{ component.final_line_price | money }}
{% else %}
Free
{% endif %}
</p>
</td>
{% endif %}
</tr>
{% endfor %}
{% endif %}
</table>
</td>
</table>
{% if line_item_group.deliverable? %}
<td height="100%">
{% for component in line_item_group.components %}
<tr>
<td class="order-list__deliverable-item" height="100%" style="padding: 0;">
<table height="100%">
{% if false %}
{% assign order_list_item_class = "order-list__bundle-item" %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign order_list_product_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign order_list_product_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if forloop.last %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<tr height="100%">
<td class="nested-line-item-spacer-cell" style="padding: 1px;">
<div class="nested-line-item-spacer"></div>
</td>
<td class="curved-line-cell-container" valign="top">
<div style="width: 0px;">
<table>
<tr>
<td class="{{ css_curved_line_cell_container_cell__no_padding_class }}" style="mso-padding-right-alt: 10px;">
<div class="curved-line-cell-container__top-spacer {{ css_curved_line_cell_container_class }}"></div>
</td>
</tr>
<tr>
<td class="curved-line-cell-container__curvedLine-cell">
<div class="curved-line-cell-container__curvedLine-cell__curvedLine"></div>
</td>
</tr>
</table>
</div>
</td>
<td class="vertical-line" height="100%">
<div class="vertical-line__content {{ css_hide_vertical_line_class }}"></div>
</td>
<td class="nested-line-item-spacer-cell--right">
<div class="nested-line-item-spacer"></div>
</td>
<td class="{{ order_list_item_class }} {{ css_image_class }}" valign="top">
{% if component.image %}
<img src="{{ component | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ order_list_product_description_class }}" valign="top">
{% if component.product.title %}
{% assign component_title = component.product.title %}
{% else %}
{% assign component_title = component.title %}
{% endif %}
{% if line_item_group.deliverable? %}
<span class="order-list__item-title">{{ component_title }} × {{ component.quantity }}</span>
{% else %}
<span class="order-list__item-title">{{ component.quantity }} × {{ component_title }}</span>
{% endif %}
<br>
{% if component.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ component.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if component.discount_allocations %}
{% for discount_allocation in component.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
</td>
{% if line_item_group.deliverable? %}
<td class="order-list__price-cell">
{% if component.original_line_price != component.final_line_price %}
<del class="order-list__item-original-price">{{ component.original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if component.final_line_price > 0 %}
{{ component.final_line_price | money }}
{% else %}
Free
{% endif %}
</p>
</td>
{% endif %}
</tr>
</table>
</td>
</tr>
{% endfor %}
</td>
{% endif %}
</td>
</tr>
{% else %}
{% if delivery_agreement == line_item_group.parent_sales_line_item.delivery_agreement %}
{% assign final_line_price = 0 %}
{% assign original_line_price = 0 %}
{% assign discount_keys_str = "" %}
{% assign parent_line_item = nil %}
{% if line_item_group.deliverable? == false %}
{% assign line_item_group_class = "order-list__item__cell" %}
{% for component in line_item_group.components %}
{% assign final_line_price = final_line_price | plus: component.final_line_price %}
{% assign original_line_price = original_line_price | plus: component.original_line_price %}
{% for da in component.discount_allocations %}
{% if da.discount_application.target_selection != 'all' %}
{% assign discount_key = da.discount_application.title | append: da.discount_application.type %}
{% assign discount_keys_str = discount_keys_str | append: discount_key | append: "," %}
{% endif %}
{% endfor %}
{% endfor %}
{% endif %}
{% if line_item_group.deliverable? %}
{% assign parent_line_item = line_item_group.parent_sales_line_item %}
{% assign final_line_price = parent_line_item.final_line_price %}
{% assign original_line_price = parent_line_item.original_line_price %}
{% assign line_item_group_class = "order-list__parent_item__cell" %}
{% assign padding_bottom_none_class = "padding-bottom-none" %}
{% endif %}
{% assign discount_keys = discount_keys_str | split: "," | uniq %}
<tr class="order-list__item">
<td class="{{ line_item_group_class }}" style="padding: 15px 0 0px 1px;">
<table height="100%">
<td class="order-list__parent-image-cell" valign="top" style="vertical-align: top;">
<table height="100%">
<tr>
<td class="{{ padding_bottom_none_class }}" valign="top">
{% if parent_line_item and parent_line_item.image %}
<img src="{{ parent_line_item | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% elsif line_item_group.image %}
<img src="{{ line_item_group | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="30" height="30" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
</tr>
{% if line_item_group.deliverable? == true %}
<tr height="100%">
<td height="100%" class="parent-vertical-line__cell">
<table height="100%" style="width: auto;">
<tr>
<td height="100%" class="nested-line-item-spacer-cell">
<div style="width: 6px;"></div>
</td>
<td height="100%" class="parent-vertical-line__cell">
<div class="parent-vertical-line__content"></div>
</td>
</tr>
</table>
</td>
</tr>
{% endif %}
</table>
</td>
<td class="order-list__product-description-cell">
<table>
<tr>
<td class="order-list__product-description-cell" colspan="2">
<span class="order-list__item-title">{{ line_item_group.display_title }} × {{ line_item_group.quantity }}</span><br/>
{% if line_item_group.variant and line_item_group.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ line_item_group.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if parent_line_item.discount_allocations %}
{% for discount_allocation in parent_line_item.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% else %}
{% for discount_key in discount_keys %}
{% assign discount_amount = 0 %}
{% for component in line_item_group.components %}
{% for da in component.discount_allocations %}
{% assign key = da.discount_application.title | append: da.discount_application.type %}
{% if da.discount_application.target_selection != 'all' and key == discount_key %}
{% assign discount_amount = discount_amount | plus: da.amount %}
{% assign discount_title = da.discount_application.title %}
{% endif %}
{% endfor %}
{% endfor %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_title | upcase }}
(-{{ discount_amount | money }})
</span>
</span>
</p>
{% endfor %}
{% endif %}
</td>
<td class="order-list__parent_price-cell">
{% if original_line_price != final_line_price %}
<del class="order-list__item-original-price">{{ original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if final_line_price > 0 %}
{{ final_line_price | money }}
{% else %}
{{ 'notifications.views.mailers.notifications.discount_free' | t }}
{% endif %}
</p>
</td>
</tr>
{% if line_item_group.deliverable? == false %}
{% for component in line_item_group.components %}
{% if true %}
{% assign order_list_item_class = "order-list__bundle-item" %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign order_list_product_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign order_list_product_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if false %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<tr height="100%">
<td class="{{ order_list_item_class }} {{ css_image_class }}" valign="top">
{% if component.image %}
<img src="{{ component | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ order_list_product_description_class }}" valign="top">
{% if component.product.title %}
{% assign component_title = component.product.title %}
{% else %}
{% assign component_title = component.title %}
{% endif %}
{% if line_item_group.deliverable? %}
<span class="order-list__item-title">{{ component_title }} × {{ component.quantity }}</span>
{% else %}
<span class="order-list__item-title">{{ component.quantity }} × {{ component_title }}</span>
{% endif %}
<br>
{% if component.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ component.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if component.discount_allocations %}
{% for discount_allocation in component.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
</td>
{% if line_item_group.deliverable? %}
<td class="order-list__price-cell">
{% if component.original_line_price != component.final_line_price %}
<del class="order-list__item-original-price">{{ component.original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if component.final_line_price > 0 %}
{{ component.final_line_price | money }}
{% else %}
Free
{% endif %}
</p>
</td>
{% endif %}
</tr>
{% endfor %}
{% endif %}
</table>
</td>
</table>
{% if line_item_group.deliverable? %}
<td height="100%">
{% for component in line_item_group.components %}
<tr>
<td class="order-list__deliverable-item" height="100%" style="padding: 0;">
<table height="100%">
{% if false %}
{% assign order_list_item_class = "order-list__bundle-item" %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign order_list_product_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign order_list_product_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if forloop.last %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<tr height="100%">
<td class="nested-line-item-spacer-cell" style="padding: 1px;">
<div class="nested-line-item-spacer"></div>
</td>
<td class="curved-line-cell-container" valign="top">
<div style="width: 0px;">
<table>
<tr>
<td class="{{ css_curved_line_cell_container_cell__no_padding_class }}" style="mso-padding-right-alt: 10px;">
<div class="curved-line-cell-container__top-spacer {{ css_curved_line_cell_container_class }}"></div>
</td>
</tr>
<tr>
<td class="curved-line-cell-container__curvedLine-cell">
<div class="curved-line-cell-container__curvedLine-cell__curvedLine"></div>
</td>
</tr>
</table>
</div>
</td>
<td class="vertical-line" height="100%">
<div class="vertical-line__content {{ css_hide_vertical_line_class }}"></div>
</td>
<td class="nested-line-item-spacer-cell--right">
<div class="nested-line-item-spacer"></div>
</td>
<td class="{{ order_list_item_class }} {{ css_image_class }}" valign="top">
{% if component.image %}
<img src="{{ component | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ order_list_product_description_class }}" valign="top">
{% if component.product.title %}
{% assign component_title = component.product.title %}
{% else %}
{% assign component_title = component.title %}
{% endif %}
{% if line_item_group.deliverable? %}
<span class="order-list__item-title">{{ component_title }} × {{ component.quantity }}</span>
{% else %}
<span class="order-list__item-title">{{ component.quantity }} × {{ component_title }}</span>
{% endif %}
<br>
{% if component.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ component.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if component.discount_allocations %}
{% for discount_allocation in component.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
</td>
{% if line_item_group.deliverable? %}
<td class="order-list__price-cell">
{% if component.original_line_price != component.final_line_price %}
<del class="order-list__item-original-price">{{ component.original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if component.final_line_price > 0 %}
{{ component.final_line_price | money }}
{% else %}
Free
{% endif %}
</p>
</td>
{% endif %}
</tr>
</table>
</td>
</tr>
{% endfor %}
</td>
{% endif %}
</td>
</tr>
{% else %}
{% for component in line_item_group.components %}
{% comment %} Skip child add-ons since they will be rendered under the parent line item {% endcomment %}
{% unless component.nested_line_child? %}
{% assign is_parent = false %}
{% assign is_nested_line_parent = component.nested_line_parent? %}
{% if component.bundle_parent? or component.nested_line_parent? %}
{% assign is_parent = true %}
{% endif %}
{% if is_nested_line_parent %}
{% assign css_order_list_cell_nested_line_parent_class = 'order-list__parent-cell' %}
{% assign css_order_list_parent_image_cell_nested_line_parent_class = 'order-list__nested-parent-image-cell' %}
{% endif %}
<tr class="order-list__item">
<td class="order-list__item__cell {{ css_order_list_cell_nested_line_parent_class }}">
<table height="100%">
<td style="padding-bottom: 0px;">
<table height="100%">
<tr valign="top">
{% if false and is_parent %}
<td class="order-list__parent-image-cell {{ css_order_list_parent_image_cell_nested_line_parent_class }}">
{% if component.image %}
<img src="{{ component | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
{% else %}
<td class="order-list__image-cell" valign="top" style="vertical-align: top;">
{% if component.image %}
<img src="{{ component | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="60" height="60" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
{% endif %}
</tr>
{% if is_nested_line_parent %}
<tr height="100%">
<td style="padding: 0px;" height="100%">
<table height="100%">
<tr>
<td height="100%" class="nested-line-item-spacer-cell">
<div class="nested-line-item-spacer"></div>
</td>
<td height="100%" class="parent-vertical-line__cell">
<div class="parent-vertical-line__content"></div>
</td>
</tr>
</table>
</td>
</tr>
{% endif %}
</table>
</td>
<td class="order-list__product-description-cell">
{% if component.presentment_title %}
{% assign line_title = component.presentment_title %}
{% elsif component.title %}
{% assign line_title = component.title %}
{% else %}
{% assign line_title = component.product.title %}
{% endif %}
{% if line.quantity < component.quantity %}
{% capture line_display %}
{{ line.quantity }} of {{ component.quantity }}
{% endcapture %}
{% else %}
{% assign line_display = component.quantity %}
{% endif %}
<span class="order-list__item-title">{{ line_title }} × {{ line_display }}</span><br/>
{% if component.variant.title != 'Default Title' and is_parent == false %}
<span class="order-list__item-variant">{{ component.variant.title }}</span><br/>
{% elsif component.variant.title != 'Default Title' and component.nested_line_parent? %}
<span class="order-list__item-variant">{{ component.variant.title }}</span><br/>
{% elsif component.variant.title != 'Default Title' and component.bundle_parent? and false == false %}
<span class="order-list__item-variant">{{ component.variant.title }}</span><br/>
{% endif %}
{% if false %}
{% for child_line in component.bundle_components %}
{% if true %}
{% assign css_class = 'order-list__bundle-item' %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign css_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign css_class = 'order-list__deliverable-item_abandoned' %}
{% assign css_image_class = 'order-list__image-cell--nested-line-item' %}
{% assign css_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if false %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<table height="100%">
<tr class="order-list__item">
<td class="{{ css_class }}" height="100%">
<table height="100%">
<td class="{{ css_image_class }}">
{% if child_line.image %}
<img src="{{ child_line | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image small"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ css_description_class }}">
{% if child_line.product.title %}
{% assign item_title = child_line.product.title %}
{% else %}
{% assign item_title = child_line.title %}
{% endif %}
{% assign item_display = child_line.quantity %}
<span class="order-list__item-title">{{ item_display }} × {{ item_title }}</span><br>
{% if child_line.variant.title != 'Default Title'%}
<span class="order-list__item-variant">{{ child_line.variant.title }}</span><br/>
{% endif %}
{% if child_line.selling_plan_allocation %}
<span class="order-list__item-variant">{{ child_line.selling_plan_allocation.selling_plan.name }}</span>
{% endif %}
</td>
</table>
</td>
</tr>
</table>
{% endfor %}
{% else %}
{% for group in component.groups %}
{% if group.deliverable? %}
<span class="order-list__item-variant">For: {{ group.display_title }}</span><br/>
{% else %}
<span class="order-list__item-variant">Part of: {{ group.display_title }}</span><br/>
{% endif %}
{% endfor %}
{% endif %}
{% if component.selling_plan_allocation %}
<span class="order-list__item-variant">{{ component.selling_plan_allocation.selling_plan.name }}</span><br/>
{% endif %}
{% if component.refunded_quantity > 0 %}
<span class="order-list__item-refunded">Refunded</span>
{% endif %}
{% if component.discount_allocations %}
{% for discount_allocation in component.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
</td>
{% if false and is_parent %}
<td class="order-list__parent-price-cell">
{% else %}
<td class="order-list__price-cell">
{% endif %}
{% if component.original_line_price != component.final_line_price %}
<del class="order-list__item-original-price">{{ component.original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if component.final_line_price > 0 %}
{{ component.final_line_price | money }}
{% if component.unit_price_measurement %}
<div class="order-list__unit-price">
{{- component.unit_price | unit_price_with_measurement: component.unit_price_measurement -}}
</div>
{% endif %}
{% else %}
Free
{% endif %}
</p>
</td>
{% if component.nested_line_parent? %}
{% for child_line in component.nested_lines %}
{% if false %}
{% assign css_class = 'order-list__bundle-item' %}
{% assign css_image_class = 'order-list__image-cell' %}
{% assign css_description_class = 'order-list__product-description-cell' %}
{% else %}
{% assign css_class = 'order-list__deliverable-item_abandoned' %}
{% assign css_image_class = 'order-list__image-cell--nested-line-item' %}
{% assign css_description_class = 'order-list__product-description-cell--nested-line-item' %}
{% if forloop.last %}
{% assign css_curved_line_cell_container_class = 'curved-line-cell-container__top-spacer-cell--show-border' %}
{% assign css_hide_vertical_line_class = 'vertical-line__content--hide' %}
{% assign css_curved_line_cell_container_cell__no_padding_class = 'curved-line-cell-container__cell--no-padding' %}
{% endif %}
{% endif %}
<table height="100%">
<tr class="order-list__item">
<td class="{{ css_class }}" height="100%">
<table height="100%">
<td class="nested-line-item-spacer-cell"style="padding: 1px;">
<div class="nested-line-item-spacer"></div>
</td>
<td class="curved-line-cell-container" valign="top">
<div style="width: 0px;">
<table>
<tr>
<td class="{{ css_curved_line_cell_container_cell__no_padding_class }}" style="mso-padding-right-alt: 10px;">
<div class="curved-line-cell-container__top-spacer {{ css_curved_line_cell_container_class }}"></div>
</td>
</tr>
<tr>
<td class="curved-line-cell-container__curvedLine-cell">
<div class="curved-line-cell-container__curvedLine-cell__curvedLine"></div>
</td>
</tr>
</table>
</div>
</td>
<td class="vertical-line" height="100%">
<div class="vertical-line__content {{ css_hide_vertical_line_class }}"></div>
</td>
<td class="nested-line-item-spacer-cell--right">
<div class="nested-line-item-spacer"></div>
</td>
<td class="{{ css_image_class }}">
{% if child_line.image %}
<img src="{{ child_line | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image small"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="20" height="20" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="{{ css_description_class }}">
{% if child_line.product.title %}
{% assign item_title = child_line.product.title %}
{% else %}
{% assign item_title = child_line.title %}
{% endif %}
{% assign item_display = child_line.quantity %}
<span class="order-list__item-title">{{ item_title }} × {{ item_display }}</span><br>
{% if child_line.variant.title != 'Default Title'%}
<span class="order-list__item-variant">{{ child_line.variant.title }}</span><br/>
{% endif %}
{% if child_line.selling_plan_allocation %}
<span class="order-list__item-variant">{{ child_line.selling_plan_allocation.selling_plan.name }}</span>
{% endif %}
</td>
</table>
</td>
</tr>
</table>
{% endfor %}
{% endif %}
</table>
</td>
</tr>
{% endunless %}
{% endfor %}
{% endif %}
{% endif %}
{% endunless %}{% comment %} POS Cafe: end line_item_group skip {% endcomment %}
{% endfor %}
</table>
{% unless forloop.last %}
<hr class="order-list__delivery-method-type-separator">
{% endunless %}
{% endif %}
{% endfor %}
{% else %}
<table class="row">
{% comment %} ===== POS Cafe: Non-POS Cafe items rendered with original formatting ===== {% endcomment %}
{% for line in non_parent_line_items %}
{% assign pc_line_type = line.properties["Item Type"] %}
{% if pc_line_type != poscafe_label and pc_line_type != modifier_label %}
{% if line.groups.size == 0 %}
<tr class="order-list__item">
<td class="order-list__item__cell">
<table>
{% assign expand_bundles = false %}
{% if expand_bundles and line.bundle_parent? %}
<td class="order-list__parent-image-cell" valign="top" style="vertical-align: top;">
{% else %}
<td class="order-list__image-cell" valign="top" style="vertical-align: top;">
{% endif %}
{% if line.image %}
<img src="{{ line | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="60" height="60" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
<td class="order-list__product-description-cell">
{% if line.quantity < line.quantity %}
{% capture line_display %}
{{ line.quantity }} of {{ line.quantity }}
{% endcapture %}
{% else %}
{% assign line_display = line.quantity %}
{% endif %}
<span class="order-list__item-title">
{% if line.product.title == blank %}
{{ line.title }}</span><br/>
{% else %}
{{ line.product.title }}
{% endif %}
</span><br/>
{% if line.quantity %}
{% if line.original_line_price != line.final_line_price %}
<span><del class="order-list__item-original-price">{{ line.original_price | money }}</del></span>
{% endif %}
<span>{{ line.final_price | money }} × {{ line.quantity }} </span><br/>
{% endif %}
{% if expand_bundles %}
{% for component in line.bundle_components %}
<table>
<tr class="order-list__item">
<td class="order-list__bundle-item">
<table>
<td class="order-list__image-cell" valign="top" style="vertical-align: top;">
{% if component.image %}
<img src="{{ component | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image small"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="40" height="40" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="order-list__product-description-cell">
{% if component.product.title %}
{% assign component_title = component.product.title %}
{% else %}
{% assign component_title = component.title %}
{% endif %}
{% assign component_display = component.quantity %}
<span class="order-list__item-title">{{ component_title }} × {{ component_display }}</span><br>
{% if component.variant.title != 'Default Title'%}
<span class="order-list__item-variant">{{ component.variant.title }}</span>
{% endif %}
</td>
</table>
</td>
</tr>
</table>
{% endfor %}
{% else %}
{% for group in line.groups %}
{% if group.deliverable? %}
<span class="order-list__item-variant">For: {{ group.display_title }}</span><br/>
{% else %}
<span class="order-list__item-variant">Part of: {{ group.display_title }}</span><br/>
{% endif %}
{% endfor %}
{% endif %}
{% if line.variant.title != 'Default Title' and line.bundle_parent? == false %}
<span class="order-list__item-variant">{{ line.variant.title }}</span>
{% if line.sku != blank %}
<span class="order-list__item-variant">• </span>
{% endif %}
{% elsif line.variant.title != 'Default Title' and line.bundle_parent? and expand_bundles == false %}
<span class="order-list__item-variant">{{ line.variant.title }}</span>
{% if line.sku != blank %}
<span class="order-list__item-variant">• </span>
{% endif %}
{% endif %}
{% if line.sku != blank %}
<span class="order-list__item-variant">SKU: {{ line.sku }}</span>
{% endif %}
{% if line.selling_plan_allocation != nil %}
<p class="order-list__item-variant">{{ line.selling_plan_allocation.selling_plan.name }}</p>
{% endif %}
{% if line.discount_allocations %}
{% for discount_allocation in line.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
{% endif %}
{% endfor %}
{% endif %}
</td>
{% if expand_bundles and line.bundle_parent? %}
<td class="order-list__parent-price-cell">
{% else %}
<td class="order-list__price-cell">
{% endif %}
<p class="order-list__item-price">
{% if line.final_line_price > 0 %}
{{ line.final_line_price | money }}
{% if line.unit_price_measurement %}
<div class="order-list__unit-price">
{{- line.unit_price | unit_price_with_measurement: line.unit_price_measurement -}}
</div>
{% endif %}
{% else %}
Free
{% endif %}
</p>
</td>
</table>
</td>
</tr>
{% endif %}
{% endif %}
{% endfor %}
{% comment %} ===== POS Cafe: Render cafe items grouped by prep area ===== {% endcomment %}
{% if has_poscafe %}
{% comment %} POS Cafe items without a prep area {% endcomment %}
{% for line in non_parent_line_items %}
{% assign pc_line_type = line.properties["Item Type"] %}
{% if pc_line_type == poscafe_label %}
{% assign pc_line_prep = line.properties["Prep Area"] %}
{% if pc_line_prep == blank %}
<tr class="order-list__item">
<td class="order-list__item__cell" style="border-bottom: 1px solid #e5e5e5; padding-top: 12px; padding-bottom: 12px;">
<table>
<td class="order-list__image-cell" valign="top" style="vertical-align: top;">
{% if line.image %}
<img src="{{ line | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="60" height="60" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
<td class="order-list__product-description-cell">
<span class="order-list__item-title">
{% if line.product.title == blank %}{{ line.title }}{% else %}{{ line.product.title }}{% endif %}
</span><br/>
{% if line.quantity %}
{% if line.original_line_price != line.final_line_price %}
<span><del class="order-list__item-original-price">{{ line.original_price | money }}</del></span>
{% endif %}
<span>{{ line.final_price | money }} × {{ line.quantity }}</span><br/>
{% endif %}
{% for p in line.properties %}
{% assign pc_prop_key = p.first | strip %}
{% assign pc_first_char = pc_prop_key | slice: 0 %}
{% unless pc_first_char == "_" or pc_hidden_keys contains pc_prop_key %}
{% if p.last != blank and p.last != "Default Title" %}
<span class="order-list__item-variant">{{ p.last }}</span><br/>
{% endif %}
{% endunless %}
{% endfor %}
{% if line.discount_allocations %}
{% for discount_allocation in line.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>{{ discount_allocation.discount_application.title | upcase }} (-{{ discount_allocation.amount | money }})</span>
</span>
{% endif %}
{% endfor %}
{% endif %}
</td>
<td class="order-list__price-cell">
<p class="order-list__item-price">
{% if line.final_line_price > 0 %}
{{ line.final_line_price | money }}
{% else %}
Free
{% endif %}
</p>
</td>
</table>
</td>
</tr>
{% endif %}
{% endif %}
{% endfor %}
{% comment %} POS Cafe items grouped by prep area {% endcomment %}
{% for area in pc_prep_areas_array %}
<tr class="order-list__item">
<td colspan="3" style="padding: 12px 0 4px 0; border-top: 1px solid #e5e5e5;">
<strong style="font-size: 14px; text-transform: uppercase; color: #555;">Prep area: {{ area }}</strong>
</td>
</tr>
{% for line in non_parent_line_items %}
{% assign pc_line_type = line.properties["Item Type"] %}
{% if pc_line_type == poscafe_label %}
{% assign pc_line_prep = line.properties["Prep Area"] %}
{% if pc_line_prep == area %}
<tr class="order-list__item">
<td class="order-list__item__cell" style="border-bottom: 1px solid #e5e5e5; padding-top: 12px; padding-bottom: 12px;">
<table>
<td class="order-list__image-cell" valign="top" style="vertical-align: top;">
{% if line.image %}
<img src="{{ line | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="60" height="60" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
<td class="order-list__product-description-cell">
<span class="order-list__item-title">
{% if line.product.title == blank %}{{ line.title }}{% else %}{{ line.product.title }}{% endif %}
</span><br/>
{% if line.quantity %}
{% if line.original_line_price != line.final_line_price %}
<span><del class="order-list__item-original-price">{{ line.original_price | money }}</del></span>
{% endif %}
<span>{{ line.final_price | money }} × {{ line.quantity }}</span><br/>
{% endif %}
{% for p in line.properties %}
{% assign pc_prop_key = p.first | strip %}
{% assign pc_first_char = pc_prop_key | slice: 0 %}
{% unless pc_first_char == "_" or pc_hidden_keys contains pc_prop_key %}
{% if p.last != blank and p.last != "Default Title" %}
<span class="order-list__item-variant">{{ p.last }}</span><br/>
{% endif %}
{% endunless %}
{% endfor %}
{% if line.discount_allocations %}
{% for discount_allocation in line.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>{{ discount_allocation.discount_application.title | upcase }} (-{{ discount_allocation.amount | money }})</span>
</span>
{% endif %}
{% endfor %}
{% endif %}
</td>
<td class="order-list__price-cell">
<p class="order-list__item-price">
{% if line.final_line_price > 0 %}
{{ line.final_line_price | money }}
{% else %}
Free
{% endif %}
</p>
</td>
</table>
</td>
</tr>
{% endif %}
{% endif %}
{% endfor %}
{% endfor %}
{% endif %}
{% for line_item_group in line_item_groups %}
{% comment %} POS Cafe: Skip line_item_groups that belong to POS Cafe (already rendered above) {% endcomment %}
{% assign pc_is_poscafe_group = false %}
{% for component in line_item_group.components %}
{% if component.properties["Item Type"] == poscafe_label or component.properties["Item Type"] == modifier_label %}
{% assign pc_is_poscafe_group = true %}
{% break %}
{% endif %}
{% endfor %}
{% unless pc_is_poscafe_group %}
{% assign final_line_price = 0 %}
{% assign original_line_price = 0 %}
{% assign discount_keys_str = "" %}
{% assign parent_line_item = nil %}
{% if line_item_group.deliverable? == false %}
{% for component in line_item_group.components %}
{% assign final_line_price = final_line_price | plus: component.final_line_price %}
{% assign original_line_price = original_line_price | plus: component.original_line_price %}
{% for da in component.discount_allocations %}
{% if da.discount_application.target_selection != 'all' %}
{% assign discount_key = da.discount_application.title | append: da.discount_application.type %}
{% assign discount_keys_str = discount_keys_str | append: discount_key | append: "," %}
{% endif %}
{% endfor %}
{% endfor %}
{% endif %}
{% if line_item_group.deliverable? %}
{% assign parent_line_item = line_item_group.parent_sales_line_item %}
{% assign final_line_price = parent_line_item.final_line_price %}
{% assign original_line_price = parent_line_item.original_line_price %}
{% assign line_item_group_class = "order-list__parent_item__cell" %}
{% else %}
{% assign line_item_group_class = "order-list__item__cell" %}
{% endif %}
{% assign discount_keys = discount_keys_str | split: "," | uniq %}
<tr class="order-list__item">
<td class="{{ line_item_group_class }}">
<table>
<td class="order-list__parent-image-cell" valign="top" style="vertical-align: top;">
{% if line_item_group.image %}
<img src="{{ line_item_group | img_url: 'compact_cropped' }}" align="left" width="60" height="60" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="30" height="30" class="order-list__no-product-image"/>
</div>
{% endif %}
</td>
<td class="order-list__product-description-cell">
<table>
<tr>
<td class="order-list__product-description-cell" colspan="2">
<span class="order-list__item-title">{{ line_item_group.title }} × {{ line_item_group.quantity }}</span><br/>
{% if line_item_group.variant and line_item_group.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ line_item_group.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if parent_line_item.discount_allocations %}
{% for discount_allocation in parent_line_item.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% else %}
{% for discount_key in discount_keys %}
{% assign discount_amount = 0 %}
{% for component in line_item_group.components %}
{% for da in component.discount_allocations %}
{% assign key = da.discount_application.title | append: da.discount_application.type %}
{% if da.discount_application.target_selection != 'all' and key == discount_key %}
{% assign discount_amount = discount_amount | plus: da.amount %}
{% assign discount_title = da.discount_application.title %}
{% endif %}
{% endfor %}
{% endfor %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_title | upcase }}
(-{{ discount_amount | money }})
</span>
</span>
</p>
{% endfor %}
{% endif %}
</td>
<td class="order-list__parent_price-cell">
{% if original_line_price != final_line_price %}
<del class="order-list__item-original-price">{{ original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if final_line_price > 0 %}
{{ final_line_price | money }}
{% else %}
Free
{% endif %}
</p>
</td>
</tr>
{% if line_item_group.deliverable? == false %}
{% for component in line_item_group.components %}
<tr>
<td class="order-list__image-cell order-list__bundle-item">
{% if component.image %}
<img src="{{ component | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="40" height="40" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="order-list__product-description-cell">
{% if component.product.title %}
{% assign component_title = component.product.title %}
{% else %}
{% assign component_title = component.title %}
{% endif %}
{% if line_item_group.deliverable? %}
<span class="order-list__item-title">{{ component_title }} × {{ component.quantity }}</span><br/>
{% else %}
<span class="order-list__item-title">{{ component.quantity }} × {{ component_title }}</span><br/>
{% endif %}
{% if component.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ component.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if component.discount_allocations %}
{% for discount_allocation in component.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
</td>
{% if line_item_group.deliverable? %}
<td class="order-list__price-cell">
{% if component.original_line_price != component.final_line_price %}
<del class="order-list__item-original-price">{{ component.original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if component.final_line_price > 0 %}
{{ component.final_line_price | money }}
{% else %}
Free
{% endif %}
</p>
</td>
{% endif %}
</tr>
{% endfor %}
{% endif %}
</table>
</td>
</table>
</td>
{% if line_item_group.deliverable? %}
<td>
{% for component in line_item_group.components %}
<tr>
<td class="order-list__deliverable-item {% if forloop.last %}order-list__deliverable-item-last{% endif %}">
<table>
<td>
<tr>
<td class="order-list__image-cell order-list__bundle-item">
{% if component.image %}
<img src="{{ component | img_url: 'compact_cropped' }}" align="left" width="40" height="40" class="order-list__product-image"/>
{% else %}
<div class="order-list__no-image-cell small">
<img src="{{ 'notifications/no-image.png' | shopify_asset_url }}" align="left" width="40" height="40" class="order-list__no-product-image small"/>
</div>
{% endif %}
</td>
<td class="order-list__product-description-cell">
{% if component.product.title %}
{% assign component_title = component.product.title %}
{% else %}
{% assign component_title = component.title %}
{% endif %}
{% if line_item_group.deliverable? %}
<span class="order-list__item-title">{{ component_title }} × {{ component.quantity }}</span><br/>
{% else %}
<span class="order-list__item-title">{{ component.quantity }} × {{ component_title }}</span><br/>
{% endif %}
{% if component.variant.title != 'Default Title' %}
<span class="order-list__item-variant">{{ component.variant.title }}</span>
{% endif %}
{% if line_item_group.deliverable? %}
{% if component.discount_allocations %}
{% for discount_allocation in component.discount_allocations %}
{% if discount_allocation.discount_application.target_selection != 'all' %}
<p>
<span class="order-list__item-discount-allocation">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span>
{{ discount_allocation.discount_application.title | upcase }}
(-{{ discount_allocation.amount | money }})
</span>
</span>
</p>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
</td>
{% if line_item_group.deliverable? %}
<td class="order-list__price-cell">
{% if component.original_line_price != component.final_line_price %}
<del class="order-list__item-original-price">{{ component.original_line_price | money }}</del>
{% endif %}
<p class="order-list__item-price">
{% if component.final_line_price > 0 %}
{{ component.final_line_price | money }}
{% else %}
Free
{% endif %}
</p>
</td>
{% endif %}
</tr>
</td>
</table>
</td>
</tr>
{% endfor %}
</td>
{% endif %}
</tr>
{% endunless %}{% comment %} POS Cafe: end line_item_group skip {% endcomment %}
{% endfor %}
</table>
{% endif %}
<table class="row subtotal-lines">
<tr>
<td>
<table class="row subtotal-table">
{% assign order_discount_count = 0 %}
{% assign total_order_discounts = 0 %}
{% assign has_shipping_discount = false %}
{% assign epsilon = 0.00001 %}
{% for discount_application in discount_applications %}
{% if discount_application.target_selection == 'all' and discount_application.target_type == 'line_item' %}
{% assign order_discount_count = order_discount_count | plus: 1 %}
{% assign total_order_discount_amount = total_order_discounts | plus: discount_application.total_allocated_amount %}
{% endif %}
{% if discount_application.target_type == 'shipping_line' %}
{% assign has_shipping_discount = true %}
{% assign shipping_discount_title = discount_application.title %}
{% assign discount_value_price = discount_application.total_allocated_amount %}
{% assign shipping_amount_minus_discount_value_price = shipping_price | minus: discount_value_price %}
{% assign shipping_amount_minus_discount_value_price_abs = shipping_amount_minus_discount_value_price | abs %}
{% assign discount_application_value_type = discount_application.value_type | strip %}
{% if shipping_amount_minus_discount_value_price_abs < epsilon or discount_application_value_type == 'percentage' and discount_application.value == 100 %}
{% assign free_shipping = true %}
{% else %}
{% assign discounted_shipping_price = shipping_amount_minus_discount_value_price %}
{% endif %}
{% endif %}
{% endfor %}
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
{% if titleBold %}
<span><strong>Subtotal</strong></span>
{% else %}
<span>Subtotal</span>
{% endif %}
</p>
</td>
<td class="subtotal-line__value">
{% if valueBold %}
<strong>{{ subtotal_price | plus: total_order_discount_amount | money }}</strong>
{% else %}
{{ subtotal_price | plus: total_order_discount_amount | money }}
{% endif %}
</td>
</tr>
{% if order_discount_count > 0 %}
{% if order_discount_count == 1 %}
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
<span>Order discount</span>
</p>
</td>
<td class="subtotal-line__value">
<span>-{{ total_order_discount_amount | money }}</span>
</td>
</tr>
{% endif %}
{% if order_discount_count > 1 %}
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
<span>Order discounts</span>
</p>
</td>
<td class="subtotal-line__value">
<span>-{{ total_order_discount_amount | money }}</span>
</td>
</tr>
{% endif %}
{% for discount_application in discount_applications %}
{% if discount_application.target_selection == 'all' and discount_application.target_type != 'shipping_line' %}
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
<span class="subtotal-line__discount">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span class="subtotal-line__discount-title">
{{ discount_application.title }} (-{{ discount_application.total_allocated_amount | money }})
</span>
</span>
</p>
</td>
</tr>
{% endif %}
{% endfor %}
{% endif %}
{% unless retail_delivery_only %}
{% if delivery_method == 'pick-up' %}
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
{% if titleBold %}
<span><strong>Pickup</strong></span>
{% else %}
<span>Pickup</span>
{% endif %}
</p>
</td>
<td class="subtotal-line__value">
{% if valueBold %}
<strong>{{ shipping_price | money }}</strong>
{% else %}
{{ shipping_price | money }}
{% endif %}
</td>
</tr>
{% else %}
{% if has_shipping_discount %}
{% if free_shipping %}
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
{% if titleBold %}
<span><strong>Shipping</strong></span>
{% else %}
<span>Shipping</span>
{% endif %}
<span class="">
<span class="subtotal-line__discount-title">{% if shipping_method.title.size > 0 %}({{ shipping_method.title }}){% endif %}</span>
</span>
</p>
</td>
<td class="subtotal-line__value">
<del>{% if shipping_price != 0 %}{{ shipping_price | money}}{% endif %}</del>
{% if valueBold %}
<strong>Free</strong>
{% else %}
Free
{% endif %}
</td>
</tr>
{% else %}
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
{% if titleBold %}
<span><strong>Shipping</strong></span>
{% else %}
<span>Shipping</span>
{% endif %}
<span class="">
<span class="subtotal-line__discount-title">{% if shipping_method.title.size > 0 %}({{ shipping_method.title }}){% endif %}</span>
</span>
</p>
</td>
<td class="subtotal-line__value">
<del>{{ shipping_price | money }}</del>
{% if valueBold %}
<strong>{{ discounted_shipping_price | money }}</strong>
{% else %}
{{ discounted_shipping_price | money }}
{% endif %}
</td>
</tr>
{% endif %}
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
<span class="subtotal-line__discount">
<img src="{{ 'notifications/discounttag.png' | shopify_asset_url }}" width="18" height="18" class="discount-tag-icon" />
<span class="subtotal-line__discount-title">
{{ shipping_discount_title }}
{% if discount_value_price != 0 %}
(-{{ discount_value_price | money }})
{% endif %}
</span>
</span>
</p>
</td>
</tr>
{% else %}
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
{% if titleBold %}
<span><strong>Shipping</strong></span>
{% else %}
<span>Shipping</span>
{% endif %}
<span class="">
<span class="subtotal-line__discount-title">{% if shipping_method.title.size > 0 %}({{ shipping_method.title }}){% endif %}</span>
</span>
</p>
</td>
<td class="subtotal-line__value">
{% if valueBold %}
<strong>{{ shipping_price | money }}</strong>
{% else %}
{{ shipping_price | money }}
{% endif %}
</td>
</tr>
{% endif %}
{% endif %}
{% endunless %}
{% if total_duties %}
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
{% if titleBold %}
<span><strong>Duties</strong></span>
{% else %}
<span>Duties</span>
{% endif %}
</p>
</td>
<td class="subtotal-line__value">
{% if valueBold %}
<strong>{{ total_duties | money }}</strong>
{% else %}
{{ total_duties | money }}
{% endif %}
</td>
</tr>
{% endif %}
{% for tax_line in tax_lines %}
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
{% if titleBold %}
<span><strong>Tax</strong></span>
{% else %}
<span>Tax</span>
{% endif %}
<span class="subtotal-line__discount">
<span class="subtotal-line__discount-title">{% if tax_line.title.size > 0 %}({{ tax_line.title }} {{ tax_line.rate | times: 100 }}%){% endif %}</span>
</span>
</p>
</td>
<td class="subtotal-line__value">
{% if valueBold %}
<strong>{{ tax_line.price | money }}</strong>
{% else %}
{{ tax_line.price | money }}
{% endif %}
</td>
</tr>
{% endfor %}
</table>
<table class="row subtotal-table subtotal-table--total">
<tr class="subtotal-line">
<td class="subtotal-line__title">
<p>
{% if titleBold %}
<span><strong>Total</strong></span>
{% else %}
<span>Total</span>
{% endif %}
</p>
</td>
<td class="subtotal-line__value">
{% if valueBold %}
<strong>{{ total_price | money_with_currency }}</strong>
{% else %}
{{ total_price | money_with_currency }}
{% endif %}
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
<table class="row content">
<tr>
<td class="content__cell {% if no_top_border == 'hide_border' %}no_top__border{% endif %}">
<center>
<table class="container">
<tr>
<td>
{% if order.transactions.size > 0 %}
<table class="row">
<tr>
<td class="customer-info__item customer-info__item--last">
<strong>Payment processing method</strong>
<br>
<p>{{ order.transactions | map: "gateway_display_name" | uniq | join: ", " }}</p>
</td>
</tr>
</table>
{% endif %}
{% if payment_terms %}
<br>
<table class="row">
<tr>
<td class="customer-info__item customer-info__item--last">
<strong>Payment terms</strong>
<br>
<p>{{ payment_terms.translated_name }}</p>
</td>
</tr>
</table>
{% endif %}
{% if requires_shipping and shipping_address %}
{% if shipping_methods.first %}
<br>
<table class="row">
<tr>
<td class="customer-info__item customer-info__item--last">
<strong>Delivery method</strong>
<br>
{% for shipping_method in shipping_methods %}
<p>{{ shipping_method.title }}</p>
{% endfor %}
</td>
</tr>
</table>
{% endif %}
<br>
<table class="row">
<tr>
<td class="customer-info__item customer-info__item--last">
<strong>Shipping address</strong>
<br>
<p>
{{ shipping_address.name }}<br>
{% if shipping_address.company %}
{{ shipping_address.company }}<br>
{% endif %}
{{ shipping_address.street }}<br>
{{ shipping_address.city }},
{{ shipping_address.province }}
{{ shipping_address.zip }}<br>
{{ shipping_address.country }}<br>
{{ shipping_address.phone }}<br>
</p>
</td>
</tr>
{% if po_number %}
<tr>
<td>
<strong>PO number</strong><br/>
<p>#{{ po_number }}</p>
</td>
</tr>
{% endif %}
</table>
{% endif %}
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
<footer class="no-print">
<br>
<table border="0" cellpadding="0" cellspacing="0" class="mail-footer">
<tbody>
<tr>
<td align="center" valign="bottom">
<img src="{{ 'mailer/merchant/shopify_logo.png' | cdn_asset_url }}" alt="Shopify" width="89">
</td>
</tr>
<tr>
<td align="center">
<p><span class="apple-link">151 O'Connor Street, Ground floor, Ottawa, ON, K2P 2L8</span></p>
</td>
</tr>
</tbody>
</table>
</footer>
<img class="no-print" src="{{ 'notifications/spacer.png' | shopify_asset_url }}" class="spacer" height="1" />
</td>
</tr>
</table>
</body>
</html>- Click Save to apply your changes.
That's it! Your staff notifications for online orders are now fully optimized for your cafe,
displaying pickup times and order details clearly and beautifully.
Troubleshooting
| Issue | Solution |
|---|---|
| Need to revert? |
You can always revert your Order Notification template to a previous version, or revert it back to its Default state. In the Code Edit screen, click on the Revert to button to choose a version to restore: 
|
If you have any questions or run into any problems, please
contact our support team
for assistance.