/* =============================================================================
   Acacia Center for Justice — Accessibility module styles
   Loads sitewide (see inc/assets.php). Contains ONLY the skip link and the
   focus treatment for its target. No element-level selectors, no brand or
   button overrides.

   Colors mirror the Blog/REDA/Timeline tokens (#174337 green, #c2561a
   orange). White on #174337 is 11.08:1; #c2561a outline on white is 4.53:1.
   ============================================================================= */

.acj-a11y-skip-link {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100000;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* :focus rather than :focus-visible — the link must appear whenever it holds focus. */
.acj-a11y-skip-link:focus {
	position: fixed;
	top: 0.75rem;
	left: 0.75rem;
	width: auto;
	height: auto;
	padding: 0.75rem 1.25rem;
	margin: 0;
	overflow: visible;
	clip: auto;
	clip-path: none;
	white-space: normal;
	background: #174337;
	color: #ffffff;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.3;
	text-decoration: underline;
	text-underline-offset: 0.2em;
	outline: 3px solid #c2561a;
	outline-offset: 2px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
}

/* The skip target only receives a temporary tabindex="-1" (see acj-a11y.js);
   it is not a control, so it should not draw a page-sized focus ring. */
#page-content[tabindex="-1"]:focus {
	outline: none;
}