/* assets/css/components/_auth-wp.css
 * Login / forgot / reset (LogIn.html) — states the static page didn't have:
 * field + request errors (invisible until there is one), Google button disabled state,
 * image caption (Theme Options), and the "welcome" notice on the plans page.
 * Loaded after pages/_auth.css (and on the plans page after pages/_sign-in.css).
 */

/* Field errors (same look as components/_forms.css) */
.auth-field .field-error { display: none; font-family: var(--font-main); font-size: 15px; line-height: 20px; color: #C0392B; text-align: right; }
.auth-field .field-error:not(:empty) { display: block; }
.auth-field input[aria-invalid="true"] { outline: 2px solid #C0392B; outline-offset: 1px; }

/* Request error (wrong password, too many attempts, expired page…) */
.auth-form-error {
  width: 100%;
  max-width: 506px;
  box-sizing: border-box;
  margin: 0;
  padding: 12px 16px;
  border-radius: 8px;
  background: #FBE3E6;
  color: #8A1C1C;
  font-family: var(--font-main);
  font-size: 16px;
  line-height: 22px;
  text-align: right;
}
.auth-form-error[hidden] { display: none; }

.auth-submit-btn[aria-busy="true"] { cursor: progress; }

/* Google button: not configured → disabled; configured → clickable once Google's script loaded */
.auth-google-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.auth-google-btn[aria-disabled="true"] { cursor: wait; }
.auth-google-btn:focus-visible { outline: 2px solid var(--color-pink-accent); outline-offset: 2px; }

/* Countdown shown by JS (display set inline) */
.auth-countdown { margin: 0; }

/* Image panel caption — only when a title / subtitle is set (הגדרות כלליות → מסכי מערכת) */
.auth-image--caption { flex-direction: column; }
.auth-image__caption { margin-top: 16px; text-align: center; color: var(--color-text-heading); font-family: var(--font-main); }
.auth-image__title { margin: 0 0 6px; font-size: 32px; line-height: 40px; font-weight: 500; }
.auth-image__subtitle { margin: 0; font-size: 20px; line-height: 28px; }

/* Plans page: "welcome" notice after a Google sign-up */
.plans-welcome-notice {
  max-width: 900px;
  margin: 0 auto 24px;
  padding: 16px 24px;
  border-radius: 16px;
  background: #E0EBE2;
  color: #183B51;
  font-family: var(--font-main);
  font-size: 19px;
  line-height: 26px;
  text-align: center;
}