/* Sawa Coco — Components
   Reusable UI pieces (forms, buttons, …). Values unchanged from the previous
   font-system.css. This will grow as components are standardized (buttons,
   cards, footer widgets) in later Phase 3 steps. */

/* Form elements */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
textarea,
select {
  font-size: var(--fs-base);
}

label {
  font-size: var(--fs-sm);
  font-weight: 500;
}

/* Button */
button,
.button,
input[type="submit"] {
  font-size: var(--fs-base);
}

/* Elementor CTA button — canonical brand style for the design-system layer.
   Every .elementor-button on the site is one filled style (verified uniform
   across all pages: brand-teal fill, white label, 3px radius, 12/24 padding).
   Elementor's exported per-element CSS sets the same values at higher
   specificity via var(--e-global-color-accent) (== --brand-teal), so this rule
   is render-neutral today; it gives the button a single tokenized definition in
   our layer and keeps it correct if the per-element CSS is ever removed. */
.elementor-button {
  background-color: var(--brand-teal);
  color: var(--paper);
  padding: var(--space-3) var(--space-5);
  border-radius: 3px;
}
