/*
 * Skip-link stacking and positioning for pages whose skip link is styled by
 * Tailwind utilities alone.
 *
 * Those pages write the link as
 *   class="sr-only focus:not-sr-only focus:absolute focus:top-2 ... focus:z-50"
 * and both focus-state utilities in that string are wrong here:
 *
 * 1. focus:z-50 (z-index 50) loses to every fixed layer the shared header
 *    injected by SHARED_DASHBOARD/js/header-embed.js adds -- .he-header 1000,
 *    its dropdowns 1050/1100, .he-search-overlay 100000 -- and .he-header is
 *    `position: fixed; top: 0; height: 3.75rem`, which is exactly the band the
 *    focused link lands in. So the link paints BEHIND the opaque header and a
 *    keyboard user focuses a control they cannot see (WCAG 2.4.7).
 *
 *    A page does not need the shared header to lose this. index.html paints its
 *    own `sticky top-0 z-50` header, which does not beat focus:z-50 but TIES it
 *    and then wins on DOM order, being the later element. Same invisible link,
 *    no shared bundle involved -- which is why this file is linked per page,
 *    not per header.
 *
 *    The value below is the site-wide skip-link value (max int, already used by
 *    .skip-link in css/base.css, css/design-system.css and
 *    css/dashboard-shell.css), NOT a number picked one above today's header
 *    ceiling. Picking the ceiling is how the previous value went stale: 1200
 *    was tuned against a header topping out at 1100, and an upstream sync then
 *    added .he-search-overlay at 100000. The shared bundle ships no skip link
 *    of its own to defer to -- zero /skip/i matches in header-embed.css at the
 *    IS lock (3a7131a4), at the tools checkout HEAD, and at
 *    tools-shared-dashboard origin/main (measured 2026-08-29) -- so the page
 *    owns this one.
 *
 * 2. focus:absolute positions the link against the DOCUMENT, not the viewport,
 *    so once the page is scrolled the focused link sits above the visible area
 *    and no z-index can rescue it. Measured in Chromium with a real wheel
 *    scroll and a real Tab: at scrollY 215 the focused link sat at viewport top
 *    -207 and the browser did not scroll it into view. `position: fixed` is
 *    what fixes that, and it is what .va-skip-link already uses.
 *
 *    Do not go looking for `position: absolute` when reading a broken page in
 *    devtools: on most of these pages the pre-fix computed value was `static`.
 *    .focus\:not-sr-only:focus does set position: static and does tie
 *    .focus\:absolute:focus at (0,2,0) -- but a tie is broken by ORDER, and the
 *    order does not favour static inside Tailwind: in the SERVED bundle
 *    .focus\:absolute:focus is the later rule (offset 1748878 vs 1748713), so
 *    Tailwind alone computes `absolute`. What flips it is a SECOND
 *    .focus\:not-sr-only:focus in static/css/indianshopping-utilities.css:1227,
 *    which pages link after Tailwind. Measured 2026-08-29 in headless Chrome 151
 *    against index.html with /vendors mapped to SHARED_VENDORS: `static` with
 *    that sheet served, `absolute` with it absent. Both values are
 *    document-relative and both fail the same way, which is why the rule below
 *    sets position outright rather than only raising the z-index.
 *
 * This mirrors the rules added for the pages that own a stylesheet
 * (.va-skip-link in css/marketplace-assignments.css, and
 * .marketplace-page > a[href="#main-content"]:focus in css/marketplace.css).
 * The pages linking THIS file have no stylesheet of their own to carry it, so
 * one shared file holds the value for all of them: the next upstream header
 * change is then a one-line edit here rather than a 32-page class-string sweep.
 *
 * This rule cannot be written as a Tailwind class in any case. The bundle that
 * ships is prebuilt and no CDN JIT runs here, and `2147483647` appears in
 * neither the served bundle nor the site-local one, so `focus:z-[2147483647]`
 * would be a dead class leaving the link at `z-index: auto` -- worse than the
 * z-50 it replaced.
 */

/* Offsets, as a FALLBACK only. The specificity here is deliberately (0,1,1) so
 * that any real Tailwind focus offset -- .focus\:top-2:focus, .focus\:top-0:focus,
 * both (0,2,0) -- outranks it and the page keeps the position it asked for. So
 * 16 pages land at 0.5rem via focus:top-2, 14 at 0 via focus:top-0, index.html
 * at 0.25rem via focus:top-1, and this
 * rule is load-bearing on exactly one: app04_returns_approval.html, whose
 * `focus:m-2` is the one offset utility the served bundle does not ship. A
 * fixed element with no declared offset falls back to its static position,
 * which moves with each page's own body padding, so it needs a real value.
 *
 * Check such a claim against the bundle that SHIPS. /vendors/* is answered by
 * the SHARED_VENDORS route at the pinned commit, not by frontend/vendors/ --
 * backend/app/main.py mounts only css, images and icons from frontend/. The two
 * files disagree in both directions, and reading the local one made focus:top-0
 * and focus:left-0 look dead when they are live in production.
 *
 * On the unfocused sr-only link these only move an already-clipped 1px box, so
 * nothing becomes visible. */
a[href="#main-content"] {
    top: 0.5rem;
    left: 0.5rem;
}

/* (0,2,1), which outranks the (0,2,0) Tailwind utilities it has to beat:
 * .focus\:z-50:focus, .focus\:absolute:focus, and .focus\:not-sr-only:focus
 * (that last one sets position: static). */
a[href="#main-content"]:focus {
    position: fixed;
    z-index: 2147483647;
}