/*
 * Login – Design wie das CRM (Farben und Schriften aus theme.css)
 *
 * Das HTML in app/Views/login.php entspricht bewusst dem alten Aufbau
 * (.wrapper > .container > form.form, Platzhalter statt Beschriftungen),
 * damit Passwortmanager wie Proton Pass das Formular weiter erkennen.
 * Nur das Aussehen kommt von hier.
 *
 * Schriften lokal: Inter (public/fonts/inter/, OFL)
 *
 * Autor:           Andreas
 * Letzte Änderung: 30.10.2026
 */

@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/inter/inter-regular.woff') format('woff'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/inter/inter-medium.woff') format('woff'); }

* { box-sizing: border-box; }

html, body { height: 100%; margin: 0; }

body {
	background: #f6f6f3;
	color: #1b1b19;
	font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
	font-size: 14px;
	-webkit-font-smoothing: antialiased;
}

.wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100%;
	padding: 24px 16px;
	transition: opacity .3s ease;
}
.wrapper.form-success { opacity: .4; }

.container { width: 100%; max-width: 380px; }

.form {
	background: #fff;
	border: 1px solid #e8e7e2;
	border-radius: 16px;
	padding: 36px 32px 32px;
	box-shadow: 0 24px 64px rgba(27, 27, 25, .06);
}

.form > a { display: block; margin-bottom: 28px; }
.form > a img { display: block; width: 48px; height: 48px; } /* round signet, public/img/logo.png */

.form input {
	display: block;
	width: 100%;
	height: 42px;
	margin: 0 0 12px;
	padding: 0 12px;
	border: 1px solid #d9d8d2;
	border-radius: 8px;
	background: #fff;
	color: #1b1b19;
	font: inherit;
	outline: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.form input::placeholder { color: #8b8a83; }
.form input:focus { border-color: #006370; box-shadow: 0 0 0 3px #e6f0f1; }
.form input:disabled { background: #fafaf8; color: #8b8a83; }

.form button {
	width: 100%;
	height: 42px;
	margin-top: 8px;
	border: 0;
	border-radius: 8px;
	background: #006370;
	color: #fff;
	font: inherit;
	font-weight: 500;
	cursor: pointer;
	transition: background-color .15s ease;
}
.form button:hover { background: #004f59; }
.form button:disabled { opacity: .5; cursor: default; }

.login_error { margin: 4px 0 12px; padding: 10px 12px; border-radius: 8px; background: #fdecea; color: #b42318; font-size: 13px; }