/*! Strand UI | MIT License | dillingerstaffing.com */

/* cf: form-field-messages */

/* ── Base ── */
.strand-form-field {
  display: flex;
  flex-direction: column;
  gap: var(--strand-space-2);
}

/* ── Label ── */
.strand-form-field__label {
  font-family: var(--strand-font-mono);
  font-size: var(--strand-text-xs);
  font-weight: var(--strand-weight-medium);
  letter-spacing: var(--strand-tracking-widest);
  text-transform: uppercase;
  color: var(--strand-form-field-label-color, var(--strand-gray-500));
  line-height: var(--strand-leading-snug);
}

.strand-form-field__required {
  color: var(--strand-blue-deep);
  margin-left: var(--strand-space-1);
}

/* ── Control wrapper ── */
.strand-form-field__control {
  display: flex;
  flex-direction: column;
}

/* ── Hint ── */
.strand-form-field__hint {
  margin: 0;
  font-family: var(--strand-font-sans);
  font-size: var(--strand-text-xs);
  color: var(--strand-form-field-hint-color, var(--strand-gray-500));
  line-height: var(--strand-leading-normal);
}

/* ── Error message ── */
.strand-form-field__error {
  margin: 0;
  font-family: var(--strand-font-sans);
  font-size: var(--strand-text-xs);
  color: var(--strand-red-alert-deep);
  line-height: var(--strand-leading-normal);
}

/* ── Success message ── */
.strand-form-field__success {
  margin: 0;
  font-family: var(--strand-font-sans);
  font-size: var(--strand-text-xs);
  color: var(--strand-green-positive-deep);
  line-height: var(--strand-leading-normal);
}