/* /signin is a thin page on top of <AuthPage> + <FormField>. The
   layout flows from those templates; this stylesheet only owns the
   page-local pieces (the inline error banner, the Forgot-password
   label-row link, the submit button spacing). The "New to Elements?"
   alt link is now the page subtitle handled by AuthPage. */

.signin-page .signin-subtitle {
  /* Sub-link rendered via <AuthPage> alt-top slot to sit immediately
     under the H1 in the same column. Spacing aligns with the auth-
     shell-head margin so the form starts at the canonical offset. */
  margin: 0;
}

/* Server-side error message rendered immediately above the Sign in
   button (the same place inline FormField errors appear), so the
   user's eye lands on it without scrolling back up. Red foreground
   on a light-red banner — same color tokens as FormField errors. */
.signin-error {
  font-family: var(--font-sans);
  font-size: 0.78125rem;
  color: #b42318;
  background: #fef3f2;
  border: 1px solid #fecdca;
  border-radius: var(--radius-sm);
  padding: 0.625rem 0.875rem;
  margin: 0 0 0.75rem 0;
}

.signin-forgot {
  font-family: var(--font-sans);
  font-size: 0.6875rem;
  color: var(--ink-soft);
  border-bottom: 1px dotted var(--ink-faint);
  padding-bottom: 1px;
}
.signin-forgot:hover { color: var(--accent); border-color: var(--accent); }

.signin-submit {
  margin-top: 0.75rem;
  width: 100%;
}