<!DOCTYPE html>
<html lang="en-GB">
<head>
    {% include 'layouts/_shared_head.html' %}
    <link href="https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Crimson+Text:wght@400;600&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/pages/tcg/base.css') }}">

    {% block page_head %}{% endblock %}
</head>
<body data-page="{{ model.hash_page_current }}" class="tcg-theme">
    <div class="topnav tcg">
        <div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_LOGO }}">
            <a href="{{ model.HASH_PAGE_MTG_TRIAL_GAME }}">
                <img class="{{ model.FLAG_LOGO }}" src="{{ url_for('static', filename='images/logo.webp') }}" alt="Shuffle And Skirmish logo" aria-label="Shuffle And Skirmish logo" tabindex="0">
            </a>
        </div>
        <div class="{{ model.FLAG_CONTAINER }} company-name">
            <h1 class="company-name tcg-title">{{ model.title }}</h1>
        </div>
        <div class="nav-links tcg">
            {% if model.user.get_is_logged_in() %}
                <a href="{{ model.HASH_PAGE_MTG_GAMES }}" class="nav-link {% if model.hash_page_current == model.HASH_PAGE_MTG_GAMES %}active{% endif %} {{ model.FLAG_NAV_MTG_GAMES }}">Games</a>
                <a href="{{ model.HASH_PAGE_MTG_DECKS }}" class="nav-link {% if model.hash_page_current == model.HASH_PAGE_MTG_DECKS %}active{% endif %} {{ model.FLAG_NAV_MTG_DECKS }}">Decks</a>
            {% endif %}
            <a href="{{ model.HASH_PAGE_MTG_TRIAL_GAME }}" class="nav-link {% if model.hash_page_current == model.HASH_PAGE_MTG_TRIAL_GAME %}active{% endif %} {{ model.FLAG_NAV_MTG_TRIAL_GAME }}">Trial</a>
            {% if model.user.get_is_logged_in() %}
                <a class="nav-link {{ model.FLAG_NAV_USER_LOGOUT }}" href="{{ model.HASH_PAGE_USER_LOGOUT }}">Logout</a>
            {% else %}
                <a class="nav-link {{ model.FLAG_NAV_USER_LOGIN }}" href="{{ model.HASH_PAGE_USER_LOGIN }}">Login</a>
            {% endif %}
        </div>
        {% include 'layouts/_shared_header.html' %}
    </div>

    <!-- Body -->
    <div id="{{ model.ID_PAGE_BODY }}" class="tcg-body">
        {% block page_body %}{% endblock %}
    </div>

    <!-- Footer -->
    <footer class="footer tcg">
        <div class="{{ model.FLAG_CONTAINER }}">
            <div class="footer-content">
                <div class="footer-section">
                    <h3>{{ model.NAME_COMPANY }}</h3>
                    <p>Email: {{ model.get_mail_contact_public() }}</p>
                </div>

                <div class="footer-section">
                    <h3>Legal</h3>
                    <a href="{{ model.HASH_PAGE_PRIVACY_POLICY }}">Privacy Policy</a>
                    <a href="{{ model.HASH_PAGE_ACCESSIBILITY_STATEMENT }}">Accessibility Statement</a>
                </div>

                <div class="footer-section">
                    <p>&copy; {{ current_year }} {{ model.NAME_COMPANY }}. <a href="{{ model.HASH_PAGE_LICENSE }}" alt="License" aria-label="License">All rights reserved.</a></p>
                </div>
            </div>
        </div>
    </footer>

    {% include 'layouts/_shared_scripts.html' %}
    <script src="{{ url_for('static', filename='dist/js/main.bundle.js') }}"></script>
</body>
</html>
