/* AMS Magic Login block. Styled to sit alongside the native login form, with the
   action button matched to the site's primary "Log in" button (red pill, uppercase). */

.aml-block { margin: 16px 0; font-size: 14px; }

.aml-block .aml-label { display: block; font-weight: 700; font-size: 15px; margin: 0 0 2px; }
.aml-block .aml-hint { display: block; color: #666; font-size: 12px; line-height: 1.45; margin: 0 0 10px; }

/* Field and button share a row and match heights (align-items: stretch). The
   field flexes down so the button can sit to its right even in a narrow column. */
.aml-row { display: flex; gap: 8px; align-items: stretch; flex-wrap: wrap; }
.aml-block input.aml-email,
.aml-block input.aml-code {
  flex: 1 1 120px; min-width: 0;
  padding: 12px 14px; border: 1px solid #ccc; border-radius: 6px;
  font-size: 15px; background: #fff; color: #333;
}
.aml-block input.aml-code {
  flex: 1 1 110px; letter-spacing: 4px; font-family: Consolas, Menlo, monospace;
}

/* Matches the site's primary Log in button: red pill, uppercase, bold. */
.aml-block .aml-send,
.aml-block .aml-verify {
  flex: 0 0 auto;
  background: #b82025; color: #fff;
  border: 0; border-radius: 200px;
  padding: 14px 18px;
  font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px;
  cursor: pointer; white-space: nowrap; line-height: 1;
}
.aml-block .aml-send:hover,
.aml-block .aml-verify:hover { background: #911a1e; }
.aml-block .aml-send:disabled,
.aml-block .aml-verify:disabled { opacity: .55; cursor: default; }

.aml-block .aml-resend {
  display: inline-block; margin-top: 10px;
  background: none; border: 0; padding: 4px 0;
  color: #b82025; font-size: 13px; cursor: pointer;
}
.aml-block .aml-resend[disabled] { color: #999; cursor: default; }

.aml-divider {
  display: flex; align-items: center; gap: 12px; margin: 16px 0;
  color: #888; font-size: 11px; text-transform: uppercase; letter-spacing: .1em;
}
.aml-divider::before, .aml-divider::after { content: ""; flex: 1; border-top: 1px solid #ddd; }

.aml-msg { margin: 10px 0 0; font-size: 13px; }
.aml-msg:empty { display: none; }
.aml-msg.aml-error { color: #b32d2e; }
.aml-done-copy { margin: 4px 0 0; font-weight: 600; }

.aml-block *:focus-visible { outline: 2px solid #b82025; outline-offset: 1px; }