{% extends 'email/base.html.twig' %}

{% block style %}
    <style type="text/css">
        .footer {
            background-color: {{ variables.color.primary }};
            color: #FFFFFF;
        }

        .footer table {
            width: 100%;
        }

        .footer td {
            width: 50%;
            padding-left: 5%;
            text-align: left;
        }

        .footer td a {
            color: #0D2617;
        }

        @media screen and (max-width: {{ variables.breakpoint.mobile }}) {
            .footer td {
                width: 50%;
                padding: 0;
                text-align: center;
            }
        }
    </style>
{% endblock %}

{% block header %}Welcome to Money Jar{% endblock %}

{% block content %}
    <p><strong>Hi {{ firstName }},</strong></p>

    <p>Thanks for registering with Money Jar, this is the start of a journey giving you the freedom to be better with money.</p>

    <p>We know that managing money can be challenging, that's why we work hard to make it simple and easy.</p>

    <p>Now that you're a Money Jar account holder, we'll keep you up to date on all of our latest progress and you'll be the first to know about improvements to the app.</p>

    <p>We're really excited to start this journey together with you.</p>

    <p class="last-child">Thanks for joining us.</p>
    <p class="last-child"><strong>The Money Jar Team</strong></p>
{% endblock %}

{% block footer %}
    <table>
        <tr>
            <td>
                Visit the website
                <br />
                <a href="https://moneyjar.ie">moneyjar.ie</a>
            </td>

            <td>
                Contact support
                <br />
                <a href="mailto:info@moneyjar.ie">info@moneyjar.ie</a>
            </td>
        </tr>
    </table>
{% endblock %}