/**
 * Kozaru Honbu - Login / Logout Pages
 *
 * Version: 1.0.0
 *
 * Auth utility pages get their own page module so branding/layout fixes do not
 * leak into dashboards, class schedule, or instructor cards.
 */

body.kozaru-seeded-page-login .kozaru-login-wrap {
	display: grid;
	grid-template-columns: minmax(0, .95fr) minmax(320px, .75fr);
	gap: clamp(1rem, 2vw, 1.5rem);
	align-items: stretch;
}

body.kozaru-seeded-page-login .kozaru-login-card,
body.kozaru-seeded-page-logout .kozaru-command-card {
	position: relative;
	overflow: hidden;
	padding: clamp(1.4rem, 3vw, 2.4rem);
}

body.kozaru-seeded-page-login .kozaru-login-card::after,
body.kozaru-seeded-page-logout .kozaru-command-card::after {
	content: "";
	position: absolute;
	inset: auto -4rem -5rem auto;
	width: 16rem;
	height: 16rem;
	border-radius: 999px;
	background: radial-gradient(circle, rgba(217, 31, 43, .14), transparent 66%);
	pointer-events: none;
}

body.kozaru-seeded-page-login .kozaru-login-card {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 420px;
	background:
		linear-gradient(135deg, rgba(5, 6, 8, .98), rgba(26, 27, 31, .93)),
		radial-gradient(circle at 100% 0%, rgba(217, 31, 43, .36), transparent 38%);
	border: 1px solid rgba(255, 255, 255, .12);
	color: rgba(255, 255, 255, .82);
}

body.kozaru-seeded-page-login .kozaru-login-card h2,
body.kozaru-seeded-page-login .kozaru-login-card .kozaru-command-eyebrow {
	color: #fff;
}

body.kozaru-seeded-page-login .kozaru-login-card p:not(.kozaru-auth-brand):not(.kozaru-command-eyebrow) {
	max-width: 44ch;
	color: rgba(255, 255, 255, .72);
}

body.kozaru-seeded-page-login .kozaru-login-form-card {
	align-self: stretch;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(1.25rem, 3vw, 2rem);
}

body.kozaru-seeded-page-login .kozaru-login-form-card form {
	display: grid;
	gap: .95rem;
	margin: 0;
}

body.kozaru-seeded-page-login .kozaru-login-form-card .login-remember {
	display: flex;
	align-items: center;
	gap: .55rem;
	margin: 0;
}

body.kozaru-seeded-page-login .kozaru-login-form-card .login-submit,
body.kozaru-seeded-page-login .kozaru-login-links {
	margin: .2rem 0 0;
}

body.kozaru-seeded-page-login .kozaru-login-form-card .button {
	width: 100%;
}

body.kozaru-seeded-page-login .kozaru-login-links a,
body.kozaru-seeded-page-logout .kozaru-command-card a:not(.kozaru-button) {
	color: var(--kozaru-crimson-dark);
	font-weight: 800;
}

body.kozaru-seeded-page-logout .kozaru-logout-wrap {
	max-width: 920px;
}

body.kozaru-seeded-page-logout .kozaru-command-card {
	background: linear-gradient(180deg, #fff, #fbfbfc);
	min-height: 360px;
}

body.kozaru-seeded-page-logout .kozaru-command-card h2 {
	font-size: clamp(2rem, 5vw, 3.4rem);
	margin: clamp(1rem, 3vw, 2rem) 0 clamp(1.25rem, 3vw, 2.4rem);
}

body.kozaru-seeded-page-login .kozaru-auth-brand,
body.kozaru-seeded-page-logout .kozaru-auth-brand {
	margin: 0 0 clamp(1rem, 2vw, 1.6rem);
}

body.kozaru-seeded-page-login .kozaru-auth-brand img {
	filter: none;
	max-width: min(100%, 360px);
}

body.kozaru-seeded-page-logout .kozaru-auth-brand img {
	max-width: min(100%, 420px);
}

@media (max-width: 900px) {
	body.kozaru-seeded-page-login .kozaru-login-wrap {
		grid-template-columns: 1fr;
	}

	body.kozaru-seeded-page-login .kozaru-login-card {
		min-height: 0;
	}
}

@media (max-width: 560px) {
	body.kozaru-seeded-page-login .kozaru-login-card,
	body.kozaru-seeded-page-login .kozaru-login-form-card,
	body.kozaru-seeded-page-logout .kozaru-command-card {
		border-radius: 20px;
		padding: 1rem;
	}

	body.kozaru-seeded-page-logout .kozaru-command-card h2 {
		font-size: clamp(1.75rem, 12vw, 2.4rem);
	}
}