/**
 * Forms — Quote request, engineering inputs, contact forms
 * Pattern from WMVILLAGE forms.css, adapted for E57
 */

/* Form sections */
.form-section {
  max-width: var(--container-md);
  margin: 0 auto;
  padding: var(--space-xl) var(--space-md);
}

.form-section__title {
  font-size: var(--text-2xl);
  font-weight: var(--font-bold);
  color: var(--color-text);
  margin-bottom: var(--space-sm);
}

.form-section__text {
  font-size: var(--text-base);
  color: var(--color-text-secondary);
  margin-bottom: var(--space-lg);
}

/* Field groups */
.form-group {
  margin-bottom: var(--space-md);
}

.form-group__label {
  display: block;
  font-size: var(--text-sm);
  font-weight: var(--font-semibold);
  color: var(--color-text);
  margin-bottom: var(--space-3xs);
}

.form-group__label--required::after {
  content: " *";
  color: var(--color-secondary);
}

.form-group__input,
.form-group__select,
.form-group__textarea {
  width: 100%;
  padding: var(--space-xs) var(--space-sm);
  font-size: var(--text-base);
  border: var(--border-1) solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-bg);
  transition: border-color var(--duration-fast) var(--ease-precision);
}

.form-group__input:focus,
.form-group__select:focus,
.form-group__textarea:focus {
  border-color: var(--color-primary);
  box-shadow: var(--focus-ring);
  outline: none;
}

.form-group__textarea { min-height: 6rem; resize: vertical; }

.form-group__hint {
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  margin-top: var(--space-3xs);
}

.form-group__error {
  font-size: var(--text-xs);
  color: var(--color-error);
  margin-top: var(--space-3xs);
  display: none;
}

.form-group--invalid .form-group__input { border-color: var(--color-error); }
.form-group--invalid .form-group__error { display: block; }

/* Row layout (2-3 fields side by side) */
.form-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--space-md);
}

/* Conditional sections (Liquid/Gas) */
.form-conditional {
  background: var(--color-surface-2);
  border-radius: var(--radius-lg);
  padding: var(--space-lg);
  margin: var(--space-md) 0;
  border-left: 4px solid var(--color-primary);
}

.form-conditional[hidden] { display: none; }

.form-conditional__title {
  font-size: var(--text-md);
  font-weight: var(--font-semibold);
  margin-bottom: var(--space-md);
}

/* Engineering input units */
.form-group--with-unit {
  position: relative;
}

.form-group__unit {
  position: absolute;
  right: var(--space-sm);
  top: 50%;
  transform: translateY(-50%);
  font-size: var(--text-xs);
  color: var(--color-text-muted);
  pointer-events: none;
}

.form-group--with-unit .form-group__input {
  padding-right: var(--space-2xl);
}

/* Submit area */
.form-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--space-sm);
  padding-top: var(--space-lg);
  border-top: var(--border-1) solid var(--color-border-light);
  margin-top: var(--space-lg);
}

/* Success/error feedback */
.form-feedback {
  padding: var(--space-md);
  border-radius: var(--radius-md);
  margin-bottom: var(--space-md);
}

.form-feedback--success {
  background: var(--color-success-bg);
  border: var(--border-1) solid var(--color-success-border);
  color: var(--color-success-text);
}

.form-feedback--error {
  background: var(--color-error-bg);
  border: var(--border-1) solid var(--color-error-border);
  color: var(--color-error-text);
}