<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
        <meta name="viewport" content="width=device-width" />
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title><?= $this->ts_functions->getsettings('email','fromname'); ?></title>
        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="<?= base_url('assets_front/css/font-awesome.min.css'); ?>" type="text/css">
        
        <style>
            /* ------------------------------------- 
            		EMAIL CSS 
            ------------------------------------- */
            body.email_wrapper {
                 -webkit-font-smoothing:antialiased;
                 -webkit-text-size-adjust:none;
                 width: 100%!important;
                 height: 100%;
                 font-size: 16px;
                 line-height: 1.5;
            }
             .email_wrapper_container {
                 background:#f3f8fb;
                 width: 100%;
                 margin: auto;
                 border: none;
                 border-radius: 20px;
                 overflow: hidden;
                 font-size: 16px;
                 line-height: 1.5;
                 -moz-box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.16);
                -webkit-box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.16);
                 box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.16);
                 padding: 20px 20px;
                 font-family: 'Segoe UI',Tahoma,Verdana,Arial,sans-serif;
                 max-width: 600px;
                 text-align: center;
            }
             .email_wrapper_container p {
                 font-size: 16px;
                 line-height: 1.5;
                 margin: 0 0 10px;
            }
             .email_wrapper_container a, .email_wrapper_container a:hover {
                 color: #2BA6CB;
                 text-decoration: none;
            }
             .email_wrapper_container table.full_wrap {
                 width: 100%;
            }
            .email_wrapper_container h1,.email_wrapper_container h2, .email_wrapper_container h3, .email_wrapper_container h4, .email_wrapper_container h5, .email_wrapper_container h6 {
                 font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
                 line-height: 1.5;
                 margin-bottom:15px;
                 color:#000;
                 margin: 0;
                 text-transform: capitalize;
            }
             .email_wrapper_container h4 {
                 font-weight:600;
                 font-size: 24px;
                 color: #000000;
                 margin-bottom: 20px;
            }
             .email_wrapper_container .container {
                 display:block;
                 clear:both;
            }
             .email_wrapper_container .content {
                 display:block;
            }
             .email_wrapper_container .collapse{
                 font-size: 32px;
                 font-weight: 800;
                 text-transform: capitalize;
                 color: #00d4bb;
                 width: 100%;
                 text-align: center;
            }
             .email_wrapper_container .content table {
                 width: 100%;
            }
            .email_wrapper_container .mail_footer p {
                margin: 0;
            }
            .email_wrapper_container .mail_body p span {
                margin-right: 6px;
                display: inline-block;
            }
            .email_wrapper_container .mail_head, .email_wrapper_container .mail_footer {
                padding: 20px 20px 0;
                color: #000000;
            } 
            .email_wrapper_container .mail_footer {
                padding: 0 20px 20px;
            } 
            .email_wrapper_container .mail_body {
                padding: 20px;
                border: none;
                color: #000000;
            }
            .email_wrapper_container .mail_body a {
                color: #008eff;
            }
            .email_wrapper_container .mail_body .login_info a {
                color: #000000;
            }
            .email_wrapper_container .mail_footer p {
                font-weight: 600;
            }
            .mail_head span {
                display: inline-block;
                width: 100%;
            }
            .mail_head span img {
                height: 130px;
                width: 150px;
                object-fit: contain;
            }
            .mail_body td div.login_info {
                background: #ffffff;
                text-align: left;
                display: inline-block;
                padding: 20px 30px 10px;
                border: none;
                border-radius: 20px;
                margin: 20px 0 20px;
            }
             @media only screen and (max-width: 600px) {
                 .email_wrapper_container .collapse{
                     font-size: 20px;
                }
            }

        </style>
    </head>
    
    <body class="email_wrapper">
        <div class="email_wrapper_container">
            <!-- HEADER -->
        	<table class="full_wrap mail_head">
        		<tr>
        		     <td>
        		         <span class="email_icon">
        		            <img src="<?php echo base_url(); ?>/assets/images/email_icon.png" alt="">
        		        </span>
    		        </td>
        		</tr>
        	</table>
            <!-- BODY -->
        	<table class="full_wrap mail_body">
        		<tr>
        			<td class="container">
        				<div class="content">
        				    {email_body}
        				</div>
        			</td>
        		</tr>
        	</table>
        	<!-- Footer -->
        	<table class="full_wrap mail_footer">
        		<tr>
        			<td>
        			    <p>Team Home Delivery</p>
        			</td>
        		</tr>
        	</table>
        </div>
    </body>
</html>