<?php
/**
 * Email template: Cart Abandonment Reminder
 *
 * This template is used to generate the HTML email sent to users
 * who have abandoned their cart. It is included in the `pixelio_send_email_to` function.
 *
 * Available variables:
 * - $recipient (string|null) : The email address of the recipient.
 * - $subject   (string)      : The email subject.
 * - $content   (string)      : Custom content to include in the email body.
 * - $coupon_code (string)    : Coupon code to incentivize recovery.
 * - $link      (string)      : Link to the cart or product page.
 *
 * Example usage:
 * ```
 * ob_start();
 * require plugin_dir_path( __FILE__ ) . 'pixelio-cart-abandon-recovery-more-email-reminder.php';
 * $html = ob_get_clean();
 * ```
 *
 * @package PixelioCartAbandonRecoveryMore
 * @since 0.1
 */

use PixelioCartAbandonRecoveryMore\Includes\Utils\Pixelio_Cart_Abandon_Recovery_More_Util;

if ( ! defined( 'ABSPATH' ) ) exit;



?><!DOCTYPE html>
<html lang="fr">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		/* Styles généraux */
		body {
			font-family: Arial, sans-serif;
			background-color: #f4f4f4;
			margin: 0;
			padding: 0;
		}

		.cart {

			background-color: #f0f0f1;
		}

		.cart > h3 {
			padding: 25px;
			text-align: center;
		}

		.logo {
			width: 100%;
		}

		.button:hover {
			background-color: #6394f7;
		}

		.button {
			display: block;
			height: 40px;
			width: 200px;
			margin: 25px auto;
			line-height: 40px;
			text-align: center;
			padding: 10px 20px;
			background-color: #0d367a;
			color: #ffffff;
			text-decoration: none;
			border-radius: 3px;

		}

		.title {
			background-color: white;
			margin-top: -25px;
			backface-visibility: hidden;
			display: inline-block;
			padding-left: 25px;
			color: #0d367a;
			padding-right: 25px;
			padding-top: 25px;
			border-radius: 5px;
			font-weight: 700;
		}

		.discount {
			outline: 1px solid black;
			width: auto;
			padding: 15px;
			margin: auto;
			line-height: 50px;
			font-size: 20px;
		}

		.discount-container {
			margin-top: 25px;
			margin-bottom: 25px;
			height: 50px;
			text-align: center;
		}

		.email-container {
			max-width: 600px;
			margin: auto;
			background-color: #ffffff;

			border-radius: 5px;
			box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
		}


		.header {

			text-align: center;
		}

		.content {
			padding: 20px;
		}

		.footer {
			font-size: 12px;
			color: #888888;
			text-align: center;
			padding: 10px;
			border-top: 1px solid #dddddd;
			margin-top: 20px;
		}

		.discount-cta {
			text-align: center;
		}

		.cart {
			margin-left: -20px;
			margin-right: -20px;
		}

		.cart-element:after {
			content: "";
			clear: both;
			display: flex;
		}

		.cart-item-img-container {
			float: left;
			width: 32%;
			text-align: center;
			flex: 1;
			margin-bottom: 20px;
			display: flex;
			vertical-align: middle;
			justify-content: center;
			align-items: center;
		}

		.cart-item-description p {
			text-align: start;
			padding-left: 15px;
			padding-right: 15px;
			font-weight: 300;
		}

		.cart-item-img {
			max-width: 150px;
			max-height: 150px
		}

		.cart-item-description {
			float: right;
			width: 67%;
		}

		.cart-element {
			padding-bottom: 25px;
		}
	</style>
</head>
<body>
<div class="email-container">
	<div class="header">
		<?php
		if ( has_custom_logo() ) {
			$pixelio_cart_abandon_recovery_more_logo_id  = get_theme_mod( 'custom_logo' );
			$pixelio_cart_abandon_recovery_more_logo_url = wp_get_attachment_image_src( $pixelio_cart_abandon_recovery_more_logo_id, 'full' );

			if ( $pixelio_cart_abandon_recovery_more_logo_url ) {
				echo esc_attr( '<img class="logo" src="' . $pixelio_cart_abandon_recovery_more_logo_url[0] . '" alt="logo"/>' );
			}
		}
		?>

		<h1 class="title">
		<?php

			esc_html_e( 'Still thinking ?', 'rivio-ai-cart-recovery-marketing-email-automation' );
		?>
		</h1>
	</div>
	<div class="content">

		<p>
			<<?php esc_html_e( 'Hi', 'rivio-ai-cart-recovery-marketing-email-automation' ); ?>
			<b><<?php esc_html_e( 'Jean', 'rivio-ai-cart-recovery-marketing-email-automation' ); ?></b>
		</p>
		<p><?php esc_html_e( 'Your cart is waiting, but it won’t be here forever! The items you chose are still available, but they’re popular and could sell out soon. Don’t miss out on these great finds!', 'rivio-ai-cart-recovery-marketing-email-automation' ); ?></p>
		<p>            <?php esc_html_e( "Complete your order within the next 24 hours to secure your items. Just click below, and you'll be back where you left off!", 'rivio-ai-cart-recovery-marketing-email-automation' ); ?></p>
		<a href="<?php echo esc_url( wc_get_cart_url() ); ?>"
			class="button"> <?php esc_html_e( 'Complete your checkout', 'rivio-ai-cart-recovery-marketing-email-automation' ); ?></a>
		<p class="discount-cta"> <?php esc_html_e( 'Get 15% reduction if you buy it in the next', 'rivio-ai-cart-recovery-marketing-email-automation' ); ?>
			<b><?php esc_html_e( '24 hours', 'rivio-ai-cart-recovery-marketing-email-automation' ); ?> </b></p>
		<p class="discount-container"><span
				class="discount"><?php echo esc_attr( $pixelio_cart_abandon_recovery_more_coupon_code ); ?></span></p>
		<div class="cart">
			<h3>
				<?php esc_html_e( 'Here what you left behind', 'rivio-ai-cart-recovery-marketing-email-automation' ); ?>
			</h3>
			<?php foreach ( $pixelio_cart_abandon_recovery_more_products as $pixelio_cart_abandon_recovery_more_product ) : ?>
				<div class="cart-element">
					<div class="cart-item-img-container">
						<img class="cart-item-img"
							src="<?php echo esc_attr( $pixelio_cart_abandon_recovery_more_product['image'] ); ?>"
							alt="<?php esc_html_e( 'product image', 'rivio-ai-cart-recovery-marketing-email-automation' ); ?>"/>
					</div>
					<div class="cart-item-description">
						<p> <?php echo esc_attr( $pixelio_cart_abandon_recovery_more_product['title'] ); ?></p>
						<p><?php echo esc_attr( $pixelio_cart_abandon_recovery_more_product['description'] ); ?></p>
						<p><?php echo esc_attr( $pixelio_cart_abandon_recovery_more_product['price'] ); ?></p>
					</div>
				</div>
			<?php endforeach; ?>
		</div>
		<a href="
		<?php
		$pixelio_cart_abandon_recovery_more_shop_page_id  = esc_html(get_option( 'woocommerce_shop_page_id' ));
		$pixelio_cart_abandon_recovery_more_shop_page_url = get_permalink( $pixelio_cart_abandon_recovery_more_shop_page_id );
		echo esc_attr( $pixelio_cart_abandon_recovery_more_shop_page_url );
		?>
		"
			class="button button-over"><?php esc_html_e( 'Shop now', 'rivio-ai-cart-recovery-marketing-email-automation' ); ?></a>
	</div>
	<div class="footer">
		&copy;
		<?php
		$pixelio_year = gmdate( 'Y' );
		echo esc_attr( $pixelio_year );

		esc_attr_e( 'all rights reserved.', 'rivio-ai-cart-recovery-marketing-email-automation' );
		?>
		<a
			href="#"><?php esc_attr_e( 'Unsubscribe', 'rivio-ai-cart-recovery-marketing-email-automation' ); ?></a>
	</div>
</div>
</body>
</html>
