{% extends 'base.html.twig' %}
{% block stylesheets %}
    {{ parent() }}
    {{ encore_entry_link_tags('account') }}
    <link rel="stylesheet" href="{{ asset('assets/css/account-card.css') }}">
    <link rel="stylesheet" href="{{ asset('assets/css/toggle-switch.css') }}">
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    {{ encore_entry_script_tags('account') }}
    <script src="{{ asset('assets/js/three-modal.js') }}" type="module"></script>
{% endblock %}

{% block titlesm %}Account Management{% endblock titlesm %}

{% block body %}
<div id="account-container">
    <div class="account-card">
        <!-- Our JavaScript will dynamically render the content here -->
        <div class="loading-spinner text-center">
            <div class="spinner-border text-primary" role="status">
                <span class="visually-hidden">Loading...</span>
            </div>
        </div>
    </div>
</div>
{% endblock %}