{% extends 'public/base.html' %}

{% block title %}Sign In | ChatLab AI Platform{% endblock %}

{% block content %}
<main class="auth-container">
    <div class="glass-card auth-card">
        <div class="auth-header">
            <div class="auth-logo">[CL]</div>
            <h2 class="auth-title">Welcome Back</h2>
            <p class="auth-subtitle">ChatLab Console Sign In</p>
        </div>
        
        {% if error_message %}
            <div class="auth-error">
                {{ error_message }}
            </div>
        {% endif %}
        
        <form method="post">
            {% csrf_token %}
            
            <div class="form-group">
                <label for="username" class="form-label">Username</label>
                <input type="text" name="username" id="username" class="form-input" placeholder="Enter your username" required autocomplete="username">
            </div>
            
            <div class="form-group" style="margin-bottom: 2rem;">
                <label for="password" class="form-label">Password</label>
                <input type="password" name="password" id="password" class="form-input" placeholder="Enter your password" required autocomplete="current-password">
            </div>
            
            <button type="submit" class="btn btn-primary" style="width: 100%; justify-content: center; padding: 0.85rem;">
                Sign In to Console
                <svg width="20" height="20" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 16l-4-4m0 0l4-4m-4 4h14m-5 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h7a3 3 0 013 3v1"/></svg>
            </button>
        </form>
    </div>
</main>
{% endblock %}