/*
 * Stryvel Forms — status + validation styles. Themeable via --sf-* (neutral fallbacks); a client
 * theme overrides them. The plugin never references client token names.
 * Only the pipeline bits are styled here — the form's own fields stay themed by the client.
 */

:root {
  --sf-error: #c0392b;
  --sf-error-bg: #fdecec;
  --sf-success: #147a5b;
  --sf-success-bg: #e6f5ef;
  --sf-radius: 10px;
}

/* Honeypot — visually and semantically hidden, still submitted. */
.sf-hp {
  position: absolute !important;
  left: -9999px !important;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Status banner (success / error) shown after submit. */
.sf-status {
  border-radius: var(--sf-radius);
  padding: 12px 16px;
  margin: 0 0 16px;
  font-size: 0.95rem;
  line-height: 1.5;
}
.sf-status--success { background: var(--sf-success-bg); color: var(--sf-success); border: 1px solid var(--sf-success); }
.sf-status--error { background: var(--sf-error-bg); color: var(--sf-error); border: 1px solid var(--sf-error); }

/* Per-field error message. */
.sf-error {
  display: block;
  margin-top: 6px;
  color: var(--sf-error);
  font-size: 0.85rem;
  line-height: 1.4;
}

/* Invalid field affordance — works with the theme's own input styling. */
[aria-invalid="true"] {
  border-color: var(--sf-error) !important;
  outline-color: var(--sf-error);
}