/**
 * EMOBILITY FOR ALL - custom account creation / login pages (Phase 26).
 * Registered by public/class-register-page.php and public/class-login-page.php,
 * enqueued only on `/register/` and `/login/` - depends on public.css's
 * design tokens/components (buttons, cards, alerts, inputs, checkboxes).
 * This file only adds the centered single-column auth layout around them.
 *
 * Breakpoints match public.css: sm: 576px  md: 768px  lg: 992px  xl: 1200px
 */

.emobility-auth {
	padding-block: var( --emobility-space-8 );
}

.emobility-auth__layout {
	display: flex;
	justify-content: center;
}

.emobility-auth-card {
	width: 100%;
	max-width: 28rem;
	padding: var( --emobility-space-8 );
}

.emobility-auth-card__header {
	margin-bottom: var( --emobility-space-6 );
	text-align: center;
}

.emobility-auth-card__header h1 {
	margin-bottom: var( --emobility-space-2 );
}

.emobility-auth-form .emobility-field {
	margin-bottom: var( --emobility-space-4 );
}

.emobility-auth-form__row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0 var( --emobility-space-4 );
}

@media ( min-width: 576px ) {
	.emobility-auth-form__row:not( .emobility-auth-form__row--split ) {
		grid-template-columns: 1fr 1fr;
	}
}

.emobility-auth-form__row--split {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var( --emobility-space-2 );
	margin-bottom: var( --emobility-space-6 );
}

.emobility-auth-form__forgot {
	font-size: var( --emobility-text-sm );
}

.emobility-auth-form__submit {
	width: 100%;
}

.emobility-auth-card__footer {
	margin: var( --emobility-space-6 ) 0 0;
	text-align: center;
	color: var( --emobility-color-text-muted );
}

/* Honeypot - same visually/tab-order-hidden-but-still-in-the-DOM approach as
   contact.css's .emobility-contact-form__honeypot. */
.emobility-auth-form__honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}