/**
 * Hísi front form — the enhancer's status line (doc 263).
 *
 * The form itself is built from Hísi atoms; this stylesheet only dresses the status MESSAGE the enhancer
 * injects, so success and error read differently out of the box (as in Bricks/Elementor). Everything is a
 * plain, low-specificity class, so a site can restyle `.hisi-form-status` (or target it with a local class)
 * without a fight. Colors are restrained and semantic, not brand — override freely.
 */
/* :where() → specificity 0, so the `form-status` canonical the class system emits (and any user
   re-theme of it) always wins on the front. This sheet is only the FALLBACK for a never-published
   site; the canonical seeds the same look with real cascade weight (doc 439). */
:where(.hisi-form-status) {
  margin-block-start: 0.75em;
  padding: 0.5em 0.75em;
  border-inline-start: 3px solid transparent;
  border-radius: 3px;
  font-size: 0.95em;
  line-height: 1.4;
}

/* No message yet → take no space (it is appended once, then reused across submits). */
.hisi-form-status:empty {
  display: none;
}

.hisi-form-status--sending {
  color: #555;
  opacity: 0.85;
}

.hisi-form-status--success {
  color: #18794e;
  background: rgba(24, 121, 78, 0.08);
  border-inline-start-color: #18794e;
}

.hisi-form-status--error {
  color: #b3261e;
  background: rgba(179, 38, 30, 0.08);
  border-inline-start-color: #b3261e;
}

/* Per-field server validation (doc 264): the inline message + the invalid control's red edge. Scoped to Hísi
   forms so it never touches another plugin's fields. :where() → the `field-error` canonical wins (doc 439). */
:where(.hisi-field-error) {
  display: block;
  margin-block-start: 0.25em;
  color: #b3261e;
  font-size: 0.85em;
  line-height: 1.4;
}

/* The failing field's red edge. This rule predates the `invalid` STYLE STATE (doc 445 A2): back
   when nothing else could paint it, `form[data-hisi-form] [aria-invalid='true']` was harmless —
   but at (0,2,1) it outranks the `.input[aria-invalid='true']` the class system emits (0,2,0), so
   restyling the state did nothing. It was the last rule in this sheet still fighting the cascade.

   It must land BETWEEN two weights, not at zero: above a plain `.input { border-color }` (0,1,0),
   or a themed site loses the red edge entirely; below `.input[aria-invalid='true']` (0,2,0), so
   the state the user styles always wins. `:where()` drops the ancestor to nothing and the `:is()`
   holds only TYPE selectors — (0,0,1) + the attribute (0,1,0) = (0,1,1). Exactly in between.
   Keep the `:is()` list free of classes/attributes: `:is()` takes its MOST specific argument, so
   one `[role='combobox']` in there would push this back to (0,2,0) and re-open the bug. */
:where(form[data-hisi-form]) :is(input, textarea, select, div)[aria-invalid='true'] {
  border-color: #b3261e;
}

/* The Hisi Select prefab (doc 405): the keyboard-active option's visual. No outline (the theme
   paints none, doc 447) — a quiet tint instead, the hover face's default. `data-active` is
   runtime-only (aria-activedescendant's mirror), NOT a stylable state, so this default is the
   only thing keeping keyboard navigation visible; :where() → any user declaration wins. */
:where([data-hisi-dropdown] [role='option'][data-active]) {
  background: rgba(0, 0, 0, 0.08);
}

/* The honeypot (server-rendered, hidden with or without JS) — [backend-wp/5/3]: `hidden` + this, never `style=`. */
.hisi-hp { display: none !important; }
