{% extends "base.html" %}
{% block title %}
    Account Activated
{% endblock title %}
{% block content %}
    <div class="columns is-centered">
        <div class="column is-8-tablet is-6-desktop">
            <div class="box has-text-centered p-5">
                <span class="icon is-large has-text-success mb-4">
                    <i class="fas fa-check-circle fa-3x"></i>
                </span>
                <h1 class="title is-3 mb-4">Account Successfully Activated!</h1>
                <p class="subtitle is-5 mb-5">Your Matrix account is now ready to use.</p>
                <div class="notification is-light is-success">
                    <div class="content">
                        <h4 class="has-text-centered mb-3">What's next?</h4>
                        <ol class="has-text-left">
                            <li>Download a Matrix client like Element</li>
                            <li>Log in with your username and password</li>
                            <li>Start chatting with others on the Matrix network</li>
                        </ol>
                    </div>
                </div>
                <p class="mt-5">
                    <a href="https://{{ matrix_domain }}" class="button is-link">
                        <span class="icon">
                            <i class="fas fa-sign-in-alt"></i>
                        </span>
                        <span>Go to {{ matrix_domain }}</span>
                    </a>
                </p>
            </div>
        </div>
    </div>
{% endblock content %}