/* =========================================================================
   GI Accessibility — Blind Friendly Mode
   Front-end styles. Zero configuration.
   ========================================================================= */

/* --- Skip to content link -------------------------------------------------
   Hidden off-screen until it receives keyboard focus (Tab), then it slides
   into the top-left corner so a sighted keyboard user can see it too. */
.gi-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 2147483647; /* above everything, incl. sticky headers */
	display: inline-block;
	margin: 0;
	padding: 14px 22px;
	background: #000000;
	color: #ffffff;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: underline;
	border-radius: 0 0 6px 0;
}

.gi-skip-link:focus,
.gi-skip-link:focus-visible {
	left: 0;
	color: #ffffff;
	background: #000000;
	outline: 3px solid #ffbf47; /* high-contrast focus ring */
	outline-offset: 0;
}

/* --- Visible keyboard focus ----------------------------------------------
   Many themes strip focus outlines, which makes a site impossible to use
   with the keyboard. We restore a strong, consistent focus indicator for
   keyboard users only (:focus-visible does not fire on mouse clicks). */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible,
[role="link"]:focus-visible {
	outline: 3px solid #1a73e8 !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 1px #ffffff !important; /* keeps the ring readable on dark backgrounds */
}

/* When the skip link moves focus into the main region, do not paint a
   distracting outline around the whole page body. */
#gi-main-content:focus,
[role="main"]:focus {
	outline: none;
}

/* --- Screen-reader-only utility -------------------------------------------
   Content that should be announced by NVDA / JAWS but not shown visually. */
.gi-sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}
