/**
 * Flare design tokens — buttons, forms, spacing.
 * Include on key pages for consistent touch targets and spacing.
 */
:root {
  /* Touch targets: min 44px for primary actions (accessibility) */
  --flare-btn-min-height: 44px;
  --flare-btn-padding-y: 0.75rem;
  --flare-btn-padding-x: 1.25rem;
  --flare-btn-border-radius: 10px;
  --flare-input-min-height: 44px;
  --flare-input-padding: 0.65rem 0.85rem;
  --flare-input-border-radius: 8px;
  /* Spacing scale (4px base) */
  --flare-space-1: 0.25rem;  /* 4px */
  --flare-space-2: 0.5rem;   /* 8px */
  --flare-space-3: 0.75rem;  /* 12px */
  --flare-space-4: 1rem;     /* 16px */
  --flare-space-5: 1.25rem;  /* 20px */
  --flare-space-6: 1.5rem;   /* 24px */
  --flare-space-8: 2rem;     /* 32px */
}

/* Apply min-height to primary buttons when this file is loaded */
.flare-btn-primary,
button.btn-primary,
.btn.btn-primary {
  min-height: var(--flare-btn-min-height);
  padding-top: var(--flare-btn-padding-y);
  padding-bottom: var(--flare-btn-padding-y);
  padding-left: var(--flare-btn-padding-x);
  padding-right: var(--flare-btn-padding-x);
  border-radius: var(--flare-btn-border-radius);
}

/* Form controls: consistent min-height for touch */
.flare-form-control,
input.form-control:not([type="checkbox"]):not([type="radio"]),
select.form-control,
textarea.form-control {
  min-height: var(--flare-input-min-height);
  padding: var(--flare-input-padding);
  border-radius: var(--flare-input-border-radius);
}

textarea.form-control {
  min-height: 5rem;
}