/* ============================================================================
   DCA — Contact page styles (form controls)
   ----------------------------------------------------------------------------
   Page-scoped stylesheet for the consultation form: submit button, fields,
   labels, and inline validation states. Consumes semantic tokens from
   tokens.css. Load AFTER theme.css on contact.html:
     <link rel="stylesheet" href="assets/css/contact.css">

   WordPress: the form becomes a Contact Form 7 / WPForms / Gravity Forms block;
   these classes map to that plugin's field wrappers. Pairs with
   assets/js/page-contact.js.
   ============================================================================ */

.btn-submit {
  background: var(--dca-color-ink);
  border: var(--dca-border-width) solid var(--dca-color-ink);
  color: var(--dca-color-white);
  padding: 13px var(--dca-space-6);
  text-transform: uppercase;
  font-weight: var(--dca-fw-bold);
  letter-spacing: var(--dca-tracking-wide);
  transition: all var(--dca-transition-base);
  display: block;
  width: 100%;
  font-family: var(--dca-font-body);
  font-size: var(--dca-fs-xs);
  cursor: pointer;
  box-shadow: var(--dca-shadow-accent);
}
.btn-submit:hover:not(:disabled) {
  background: var(--dca-color-secondary);
  border-color: var(--dca-color-secondary);
  box-shadow: var(--dca-shadow-accent-press);
}
.btn-submit:disabled { opacity: .6; cursor: not-allowed; }

.form-field {
  border: var(--dca-border-width) solid var(--dca-color-border-subtle);
  padding: var(--dca-space-2-5) var(--dca-space-3);
  width: 100%;
  font-family: var(--dca-font-body);
  font-size: var(--dca-fs-label);
  background: var(--dca-color-white);
  transition: border-color var(--dca-transition-fast);
  outline: var(--dca-border-width) solid transparent;
  outline-offset: 1px;
}
.form-field:focus { border-color: var(--dca-color-primary); outline-color: var(--dca-c-black-a12); }
.form-field.field-error { border-color: var(--dca-color-secondary); }
.form-field.field-error:focus { outline-color: var(--dca-c-red-a15); }

select.form-field {
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23555' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--dca-space-3) center;
  padding-right: var(--dca-space-8);
}

.form-label {
  font-family: var(--dca-font-body);
  font-size: var(--dca-fs-3xs);
  font-weight: var(--dca-fw-bold);
  text-transform: uppercase;
  letter-spacing: var(--dca-tracking-overline);
  display: block;
  margin-bottom: 5px;
  color: var(--dca-color-text-muted);
}
.error-msg {
  font-family: var(--dca-font-mono);
  font-size: var(--dca-fs-3xs);
  color: var(--dca-color-secondary);
  margin-top: 3px;
  display: none;
}
.field-error ~ .error-msg { display: block; }