<!doctype html>
<html lang="en">
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Email</title>
    <style media="all" type="text/css">
      @media only screen and (max-width: 640px) {
        .main p,
        .main td,
        .main span {
          font-size: 14px !important;
        }

        .wrapper {
          padding: 8px !important;
        }

        .content {
          padding: 0 !important;
        }

        .container {
          padding: 0 !important;
          padding-top: 8px !important;
          width: 100% !important;
        }

        .main {
          border-left-width: 0 !important;
          border-radius: 0 !important;
          border-right-width: 0 !important;
        }

        .btn table {
          max-width: 100% !important;
          width: 100% !important;
        }

        .btn a {
          font-size: 16px !important;
          max-width: 100% !important;
          width: 100% !important;
        }
      }
      @media all {
        .ExternalClass {
          width: 100%;
        }

        .ExternalClass,
        .ExternalClass p,
        .ExternalClass span,
        .ExternalClass font,
        .ExternalClass td,
        .ExternalClass div {
          line-height: 100%;
        }

        .apple-link a {
          color: inherit !important;
          font-family: inherit !important;
          font-size: inherit !important;
          font-weight: inherit !important;
          line-height: inherit !important;
          text-decoration: none !important;
        }

        #MessageViewBody a {
          color: inherit;
          text-decoration: none;
          font-size: inherit;
          font-family: inherit;
          font-weight: inherit;
          line-height: inherit;
        }
      }
    </style>
  </head>
  <body
    style="
      font-family: Helvetica, sans-serif;
      -webkit-font-smoothing: antialiased;
      font-size: 16px;
      line-height: 1.3;
      -ms-text-size-adjust: 100%;
      -webkit-text-size-adjust: 100%;
      background-color: #f8f8f8;
      margin: 0;
      padding: 0;
    "
  >
    <table
      role="presentation"
      border="0"
      cellpadding="0"
      cellspacing="0"
      class="body"
      style="
        border-collapse: separate;
        mso-table-lspace: 0pt;
        mso-table-rspace: 0pt;
        background-color: #f8f8f8;
        width: 100%;
      "
      width="100%"
      bgcolor="#f8f8f8"
    >
      <tr>
        <td
          style="
            font-family: Helvetica, sans-serif;
            font-size: 16px;
            vertical-align: top;
          "
          valign="top"
        >
          &nbsp;
        </td>
        <td
          class="container"
          style="
            font-family: Helvetica, sans-serif;
            font-size: 16px;
            vertical-align: top;
            max-width: 600px;
            padding: 0;
            padding-top: 24px;
            width: 600px;
            margin: 0 auto;
          "
          width="600"
          valign="top"
        >
          <div
            class="content"
            style="
              box-sizing: border-box;
              display: block;
              margin: 0 auto;
              max-width: 600px;
              padding: 0;
            "
          >
            <!-- START CENTERED WHITE CONTAINER -->
            <span
              class="preheader"
              style="
                color: transparent;
                display: none;
                height: 0;
                max-height: 0;
                max-width: 0;
                opacity: 0;
                overflow: hidden;
                mso-hide: all;
                visibility: hidden;
                width: 0;
              "
              >Please verify your email address by clicking the button
              below.</span
            >
            <table
              role="presentation"
              border="0"
              cellpadding="0"
              cellspacing="0"
              class="main"
              style="
                border-collapse: separate;
                mso-table-lspace: 0pt;
                mso-table-rspace: 0pt;
                background: #ffffff;
                border: 1px solid #eaebed;
                border-radius: 16px;
                width: 100%;
              "
              width="100%"
            >
              <!-- START MAIN CONTENT AREA -->
              <tr>
                <td
                  class="wrapper"
                  style="
                    font-family: Helvetica, sans-serif;
                    font-size: 16px;
                    vertical-align: top;
                    box-sizing: border-box;
                    padding: 24px;
                    width: fit-content;
                  "
                  valign="top"
                >
                  <h1
                    style="
                      font-family: Helvetica, sans-serif;
                      font-size: 24px;
                      font-weight: bold;
                      margin: 0;
                      margin-bottom: 16px;
                    "
                  >
                    Verify your email address
                  </h1>

                  <p
                    style="
                      font-family: Helvetica, sans-serif;
                      font-size: 14px;
                      font-weight: normal;
                      margin: 0;
                      margin-bottom: 16px;
                    "
                  >
                    Thank you for signing up with Linkwarden! 🥳
                  </p>

                  <p
                    style="
                      font-family: Helvetica, sans-serif;
                      font-size: 14px;
                      font-weight: normal;
                      margin: 0;
                      margin-bottom: 16px;
                    "
                  >
                    Just one small step left. Simply verify your email address,
                    and you’re all set!
                  </p>

                  <table
                    role="presentation"
                    border="0"
                    cellpadding="0"
                    cellspacing="0"
                    class="btn btn-primary"
                    style="
                      border-collapse: separate;
                      mso-table-lspace: 0pt;
                      mso-table-rspace: 0pt;
                      box-sizing: border-box;
                      width: 100%;
                      min-width: 100%;
                    "
                    width="100%"
                  >
                    <tbody>
                      <tr>
                        <td
                          align="left"
                          style="
                            font-family: Helvetica, sans-serif;
                            font-size: 16px;
                            vertical-align: top;
                            padding-bottom: 16px;
                          "
                          valign="top"
                        >
                          <table
                            role="presentation"
                            border="0"
                            cellpadding="0"
                            cellspacing="0"
                            style="
                              border-collapse: separate;
                              mso-table-lspace: 0pt;
                              mso-table-rspace: 0pt;
                              width: auto;
                            "
                          >
                            <tbody>
                              <tr>
                                <td
                                  style="
                                    font-family: Helvetica, sans-serif;
                                    font-size: 13px;
                                    vertical-align: top;
                                    border-radius: 8px;
                                    text-align: center;
                                    background-color: #00335a;
                                  "
                                  valign="top"
                                  align="center"
                                  bgcolor="#0867ec"
                                >
                                  <a
                                    href="{{url}}"
                                    target="_blank"
                                    style="
                                      border-radius: 8px;
                                      box-sizing: border-box;
                                      cursor: pointer;
                                      display: inline-block;
                                      font-size: 13px;
                                      font-weight: bold;
                                      margin: 0;
                                      padding: 10px 18px;
                                      text-decoration: none;
                                      text-transform: capitalize;
                                      background-color: #00335a;
                                      color: #ffffff;
                                    "
                                    >Verify Email</a
                                  >
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                    </tbody>
                  </table>

                  <hr
                    style="
                      border: none;
                      border-top: 1px solid #eaebed;
                      margin-bottom: 24px;
                      width: 100%;
                    "
                  />

                  <p
                    style="
                      font-family: Helvetica, sans-serif;
                      font-size: 12px;
                      font-weight: normal;
                      margin: 0;
                      margin-bottom: 5px;
                      color: #868686;
                    "
                  >
                    If you’re having trouble clicking the button, click on the
                    following link:
                  </p>

                  <span
                    style="
                      font-family: Helvetica, sans-serif;
                      font-size: 10px;
                      font-weight: normal;
                      margin: 0;
                      margin-bottom: 16px;
                      word-break: break-all;
                    "
                  >
                    {{url}}
                  </span>
                </td>
              </tr>

              <!-- END MAIN CONTENT AREA -->
            </table>

            <!-- START FOOTER -->
            <div
              class="footer"
              style="
                clear: both;
                padding-top: 24px;
                text-align: center;
                width: 100%;
              "
            >
              <table
                role="presentation"
                border="0"
                cellpadding="0"
                cellspacing="0"
                style="
                  border-collapse: separate;
                  mso-table-lspace: 0pt;
                  mso-table-rspace: 0pt;
                  width: 100%;
                "
                width="100%"
              >
                <tr>
                  <td
                    class="content-block"
                    style="vertical-align: top; text-align: center"
                    valign="top"
                    align="center"
                  >
                    <img
                      src="https://raw.githubusercontent.com/linkwarden/linkwarden/main/public/linkwarden_light.png"
                      alt="logo"
                      style="width: 180px; height: auto"
                    />
                  </td>
                </tr>
              </table>
            </div>

            <!-- END FOOTER -->

            <!-- END CENTERED WHITE CONTAINER -->
          </div>
        </td>
        <td
          style="
            font-family: Helvetica, sans-serif;
            font-size: 16px;
            vertical-align: top;
          "
          valign="top"
        >
          &nbsp;
        </td>
      </tr>
    </table>
  </body>
</html>
