/*
 * Touch-target corrections — WCAG 2.2 SC 2.5.8 (Target Size, Minimum).
 *
 * `scripts/beta-ui.mjs` measures every control and reports anything whose hit
 * area is under 24×24 CSS pixels. Most of what it found is exempt: 2.5.8 does
 * not apply to a link inline in a sentence, which covers the footer's contact
 * address, "Powered by: Naspin Tech", and the two in-body links on the order
 * pages. Those are left alone rather than padded into something the sentence
 * around them did not ask for.
 *
 * What is corrected here is the rest: standalone links, sitting on their own
 * line, that a finger has to find. Measured before this file existed:
 *
 *   Forgot password?      121 × 18   both login pages
 *   ← Return to website   137 × 20   both login pages
 *   Return to CloudCard   152 × 21   card-unavailable
 *
 * The top navigation's Home / About / Contact are also under the minimum and are
 * deliberately **not** touched: the brief puts the established top navigation off
 * limits, and this is the owner's call rather than a lint's.
 *
 * ## Why the box grows rather than an overlay extending it
 *
 * The first attempt put an absolutely positioned `::after` over each link. That
 * is a real fix — a press anywhere in generated content activates its link, and
 * it moves nothing on the page — but `getBoundingClientRect()` returns the
 * anchor's own box, not the overlay's, so the beta suite went on reporting
 * 121 × 18 and the correction was invisible to the only thing measuring it.
 *
 * A fix an audit cannot see is a fix that gets removed by the next person, so
 * the element itself now carries the height. The cost is 6px of extra height on
 * one link and 4px on another, with the text staying exactly where it was
 * — `align-items: center` grows the box around the baseline rather than
 * shifting it. That is well inside what "make these tappable" asks for, and
 * unlike the overlay it is the same measurement a browser, an auditor and the
 * suite all take.
 */

.cc-tap {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  justify-content: center;
}

/* ------------------------------------------------------------------
   The card-unavailable and unlock back link.

   `.card-unlock__back` is `display: block` in `card-unlock-v1.css`, which is
   extracted verbatim and never hand-edited; this sheet loads after it. A block
   element can take the height directly, so it gets a real 24px line box rather
   than an overlay — simpler, and it keeps the centred text where it was.
   ------------------------------------------------------------------ */

.card-unlock__back {
  display: flex;
  min-height: 24px;
  align-items: center;
  justify-content: center;
}