/*
 * Keyboard-accessibility affordances for the markup the render shim prints.
 *
 * These rules used to live ONLY in the bundled theme's base.css — but the shim is PLUGIN code and
 * runs under whatever theme the site has active. On a site still running its old theme (an import
 * being reviewed before the switch, say) the stylesheet was absent and the skip link, which is
 * meant to be invisible until focused, rendered as the words "Skip to content" across the top of
 * every Loom page. The plugin prints the markup, so the plugin ships its style.
 *
 * Deliberately tiny and design-neutral: affordances only, no design. Tokens are referenced with
 * fallbacks so this is correct before tokens.css loads, and on a site with no Loom tokens at all.
 */

/* Off-screen until it receives keyboard focus, then it slides into the top-left as the first
   actionable element on the page. `left` (not display:none) keeps it in the tab order — a skip
   link a keyboard can't reach is the one thing it must never be. */
.lm-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100000;
	padding: 0.5rem 1rem;
	background: var(--lm-color-surface, #f8fafc);
	color: var(--lm-color-text, #1e293b);
	text-decoration: none;
	border-radius: var(--lm-radius-md, 8px);
}

.lm-skip-link:focus {
	left: 0.5rem;
	top: 0.5rem;
}

/* The <main> landmark is focusable (tabindex="-1") so the skip link can move focus into it; it
   must not show a focus ring of its own when targeted programmatically. */
#lm-main:focus {
	outline: none;
}