{% extends "base.html" %}
{% block content %}
<div style="display: flex; justify-content: center; align-items: center; min-height: 60vh;">
<div style="background: var(--white); padding: 2rem; border-radius: 0.5rem; box-shadow: 0 4px 6px rgba(0,0,0,0.1); width: 100%; max-width: 400px;">
<h2 style="margin-top: 0; text-align: center;">Login</h2>
{% if error %}<div class="flash flash-error">{{ error }}</div>{% endif %}
<form method="POST">
<div class="form-group">
<label class="form-label">Username</label>
<input type="text" name="username" class="form-control" required>
</div>
<div class="form-group">
<label class="form-label">Password</label>
<input type="password" name="password" class="form-control" required>
</div>
<button type="submit" class="btn btn-primary" style="width: 100%; justify-content: center;">Sign In</button>
</form>
</div>
</div>
{% endblock %}