
/* ---------------------------------------------------------------------------
 * 1. Contrast corrections. Measured before -> after, all on WCAG 2.2 AA (4.5:1
 *    for normal text). Colours reuse the site's own palette where one exists.
 * ------------------------------------------------------------------------- */

/* Game-card tier badge: white on #22C55E = 2.28:1 -> white on #15803D = 5.02:1 */
html body .lhgs-tier { background: #15803D; }

/* "Pro" tier variant: white on #f59e0b = 2.15:1 -> white on #96620A = 5.19:1.
   Restated after the base rule above so the variant is not flattened by it. */
html body .lhgs-tier-pro { background: #96620A; }

/* Play label: brand flame #E91E63 on white = 4.35:1 -> #C2185B = 5.87:1.
   #C2185B is NOT a new colour — it is the design system's own --lwh-coral-dark. */
html body .lhgs-play { color: #C2185B; }

/* Duration label: #9aa0ab on white = 2.63:1 -> #5D6472 = 5.95:1 */
html body .lhgs-dur { color: #5D6472; }

/* Search-filter sub-pill: #8a7340 on #FFF4CC = 4.14:1 -> #6B5518 = 6.49:1 */
html body .lhsf__sub { color: #6B5518; }

/* Subject tag: #9a6a12 on #FFF3DA = 4.29:1 -> #7A520A = 6.28:1.
   .lh-tag--stage is intentionally untouched: it already measures 5.77:1. */
html body .lh-tag--subject { color: #7A520A; }

/* Library pills. .pill.free is white on --tl #14B8A6 = 2.49:1 -> #0F766E = 5.47:1.
   .pill.new is --pk #E91E63 on white = 4.35:1 -> #C2185B = 5.87:1.
   The live rule is `.lxe .pill.free` — THREE classes (0,3,0) — not the bare `.pill.free`
   a first pass assumed. `html body .pill.free` is only (0,2,2) and lost, verified in the
   browser. Scoping to `.lxe` restores the win at (0,3,2) without needing !important. */
html body .lxe .pill.free { background: #0F766E; }
html body .lxe .pill.new  { color: #C2185B; border-color: #E9A9C0; }

/* Plans CTA. The component sets .lhpr-cta{color:#fff} (0,1,0) but an inline
   `.lhx3 a{color:inherit}` (0,1,1) outranks it, so the button inherits
   .lhpr{color:#1A1A2E} — dark text on #64258f = 1.79:1. Raising specificity to
   (0,2,x) restores the intended white and returns the button to 9.53:1.
   The --current variant is left alone so "your current plan" stays visually distinct. */
html body .lhpr .lhpr-cta:not(.lhpr-cta--current) { color: #fff; }

/* ---------------------------------------------------------------------------
 * 2. Focus visibility (WCAG 2.2 SC 2.4.7 / 1.4.11).
 *
 *    The theme currently does `input:focus, select:focus, textarea:focus
 *    { outline:none; box-shadow:0 0 0 3px rgba(233,30,99,.1) }` — the outline is
 *    removed and replaced by a 10%-alpha pink glow that is effectively invisible,
 *    and is present in the resting state anyway on some controls.
 *
 *    A single-colour ring cannot work site-wide here: the header is #34136E and
 *    the mega panel is #fff, so any one colour fails on one of them (a dark ring
 *    on the header measures 1.19:1). This uses a DUAL-TONE ring instead — a dark
 *    core with a white halo — which is legible on both:
 *      #1A1A2E core on #ffffff = 17.06:1
 *      #ffffff  halo on #34136E = 14.34:1
 *    so no per-container exception list is needed and nothing can be missed.
 *
 *    :focus-visible is used so mouse users do not see rings on click.
 * ------------------------------------------------------------------------- */

html body a:focus-visible,
html body button:focus-visible,
html body input:focus-visible,
html body select:focus-visible,
html body textarea:focus-visible,
html body summary:focus-visible,
html body [tabindex]:focus-visible,
html body [role="button"]:focus-visible {
	outline: 3px solid #1A1A2E !important;
	outline-offset: 3px !important;
	box-shadow: 0 0 0 6px #FFFFFF !important;
	border-radius: 3px;
}

/* Windows High Contrast / forced-colours: let the OS draw its own indicator
   rather than fighting it with fixed hex values. */
@media (forced-colors: active) {
	html body a:focus-visible,
	html body button:focus-visible,
	html body input:focus-visible,
	html body select:focus-visible,
	html body textarea:focus-visible,
	html body summary:focus-visible,
	html body [tabindex]:focus-visible,
	html body [role="button"]:focus-visible {
		outline: 3px solid CanvasText !important;
		box-shadow: none !important;
	}
}
/*# sourceURL=lh-a11y-contrast-focus-inline-css */
