/*
 * Contact Form 7 styling. Loaded only when the current page contains a form.
 */

.site .wpcf7 {
  --bs-ink: #13241b;
  --bs-green: #1c3a2a;
  --bs-green-hover: #285039;
  --bs-muted: #566057;
  --bs-line: #e6e1d2;
  --bs-control: #8c8672;
  --bs-error: #a3372a;

  box-sizing: border-box;
  width: 100%;
  max-width: 560px;
  margin: 8px auto 72px;
  color: var(--bs-ink);
  text-align: left;
}

.site .wpcf7 *,
.site .wpcf7 *::before,
.site .wpcf7 *::after { box-sizing: border-box; }

.site .wpcf7 form {
  display: flex;
  flex-direction: column;
  padding: clamp(20px, 5vw, 36px);
  border: 1px solid #dfdacb;
  border-radius: 18px;
  background: #fffefa;
}

.site .wpcf7 form > p {
  margin: 0 0 20px;
  padding: 0;
  font-size: 16px;
  line-height: 1.5;
}

/* Field rows first, then the bot check just above the send button, then the result message. */
.site .wpcf7 form > .wpcf7-turnstile { order: 1; margin: 4px 0 20px; max-width: 100%; }
.site .wpcf7 form > p:has(.wpcf7-submit) { order: 2; margin: 0; }
.site .wpcf7 form > .wpcf7-response-output { order: 3; }

.site .wpcf7 label {
  display: block;
  width: 100%;
  margin: 0;
  color: var(--bs-ink);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0;
  text-transform: none;
}

.site .wpcf7 label br { display: none; }
.site .wpcf7 .bagolf-optional { color: var(--bs-muted); font-weight: 400; }
.site .wpcf7 .wpcf7-form-control-wrap { display: block; width: 100%; margin-top: 8px; }

.site .wpcf7 input[type="text"],
.site .wpcf7 input[type="email"],
.site .wpcf7 input[type="tel"],
.site .wpcf7 input[type="url"],
.site .wpcf7 input[type="number"],
.site .wpcf7 input[type="date"],
.site .wpcf7 select,
.site .wpcf7 textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 52px;
  margin: 0;
  padding: 0 16px;
  border: 1px solid var(--bs-control);
  border-radius: 12px;
  background: #fff;
  color: var(--bs-ink);
  /* 16px stops iOS Safari from zooming in when a field gets focus. */
  font-family: inherit;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.4;
  box-shadow: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.site .wpcf7 textarea {
  /* CF7 prints rows="10"; a fixed starting height keeps the form compact, users can still drag it taller. */
  height: 156px;
  min-height: 112px;
  padding: 14px 16px;
  line-height: 1.5;
  resize: vertical;
}

.site .wpcf7 input::placeholder,
.site .wpcf7 textarea::placeholder { color: #697068; opacity: 1; }

.site .wpcf7 input:not(.wpcf7-submit):hover,
.site .wpcf7 textarea:hover { border-color: var(--bs-ink); }

.site .wpcf7 input:not(.wpcf7-submit):focus,
.site .wpcf7 textarea:focus {
  border-color: var(--bs-green);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(28, 58, 42, 0.18);
}

.site .wpcf7 .wpcf7-not-valid {
  border-color: var(--bs-error);
}

.site .wpcf7 .wpcf7-not-valid:focus { box-shadow: 0 0 0 3px rgba(163, 55, 42, 0.16); }

.site .wpcf7 .wpcf7-not-valid-tip {
  display: block;
  margin-top: 6px;
  color: var(--bs-error);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
}

/* Send button: same pill as the booking page. */
.site .wpcf7 form > p:has(.wpcf7-submit) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.site .wpcf7 input.wpcf7-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: none;
  min-height: 52px;
  margin: 0;
  padding: 0 30px;
  overflow: visible;
  border: 0;
  border-radius: 999px;
  background: var(--bs-green);
  color: #f7f5ea;
  font-family: inherit;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: 0;
  text-overflow: clip;
  text-transform: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.site .wpcf7 input.wpcf7-submit:hover,
.site .wpcf7 input.wpcf7-submit:focus {
  background: var(--bs-green-hover);
  color: #f7f5ea;
}

.site .wpcf7 input.wpcf7-submit:focus-visible {
  outline: 2px solid var(--bs-green);
  outline-offset: 3px;
}

.site .wpcf7 input.wpcf7-submit:disabled { opacity: 0.6; cursor: progress; }

.site .wpcf7 .wpcf7-spinner { margin: 0; background-color: var(--bs-green); }

/* Result message under the form. */
.site .wpcf7 form .wpcf7-response-output {
  margin: 20px 0 0;
  padding: 14px 16px;
  border: 1px solid var(--bs-line);
  border-radius: 12px;
  background: #fff;
  color: var(--bs-ink);
  font-size: 15px;
  line-height: 1.5;
}

.site .wpcf7 form.sent .wpcf7-response-output {
  border-color: #b9cfb4;
  background: #e2eadb;
  color: var(--bs-green);
}

.site .wpcf7 form.invalid .wpcf7-response-output,
.site .wpcf7 form.unaccepted .wpcf7-response-output,
.site .wpcf7 form.payment-required .wpcf7-response-output {
  border-color: #e8d3a8;
  background: #f8eed9;
  color: #6f4a12;
}

.site .wpcf7 form.failed .wpcf7-response-output,
.site .wpcf7 form.aborted .wpcf7-response-output,
.site .wpcf7 form.spam .wpcf7-response-output {
  border-color: #ecc8bd;
  background: #f9ebe6;
  color: #6e2419;
}

@media (max-width: 520px) {
  .site .wpcf7 { margin-bottom: 56px; }
  .site .wpcf7 form > p:has(.wpcf7-submit) { position: relative; }
  .site .wpcf7 input.wpcf7-submit { width: 100%; }
  /* A full-width button would push the (hidden) spinner onto its own line; show it inside the button instead. */
  .site .wpcf7 .wpcf7-spinner {
    position: absolute;
    top: 50%;
    right: 16px;
    margin-top: -12px;
    background-color: #f7f5ea;
  }
  .site .wpcf7 .wpcf7-spinner::before { background-color: var(--bs-green); }
}