{% extends 'base.html' %}

{% block content %}
<div class="row justify-content-center">
	<div class="col-12 col-md-8 col-lg-5">
		<div class="form-container">
			<h1 class="h3 mb-3 text-center">Sign In</h1>
			<p class="text-muted text-center mb-4">Access your account and continue shopping.</p>
			<form method="POST" action="{{ url_for('auth.login') }}">
				<input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
				<div class="mb-3">
					<label for="username" class="form-label">Username</label>
					<input type="text" class="form-control" id="username" name="username" required placeholder="Enter your username">
				</div>

				<div class="mb-4">
					<label for="password" class="form-label">Password</label>
					<input type="password" class="form-control" id="password" name="password" required placeholder="Enter your password">
				</div>

				<button type="submit" class="btn btn-primary w-100">Login</button>
			</form>
			<p class="text-center mt-3 mb-0">Don't have an account? <a href="{{ url_for('main.register') }}">Register here</a>.</p>
		</div>
	</div>
</div>
{% endblock %}