/* ==========================================================================
   Devon Rex Adoption — Enquiry form (Fluent Forms, restyled to the brand)
   ========================================================================== */

.e-con.dr-formcard {
  background: #fff;
  border: 1px solid var(--dr-line);
  border-radius: var(--dr-r-card);
  box-shadow: var(--dr-shadow-sm);
}

.dr-formcard .dr-el-h3 { margin-bottom: .2rem; }

/* --------------------------------------------------------------- Layout */

.fluentform .ff-el-group { margin-bottom: 1.15rem; }
.fluentform .ff-el-group:last-of-type { margin-bottom: 0; }

.fluentform .ff-t-container { gap: 1rem; display: flex; flex-wrap: wrap; }
.fluentform .ff-t-cell { flex: 1 1 220px; min-width: 0; }

/* ---------------------------------------------------------------- Labels */

.fluentform .ff-el-input--label label {
  font-family: var(--dr-font-brand);
  font-size: .875rem;
  font-weight: 600;
  letter-spacing: -0.004em;
  color: var(--dr-ink);
  margin-bottom: .4rem;
  display: inline-block;
}
.fluentform .ff-el-is-required.asterisk-right label:after {
  content: " *";
  color: var(--dr-copper);
  font-weight: 600;
}

.fluentform .ff-el-help-message {
  font-family: var(--dr-font-body);
  font-size: .78rem;
  color: var(--dr-muted);
  line-height: 1.5;
  margin-top: .3rem;
}

/* ---------------------------------------------------------------- Inputs */

.fluentform .ff-el-form-control {
  font-family: var(--dr-font-body);
  font-size: .95rem;
  color: var(--dr-ink);
  background: var(--dr-mist);
  border: 1px solid var(--dr-line);
  border-radius: var(--dr-r-sm);
  padding: .78rem .95rem;
  width: 100%;
  line-height: 1.5;
  box-shadow: none;
  transition: border-color .18s var(--dr-ease), background-color .18s var(--dr-ease), box-shadow .18s var(--dr-ease);
}

.fluentform .ff-el-form-control::placeholder {
  color: #8E867F;
  opacity: 1;
}

.fluentform .ff-el-form-control:hover { border-color: #DCD4CC; }

.fluentform .ff-el-form-control:focus,
.fluentform .ff-el-form-control:focus-visible {
  outline: none;
  background: #fff;
  border-color: var(--dr-copper);
  box-shadow: 0 0 0 3px rgba(169, 96, 59, .14);
}

.fluentform textarea.ff-el-form-control { min-height: 140px; resize: vertical; }

/* ----------------------------------------------------------------- Error */

.fluentform .ff-el-is-error .ff-el-form-control { border-color: #B3402F; background: #FDF6F4; }
.fluentform .error, .fluentform .text-danger, .fluentform .error-text {
  font-family: var(--dr-font-body);
  font-size: .8rem;
  color: #B3402F;
  margin-top: .32rem;
}

/* ---------------------------------------------------------------- Submit */

.fluentform .ff-btn-submit,
.fluentform .ff_btn_style {
  font-family: var(--dr-font-brand) !important;
  font-size: .95rem !important;
  font-weight: 600 !important;
  letter-spacing: .004em;
  background: var(--dr-copper) !important;
  color: #fff !important;
  border: 1px solid transparent !important;
  border-radius: var(--dr-r-pill) !important;
  padding: .92rem 2rem !important;
  line-height: 1.2;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(23,20,18,.06), 0 8px 20px rgba(169,96,59,.22);
  transition: transform .22s var(--dr-ease), background-color .22s var(--dr-ease), box-shadow .22s var(--dr-ease);
}
.fluentform .ff-btn-submit:hover,
.fluentform .ff_btn_style:hover {
  background: var(--dr-copper-deep) !important;
  transform: translateY(-2px);
  box-shadow: 0 2px 4px rgba(23,20,18,.07), 0 14px 30px rgba(169,96,59,.28);
}
.fluentform .ff-btn-submit:focus-visible { outline: 2px solid var(--dr-copper); outline-offset: 4px; }

.fluentform .ff-el-group.ff-text-left { margin-top: 1.4rem; }

/* Loading state must be visible, not just a disabled button */
.fluentform .ff_submitting .ff-btn-submit { opacity: .72; cursor: progress; transform: none; }

/* -------------------------------------------------------- Success notice */

.fluentform .ff-message-success,
.ff-message-success {
  background: var(--dr-copper-wash);
  border: 1px solid var(--dr-copper-line);
  border-radius: var(--dr-r);
  padding: 1.3rem 1.45rem;
  color: var(--dr-slate);
  font-family: var(--dr-font-body);
  font-size: var(--dr-t-sm);
  line-height: 1.68;
}
.ff-message-success strong,
.ff-message-success p:first-child {
  font-family: var(--dr-font-brand);
  color: var(--dr-ink);
}

/* ------------------------------------------------------------ Responsive */

@media (max-width: 560px) {
  .fluentform .ff-t-container { display: block; }
  .fluentform .ff-t-cell { margin-bottom: 1.15rem; }
  .fluentform .ff-t-cell:last-child { margin-bottom: 0; }
  .fluentform .ff-btn-submit { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .fluentform .ff-btn-submit:hover { transform: none; }
}

/* iOS zooms the viewport whenever a focused field is under 16px. Locking the
   control font to 16px on touch widths keeps the page from jumping on tap. */
@media (max-width: 782px) {
  .fluentform .ff-el-form-control,
  .fluentform input[type="text"],
  .fluentform input[type="email"],
  .fluentform input[type="tel"],
  .fluentform textarea,
  .fluentform select {
    font-size: 16px;
  }
}

/* Comfortable touch targets for the submit control */
@media (max-width: 782px) {
  .fluentform .ff-btn-submit { min-height: 48px; }
  .fluentform .ff-el-form-control { min-height: 48px; }
  .fluentform textarea.ff-el-form-control { min-height: 140px; }
}
