{% load static i18n %}
<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>{% trans "Data Center Light Account Activation" %}</title>
    <link rel="shortcut icon" href="{{ base_url }}{% static 'datacenterlight/img/favicon.ico' %}" type="image/x-icon">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:300,400">
</head>

<body style="margin: 0; padding: 20px 0;">
    <table style="width: 100%; border-spacing: 0; border-collapse: collapse; max-width: 560px;">
        <tr>
            <td>
                <img src="{{ base_url }}{% static 'datacenterlight/img/logo_black.png' %}" style="width: 200px; height: 50px;">
            </td>
        </tr>
        <tr>
            <td style="padding-top: 15px;">
                <h1 style="font-family: Lato, Arial, sans-serif; font-size: 25px; font-weight: 400; margin: 0;">{% trans "Data Center Light Account Activation" %}</h1>
            </td>
        </tr>
        <tr>
            <td style="padding-top: 25px; font-size: 16px;">
                <p style="line-height: 1.75; font-family: Lato, Arial, sans-serif; font-weight: 300; margin-bottom: 10px; margin-top: 0;">
                    {% blocktrans %}You can activate your Data Center Light account by clicking <a href="{{base_url}}{{activation_link}}" style="text-decoration: none; color: #4382c8; font-weight: 400;">here</a>.{% endblocktrans %}
                </p>
                <p style="line-height: 1.75; font-family: Lato, Arial, sans-serif; font-weight: 300; margin-bottom: 10px; margin-top: 0;">
                    {% blocktrans %}You can also copy and paste the following link into the address bar of your browser to activate your Data Center Light account.{% endblocktrans %}
                </p>
                <p style="color: #4382c8; line-height: 1.4; font-family: Lato, Arial, sans-serif; font-weight: 300; margin: 0;">
                    {{base_url}}{{activation_link}}
                </p>
                <p>
                    {% if account_details %}
                        {% url 'hosting:reset_password' as reset_password_url %}
                        {% trans "Your account details are as follows" %}:

                        {% trans "Username" %} : {% trans "Your email address" %}
                        {% trans "Password" %} : {{account_details}}

                        {% trans "You can reset your password here" %}:
                        {{base_url}}{{reset_password_url}}
                    {% endif %}
                </p>
            </td>
        </tr>
        <tr>
            <td style="padding-top: 40px; padding-bottom: 25px;">
                <h3 style="font-family: Lato, Arial, sans-serif; margin: 0; font-weight: 400; font-size: 15px;">{% trans "Your Data Center Light Team" %}</h3>
            </td>
        </tr>
    </table>
</body>

</html>
