<div class="mailpoet_tools"></div>
<div class="mailpoet_woocommerce_content_overlay">
  <p><%= __('Autogenerated content by WooCommerce') %></p>
</div>
<div class="mailpoet_content mailpoet_woocommerce_content" data-automation-id="woocommerce_content">

	<!-- WooCommerce email template start -->
	<div class="email-introduction" style="padding-bottom: 24px;">
		<p style="margin: 0 0 16px;">
			<%= __('Hi %s,', 'woocommerce') | format('Jane') %></p>
		<p style="margin: 0 0 16px;"><%= __('We’ve successfully processed your order, and it’s on its way to you.', 'woocommerce') %></p>
		<p style="margin: 0 0 16px;"><%= __('Here’s a reminder of what you’ve ordered:', 'woocommerce') %></p>
	</div>
	<h2 class="email-order-detail-heading" style='color: #3c3c3c; display: block; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; font-size: 20px; font-weight: bold; line-height: 160%; margin: 0 0 18px; text-align: left;'>
		<%= __('Order summary', 'woocommerce') %><br><span style="color: #3c3c3c; display: block; font-size: 14px; font-weight: normal;"><%= __('Order #%s', 'woocommerce') | format('12345') %> (March 3, 2025)</span>
	</h2>
	<div style="margin-bottom: 24px;">
		<table class="td font-family email-order-details" cellspacing="0" cellpadding="6" border="0" style='color: #636363; border: 0; vertical-align: middle; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; width: 100%;' width="100%">
			<tbody>
				<tr class="order_item">
					<td class="td font-family text-align-left" style='color: #636363; border: 0; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; text-align: left; padding: 8px 12px; padding-left: 0; vertical-align: middle; word-wrap: break-word;' align="left">
						<table class="order-item-data" style='color: #3c3c3c; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif;'>
							<tr>
								<td style="vertical-align: middle; padding-left: 0; border-bottom: 1px solid rgba(0,0,0,.2); padding-bottom: 24px; border: 0; padding: 0;">
									<img src="<%= get_product_placeholder_img() %>" width="48" height="48" alt="" style="border: none; display: inline-block; font-size: 14px; font-weight: bold; height: auto; outline: none; text-decoration: none; text-transform: capitalize; vertical-align: middle; margin-right: 24px; max-width: 100%;" border="0">
									</td>
								<td style="vertical-align: middle; padding-right: 0; border-bottom: 1px solid rgba(0,0,0,.2); padding-bottom: 24px; border: 0; padding: 0;">
									<%= __('Dummy Product', 'woocommerce') %><div class="email-order-item-meta" style="color: #3c3c3c; font-size: 14px; line-height: 140%;"></div>
								</td>
							</tr>
						</table>
					</td>
					<td class="td font-family text-align-right" style='color: #636363; border: 0; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; text-align: right; padding: 8px 12px; vertical-align: middle;' align="right">
						×2 </td>
					<td class="td font-family text-align-right" style='color: #636363; border: 0; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; text-align: right; padding: 8px 12px; padding-right: 0; vertical-align: middle;' align="right">
						<span class="woocommerce-Price-amount amount">50,00 <span class="woocommerce-Price-currencySymbol">$</span></span> </td>
				</tr>
				<tr class="order_item">
					<td class="td font-family text-align-left" style='color: #636363; border: 0; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; text-align: left; padding: 8px 12px; padding-left: 0; border-bottom: 1px solid rgba(0,0,0,.2); padding-bottom: 24px; vertical-align: middle; word-wrap: break-word;' align="left">
						<table class="order-item-data" style='color: #3c3c3c; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif;'>
							<tr>
								<td style="vertical-align: middle; padding-left: 0; border-bottom: 1px solid rgba(0,0,0,.2); padding-bottom: 24px; border: 0; padding: 0;">
									<img src="<%= get_product_placeholder_img() %>" width="48" height="48" alt="" style="border: none; display: inline-block; font-size: 14px; font-weight: bold; height: auto; outline: none; text-decoration: none; text-transform: capitalize; vertical-align: middle; margin-right: 24px; max-width: 100%;" border="0">
									</td>
								<td style="vertical-align: middle; padding-right: 0; border-bottom: 1px solid rgba(0,0,0,.2); padding-bottom: 24px; border: 0; padding: 0;">
									<%= __('Dummy Product Variation', 'woocommerce') %><div class="email-order-item-meta" style="color: #3c3c3c; font-size: 14px; line-height: 140%;">
										<span><%= __('Color:', 'woocommerce') %></span> <%= __('Red', 'woocommerce') %><br><span><%= __('Size:', 'woocommerce') %></span> <%= __('Small', 'woocommerce') %></div>
								</td>
							</tr>
						</table>
					</td>
					<td class="td font-family text-align-right" style='color: #636363; border: 0; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; text-align: right; padding: 8px 12px; border-bottom: 1px solid rgba(0,0,0,.2); padding-bottom: 24px; vertical-align: middle;' align="right">
						×1 </td>
					<td class="td font-family text-align-right" style='color: #636363; border: 0; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; text-align: right; padding: 8px 12px; padding-right: 0; border-bottom: 1px solid rgba(0,0,0,.2); padding-bottom: 24px; vertical-align: middle;' align="right">
						<span class="woocommerce-Price-amount amount">20,00 <span class="woocommerce-Price-currencySymbol">$</span></span> </td>
				</tr>
			</tbody>
			<tfoot>
				<tr class="order-totals order-totals-subtotal">
					<th class="td text-align-left" scope="row" colspan="2" style="color: #636363; border: 0; vertical-align: middle; text-align: left; padding: 8px 12px; font-weight: normal; padding-bottom: 5px; padding-left: 0; padding-top: 24px; border-top-width: 4px;" align="left">
						<%= __('Subtotal:', 'woocommerce') %> </th>
					<td class="td text-align-right" style="color: #636363; border: 0; vertical-align: middle; text-align: right; padding: 8px 12px; font-weight: normal; padding-bottom: 5px; padding-right: 0; padding-top: 24px; border-top-width: 4px;" align="right"><span class="woocommerce-Price-amount amount">70,00 <span class="woocommerce-Price-currencySymbol">$</span></span></td>
				</tr>
				<tr class="order-totals order-totals-discount">
					<th class="td text-align-left" scope="row" colspan="2" style="color: #636363; border: 0; vertical-align: middle; text-align: left; padding: 8px 12px; font-weight: normal; padding-bottom: 5px; padding-top: 5px; padding-left: 0;" align="left">
						<%= __('Discount:', 'woocommerce') %> </th>
					<td class="td text-align-right" style="color: #636363; border: 0; vertical-align: middle; text-align: right; padding: 8px 12px; font-weight: normal; padding-bottom: 5px; padding-top: 5px; padding-right: 0;" align="right">-<span class="woocommerce-Price-amount amount">10,00 <span class="woocommerce-Price-currencySymbol">$</span></span>
					</td>
				</tr>
				<tr class="order-totals order-totals-shipping">
					<th class="td text-align-left" scope="row" colspan="2" style="color: #636363; border: 0; vertical-align: middle; text-align: left; padding: 8px 12px; font-weight: normal; padding-bottom: 5px; padding-top: 5px; padding-left: 0;" align="left">
						<%= __('Shipping:', 'woocommerce') %> <%= __('Flat rate', 'woocommerce') %> </th>
					<td class="td text-align-right" style="color: #636363; border: 0; vertical-align: middle; text-align: right; padding: 8px 12px; font-weight: normal; padding-bottom: 5px; padding-top: 5px; padding-right: 0;" align="right"><span class="woocommerce-Price-amount amount">5,00 <span class="woocommerce-Price-currencySymbol">$</span></span></td>
				</tr>
				<tr class="order-totals order-totals-total">
					<th class="td text-align-left" scope="row" colspan="2" style="color: #636363; border: 0; vertical-align: middle; text-align: left; padding: 8px 12px; padding-bottom: 5px; padding-top: 5px; font-weight: bold; padding-left: 0;" align="left">
						<%= __('Total:', 'woocommerce') %> </th>
					<td class="td text-align-right" style="color: #636363; border: 0; vertical-align: middle; text-align: right; padding: 8px 12px; padding-bottom: 5px; padding-top: 5px; font-weight: bold; font-size: 20px; padding-right: 0;" align="right"><span class="woocommerce-Price-amount amount">65,00 <span class="woocommerce-Price-currencySymbol">$</span></span></td>
				</tr>
				<tr class="order-totals order-totals-payment_method order-totals-last">
					<th class="td text-align-left" scope="row" colspan="2" style="color: #636363; border: 0; vertical-align: middle; text-align: left; padding: 8px 12px; font-weight: normal; padding-top: 5px; border-bottom: 1px solid rgba(0,0,0,.2); padding-bottom: 24px; padding-left: 0;" align="left">
						<%= __('Payment method:', 'woocommerce') %> </th>
					<td class="td text-align-right" style="color: #636363; border: 0; vertical-align: middle; text-align: right; padding: 8px 12px; font-weight: normal; padding-top: 5px; border-bottom: 1px solid rgba(0,0,0,.2); padding-bottom: 24px; padding-right: 0;" align="right"><%= __('Direct bank transfer', 'woocommerce') %></td>
				</tr>
				<tr class="order-customer-note">
					<td class="td text-align-left" colspan="3" style="color: #636363; border: 0; vertical-align: middle; text-align: left; padding: 8px 12px; border-bottom: 1px solid rgba(0,0,0,.2); padding-bottom: 24px; padding-top: 24px; padding-left: 0; padding-right: 0;" align="left">
						<b><%= __('Customer note', 'woocommerce') %></b><br>
						<%= __('This is a customer note. Customers can add a note to their order on checkout.', 'woocommerce') %><br>
						<br>
						<%= __('It can be multiple lines. If there’s no note, this section is hidden.', 'woocommerce') %> </td>
				</tr>
			</tfoot>
		</table>
	</div>
	<table id="addresses" cellspacing="0" cellpadding="0" border="0" style="width: 100%; vertical-align: top; margin-bottom: 0; padding: 0;" width="100%">
		<tr>
			<td class="font-family text-align-left" valign="top" width="50%" style='font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; text-align: left; border: 0; padding: 0;' align="left">
				<b class="address-title" style='color: #3c3c3c; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif;'><%= __('Billing address', 'woocommerce') %></b>
				<address class="address" style="color: #3c3c3c; font-style: normal; padding: 8px 0;">
					John Doe<br>Company<br>123 Fake Street<br>Faketown, CA 12345<br>United States (US) <br><a target="_blank" href="tel:5555555555" style="color: #7f54b3; font-weight: normal; text-decoration: underline;">555-555-5555</a> <br>john@company.com </address>
			</td>
			<td class="font-family text-align-left" valign="top" width="50%" style='font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; text-align: left; padding: 0;' align="left">
				<b class="address-title" style='color: #3c3c3c; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif;'><%= __('Shipping address', 'woocommerce') %></b>
				<address class="address" style="color: #3c3c3c; font-style: normal; padding: 8px 0;">
					John Doe<br>Company<br>123 Fake Street<br>Faketown, CA 12345<br>United States (US) <br><a target="_blank" href="tel:5555555555" style="color: #7f54b3; font-weight: normal; text-decoration: underline;">555-555-5555</a> </address>
			</td>
		</tr>
	</table>
	<br>
	<table border="0" cellpadding="0" cellspacing="0" width="100%">
		<tr>
			<td class="email-additional-content" style='color: #3c3c3c; font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif; padding: 32px 0 0;'>
				<p style="text-align: center; margin: 0 0 16px;" align="center"><%= __('Thanks for shopping with us.', 'woocommerce') %></p>
			</td>
		</tr>
	</table>
	<!-- WooCommerce email template end -->

</div>
<div class="mailpoet_block_highlight"></div>
