/* ==========================================================================
   cf7-overrides.css — Contact Form 7 integration shim.

   Loaded ONLY on the contact page via inc/cf7-integration.php.
   Targets the CF7-injected wrapper elements so the form renders
   consistently with the locked DESIGN §4.12 layout.

   Selectors:
     .wpcf7-form-control-wrap   — CF7 wraps every input in this <span>
     .wpcf7-response-output     — form status region (all 6 states)
     .wpcf7-not-valid-tip       — per-field inline validation messages
     .wpcf7-form .form__honeypot — hidden honeypot field

   Status states (applied as classes on the <form> element):
     form.init          — page load; no submission yet
     form.sent          — submission accepted
     form.failed        — server-side failure (mail not sent)
     form.aborted       — submission aborted by a filter
     form.spam          — flagged as spam (honeypot / Akismet)
     form.invalid       — client-side validation failure
     form.unaccepted    — terms checkbox not ticked (not used here)

   Reference: https://contactform7.com/styling-contact-form/
   ========================================================================== */

/* ── 1. Strip the inline-block wrapper added by CF7 around every input ── */
.wpcf7-form-control-wrap {
  display: block;
}

/* ── 2. Status region ────────────────────────────────────────────────── */
.wpcf7-response-output {
  padding: 0.75rem 1rem;
  border-radius: 3px;
  margin-block-start: 1rem;
  font-size: 0.9375rem;
  line-height: 1.5;
  /* Hide until there is content (CF7 sets border when the state changes). */
  border: 1px solid transparent;
}

/* Sent (green) */
.wpcf7 form.sent .wpcf7-response-output {
  background: #f0faf4;
  border-color: #5cb85c;
  color: #2d6e35;
}

/* Failed / aborted / spam (amber) */
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output {
  background: #fffbf0;
  border-color: #f0ad4e;
  color: #7a5000;
}

/* Invalid (red; validation errors present) */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
  background: #fff5f5;
  border-color: #d9534f;
  color: #7a1a18;
}

/* ── 3. Per-field validation tips ────────────────────────────────────── */
.wpcf7-not-valid-tip {
  display: block;
  color: #d9534f;
  font-size: 0.8125rem;
  margin-block-start: 0.25rem;
  line-height: 1.4;
}

/* ── 4. Honeypot field — must stay invisible to human visitors ───────── */
/* The [honeypot] form-tag renders a <span> wrapping a hidden text input.
   display:none ensures bots filling the field are caught without any
   UI visible to users.                                                   */
.wpcf7-form .wpcf7-form-control-wrap[data-name="honeypot-trap"],
.wpcf7-form .form__honeypot,
.wpcf7-form span[data-name*="honeypot"] {
  display: none !important;
}

/* ── 5. Spinner shown while CF7 submits via Ajax ─────────────────────── */
.wpcf7 .ajax-loader {
  display: inline-block;
  vertical-align: middle;
  margin-inline-start: 0.5rem;
}