---
bodyClass: bg-gray-postmark-lighter
---

<extends src="app/mailers/renderer/html/layouts/main.html">
	<block name="template">
		<table class="email-wrapper w-full bg-gray-postmark-lighter font-sans">
			<tr>
				<td align="center">
					<table class="email-content w-full">
						<component src="app/mailers/renderer/html/components/header.html"></component>
						<tr>
							<td class="email-body w-full">
								<table align="center" class="email-body_inner w-570 bg-white mx-auto sm:w-full">
									<tr>
										<td class="px-45 py-24">
											<div class="text-base">
												<h1 class="mt-0 text-2xl font-bold text-left text-gray-postmark-darker">
													Hi 👋,
												</h1>
												<p class="mt-6 mb-20 text-base leading-24 text-gray-postmark-dark">
													{{ invitation_sender_name }} from {{ invitation_sender_organization_name }}
													has invited you to join their organization.
													Use the button below to set up your account and get started.
													<strong>
														This invitation is only valid for the next 7 days.
													</strong>
												</p>
												<table align="center" class="w-full text-center my-30 mx-auto">
													<tr>
														<td align="center">
															<table class="w-full">
																<tr>
																	<td align="center" class="text-base">
																		<a
																			href="{{ action_url }}"
																			class="button button--green"
																			target="_blank"
																		>
																			Set up account
																		</a>
																	</td>
																</tr>
															</table>
														</td>
													</tr>
												</table>
												<p class="mt-6 mb-20 text-base leading-24 text-gray-postmark-dark">
													Welcome aboard,
													<br />The {{ page.company.product }} Team
												</p>
												<table class="body-sub">
													<tr>
														<td>
															<p
																class="mt-6 mb-20 text-xs leading-24 text-gray-postmark-dark"
															>
																If you're having trouble with the button above, copy and
																paste the URL below into your web browser.
															</p>
															<p
																class="mt-6 mb-20 text-xs leading-24 text-gray-postmark-dark"
															>
																{{ action_url }}
															</p>
														</td>
													</tr>
												</table>
											</div>
										</td>
									</tr>
								</table>
							</td>
						</tr>
						<!--<component src="app/mailers/renderer/html/components/footer.html"></component>-->
					</table>
				</td>
			</tr>
		</table>
	</block>
</extends>
