/*
 * Front gate redesign, Phase 2 (flag-gated) — accessibility + mobile fold.
 * Conservative by design: spacing, focus, and hierarchy only. The visual
 * redesign proper is Phase 4 (Gate.dc.html canvas), judged against the
 * gate_* funnel events.
 */

/* ── Keyboard focus is visible everywhere on the gate ─────────────── */
.login-layout-sec a:focus-visible,
.login-layout-sec button:focus-visible,
.login-layout-sec input:focus-visible,
.login-layout-sec [role="button"]:focus-visible {
	outline: 2px solid #d6336c;
	outline-offset: 2px;
	border-radius: 4px;
}

/* ── Tap targets: 44px minimum on the controls that matter ────────── */
.login-layout-sec .pep-sso-button,
.login-layout-sec button[type="submit"],
.login-layout-sec input[type="submit"] {
	min-height: 48px;
}
.login-layout-sec a,
.login-layout-sec label {
	min-height: 44px;
	display: inline-flex;
	align-items: center;
}
.login-layout-sec p a {
	min-height: 0; /* body-copy links (privacy/terms) stay inline */
	display: inline;
}
.login-layout-sec input[type="checkbox"] {
	width: 24px;
	height: 24px; /* WCAG 2.5.8 minimum target size */
}

/* ── The h1 the a11y shim promotes keeps the span's visual size ───── */
h1.user-registration-login-title {
	margin: 0 0 4px;
	font-size: 1.75rem;
	line-height: 1.2;
}

/* ── SSO is the primary action; give it weight without breaking
 *    Google's branding rules (white button, colored G) ─────────────── */
.login-layout-sec .pep-sso-button {
	border-width: 2px;
	font-weight: 700;
	box-shadow: 0 1px 4px rgba(24, 37, 48, 0.12);
}

/* ── Mobile fold: compact the trust strip so the form enters the
 *    first viewport on a 812px-tall phone ─────────────────────────── */
@media (max-width: 767px) {
	.login-layout-content-wrap {
		padding-top: 16px;
	}
	.login-layout-logo img {
		max-height: 44px;
		width: auto;
	}
	.login-catalog-mobile-line {
		margin: 6px 0 4px;
		font-size: 0.95rem;
	}
	.login-trust-signal {
		margin: 4px auto 8px;
		gap: 6px;
	}
	.login-trust-signal-text {
		font-size: 0.85rem;
		line-height: 1.35;
	}
	.login-trust-signal-text br {
		display: none;
	}
}

/* ── Inline error text: legible, high-contrast, spaced off the field ─ */
.login-layout-sec .ur-message,
.login-layout-sec .user-registration-error {
	font-size: 0.95rem;
	line-height: 1.4;
	margin-top: 6px;
}