/*
 * Purity — Contact Form 7 additions
 * ============================================================================
 * Loaded only when a CF7 form is picked in the Enquiry tab, after main.css.
 * main.css is not changed: this file only handles the elements CF7 adds around
 * the Purity markup (built by purity_cf7_reshape()), the states the design
 * doesn't define (errors, success/failure message), and extra content some
 * forms have (e.g. a consent checkbox).
 *
 * Error colour #ff7a73 = 7.5:1 on the enquiry navy (WCAG AAA). The site's
 * usual #fa0800 is only 4.6:1 there.
 */

.pu-enquiry {
  --pu-enquiry-error: #ff7a73;
}

/* CF7's wrapper around the form: no box of its own. */
.pu-enquiry .wpcf7 {
  display: contents;
}

/* CF7's hidden inputs would otherwise take the first grid cell. */
.pu-enquiry__form .hidden-fields-container {
  display: none;
}

/* Screen-reader announcements (errors / success): kept, but not visible. */
.pu-enquiry .screen-reader-response {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* The span CF7 wraps around each input. */
.pu-enquiry__form .wpcf7-form-control-wrap {
  position: relative;
  display: block;
}

/* Errors. */
.pu-enquiry__input.wpcf7-not-valid {
  border-color: var(--pu-enquiry-error);
}

.pu-enquiry__form .wpcf7-not-valid-tip {
  display: block;
  margin-top: 6px;
  padding: 0 20px;
  color: var(--pu-enquiry-error);
  font-size: 0.875rem;
  line-height: 1.25rem;
}

@media (max-width: 768px) {
  .pu-enquiry__form .wpcf7-not-valid-tip {
    padding: 0 25px;
  }
}

/* While sending, or disabled by CF7 (e.g. consent not ticked yet). */
.pu-enquiry__submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.pu-enquiry__form.submitting .pu-enquiry__submit {
  opacity: 0.6;
  cursor: progress;
}

/* Extra content a form may have (consent, notes, extra fields): full width. */
.pu-enquiry__form .pu-enquiry__extra,
.pu-enquiry__form .pu-enquiry__field--extra,
.pu-enquiry__form .pu-enquiry__actions {
  grid-column: 1 / -1;
  margin: 0;
}

.pu-enquiry__form .pu-enquiry__extra {
  color: var(--pu-enquiry-ink);
  font-size: 0.875rem;
  line-height: 1.375rem;
}

.pu-enquiry__form .pu-enquiry__extra p {
  margin: 0;
}

.pu-enquiry__form .pu-enquiry__extra a {
  color: inherit;
  text-decoration: underline;
}

.pu-enquiry__form .pu-enquiry__extra a:focus-visible {
  outline: 2px solid var(--pu-enquiry-blue);
  outline-offset: 2px;
}

.pu-enquiry__form .pu-enquiry__extra .wpcf7-list-item {
  display: block;
  margin: 0;
}

.pu-enquiry__form .pu-enquiry__extra label {
  display: inline-flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
}

.pu-enquiry__form .pu-enquiry__extra input[type="checkbox"],
.pu-enquiry__form .pu-enquiry__extra input[type="radio"] {
  flex: none;
  width: 20px;
  height: 20px;
  margin: 1px 0 0;
  accent-color: var(--pu-enquiry-blue);
}

/* The button on its own row (forms with extra content), as on phones. */
.pu-enquiry__form .pu-enquiry__actions .pu-enquiry__submit {
  position: static;
  min-width: 166px;
  height: 57px;
  border-radius: 100px;
}

/* The message box CF7 adds at the end of the form: a full-width row, hidden
   until there is something to say. Like the rest of the site, it stays hidden
   for field errors (shown under each field) and for a send that redirects. */
.pu-enquiry__form .wpcf7-response-output {
  grid-column: 1 / -1;
  margin: 0;
  padding: 16px 24px;
  border: 1px solid var(--pu-enquiry-rule);
  border-radius: 32px;
  color: var(--pu-enquiry-ink);
  font-size: 1rem;
  line-height: 1.5rem;
  text-align: center;
}

.pu-enquiry__form .wpcf7-response-output:empty,
.pu-enquiry__form.init .wpcf7-response-output,
.pu-enquiry__form.invalid .wpcf7-response-output,
.pu-enquiry__form.sent .wpcf7-response-output {
  display: none;
}

/* Sent, and no redirect applies: show the success message. */
.display-thank-you .pu-enquiry__form.sent .wpcf7-response-output {
  display: block;
}

/* Could not be sent (server, spam check…). */
.pu-enquiry__form.failed .wpcf7-response-output,
.pu-enquiry__form.aborted .wpcf7-response-output,
.pu-enquiry__form.spam .wpcf7-response-output {
  border-color: var(--pu-enquiry-error);
}

/* CF7's reCAPTCHA / Turnstile widgets, if enabled: full-width row. */
.pu-enquiry__form .wpcf7-turnstile,
.pu-enquiry__form .wpcf7-recaptcha {
  grid-column: 1 / -1;
}