{% extends "./base_email.html" %}
{% load static %}

{% block email_body %}
<div class="margin-bottom-1200">
  <h1>Welcome to GLCDI!<br>Your application has been approved.</h1>
  <p>Hello {{ fullname }},</p>
  <p>
    Your registration to the GLCDI Data Space has been reviewed and approved.
  </p>
  {% if keycloak_username %}
  <p>Your account has been created. Here are your credentials:</p>
  <table style="margin-bottom: 24px;">
    <tr>
      <td class="small-padding"><p class="no-padding"><strong>Username:</strong></p></td>
      <td><p class="no-padding">{{ keycloak_username }}</p></td>
    </tr>
    <tr>
      <td class="small-padding"><p class="no-padding"><strong>Password:</strong></p></td>
      <td><p class="no-padding">{{ keycloak_password|safe }}</p></td>
    </tr>
  </table>
  <p>
    You will be asked to set a new password on first login.<br>
    Log in at: <a href="{{ keycloak_login_url }}" style="color:#0284C7;">{{ keycloak_login_url }}</a>
  </p>
  {% else %}
  <p>
    You will receive your credentials within the next 7 days.
  </p>
  {% endif %}
</div>

<div class="margin-bottom-1200">
  <h2 class="margin-bottom-400">Next steps</h2>
  <table>
    <tr>
      <td class="small-padding text-center">
        <img class="check" src="{{ base_url }}{% static 'images/ci--check.png' %}" alt="checkmark"/>
      </td>
      <td class="large-padding">
        <p class="no-padding">Deploy your own data space connector.</p>
      </td>
    </tr>
    <tr>
      <td class="small-padding text-center">
        <img class="check" src="{{ base_url }}{% static 'images/ci--check.png' %}" alt="checkmark"/>
      </td>
      <td class="large-padding">
        <p class="no-padding">Connect to other participants in the network.</p>
      </td>
    </tr>
    <tr>
      <td class="small-padding text-center">
        <img class="check" src="{{ base_url }}{% static 'images/ci--check.png' %}" alt="checkmark"/>
      </td>
      <td class="large-padding">
        <p class="no-padding">Negotiate data sharing agreements.</p>
      </td>
    </tr>
    <tr>
      <td class="small-padding text-center">
        <img class="check" src="{{ base_url }}{% static 'images/ci--check.png' %}" alt="checkmark"/>
      </td>
      <td>
        <p class="no-padding">Offer and access data across the community.</p>
      </td>
    </tr>
  </table>
</div>

<div>
  <h2>Need help?</h2>
  <p>If you have any questions, please contact the support team.</p>
</div>
{% endblock %}