/* NexDerm forms — large fields, strong labels, high-contrast focus.
   Ordinary forms never collect PHI (see 09_COMPLIANCE). */

.nd-form {
  display: grid;
  gap: 1.25rem;
}

@media (min-width: 48em) {
  .nd-form { grid-template-columns: 1fr 1fr; }
  .nd-form .nd-field--full { grid-column: 1 / -1; }
}

.nd-field { display: flex; flex-direction: column; gap: 0.4rem; }

.nd-field label {
  font-weight: 600;
  font-size: var(--nd-text-small);
  color: var(--nd-charcoal);
}

.nd-field .nd-hint {
  font-size: var(--nd-text-label);
  color: var(--nd-slate);
}

/* Labels, hints, and checkbox copy must stay legible on dark sections */
.nd-tone-ink .nd-field label,
.nd-tone-teal .nd-field label,
.nd-tone-ink .nd-checkbox,
.nd-tone-teal .nd-checkbox {
  color: var(--nd-white);
}

.nd-tone-ink .nd-field .nd-hint,
.nd-tone-teal .nd-field .nd-hint,
.nd-tone-ink .nd-field .nd-error,
.nd-tone-teal .nd-field .nd-error {
  color: var(--nd-silver);
}

.nd-field input[type="text"],
.nd-field input[type="email"],
.nd-field input[type="tel"],
.nd-field select,
.nd-field textarea {
  font: inherit;
  color: var(--nd-charcoal);
  background: var(--nd-white);
  border: 1px solid var(--nd-slate);
  border-radius: var(--nd-radius-small);
  padding: 0.8rem 0.9rem;
  min-height: 3rem;
  width: 100%;
  transition: border-color var(--nd-transition-fast);
}

.nd-field textarea { min-height: 7rem; resize: vertical; }

.nd-field input:hover,
.nd-field select:hover,
.nd-field textarea:hover { border-color: var(--nd-charcoal); }

.nd-field input:focus-visible,
.nd-field select:focus-visible,
.nd-field textarea:focus-visible {
  outline: 3px solid var(--nd-gold);
  outline-offset: 2px;
  border-color: var(--nd-teal);
}

/* Error state — charcoal text + leading gold marker, no new colors */
.nd-field.has-error input,
.nd-field.has-error select,
.nd-field.has-error textarea { border-color: var(--nd-charcoal); border-width: 2px; }

.nd-field .nd-error {
  display: flex;
  gap: 0.4rem;
  font-size: var(--nd-text-small);
  font-weight: 600;
  color: var(--nd-charcoal);
  margin-top: 0.4rem;
}

.nd-field .nd-error::before {
  content: "!" / "";
  flex: 0 0 auto;
  font-family: var(--nd-font-interface);
  color: var(--nd-gold);
}

.nd-checkbox {
  display: flex;
  gap: 0.6rem;
  align-items: flex-start;
  font-size: var(--nd-text-small);
}

/* Honeypot — visually removed, present for bots */
.nd-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.nd-notice--success {
  border-color: var(--nd-gold);
  font-weight: 600;
}

.nd-notice:focus { outline: none; }

.nd-checkbox input {
  width: 1.15rem;
  height: 1.15rem;
  margin-top: 0.2rem;
  accent-color: var(--nd-teal);
  flex-shrink: 0;
}
