/*
 * Forms - Hygienize Child
 *
 * Escopado dentro de .hyg-form (nao em seletores globais de
 * input/textarea/select), para nao alterar formularios existentes
 * do WordPress (comentarios, busca) que nao usem esta classe.
 */

.hyg-form {
  display: flex;
  flex-direction: column;
  gap: var(--hyg-space-4);
}

.hyg-form label {
  display: block;
  font-family: var(--hyg-font-family-base);
  font-size: var(--hyg-font-size-small);
  font-weight: var(--hyg-font-weight-medium);
  color: var(--hyg-color-text);
  margin-bottom: var(--hyg-space-1);
}

.hyg-form input[type="text"],
.hyg-form input[type="email"],
.hyg-form input[type="tel"],
.hyg-form input[type="number"],
.hyg-form input[type="password"],
.hyg-form textarea,
.hyg-form select {
  width: 100%;
  padding: var(--hyg-space-3);
  border: 1px solid var(--hyg-color-border);
  border-radius: var(--hyg-radius-md);
  background-color: var(--hyg-color-background);
  color: var(--hyg-color-text);
  font-family: var(--hyg-font-family-base);
  font-size: var(--hyg-font-size-body);
  transition: border-color var(--hyg-transition-base), box-shadow var(--hyg-transition-base);
}

.hyg-form textarea {
  min-height: 120px;
  resize: vertical;
}

.hyg-form input:focus-visible,
.hyg-form textarea:focus-visible,
.hyg-form select:focus-visible {
  outline: none;
  border-color: var(--hyg-color-primary);
  box-shadow: 0 0 0 3px rgba(47, 94, 168, 0.15);
}

.hyg-form .is-invalid {
  border-color: var(--hyg-color-error) !important;
}
.hyg-form .is-valid {
  border-color: var(--hyg-color-success) !important;
}

.hyg-form__hint {
  font-family: var(--hyg-font-family-base);
  font-size: var(--hyg-font-size-small);
}
.hyg-form__hint--error { color: var(--hyg-color-error); }
.hyg-form__hint--success { color: var(--hyg-color-success); }