/* CSS variable bridge — maps index.html naming (--color-*) to dashboard/onboarding naming (--bg/--border/etc).
 * Uses var(--x, fallback) so each bridge var only activates when the target var is absent on the page.
 * The inline <style> :root on each page runs after this stylesheet and wins for any var it defines explicitly.
 */
:root {
  --color-bg:      var(--bg, #ffffff);
  --color-border:  var(--border, #e2e8f0);
  --color-text:    var(--text, #1a202c);
  --color-primary: var(--accent, #2AABEE);
  --font-b:        var(--font-body, inherit);
}

/* Canonical form-control dimensions — SSOT
 * Extracted from src/public/index.html (.stub-station-inp, .stub-field input[type=date], .stub-field select rule):
 *   font-size:     14px
 *   padding:       9px 12px
 *   border-radius: 8px
 *   border-width:  1px  (border-style: solid)
 *   outline:       none
 *   box-sizing:    border-box
 *   height/line-height: unset — natural height ~41px (14px font + 18px v-padding + 2px border)
 * Verified identical in onboarding.html (input,select rule) and dashboard.html (input,select,textarea rule).
 * Colour, background, font-family, focus colour, and transition remain per-surface in inline <style>.
 * No select chevron override — index.html does not use -webkit-appearance:none.
 */

.form-control {
  width: 100%;
  font-size: 14px;
  padding: 9px 12px;
  border-radius: 8px;
  border-width: 1px;
  border-style: solid;
  outline: none;
  box-sizing: border-box;
}

/* Stepper container — aligns +/- buttons flush with .form-control natural height */
.form-control-stepper {
  display: flex;
  align-items: center;
  height: 41px;
}