{% extends "base.html" %}

{% block title %}Login - OpenRouter Monitor{% endblock %}

{% block content %}
<article class="grid">
    <div>
        <h1>Login</h1>
        <p>Enter your credentials to access the dashboard.</p>
    </div>
    <div>
        <form action="/login" method="POST" hx-post="/login" hx-swap="outerHTML" hx-target="this">
            {% if error %}
            <div class="alert alert-danger" role="alert">
                {{ error }}
            </div>
            {% endif %}
            
            <label for="email">
                Email
                <input type="email" id="email" name="email" placeholder="your@email.com" required>
            </label>
            
            <label for="password">
                Password
                <input type="password" id="password" name="password" placeholder="Password" required minlength="8">
            </label>
            
            <fieldset>
                <label for="remember">
                    <input type="checkbox" id="remember" name="remember" role="switch">
                    Remember me
                </label>
            </fieldset>
            
            <button type="submit">Login</button>
        </form>
        
        <p>Don't have an account? <a href="/register">Register here</a>.</p>
    </div>
</article>
{% endblock %}