<!doctype html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Signup Successful</title>

    <!--[if !mso]><!-->
    <style type="text/css">
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
    </style>
    <!--<![endif]-->

    <style type="text/css" rel="stylesheet" media="all">
      @media only screen and (max-width: 640px) {
        .ms-header {
          display: none !important;
        }
        .ms-content {
          width: 100% !important;
          border-radius: 0;
        }
        .ms-content-body {
          padding: 30px !important;
        }
        .ms-footer {
          width: 100% !important;
        }
        .mobile-wide {
          width: 100% !important;
        }
        .info-lg {
          padding: 30px;
        }
      }
    </style>
    <!--[if mso]>
      <style type="text/css">
        body {
          font-family: Arial, Helvetica, sans-serif!important !important;
        }
        td {
          font-family: Arial, Helvetica, sans-serif!important !important;
        }
        td * {
          font-family: Arial, Helvetica, sans-serif!important !important;
        }
        td p {
          font-family: Arial, Helvetica, sans-serif!important !important;
        }
        td a {
          font-family: Arial, Helvetica, sans-serif!important !important;
        }
        td span {
          font-family: Arial, Helvetica, sans-serif!important !important;
        }
        td div {
          font-family: Arial, Helvetica, sans-serif!important !important;
        }
        td ul li {
          font-family: Arial, Helvetica, sans-serif!important !important;
        }
        td ol li {
          font-family: Arial, Helvetica, sans-serif!important !important;
        }
        td blockquote {
          font-family: Arial, Helvetica, sans-serif!important !important;
        }
        th * {
          font-family: Arial, Helvetica, sans-serif!important !important;
        }
      </style>
    <![endif]-->
  </head>
  <body
    style="
      font-family: 'Inter', Helvetica, Arial, sans-serif;
      width: 100% !important;
      height: 100%;
      margin: 0;
      padding: 0;
      -webkit-text-size-adjust: none;
      background-color: #f4f7fa;
      color: #4a5566;
    "
  >
    <div
      class="preheader"
      style="
        display: none !important;
        visibility: hidden;
        mso-hide: all;
        font-size: 1px;
        line-height: 1px;
        max-height: 0;
        max-width: 0;
        opacity: 0;
        overflow: hidden;
      "
    ></div>

    <table
      class="ms-body"
      width="100%"
      cellpadding="0"
      cellspacing="0"
      role="presentation"
      style="
        border-collapse: collapse;
        background: linear-gradient(to right, #7c3aed, #f72585);
        width: 100%;
        margin-top: 0;
        margin-bottom: 0;
        margin-right: 0;
        margin-left: 0;
        padding-top: 0;
        padding-bottom: 0;
        padding-right: 0;
        padding-left: 0;
      "
    >
      <tr>
        <td
          align="center"
          style="
            word-break: break-word;
            font-family: 'Inter', Helvetica, Arial, sans-serif;
            font-size: 16px;
            line-height: 24px;
          "
        >
          <table
            class="ms-container"
            width="100%"
            cellpadding="0"
            cellspacing="0"
            style="
              border-collapse: collapse;
              width: 100%;
              margin-top: 0;
              margin-bottom: 0;
              margin-right: 0;
              margin-left: 0;
              padding-top: 0;
              padding-bottom: 0;
              padding-right: 0;
              padding-left: 0;
            "
          >
            <tr>
              <td
                align="center"
                style="
                  word-break: break-word;
                  font-family: 'Inter', Helvetica, Arial, sans-serif;
                  font-size: 16px;
                  line-height: 24px;
                "
              >
                <table
                  class="ms-header"
                  width="100%"
                  cellpadding="0"
                  cellspacing="0"
                  style="border-collapse: collapse"
                >
                  <tr>
                    <td
                      height="40"
                      style="
                        font-size: 0px;
                        line-height: 0px;
                        word-break: break-word;
                        font-family: 'Inter', Helvetica, Arial, sans-serif;
                      "
                    >
                      &nbsp;
                    </td>
                  </tr>
                </table>
              </td>
            </tr>
            <tr>
              <td
                align="center"
                style="
                  word-break: break-word;
                  font-family: 'Inter', Helvetica, Arial, sans-serif;
                  font-size: 16px;
                  line-height: 24px;
                "
              >
                <table
                  class="ms-content"
                  width="640"
                  cellpadding="0"
                  cellspacing="0"
                  role="presentation"
                  style="
                    border-collapse: collapse;
                    width: 640px;
                    margin-top: 0;
                    margin-bottom: 0;
                    margin-right: auto;
                    margin-left: auto;
                    padding-top: 0;
                    padding-bottom: 0;
                    padding-right: 0;
                    padding-left: 0;
                    background-color: #ffffff;
                    border-radius: 6px;
                    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.05);
                  "
                >
                  <tr>
                    <td
                      class="ms-content-body"
                      style="
                        word-break: break-word;
                        font-family: 'Inter', Helvetica, Arial, sans-serif;
                        font-size: 16px;
                        line-height: 24px;
                        padding-top: 40px;
                        padding-bottom: 40px;
                        padding-right: 50px;
                        padding-left: 50px;
                      "
                    >
                      <img
                        class="logo"
                        style="
                          height: 50px;
                          margin-right: auto;
                          margin-left: auto;
                          color: #7c3aed;
                          text-align: center;
                          margin-top: 0;
                          margin-bottom: 40px;
                          display: block;
                        "
                        src="https://github.com/HoneyBearCodes/UrbanStride/blob/main/public/img/logo.png?raw=true"
                      />

                      <h2
                        style="
                          margin-top: 0;
                          color: #7c3aed;
                          font-size: 20px;
                          line-height: 36px;
                          font-weight: 600;
                          margin-bottom: 24px;
                        "
                      >
                        Forgot your password?
                      </h2>

                      <p
                        style="
                          color: #4a5566;
                          margin-top: 20px;
                          margin-bottom: 20px;
                          margin-right: 0;
                          margin-left: 0;
                          font-size: 16px;
                          line-height: 28px;
                        "
                      >
                        We all forget our password sometimes. Don't worry, click
                        the button below to reset your password.
                        <strong
                          >This link is only valid for the next 3 hours.</strong
                        >
                      </p>

                      <table
                        width="100%"
                        align="center"
                        cellpadding="0"
                        cellspacing="0"
                        role="presentation"
                        style="border-collapse: collapse"
                      >
                        <tr>
                          <td
                            align="center"
                            style="
                              padding-top: 20px;
                              padding-bottom: 20px;
                              padding-right: 0;
                              padding-left: 0;
                              word-break: break-word;
                              font-family: 'Inter', Helvetica, Arial, sans-serif;
                              font-size: 16px;
                              line-height: 24px;
                            "
                          >
                            <table
                              class="mobile-wide"
                              border="0"
                              cellspacing="0"
                              cellpadding="0"
                              role="presentation"
                              style="border-collapse: collapse"
                            >
                              <tr>
                                <td
                                  align="center"
                                  class="btn"
                                  style="
                                    word-break: break-word;
                                    font-family: 'Inter', Helvetica, Arial,
                                      sans-serif;
                                    font-size: 16px;
                                    line-height: 24px;
                                    background-color: #f72585;
                                    border-radius: 100px;
                                    box-shadow:
                                      0 4px 6px -1px rgba(0, 0, 0, 0.1),
                                      0 2px 4px -1px rgba(0, 0, 0, 0.06);
                                  "
                                >
                                  <a
                                    href="<%= domain %>/reset/<%= resetToken %>"
                                    target="_blank"
                                    style="
                                      background-color: #f72585;
                                      padding-top: 14px;
                                      padding-bottom: 14px;
                                      padding-right: 30px;
                                      padding-left: 30px;
                                      display: inline-block;
                                      color: #fff;
                                      text-decoration: none;
                                      border-radius: 100px;
                                      -webkit-text-size-adjust: none;
                                      box-sizing: border-box;
                                      font-weight: 600;
                                      font-size: 15px;
                                      line-height: 21px;
                                      letter-spacing: 0.25px;
                                    "
                                    >Reset Password</a
                                  >
                                </td>
                              </tr>
                            </table>
                          </td>
                        </tr>
                      </table>

                      <p
                        style="
                          color: #4a5566;
                          margin-top: 20px;
                          margin-bottom: 20px;
                          margin-right: 0;
                          margin-left: 0;
                          font-size: 16px;
                          line-height: 28px;
                        "
                      >
                        If this is not done by you then please ignore this
                        email. Someone else might've entered your email
                        accidentally.
                      </p>

                      <table
                        width="100%"
                        cellpadding="0"
                        cellspacing="0"
                        role="presentation"
                        style="border-collapse: collapse"
                      ></table>

                      <p
                        style="
                          color: #4a5566;
                          margin-top: 20px;
                          margin-bottom: 20px;
                          margin-right: 0;
                          margin-left: 0;
                          font-size: 16px;
                          line-height: 28px;
                        "
                      >
                        <strong style="font-weight: 600">P.S.</strong> Want to
                        know more about the things you can do? Check out the
                        official
                        <a
                          href="https://github.com/HoneyBearCodes/UrbanStride"
                          style="color: #7c3aed; text-decoration: none"
                          ><strong>Github Repo</strong></a
                        >
                        for this project. And don't forget to follow me on my
                        <a
                          href="https://www.linkedin.com/in/shashanksingh790"
                          style="color: #7c3aed; text-decoration: none"
                          ><strong>LinkedIn</strong></a
                        >.
                      </p>

                      <table width="100%" style="border-collapse: collapse">
                        <tr>
                          <td
                            height="20"
                            style="
                              font-size: 0px;
                              line-height: 0px;
                              word-break: break-word;
                              font-family: 'Inter', Helvetica, Arial, sans-serif;
                            "
                          >
                            &nbsp;
                          </td>
                        </tr>
                        <tr>
                          <td
                            height="20"
                            style="
                              font-size: 0px;
                              line-height: 0px;
                              border-top-width: 1px;
                              border-top-style: solid;
                              border-top-color: #e2e8f0;
                              word-break: break-word;
                              font-family: 'Inter', Helvetica, Arial, sans-serif;
                            "
                          >
                            &nbsp;
                          </td>
                        </tr>
                      </table>

                      <p
                        class="small"
                        style="
                          color: #4a5566;
                          margin-top: 20px;
                          margin-bottom: 20px;
                          margin-right: 0;
                          margin-left: 0;
                          font-size: 14px;
                          line-height: 21px;
                        "
                      >
                        If youâ€™re having trouble with the button above, copy and
                        paste the URL below into your web browser.
                      </p>
                      <p
                        class="small"
                        style="
                          color: #4a5566;
                          margin-top: 20px;
                          margin-bottom: 20px;
                          margin-right: 0;
                          margin-left: 0;
                          font-size: 14px;
                          line-height: 21px;
                        "
                      >
                      <%= domain %>/reset/<%= resetToken %>
                      </p>
                    </td>
                  </tr>
                </table>
              </td>
            </tr>
            <tr>
              <td
                align="center"
                style="
                  word-break: break-word;
                  font-family: 'Inter', Helvetica, Arial, sans-serif;
                  font-size: 16px;
                  line-height: 24px;
                "
              >
                <table
                  class="ms-footer"
                  width="640"
                  cellpadding="0"
                  cellspacing="0"
                  role="presentation"
                  style="
                    border-collapse: collapse;
                    width: 640px;
                    margin-top: 0;
                    margin-bottom: 0;
                    margin-right: auto;
                    margin-left: auto;
                  "
                >
                  <tr>
                    <td
                      class="ms-content-body"
                      align="center"
                      style="
                        word-break: break-word;
                        font-family: 'Inter', Helvetica, Arial, sans-serif;
                        font-size: 16px;
                        line-height: 24px;
                        padding-top: 40px;
                        padding-bottom: 40px;
                        padding-right: 50px;
                        padding-left: 50px;
                      "
                    >
                      <p
                        class="small"
                        style="
                          margin-top: 20px;
                          margin-bottom: 20px;
                          margin-right: 0;
                          margin-left: 0;
                          color: #fff;
                          font-size: 16px;
                          line-height: 21px;
                        "
                      >
                        Made with ðŸ’– by Shashank Singh &copy; <%= currentYear %>
                      </p>
                    </td>
                  </tr>
                </table>
              </td>
            </tr>
          </table>
        </td>
      </tr>
    </table>
  </body>
</html>
