<div id="user_login">
    <!-- Analyze Charts dropdown -->
    <div id="analyze_charts_container" class="analyze-dropdown-container">
        <button class="btn analyze-btn" onclick="UI.chartAnalysis.toggleDropdown()">
            <span class="analyze-icon">📊</span> Analyze
        </button>
        <div id="analyze_dropdown" class="analyze-dropdown" style="display: none;">
            <div class="analyze-option" onclick="UI.chartAnalysis.startPatternDetection()">
                <span class="option-icon">🔍</span> Detect Patterns
            </div>
            <!-- Future analysis tools can be added here -->
        </div>
    </div>
    <span id="username_display" class="username-link" onclick="UI.account.showAccountSettings()">{{user_name}}</span>
    <button class="btn" type="button" id="login_button" name="login" onclick="UI.users.toggleLogin()">
    Sign in
    </button>
    <button class="btn" type="button" id="logout_button" name="logout" onclick="UI.users.logout()">
    Sign out
    </button>
    <div class="form-popup" id="login_popup" style="border-radius: 10px; overflow: hidden;">
        <!-- Draggable Header Section -->
        <div class="dialog-header" id="login_draggable_header">
            <h1>Sign In</h1>
            <button class="dialog-close-btn" onclick="UI.users.toggleLogin()">&times;</button>
        </div>

        <!-- Main Content -->
        <div class="form-container login_content" style="padding: 15px;">
            <form name="signup_form" action="/login" method="POST">
                <div class="input-field"><input id='username' name='username' placeholder="Username" class="validate"></div>
                <div class="input-field"><input type="password" id='password' name='password' placeholder="Password" class="validate"></div>
                <button class="btn" onclick="UI.users.validate_input({username, email, password})">Sign in</button>
            </form>
            <p style="text-align: center; margin-top: 15px;">Don't have an account? <a href="/signup">Sign Up</a></p>
        </div>
    </div>
</div>
