/*
Мост между Contact Form 7 и вёрсткой темы.

Разметку формы задаёт её шаблон в админке, здесь только служебные узлы плагина:
обёртки полей, сообщения валидации и статус отправки. Файл вне @layer, поэтому
побеждает слои темы без повышения специфичности.
*/

.wpcf7 {
  margin: 0;
}

.wpcf7-form {
  display: grid;
  gap: 14px;
}

/* Плагин оборачивает каждое поле в span: он должен вести себя как сам инпут. */
.wpcf7-form-control-wrap {
  display: block;
  min-inline-size: 0;
}

.wpcf7-form .field {
  margin: 0;
}

.wpcf7-not-valid-tip {
  margin-block-start: 4px;
  color: var(--c-bad);
  font-size: 12px;
}

.wpcf7-form-control.wpcf7-not-valid {
  border-color: var(--c-bad);
}

.wpcf7-response-output {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--c-line);
  border-radius: var(--radius-sm);
  background: var(--c-surface-2);
  color: var(--c-text);
  font-size: 13px;
}
.wpcf7-form.invalid .wpcf7-response-output,
.wpcf7-form.unaccepted .wpcf7-response-output,
.wpcf7-form.payment-required .wpcf7-response-output {
  border-color: var(--c-warn);
}
.wpcf7-form.failed .wpcf7-response-output,
.wpcf7-form.aborted .wpcf7-response-output {
  border-color: var(--c-bad);
  color: var(--c-bad);
}
.wpcf7-form.sent .wpcf7-response-output {
  border-color: var(--c-ok);
  color: var(--c-ok);
}
.wpcf7-form.init .wpcf7-response-output,
.wpcf7-form.resetting .wpcf7-response-output,
.wpcf7-form.submitting .wpcf7-response-output {
  display: none;
}

.wpcf7-spinner {
  margin: 0 0 0 8px;
  background: var(--c-muted);
}

.wpcf7 form .wpcf7-submit:disabled {
  background: var(--c-surface-2);
  color: var(--c-muted);
}

.screen-reader-response {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}