/* Typed date field (DD / MM / YYYY) — www4.gifts.ie/js/bgi/bgiDateField.js + templates/web/shared/date_field.twig.
   Owner-approved values (2026-10-12 mock); docs/plans/2026-10-12-typed-date-field.md. Plain CSS, px only.
   The box keeps the host's own input class (builder .step-input, product page .form-control); this only adds
   width, the 16px font that stops iOS zooming, and tabular figures. Selectors carry [type=text] so they outrank
   the product page's `input[type=text].form-control { font-size: 14px }`. #bd0000 here is the ERROR red, not
   the brand colour, so it stays red on greetings.ie. */
.bgi-date-field input[type=text].bgi-date-field__input { max-width: 220px; font-size: 16px; letter-spacing: 1px; font-variant-numeric: tabular-nums; }
.bgi-date-field input[type=text].bgi-date-field__input::placeholder { letter-spacing: 1px; }
.bgi-date-field.is-error input[type=text].bgi-date-field__input { border-color: #bd0000; }
.bgi-date-field__readback { min-height: 20px; margin-top: 6px; font-size: 14px; line-height: 20px; }
.bgi-date-field__readback:empty { min-height: 0; margin-top: 0; }
.bgi-date-field__readback.is-ok { color: #1b7f3b; font-weight: 600; }
.bgi-date-field__readback.is-err { color: #bd0000; }
.bgi-date-field__readback svg { display: inline-block; width: 16px; height: 16px; vertical-align: -3px; margin-right: 6px; }