/* MLS GO Registration - validation and continuation message UX
 * Build: 2026-08-31
 */

/* Inline field validation: keep the explanation next to the field. */
.field-group input[aria-invalid="true"],
.field-group select[aria-invalid="true"],
.field-group textarea[aria-invalid="true"] {
  border: 1px solid var(--danger, #b61d2b) !important;
  box-shadow: 0 0 0 2px rgba(182, 29, 43, 0.08);
}

.field-group input[aria-invalid="true"]:focus,
.field-group select[aria-invalid="true"]:focus,
.field-group textarea[aria-invalid="true"]:focus {
  border-color: var(--danger, #b61d2b) !important;
  box-shadow: 0 0 0 3px rgba(182, 29, 43, 0.14);
}

.field-error {
  margin: 0;
  color: var(--danger, #b61d2b);
  font-size: 0.86rem;
  line-height: 1.35;
  font-weight: 600;
}

/* The top message is a summary/status area. Field-specific errors stay inline. */
#form-message:empty {
  display: none;
}

#form-message.form-message--loading {
  display: block;
  color: #1d2f40;
  background: #f4f7fb;
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  padding: 11px 13px;
  font-weight: 600;
}

#form-message.form-message--success {
  display: block;
  color: #185c37;
  background: #f1f8f4;
  border: 1px solid #b7d7c4;
  border-radius: 12px;
  padding: 11px 13px;
  font-weight: 600;
}

#form-message.form-message--error {
  display: block;
  color: var(--danger, #b61d2b);
  background: #fff5f5;
  border: 1px solid #efb8be;
  border-radius: 12px;
  padding: 11px 13px;
  font-weight: 600;
}

/* Continuation withdrawal controls */
.withdraw-registration-panel {
  margin-top: 24px;
  padding: 16px;
  border: 1px solid rgba(182, 29, 43, 0.18);
  border-radius: 16px;
  background: #fffafa;
}

.withdraw-registration-panel__intro {
  display: grid;
  gap: 4px;
  margin-bottom: 12px;
}

.withdraw-registration-panel__intro strong {
  color: var(--ink, #10131d);
}

.withdraw-registration-panel__intro span,
.withdraw-registration-warning {
  color: var(--muted, #516173);
  line-height: 1.45;
}

.withdraw-registration-form {
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(182, 29, 43, 0.16);
}

.withdraw-field-label {
  font-size: 0.9rem;
  font-weight: 700;
}

.withdraw-input {
  width: 100%;
  border: 1px solid var(--line, #d9dfea);
  border-radius: 12px;
  padding: 11px 12px;
  font: inherit;
  background: #fff;
}

.withdraw-input:focus {
  outline: none;
  border-color: var(--brand, #6f2dbd);
  box-shadow: 0 0 0 3px rgba(111, 45, 189, 0.1);
}

.withdraw-input--invalid {
  border: 1px solid var(--danger, #b61d2b) !important;
  box-shadow: 0 0 0 2px rgba(182, 29, 43, 0.08) !important;
}

.withdraw-inline-message {
  min-height: 1.2em;
  margin: 0;
  color: var(--danger, #b61d2b);
  font-size: 0.88rem;
  font-weight: 600;
}

.withdraw-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.withdraw-final-confirmation {
  margin-top: 4px;
  padding: 14px;
  border: 1px solid rgba(182, 29, 43, 0.28);
  border-radius: 12px;
  background: rgba(182, 29, 43, 0.05);
}

.withdraw-final-confirmation p {
  margin: 0 0 12px;
  line-height: 1.45;
}

.btn-danger {
  border-color: #9f1724;
  background: #b61d2b;
  color: #fff;
}

.btn-danger:hover {
  filter: brightness(0.96);
}