/* TheaLinks form engine — shared styles for every form.
   Reuses site.css custom properties; adds only what forms need that the
   rest of the (form-free, until now) site never required. */

.thealinks-form-card {
  max-width: var(--content-max-width, 800px);
  margin: 0 auto;
  /* No horizontal padding — the card sits inside the page's own content
     column (e.g. .long-form on /contact/), so the fields align with the
     surrounding section headings and body text rather than inset from them. */
  padding: var(--space-4, 32px) 0;
}

.thealinks-form-card h1 {
  margin-bottom: var(--space-2, 16px);
}

.thealinks-privacy-notice {
  font-size: 0.9em;
  color: var(--color-god-contained, #0A0A0A);
  background: var(--tint-blue, #E7ECF5);
  border: 1px solid var(--color-border, #D9E1ED);
  border-radius: 6px;
  padding: var(--space-2, 16px);
  margin-bottom: var(--space-3, 24px);
}

.thealinks-privacy-notice a {
  color: var(--color-sky-ocean, #2C66A5);
}

.thealinks-consent-notice {
  font-size: 0.85em;
  color: var(--color-god-contained, #0A0A0A);
  opacity: 0.8;
  margin-bottom: var(--space-2, 16px);
}

.thealinks-consent-notice a {
  color: var(--color-sky-ocean, #2C66A5);
}

.thealinks-field {
  margin-bottom: var(--space-3, 24px);
}

.thealinks-field label {
  display: block;
  font-family: var(--font-ui, sans-serif);
  font-weight: 600;
  margin-bottom: var(--space-1, 8px);
}

.thealinks-required {
  color: var(--color-heart-magenta, #A52C66);
}

.thealinks-field-hint {
  font-size: 0.85em;
  color: var(--color-god-contained, #0A0A0A);
  opacity: 0.7;
  margin: var(--space-1, 8px) 0 0;
}

/* Every visible field input, whatever its type (text/email/tel/url/file/…) —
   one selector rather than an enumerated type list that silently drops a
   field the day a new input type is added (as type="url" was). Hidden inputs
   carry the form's plumbing and must not be styled. */
.thealinks-field input:not([type="hidden"]),
.thealinks-field textarea {
  width: 100%;
  font-family: var(--font-body, sans-serif);
  font-size: 1em;
  padding: var(--space-1, 8px) calc(var(--space-1, 8px) * 1.5);
  border: 1px solid var(--color-border, #D9E1ED);
  border-radius: 6px;
  background: var(--input-bg, #FFFFFF);
  color: var(--color-god-contained, #0A0A0A);
  box-sizing: border-box;
}

.thealinks-field input:focus-visible,
.thealinks-field textarea:focus-visible {
  outline: 3px solid var(--color-sky-ocean, #2C66A5);
  outline-offset: 1px;
}

.thealinks-field textarea {
  resize: vertical;
}

/* Honeypot — hidden from sighted users and screen readers alike via
   off-screen positioning, not display:none (some bots specifically skip
   inputs they detect as display:none or type=hidden). */
.thealinks-honeypot {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.thealinks-start-over {
  font-family: var(--font-body, sans-serif);
  color: var(--color-god-contained, #0A0A0A);
  font-size: 0.7rem;
  text-align: right;
  margin: 10px 0;
}

.thealinks-start-over a {
  color: var(--color-sky-ocean, #2C66A5);
}

.thealinks-error {
  color: #8A1F3D;
  background: var(--tint-magenta, #F5E6EE);
  border: 1px solid var(--color-heart-magenta, #A52C66);
  border-radius: 6px;
  padding: var(--space-2, 16px);
  margin-bottom: var(--space-3, 24px);
}
