/* ==========================================================================
   BRIXVEN — Forms
   Every form on the site (contact, newsletter, booking, and Part 3's admin
   panel forms) uses this one set of field styles — never redeclared per form.
   ========================================================================== */

.field {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}

.field label {
  font-size: var(--text-label);
  font-weight: var(--weight-semibold);
  color: var(--color-text);
}

.field input,
.field textarea,
.field select {
  padding: 14px 18px;
  border-radius: var(--radius-input);
  border: 1px solid var(--color-border);
  background: var(--color-card);
  color: var(--color-text);
  font-size: var(--text-small);
  transition: border-color var(--duration-fast) var(--ease-standard),
              box-shadow var(--duration-fast) var(--ease-standard);
}

.field input::placeholder,
.field textarea::placeholder {
  color: var(--color-gray);
}

.field select option {
  background: var(--color-card);
  color: var(--color-text);
}

.field input:focus,
.field textarea:focus,
.field select:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 4px var(--color-primary-tint);
}

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

.field--valid input { border-color: var(--color-success); }
.field--invalid input { border-color: var(--color-danger); }

.field__message {
  font-size: var(--text-label);
}

.field__message--error { color: var(--color-danger); }
.field__message--success { color: var(--color-success); }
