{{#
    @name Skip to links
    @desc The first buttons that pop up when a user tabs. This enables them to skip directly to specified areas.
#}}

<!-- statamic-civet-tools::navigation/_skip_links.antlers.html -->
<div class="z-50 text-sm font-bold text-white [&_a]:fixed [&_a]:px-4 [&_a]:py-2 [&_a]:-translate-y-24 [&_a]:opacity-0 [&_a]:top-4 [&_a]:left-8 [&_a]:bg-primary [&_a]:focus-visible:translate-y-0 [&_a]:focus-visible:opacity-100 [&_a]:outline-primary [&_a]:motion-safe:transition-transform">
    {{ if defaults || defaults === null }}
        <a href="#content">{{ trans:strings.skip_to_content }}</a>
    {{ /if }}
    {{ slot}}
</div>
<!-- End: statamic-civet-tools::navigation/_skip_links.antlers.html -->