/**
 * Kestrel utilities layer (template.kestrel.utilities): single-purpose helpers, loaded last in
 * the preset (PAGES.md 5). The visually hidden text and the skip link the chrome relies on. The
 * kit's .ts-btn, .ts-btn--outline, .ts-tag and .ts-badge hooks share the .ke-btn, .ke-chip and
 * .ke-badge rules in components.css (one rule set for both names, K40); nothing in joomla.css or
 * community.css restyles them, so they need no later layer.
 *
 * @copyright Copyright (C) 2026 BulaSikku Technologies Private Limited. All rights reserved.
 * @license   GNU General Public License version 2 or later
 */

/* 1. Visually hidden, still read (the search toggle label, the account menu names). ---------- */

.ts-sr-only {
    position: absolute !important;
    inline-size: 1px !important;
    block-size: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    border: 0 !important;
    white-space: nowrap !important;
}

/* 2. Skip link to #ts-main: hidden until focused, then an ink button over the header. -------- */

.ts-skip-link {
    position: absolute;
    inset-block-start: 0.75rem;
    inset-inline-start: 0.75rem;
    z-index: var(--ts-z-toast);
    display: inline-flex;
    align-items: center;
    min-block-size: 2.75rem;
    padding: 0 1rem;
    border-radius: var(--ke-r-control);
    background-color: var(--ke-ink);
    color: var(--ke-on-ink);
    font-family: var(--ke-sans);
    font-size: var(--ke-t-ui);
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
}

.ts-skip-link:not(:focus) {
    inline-size: 1px;
    block-size: 1px;
    min-block-size: 0;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}