/**
 * kbnx-skip-links.css — Skip link styles for bypass blocks.
 *
 * Skip links are visually hidden until focused, then appear at
 * a fixed position at the top-left of the viewport.
 *
 * @see WCAG 2.1 SC 2.4.1 (Bypass Blocks)
 */

.kbnx-skip-link {
    position: absolute;
    left: -9999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    z-index: 100000;
}

.kbnx-skip-link:focus {
    position: fixed;
    top: 8px;
    left: 8px;
    width: auto;
    height: auto;
    padding: 8px 16px;
    background: var(--kbnx-color-bg, #ffffff);
    color: var(--kbnx-color-fg, #1a1a1a);
    border: 2px solid var(--kbnx-focus-ring-color, #1a73e8);
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    text-decoration: none;
    z-index: 100000;
}

@media (forced-colors: active) {
    .kbnx-skip-link:focus {
        border: 2px solid Highlight;
        background: Canvas;
        color: CanvasText;
    }
}