<!-- NAV (W4, W2, W3) -->
<nav aria-label="Main navigation">
    <div class="nav-inner">
        <a href="/" class="logo">Agent<span>Forms</span></a>
        <button type="button" class="nav-hamburger" aria-label="Menu">
            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" aria-hidden="true">
                <path d="M3 6h18M3 12h18M3 18h18"/>
            </svg>
        </button>
        <div class="nav-links">
            {% if session.get('user_id') %}
            <a href="/auth/dashboard">Dashboard</a>
            <a href="/sites/">Sites</a>
            <a href="/documents/">Documents</a>
            <a href="/teams/">Teams</a>
            <a href="/settings/">Settings</a>
            <a href="/api/docs">API Docs</a>
            <a href="https://relay.agentforms.io" target="_blank" rel="noopener">Downloads</a>
            {% if user and user.email %}
            <span class="user-email">{{ user.email }}</span>
            {% endif %}
            <form method="POST" action="/auth/logout">
                    <input type="hidden" name="csrf_token" value="{{ csrf_token }}"/>
                <button type="submit" class="btn-logout">Logout</button>
            </form>
            {% else %}
            <a href="/features">Features</a>
            <a href="/pricing">Pricing</a>
            <a href="/api/docs">Docs</a>
            <a href="https://relay.agentforms.io" target="_blank" rel="noopener">Downloads</a>
            <a href="/auth/login" class="btn btn-outline btn-sm">Sign in</a>
            <a href="/auth/register" class="btn btn-sm">Sign up</a>
            {% endif %}
        </div>
    </div>
</nav>
<script src="/static/js/nav-inline.js"></script>