/* ==========================================================================
   FoodExL — utilities.

   A small set of single-purpose classes, standing in for the style="" that
   used to be written on the element. Only patterns the app already repeated
   are here: 190 attributes across 63 views said one of these seventeen things.

   Loaded last, because that is the position style="" used to hold: a utility
   should win against the component rule it is correcting. It does not carry
   !important — a component rule with a heavier selector still wins, and where
   that mattered the style="" was left where it was.

   This is not a utility framework and should not grow into one. A new entry
   earns its place by already appearing several times; anything used once
   belongs in the component's own rule.
   ========================================================================== */

.u-fs-11   { font-size: 11px; }
.u-fs-12   { font-size: 12px; }
.u-fw-600  { font-weight: 600; }

.u-m-0     { margin: 0; }
.u-mb-15   { margin-bottom: 15px; }
.u-mb-20   { margin-bottom: 20px; }
.u-mt-6    { margin-top: 6px; }
.u-mt-10   { margin-top: 10px; }
.u-mr-5    { margin-right: 5px; }
.u-mr-6    { margin-right: 6px; }
.u-mr-8    { margin-right: 8px; }

.u-w-full  { width: 100%; }
.u-nowrap  { white-space: nowrap; }
.u-pointer { cursor: pointer; }
.u-nolink  { text-decoration: none; }

/* A label beside the thing it labels: a date under a figure, a branch under a
   name. Small, and the lightest grey in the ramp that still reads at AA. */
.u-meta    { font-size: 11px; color: var(--n-500); }
html.dark .u-meta { color: var(--dk-muted); }

/* A reference the reader copies rather than reads: a booking code, an invoice
   number, an ID. It takes the colour of the sentence it sits in. */
.u-ref     { font-size: .82em; color: inherit; font-weight: 600; letter-spacing: .3px; }