/* Signup form (site/tmpl/signup/default.php) — Slack-style single
   vertical card, decided 2026-09-08 (user reference: Slack's own
   "Enter your email" screen). Generic frontend Bootstrap classes handle
   the field layout itself (see the plan's own "Stile del form
   frontend" decision) — this file only covers what Bootstrap alone
   doesn't: card centering, the OR divider, and the social-button row.
   The password toggle and slug preview are now real Bootstrap
   input-groups (2026-09-08 revision, user feedback linking
   https://getbootstrap.com/docs/5.3/forms/input-group/) — no custom
   positioning CSS needed for either any more. */

.jplusapp-signup {
	display: flex;
	justify-content: center;
	padding: 2rem 1rem;
}

.jplusapp-signup-card {
	width: 100%;
	max-width: 28rem;
}

.jplusapp-signup-card h1 {
	font-size: 1.5rem;
	text-align: center;
	margin-bottom: 1.5rem;
}

.jplusapp-signup-divider {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 1.5rem 0;
	color: var(--bs-secondary-color, #6c757d);
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.jplusapp-signup-divider::before,
.jplusapp-signup-divider::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var(--bs-border-color, #dee2e6);
}

.jplusapp-social-buttons {
	display: flex;
	gap: 0.75rem;
}

.jplusapp-social-buttons .btn {
	flex: 1;
}

.jplusapp-signup-login-hint {
	text-align: center;
	margin: 1.5rem 0 0;
	font-size: 0.9rem;
	color: var(--bs-secondary-color, #6c757d);
}