@import "https://assets.elements.dev/assets/app/shared/styles/page.dfd96fede8be9a37.css";

/* /signup is a thin page on top of <AuthPage> + <FormField>. The
   shared templates own the layout — this stylesheet just covers the
   page-local pieces (the inline form-error banner, the submit-button
   spacing). The "Already have an account?" alt link is now the page
   subtitle handled by AuthPage. */

.signup-page .signup-subtitle {
  margin: 0;
}

/* "Already have an account? Sign in" wraps as one piece, never leaving
   "Sign in" alone on a line. */
.signup-signin {
  white-space: nowrap;
}

/* The code step, as on /install. */
.signup-p {
  margin: 0 0 var(--space-4);
}

.signup-alt {
  margin: 0 0 var(--space-4);
  font-size: 0.9375rem;
  color: var(--ink-soft);
}

.signup-code {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  max-width: var(--form-width);
  margin: 0 0 var(--space-4);
}

.signup-code-input {
  width: 100%;
  font-family: var(--font-mono);
  font-size: 1.25rem;
  letter-spacing: 0.2em;
  text-align: center;
}

.signup-code .button {
  width: 100%;
  justify-content: center;
}

.signup-code-error {
  margin: 0 0 var(--space-4);
  font-size: 0.9375rem;
  color: var(--danger, #b42318);
}

button.signup-resend {
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  color: var(--accent-deep);
  cursor: pointer;
}

button.signup-resend:disabled {
  color: var(--ink-soft);
  cursor: default;
}