/* Famyro Area Guide — forms v1.0 */
.famyro-field {
  display: grid;
  gap: 8px;
}

.famyro-label {
  font-family: var(--famyro-font-heading);
  font-size: 0.875rem;
  font-weight: 800;
}

.famyro-input,
.famyro-select,
.famyro-textarea {
  width: 100%;
  min-height: 50px;
  padding: 12px 15px;
  border: var(--famyro-border-width) solid var(--famyro-color-ink);
  border-radius: var(--famyro-radius-md);
  background: var(--famyro-color-surface);
  color: var(--famyro-color-ink);
  box-shadow: var(--famyro-shadow-sm);
  transition: border-color var(--famyro-transition-fast), box-shadow var(--famyro-transition-fast);
}

.famyro-textarea {
  min-height: 130px;
  resize: vertical;
}

.famyro-input::placeholder,
.famyro-textarea::placeholder {
  color: var(--famyro-color-muted);
  opacity: 0.8;
}

.famyro-input:focus,
.famyro-select:focus,
.famyro-textarea:focus {
  border-color: var(--famyro-color-green-dark);
  outline: none;
  box-shadow: 5px 5px 0 var(--famyro-color-green-dark);
}

.famyro-field__hint {
  color: var(--famyro-color-muted);
  font-size: 0.8125rem;
}