{% apply inline_css(source("@styles/export.css")) %}
	<div class="page">
		<center>
			<img src="{{ absolute_url(asset( foxorders_logos ~ 'logo-black.png')) }}" height="100px">
		</center>
		<h3>{{labels.summary}}</h3>
		<h4>
			{{ labels.order ~ ': ' ~ labels.ordersDate }}
		</h4>
		<table width="100%">
			<tbody>
				{% for date, value in orders %}
					<tr>
						<td>
							<p class="date">
								{{date}}
							</p>
						</td>
					</tr>
					{% for item in value %}
						<tr>
							<td class="product">
								{{ item.quantity ~ " x " ~  item.name|capitalize  }}
							</td>
						</tr>
						{% for option in item.optionList %}
							<tr>
								<td class="option">
									<span class="option-name">
										{{ option.translations is defined and option.translations.0 is defined ? option.translations.0.name|striptag|capitalize : '-' }}
										<br>
										<span class="variant">
											{{labels.variants}}
											{% for optionvariant in option.optionVariant %}
												{{ optionvariant.optionVariantTranslations is defined and optionvariant.optionVariantTranslations.0 is defined ? optionvariant.optionVariantTranslations.0.name|capitalize ~  ' (' ~ optionvariant.quantity ~ ') ' : '-' }}
											{% endfor %}
										</span>
									</span>
								</td>
							</tr>
						{% endfor %}
					{% endfor %} 
				{% endfor %}
			</tbody>
		</table>
	</div>
	
	{% for orderDetail in orderDetails %}
		<div class="page">
			<table width="100%">
				<tbody>
					<tr>
						<td>
							<h4>
								{{ labels.nameTitle ~ orderDetail.0.fullName ?? labels.guest }}
							</h4>
						</td>
					</tr>
					<tr>
						<td class="border-line"></td>
					</tr>
					<tr>
						<td>
							<h4>
								{{ labels.type ~ orderDetail.0.shopModeName }}
							</h4>
						</td>
					</tr>
					<tr>
						<td class="order">
							<h4>
								{{ labels.order ~  orderDetail.0.id }}
							</h4>
						</td>
					</tr>
				</tbody>
			</table>
			<table width="100%">
				<tbody>
					{% for orderitem in orderDetail %}
						<tr>
							<td>
								<p>
									{{ orderitem.quantity  ~ " x "  ~ orderitem.name|capitalize }}
								</p>
							</td>
						</tr>
						{% for option in orderitem.optionList %}
							<tr>
								<td class="order-option">
									<span>
										{{ option.translations is defined and option.translations.0 is defined ? option.translations.0.name|striptag|capitalize : '-' }}
									</span>
								</td>
							</tr>

							{% for optionvariant in option.optionVariant %}
								<tr>
									<td class="order-variant">
										<span>
											{{ optionvariant.optionVariantTranslations is defined and optionvariant.optionVariantTranslations.0 is defined ? optionvariant.optionVariantTranslations.0.name|striptag|capitalize ~ ' (' ~ optionvariant.quantity  ~ ')'  : '-' }}
										</span>
									</td>
								</tr>
							{% endfor %}

						{% endfor %}
						
						{% if orderitem.note is not null and orderitem.note is not empty  %}
							<tr>
								<td>
									<p class="note">
										<b>{{ labels.orderItemNote }}</b>
										{{ orderitem.note }}
									</p>
								</td>
							</tr>
						{% endif %} 
						

					{% endfor %}

					{% if orderDetail.0.notes is not null and orderDetail.0.notes is not empty  %}
						<tr>
							<td>
								<p class="order-note">
									<b>{{ labels.orderNote }}</b>
									{{ orderDetail.0.notes }}
								</p>
							</td>
						</tr>
					{% endif %}
					<tr>
						<td class="label" align="left">
							<h4>
								{{ labels.subTotal}}
							</h4>
						</td>
						<td class="value" align="right">
							<h4>
								{{ orderDetail.0.itemsTotal / 100 ~ ' ' ~ orderDetail.0.symbol }}
							</h4>
						</td>
					</tr>
					<tr>
						<td class="label" align="left">
							<h4>
								{{ labels.total }}
							</h4>
						</td>
						<td class="value" align="right">
							<h4>
								{{ orderDetail.0.total / 100 ~ ' ' ~ orderDetail.0.symbol }}
							</h4>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
	{% endfor %}
{% endapply %}