<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>{{appName}} password recovery</title>

  <meta name="Author" content="{{appName}} Team" />
  <meta name="Description" content="Recover your password in order to gain access to your account." />
</head>

<body style="
			margin: 0;
			padding: 0;
			box-sizing: border-box;

			font-style: normal;
		">
  <!-- for readable snippet -->
  <table style="display: none">
    <tr style="display: none">
      <td style="display: none">
        <p style="display: none">
          Recover your password in order to gain access to your account.
        </p>
      </td>
    </tr>
  </table>

  <table style="border-spacing: 0; border: none; background-color: #ffffff" width="100%" cellspacing="0"
    cellpadding="0">
    <tbody>
      <tr>
        <td align="center" style="
							padding: 12px 4px 24px 8px;
							-webkit-font-smoothing: antialiased;
							-webkit-text-size-adjust: none;
							-ms-text-size-adjust: none !important;
						">
          <!-- Container -->
          <table width="744" style="
								border-spacing: 0;
								border: none;

								border-radius: 32px;
								box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.075);
								background-image: linear-gradient(
									0deg,
									#ffffff,
									#ffffff
								);
							" role="presentation" cellspacing="0" cellpadding="0">
            <tr>
              <td style="padding: 0; padding-bottom: 60px">
                <!-- Top block -->
                <table width="100%" style="
											border-spacing: 0;
											border: none;
											border-radius: 32px;
											background: linear-gradient(
												149.8deg,
												#2d7dd8 17.72%,
												#7dbaff 100%
											);
										" role="presentation" cellspacing="0" cellpadding="0">
                  <tbody>
                    <tr>
                      <td align="center" style="
														padding: 0;
														padding-top: 80px;
													">
                        <img width="173" height="40" src="{{domain}}/mailing/reset_password/{{appNameLower}}_logo.png"
                          alt="{{appName}} Logo" />
                      </td>
                    </tr>

                    <tr>
                      <td style="
														padding: 30px 40px 0
															40px;

														border-spacing: 0;
														border: none;

														font-family: Verdana,
															Geneva, Tahoma,
															sans-serif;
														text-align: center;
														font-style: normal;
														font-weight: 700;
														font-size: 30px;
														line-height: 36px;

														color: #ffffff;
													">
                        We have received a request to reset the password for the account.
                      </td>
                    </tr>

                    <tr>
                      <td style="padding: 0">
                        <img width="100%" height="auto" src="{{domain}}/mailing/reset_password/security.png"
                          alt="{{appName}} password recovery" />
                      </td>
                    </tr>

                    <tr>
                      <td style="
														padding: 0 56px;

														font-family: Arial,
															sans-serif;

														font-size: 21px;
														line-height: 26px;
														font-weight: 500;
														text-align: center;
														color: #ffffff;
													">
                        To set a new password for the account of
                        <span style="font-weight: 600">{{userName}}</span>, please proceed by
                        clicking on the link below.
                      </td>
                    </tr>

                    <tr>
                      <td align="center" style="
														padding: 0;
														padding-top: 40px;
														padding-bottom: 80px;
													">
                        <a href="{{recoveryLink}}" style="
															width: 340px;

															display: block;
															background-color: #ffc700;
															box-shadow: 0px 10px
																20px
																rgba(
																	255,
																	239,
																	90,
																	0.25
																);
															border-radius: 64px;

															padding-top: 15px;
															padding-bottom: 19px;

															font-family: Verdana,
																Geneva, Tahoma,
																sans-serif;
															text-align: center;
															font-style: normal;
															font-weight: 700;
															font-size: 28px;
															line-height: 39px;
															text-decoration: none;

															color: #ffffff;
														">Reset</a>
                      </td>
                    </tr>
                  </tbody>
                </table>

                <!-- Bottom block -->
                <table width="100%" style="border-spacing: 0; border: none" role="presentation" cellspacing="0"
                  cellpadding="0">
                  <tbody>
                    <tr>
                      <td style="
														padding: 40px 128px 0
															128px;

														font-family: Arial,
															sans-serif;

														font-size: 16px;
														line-height: 24px;
														font-weight: 500;
														text-align: center;
														color: #8a929d;
													">
                        If this request was not initiated by you, please notify us of the receipt of
                        this email at
                        <a style="color: #8a929d" target="_blank" rel="noopener noreferrer"
                          href="mailto:{{supportEmail}}">{{supportEmail}}</a>.
                      </td>
                    </tr>

                    <tr>
                      <td style="
														padding: 0;
														padding-top: 40px;

														font-family: Arial,
															sans-serif;

														font-size: 21px;
														line-height: 26px;
														font-weight: 500;
														text-align: center;
														color: #8a929d;
													">
                        Yours sincerely, The {{appName}} Team!
                      </td>
                    </tr>
                  </tbody>
                </table>
              </td>
            </tr>
          </table>
        </td>
      </tr>
    </tbody>
  </table>
</body>

</html>