/* ============================================================================
   forms.css — Reusable form controls (IAPrompt #33). Prefixed, opt-in.
   ============================================================================ */
.wa-field { display: block; margin-bottom: var(--wa-space-4); }
.wa-label {
  display: block; font-size: var(--wa-fs-xs); font-weight: 600;
  color: var(--wa-text-muted); margin-bottom: var(--wa-space-1);
}
.wa-input, .wa-select, .wa-textarea {
  width: 100%; box-sizing: border-box; padding: 0.55rem 0.7rem;
  border: 1px solid var(--wa-border); border-radius: var(--wa-radius-sm);
  font-size: var(--wa-fs-sm); color: var(--wa-text); background: var(--wa-surface);
  outline: none; transition: border-color var(--wa-transition);
}
.wa-input:focus, .wa-select:focus, .wa-textarea:focus { border-color: var(--wa-blue); }
.wa-textarea { resize: vertical; min-height: 3rem; }

.wa-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--wa-space-4); }
.wa-checkrow { display: flex; align-items: flex-start; gap: var(--wa-space-2); font-size: var(--wa-fs-sm); }
.wa-checkrow input { width: auto; margin-top: 0.2rem; }
.wa-help { font-size: var(--wa-fs-xs); color: var(--wa-text-faint); }