/*
 * Shared styles for the friendly "we've paused this for a few minutes"
 * lockout banner used by /login, /forgot-password, and /register. Each
 * page already defines the `--clay`, `--muted`, `--foreground`, and
 * `--olive-dark` CSS variables on :root, so this file just consumes them.
 */
.lockout {
  margin-top: 14px; padding: 14px 16px; border-radius: 10px;
  background: rgba(185,116,85,0.08); border: 1px solid rgba(185,116,85,0.2);
  color: var(--foreground); font-size: 13px; line-height: 1.5; display: none;
}
.lockout-title { font-weight: 600; color: var(--clay); margin-bottom: 6px; }
.lockout-countdown { margin-top: 8px; font-size: 12px; color: var(--muted); }
.lockout-countdown strong { color: var(--foreground); font-weight: 600; }
.btn-primary:disabled { opacity: 0.55; cursor: not-allowed; }
.btn-primary:disabled:hover { background: var(--olive-dark); }