{% load i18n %}


<html>
	<head>
		<title>{% block title %}{% trans 'Login' %}{% endblock %}</title>
		<style>
			html {
				font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
				font-size: 16px;
				margin: 0;
				padding: 0;
			}

			*, *::before, *::after {
				box-sizing: border-box;
			}

			body {
				display: flex;
				min-height: 100vh;
				align-items: center;
				justify-content: center;
			}

			div {
				text-align: center;
			}

			p {
				margin-bottom: 2em;
			}

			.btn {
				transition: background-color 0.3s ease-out;
				background-color: #007bff;
				border: 0;
				border-radius: 3px;
				color: white;
				font-weight: bold;
				padding: 1rem 2rem;
				text-decoration: none;
				text-transform: uppercase;
			}

			.btn:hover {
				background-color: #0069d9;
			}
		</style>
	</head>
	<body>
		<div>
			{% block content %}
				{% if user.is_authenticated %}
				<p>
					{% blocktrans trimmed %}
						You are authenticated as {{ username }},<br />
						but are not authorized to access this page.
					{% endblocktrans %}
				</p>
				{% endif %}
			{% endblock %}

			{% block login_button %}
				<a class="btn" href="{% url 'centralauth_client:login' %}{% if next %}?next={{ next }}{% endif %}">
					{% block login_button_label %}
						{% trans 'Proceed with login' %}
					{% endblock %}
				</a>
			{% endblock %}
		</div>
	</body>
</html>
