<?php
/**
 * Template Name: Email Reovery Stats Block.
 *
 * @package Cart Abandonment Recovery
 */

// Exit if accessed directly.
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}
?> 

<!-- Row 1 -->
<tr>
<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0;" valign="top" class="mceGutterContainer" id="gutterContainerId-16">
	<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate;" role="presentation">
	<tbody>
		<tr>
		<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0; border: 0; border-radius: 0;" valign="top" id="b16">
			<table width="100%" style="border: 0; background-color: transparent; border-radius: 0; border-collapse: separate;">
			<tbody>
				<tr>
				<td style="padding-left: 24px; padding-right: 24px; padding-top: 12px; padding-bottom: 0;" class="mceTextBlockContainer">
					<div data-block-id="16" class="mceText" id="d16" style="width: 100%;">
					<h4 style="text-align: left;" class="last-child">
						<?php
							echo esc_html( 
								sprintf(
									/* translators: %1$s: Report Start Date, %2$s: Report End Date. */ 
									__( 'Last 7 Days (%1$s - %2$s):', 'woo-cart-abandonment-recovery' ), 
									$from_date, 
									$to_date 
								) 
							); 
							?>
					</h4>
					</div>
				</td>
				</tr>
			</tbody>
			</table>
		</td>
		</tr>
	</tbody>
	</table>
</td>
</tr>
<!-- Row 2 -->
<tr>
<td style="padding-top: 0; padding-bottom: 0; padding-right: 24px; padding-left: 24px;" valign="top" class="mceGutterContainer" id="gutterContainerId-17">
	<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate;" role="presentation">
	<tbody>
		<tr>
		<td style="padding-top: 12px; padding-bottom: 0; padding-right: 0; padding-left: 0; border: 0; border-radius: 0;" valign="top" class="mceLayoutContainer" id="b17">
			<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" data-block-id="17" id="section_a083e0db65d7352a2c22ef29a406ab78" class="mceLayout">
			<tbody>
				<tr class="mceRow">
				<td style="background-position: center; background-repeat: no-repeat; background-size: cover;" valign="top">
					<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
					<tbody>
						<tr>
						<td valign="top" class="mceColumn" id="mceColumnId--15" data-block-id="-15" colspan="12" width="100%">
							<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
							<tbody>
								<tr>
								<td style="border: 0; border-radius: 0;" valign="top" align="center" id="b-5">
									<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" data-block-id="-5">
									<tbody>
										<tr class="mceRow">
										<td style="background-position: center; background-repeat: no-repeat; background-size: cover;" valign="top">
											<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
											<tbody>
												<tr>
												<td valign="top" class="mceColumn" id="mceColumnId--20" data-block-id="-20" colspan="12" width="100%">
													<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
													<tbody>
														<tr>
														<td style="border: 0; border-radius: 0;" valign="top" id="b22">
															<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" data-block-id="22">
															<tbody>
																<tr class="mceRow">
																<td style="background-position: center; background-repeat: no-repeat; background-size: cover; padding-top: 0px; padding-bottom: 0px;" valign="top">
																	<table border="0" cellpadding="0" cellspacing="24" width="100%" style="table-layout: fixed;" role="presentation">
																	<colgroup>
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																	</colgroup>
																	<tbody>
																		<tr>
																		<td style="padding-top: 0; padding-bottom: 0;" valign="center" class="mceColumn" id="mceColumnId-19" data-block-id="19" colspan="6" width="50%">
																			<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
																			<tbody>
																				<tr>
																				<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0;" valign="top" class="mceGutterContainer" id="gutterContainerId-23">
																					<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate;" role="presentation">
																					<tbody>
																						<tr>
																						<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0; border: 0; border-radius: 0;" valign="top" id="b23">
																							<table width="100%" style="border-width: 1px; border-style: solid; border-color: #edbeaf; background-color: #fff9f7; border-radius: 0; border-collapse: separate;">
																							<tbody>
																								<tr>
																								<td style="padding-left: 24px; padding-right: 24px; padding-top: 24px; padding-bottom: 24px;" class="mceTextBlockContainer">
																									<div data-block-id="23" class="mceText" id="d23" style="width: 100%;">
																									<p>
																										<span style="color: #1f2937;"><span style="font-size: 24px;"><?php echo wp_kses_post( wc_price( $report_details['recovered_revenue'] ) ); ?></span></span>
																									</p>
																									<p class="last-child">
																										<span style="color: rgb(112, 112, 112);"><span style="font-size: 14px;"><?php echo esc_html__( 'Recovered Revenue', 'woo-cart-abandonment-recovery' ); ?></span></span>
																									</p>
																									</div>
																								</td>
																								</tr>
																							</tbody>
																							</table>
																						</td>
																						</tr>
																					</tbody>
																					</table>
																				</td>
																				</tr>
																			</tbody>
																			</table>
																		</td>
																		<td style="padding-top: 0; padding-bottom: 0;" valign="center" class="mceColumn" id="mceColumnId-21" data-block-id="21" colspan="6" width="50%">
																			<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
																			<tbody>
																				<tr>
																				<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0;" valign="top" class="mceGutterContainer" id="gutterContainerId-24">
																					<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate;" role="presentation">
																					<tbody>
																						<tr>
																						<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0; border: 0; border-radius: 0;" valign="top" id="b24">
																							<table width="100%" style="border-width: 1px; border-style: solid; border-color: #edbeaf; background-color: #fff9f7; border-radius: 0; border-collapse: separate;">
																							<tbody>
																								<tr>
																								<td style="padding-left: 24px; padding-right: 24px; padding-top: 24px; padding-bottom: 24px;" class="mceTextBlockContainer">
																									<div data-block-id="24" class="mceText" id="d24" style="width: 100%;">
																									<p>
																										<span style="color: #1f2937;"><span style="font-size: 24px;"><?php echo esc_html( $report_details['recovered_orders'] ); ?></span></span>
																									</p>
																									<p class="last-child">
																										<span style="color: rgb(112, 112, 112);"><span style="font-size: 14px;"><?php echo esc_html__( 'Carts Recovered', 'woo-cart-abandonment-recovery' ); ?></span></span>
																									</p>
																									</div>
																								</td>
																								</tr>
																							</tbody>
																							</table>
																						</td>
																						</tr>
																					</tbody>
																					</table>
																				</td>
																				</tr>
																			</tbody>
																			</table>
																		</td>
																		</tr>
																	</tbody>
																	</table>
																</td>
																</tr>
															</tbody>
															</table>
														</td>
														</tr>
													</tbody>
													</table>
												</td>
												</tr>
											</tbody>
											</table>
										</td>
										</tr>
									</tbody>
									</table>
								</td>
								</tr>
							</tbody>
							</table>
						</td>
						</tr>
					</tbody>
					</table>
				</td>
				</tr>
			</tbody>
			</table>
		</td>
		</tr>
	</tbody>
	</table>
</td>
</tr>
<!-- Row 3 -->
<tr>
<td style="padding-top: 0; padding-bottom: 0; padding-right: 24px; padding-left: 24px;" valign="top" class="mceGutterContainer" id="gutterContainerId-25">
	<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate;" role="presentation">
	<tbody>
		<tr>
		<td style="padding-top: 0; padding-bottom: 12px; padding-right: 0; padding-left: 0; border: 0; border-radius: 0;" valign="top" class="mceLayoutContainer" id="b25">
			<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" data-block-id="25" id="section_ee7ff1c8fb52ecf9a18c97677a634035" class="mceLayout">
			<tbody>
				<tr class="mceRow">
				<td style="background-position: center; background-repeat: no-repeat; background-size: cover;" valign="top">
					<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
					<tbody>
						<tr>
						<td valign="top" class="mceColumn" id="mceColumnId--16" data-block-id="-16" colspan="12" width="100%">
							<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
							<tbody>
								<tr>
								<td style="border: 0; border-radius: 0;" valign="top" align="center" id="b-7">
									<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" data-block-id="-7">
									<tbody>
										<tr class="mceRow">
										<td style="background-position: center; background-repeat: no-repeat; background-size: cover;" valign="top">
											<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
											<tbody>
												<tr>
												<td valign="top" class="mceColumn" id="mceColumnId--21" data-block-id="-21" colspan="12" width="100%">
													<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
													<tbody>
														<tr>
														<td style="border: 0; border-radius: 0;" valign="top" id="b30">
															<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" data-block-id="30">
															<tbody>
																<tr class="mceRow">
																<td style="background-position: center; background-repeat: no-repeat; background-size: cover; padding-top: 0px; padding-bottom: 0px;" valign="top">
																	<table border="0" cellpadding="0" cellspacing="24" width="100%" style="table-layout: fixed;" role="presentation">
																	<colgroup>
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																		<col span="1" width="8.333333333333332%" />
																	</colgroup>
																	<tbody>
																		<tr>
																		<td style="padding-top: 0; padding-bottom: 0;" valign="top" class="mceColumn" id="mceColumnId-27" data-block-id="27" colspan="4" width="33.33333333333333%">
																			<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
																			<tbody>
																				<tr>
																				<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0;" valign="top" class="mceGutterContainer" id="gutterContainerId-31">
																					<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate;" role="presentation">
																					<tbody>
																						<tr>
																						<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0; border: 0; border-radius: 0;" valign="top" id="b31">
																							<table width="100%" style="border-width: 1px; border-style: solid; border-color: #edbeaf; background-color: #fff9f7; border-radius: 0; border-collapse: separate;">
																							<tbody>
																								<tr>
																								<td style="padding-left: 24px; padding-right: 24px; padding-top: 24px; padding-bottom: 24px;" class="mceTextBlockContainer">
																									<div data-block-id="31" class="mceText" id="d31" style="width: 100%;">
																									<p>
																										<span style="color: #1f2937;"><span style="font-size: 24px;"><?php echo esc_html( $report_details['abandonded_orders'] ); ?></span></span>
																									</p>
																									<p class="last-child">
																										<span style="color: #707070;"><span style="font-size: 14px;"><?php echo esc_html__( 'Carts Abandoned', 'woo-cart-abandonment-recovery' ); ?></span></span>
																									</p>
																									</div>
																								</td>
																								</tr>
																							</tbody>
																							</table>
																						</td>
																						</tr>
																					</tbody>
																					</table>
																				</td>
																				</tr>
																			</tbody>
																			</table>
																		</td>
																		<td style="padding-top: 0; padding-bottom: 0;" valign="top" class="mceColumn" id="mceColumnId-29" data-block-id="29" colspan="4" width="33.33333333333333%">
																			<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
																			<tbody>
																				<tr>
																				<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0;" valign="top" class="mceGutterContainer" id="gutterContainerId-32">
																					<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate;" role="presentation">
																					<tbody>
																						<tr>
																						<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0; border: 0; border-radius: 0;" valign="top" id="b32">
																							<table width="100%" style="border-width: 1px; border-style: solid; border-color: #edbeaf; background-color: #fff9f7; border-radius: 0; border-collapse: separate;">
																							<tbody>
																								<tr>
																								<td style="padding-left: 24px; padding-right: 24px; padding-top: 24px; padding-bottom: 24px;" class="mceTextBlockContainer">
																									<div data-block-id="32" class="mceText" id="d32" style="width: 100%;">
																									<p>
																										<span style="color: rgb(31, 41, 55);"><span style="font-size: 24px;"><?php echo esc_html( $report_details['conversion_rate'] ) . '%'; ?></span></span>
																									</p>
																									<p class="last-child">
																										<span style="color: rgb(112, 112, 112);"><span style="font-size: 14px;"><?php echo esc_html__( 'Recovery Rate', 'woo-cart-abandonment-recovery' ); ?></span></span>
																									</p>
																									</div>
																								</td>
																								</tr>
																							</tbody>
																							</table>
																						</td>
																						</tr>
																					</tbody>
																					</table>
																				</td>
																				</tr>
																			</tbody>
																			</table>
																		</td>
																		<td style="padding-top: 0; padding-bottom: 0;" valign="top" class="mceColumn" id="mceColumnId-34" data-block-id="34" colspan="4" width="33.33333333333333%">
																			<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
																			<tbody>
																				<tr>
																				<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0;" valign="top" class="mceGutterContainer" id="gutterContainerId-35">
																					<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate;" role="presentation">
																					<tbody>
																						<tr>
																						<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0; border: 0; border-radius: 0;" valign="top" id="b35">
																							<table width="100%" style="border-width: 1px; border-style: solid; border-color: #edbeaf; background-color: #fff9f7; border-radius: 0; border-collapse: separate;">
																							<tbody>
																								<tr>
																								<td style="padding-left: 24px; padding-right: 24px; padding-top: 24px; padding-bottom: 24px;" class="mceTextBlockContainer">
																									<div data-block-id="35" class="mceText" id="d35" style="width: 100%;">
																									<p>
																										<span style="color: rgb(31, 41, 55);"><span style="font-size: 24px;"><?php echo wp_kses_post( wc_price( $report_details['average_order_value'] ) ); ?></span></span>
																									</p>
																									<p class="last-child">
																										<span style="color: rgb(112, 112, 112);"><span style="font-size: 14px;"><?php echo esc_html__( 'Avg. Recovered Value', 'woo-cart-abandonment-recovery' ); ?></span></span>
																									</p>
																									</div>
																								</td>
																								</tr>
																							</tbody>
																							</table>
																						</td>
																						</tr>
																					</tbody>
																					</table>
																				</td>
																				</tr>
																			</tbody>
																			</table>
																		</td>
																		</tr>
																	</tbody>
																	</table>
																</td>
																</tr>
															</tbody>
															</table>
														</td>
														</tr>
													</tbody>
													</table>
												</td>
												</tr>
											</tbody>
											</table>
										</td>
										</tr>
									</tbody>
									</table>
								</td>
								</tr>
							</tbody>
							</table>
						</td>
						</tr>
					</tbody>
					</table>
				</td>
				</tr>
			</tbody>
			</table>
		</td>
		</tr>
	</tbody>
	</table>
</td>
</tr>
<!-- Row 4 -->
<tr>
<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0;" valign="top" class="mceGutterContainer" id="gutterContainerId-46">
	<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate;" role="presentation">
	<tbody>
		<tr>
		<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0; border: 0; border-radius: 0;" valign="top" id="b46">
			<table width="100%" style="border: 0; background-color: transparent; border-radius: 0; border-collapse: separate;">
			<tbody>
				<tr>
				<td style="padding-left: 24px; padding-right: 24px; padding-top: 12px; padding-bottom: 0;" class="mceTextBlockContainer">
					<div data-block-id="46" class="mceText" id="d46" style="width: 100%;">
					<h4 style="text-align: left;" class="last-child">
						Last 30 Days:
					</h4>
					</div>
				</td>
				</tr>
			</tbody>
			</table>
		</td>
		</tr>
	</tbody>
	</table>
</td>
</tr>
<!-- Row 5 -->
<tr>
	<td style="padding-top: 0; padding-bottom: 0; padding-right: 24px; padding-left: 24px;" valign="top" class="mceGutterContainer" id="gutterContainerId-48">
		<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate;" role="presentation">
			<tbody>
				<tr>
					<td style="padding-top: 12px; padding-bottom: 0; padding-right: 0; padding-left: 0; border: 0; border-radius: 0;" valign="top" class="mceLayoutContainer" id="b48">
						<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" data-block-id="48" id="section_758918f0a9268cb22395ad4ddc998ae6" class="mceLayout">
							<tbody>
								<tr class="mceRow">
									<td style="background-position: center; background-repeat: no-repeat; background-size: cover;" valign="top">
										<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
											<tbody>
												<tr>
													<td valign="top" class="mceColumn" id="mceColumnId--18" data-block-id="-18" colspan="12" width="100%">
														<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
															<tbody>
																<tr>
																	<td style="border: 0; border-radius: 0;" valign="top" align="center" id="b-11">
																		<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" data-block-id="-11">
																			<tbody>
																				<tr class="mceRow">
																					<td style="background-position: center; background-repeat: no-repeat; background-size: cover;" valign="top">
																						<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
																							<tbody>
																								<tr>
																									<td valign="top" class="mceColumn" id="mceColumnId--23" data-block-id="-23" colspan="12" width="100%">
																										<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
																											<tbody>
																												<tr>
																													<td style="border: 0; border-radius: 0;" valign="top" id="b55">
																														<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" data-block-id="55">
																															<tbody>
																																<tr class="mceRow">
																																	<td style="background-position: center; background-repeat: no-repeat; background-size: cover;" valign="top">
																																		<table border="0" cellpadding="0" cellspacing="24" width="100%" role="presentation">
																																			<tbody>
																																				<tr>
																																					<td style="padding-top: 0; padding-bottom: 0;" valign="top" class="mceColumn" id="mceColumnId-50" data-block-id="50" colspan="12" width="100%">
																																						<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
																																							<tbody>
																																								<tr>
																																									<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0;" valign="top" class="mceGutterContainer" id="gutterContainerId-49">
																																										<table border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate;" role="presentation">
																																											<tbody>
																																												<tr>
																																													<td style="padding-top: 0; padding-bottom: 0; padding-right: 0; padding-left: 0; border: 0; border-radius: 0;" valign="top" id="b49">
																																														<table width="100%" style="border-width: 1px; border-style: solid; border-color: #edbeaf; background-color: #fff9f7; border-radius: 0; border-collapse: separate;">
																																															<tbody>
																																																<tr>
																																																	<td style="padding-left: 24px; padding-right: 24px; padding-top: 24px; padding-bottom: 24px;" class="mceTextBlockContainer">
																																																		<div data-block-id="49" class="mceText" id="d49" style="width: 100%;">
																																																			<p>
																																																				<span style="color: rgb(31, 41, 55);"><span style="font-size: 24px;"><?php echo wp_kses_post( wc_price( $report_details['last_month_recovered_Revenue'] ) ); ?></span></span>
																																																			</p>
																																																			<p class="last-child">
																																																				<span style="color: rgb(112, 112, 112);"><span style="font-size: 14px;"><?php echo esc_html__( 'Recovered Revenue', 'woo-cart-abandonment-recovery' ); ?></span></span>
																																																			</p>
																																																		</div>
																																																	</td>
																																																</tr>
																																															</tbody>
																																														</table>
																																													</td>
																																												</tr>
																																											</tbody>
																																										</table>
																																									</td>
																																								</tr>
																																							</tbody>
																																						</table>
																																					</td>
																																				</tr>
																																			</tbody>
																																		</table>
																																	</td>
																																</tr>
																															</tbody>
																														</table>
																													</td>
																												</tr>
																											</tbody>
																										</table>
																									</td>
																								</tr>
																							</tbody>
																						</table>
																					</td>
																				</tr>
																			</tbody>
																		</table>
																	</td>
																</tr>
															</tbody>
														</table>
													</td>
												</tr>
											</tbody>
										</table>
									</td>
								</tr>
							</tbody>
						</table>
					</td>
				</tr>
			</tbody>
		</table>
	</td>
</tr>

<?php
