/* Accessibilitor — accessibility toolbar. Toolbar colours are fixed (navy on white, 10:1) so it stays readable in every mode. */
#wp-accessibilitor { position: fixed; top: var(--accessibilitor-top, 100px); z-index: 99999; font: 15px/1.4 Tahoma, Verdana, Arial, sans-serif; color: #111; }
#wp-accessibilitor.accessibilitor--left { left: 0; }
#wp-accessibilitor.accessibilitor--right { right: 0; }
#wp-accessibilitor .screen-reader-text { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); border: 0; white-space: nowrap; }
.accessibilitor__toggle { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; padding: 0; border: 0; background: #03418b; color: #fff; cursor: pointer; box-shadow: 0 2px 6px rgba(0,0,0,.35); }
.accessibilitor--left .accessibilitor__toggle { border-radius: 0 6px 6px 0; }
.accessibilitor--right .accessibilitor__toggle { border-radius: 6px 0 0 6px; }
.accessibilitor__toggle:hover, .accessibilitor__toggle:focus-visible { background: #052f66; }
.accessibilitor__toggle:focus-visible, .accessibilitor__btn:focus-visible, .accessibilitor__links a:focus-visible { outline: 3px solid #ffbf00; outline-offset: 2px; }
.accessibilitor__panel { position: absolute; top: 0; width: 280px; max-width: calc(100vw - 60px); max-height: calc(100vh - var(--accessibilitor-top, 100px) - 16px); overflow: auto; background: #fff; color: #111; border: 2px solid #03418b; border-radius: 6px; box-shadow: 0 6px 24px rgba(0,0,0,.25); padding: 12px; }
.accessibilitor--left .accessibilitor__panel { left: 56px; }
.accessibilitor--right .accessibilitor__panel { right: 56px; }
.accessibilitor__title { margin: 0 0 10px; font-family: inherit; font-size: 18px; font-weight: bold; line-height: 1.3; letter-spacing: normal; text-transform: none; color: #03418b; }
.accessibilitor__list, .accessibilitor__links ul { list-style: none; margin: 0; padding: 0; }
.accessibilitor__list li { margin: 0 0 6px; }
.accessibilitor__row { display: flex; gap: 6px; }
.accessibilitor__row .accessibilitor__btn { flex: 1; }
.accessibilitor__btn { display: block; width: 100%; min-height: 40px; padding: 8px 10px; border: 2px solid #03418b; border-radius: 4px; background: #fff; color: #03418b; font: inherit; font-weight: bold; text-align: left; cursor: pointer; }
.accessibilitor__btn:hover { background: #e4ecf6; }
.accessibilitor__btn[disabled] { opacity: .5; cursor: default; }
.accessibilitor__btn[aria-pressed="true"] { background: #03418b; color: #fff; }
.accessibilitor__btn[aria-pressed="true"]::before { content: "✓ "; }
.accessibilitor__btn--reset { border-style: dashed; font-weight: normal; }
.accessibilitor__links { margin-top: 10px; padding-top: 10px; border-top: 1px solid #c9d6e2; }
.accessibilitor__links a { display: block; padding: 6px 0; color: #03418b; text-decoration: underline; font-weight: bold; }
@media (max-width: 600px) { #wp-accessibilitor { top: var(--accessibilitor-top-mobile, 50px); } .accessibilitor__toggle { width: 44px; height: 44px; } .accessibilitor--left .accessibilitor__panel { left: 48px; } .accessibilitor--right .accessibilitor__panel { right: 48px; } }

/* ---- modes (classes on <html>) ---- */
/* Text size: scales everything except the toolbar. Themes can react with container queries (the header/content
   inline size shrinks in CSS px) so menus switch to their mobile layout instead of overflowing. */
html.accessibilitor-fs-1 body > :not(#wp-accessibilitor) { zoom: 1.15; }
html.accessibilitor-fs-2 body > :not(#wp-accessibilitor) { zoom: 1.3; }
html.accessibilitor-fs-3 body > :not(#wp-accessibilitor) { zoom: 1.5; }

/* While a mode is switched on or off (class set by toolbar.js for two frames): no theme transitions, so the page
   does not animate through half-changed colours. */
html.accessibilitor-switching *, html.accessibilitor-switching *::before, html.accessibilitor-switching *::after { transition: none !important; }

/* Grayscale and inverted colours: `filter` on <html>. The root element is the one place where a filter neither
   turns fixed elements (the toolbar, sticky headers) into scrolling ones nor leaves the page background out —
   the canvas background is filtered too. Works in every engine without GPU compositing (backdrop-filter does not). */
html.accessibilitor-grayscale { filter: grayscale(1); }
html.accessibilitor-negative { filter: invert(1); }
html.accessibilitor-grayscale.accessibilitor-negative { filter: grayscale(1) invert(1); }
/* Inverted colours: photos, video, embeds and the toolbar are inverted in advance, so the page filter turns them back
   to normal (invert is exactly reversible; the old invert + hue-rotate was not and turned red into purple). */
html.accessibilitor-negative #wp-accessibilitor,
html.accessibilitor-negative body :is(img, picture, video, iframe, canvas, object, embed, .accessibilitor-keep):not(#wp-accessibilitor *):not(:is(img, picture, video, iframe, canvas, object, embed, .accessibilitor-keep) *) {
	filter: invert(1);
}

/* Text colour via a custom property: links set it to yellow/blue, everything else inherits — no specificity fights. */
html.accessibilitor-contrast body { --accessibilitor-fg: #fff; }
html.accessibilitor-contrast body a { --accessibilitor-fg: #ffff00; text-decoration: underline !important; }
html.accessibilitor-light body { --accessibilitor-fg: #000; }
html.accessibilitor-light body a { --accessibilitor-fg: #0000cc; text-decoration: underline !important; }

/* High contrast: black background, white text, yellow links (21:1 / 19.6:1). Images and video untouched.
   Themes can protect an element that carries content in its background (a video poster, a map) with
   class="accessibilitor-keep"; it and its descendants keep their own colours. */
html.accessibilitor-contrast body,
html.accessibilitor-contrast body *:not(#wp-accessibilitor):not(#wp-accessibilitor *):not(img):not(video):not(iframe):not(svg):not(svg *):not(.accessibilitor-keep):not(.accessibilitor-keep *) {
	background-color: #000 !important; background-image: none !important; color: var(--accessibilitor-fg) !important;
	border-color: #fff !important; text-shadow: none !important; box-shadow: none !important;
}
/* Light background: white background, black text, dark blue links (8.6:1). */
html.accessibilitor-light body,
html.accessibilitor-light body *:not(#wp-accessibilitor):not(#wp-accessibilitor *):not(img):not(video):not(iframe):not(svg):not(svg *):not(.accessibilitor-keep):not(.accessibilitor-keep *) {
	background-color: #fff !important; background-image: none !important; color: var(--accessibilitor-fg) !important;
	border-color: #000 !important; text-shadow: none !important; box-shadow: none !important;
}
/* Decorative pseudo-elements (CSS triangles, bullets, gradients) lose their meaning without the theme colours. */
html.accessibilitor-contrast body *:not(#wp-accessibilitor *):not(.accessibilitor-keep):not(.accessibilitor-keep *)::before,
html.accessibilitor-contrast body *:not(#wp-accessibilitor *):not(.accessibilitor-keep):not(.accessibilitor-keep *)::after,
html.accessibilitor-light body *:not(#wp-accessibilitor *):not(.accessibilitor-keep):not(.accessibilitor-keep *)::before,
html.accessibilitor-light body *:not(#wp-accessibilitor *):not(.accessibilitor-keep):not(.accessibilitor-keep *)::after {
	background-image: none !important; border-color: transparent !important; box-shadow: none !important; text-shadow: none !important;
}
html.accessibilitor-contrast :focus-visible { outline: 3px solid #ffff00 !important; }
html.accessibilitor-light :focus-visible { outline: 3px solid #0000cc !important; }
html.accessibilitor-contrast body button:not(#wp-accessibilitor button):not(.accessibilitor-keep *), html.accessibilitor-contrast body input[type="submit"] { border: 2px solid #fff !important; }
html.accessibilitor-light body button:not(#wp-accessibilitor button):not(.accessibilitor-keep *), html.accessibilitor-light body input[type="submit"] { border: 2px solid #000 !important; }

html.accessibilitor-underline body a:not(#wp-accessibilitor a) { text-decoration: underline !important; }

/* Readable font: Atkinson Hyperlegible Next (Braille Institute, SIL OFL — see fonts/OFL.txt), designed for low
   vision: I/l/1, O/0, b/d/p/q are easy to tell apart. Shipped with the plugin (no font service); browsers only
   download it when the mode is on. Plus the text spacing of WCAG 1.4.12 — line height 1.5, letters 0.12em,
   words 0.16em, paragraphs 2em — which helps readers with dyslexia more than special "dyslexia fonts" do. */
@font-face { font-family: "Accessibilitor Hyperlegible"; font-style: normal; font-weight: 200 800; font-display: swap; src: url("fonts/atkinson-hyperlegible-next-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Accessibilitor Hyperlegible"; font-style: normal; font-weight: 200 800; font-display: swap; src: url("fonts/atkinson-hyperlegible-next-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
/* Icon fonts (Font Awesome, Dashicons, Material, …) keep their font, or the icons turn into letters. */
html.accessibilitor-font body, html.accessibilitor-font body *:not(#wp-accessibilitor):not(#wp-accessibilitor *):not(svg *):not(.fa, .fas, .far, .fab, .fa-solid, .fa-regular, .fa-brands, .dashicons, .genericon, .material-icons, .material-symbols-outlined, .material-symbols-rounded, [class^="icon-"], [class*=" icon-"], [class^="icon "], [class*=" icon "]) {
	font-family: "Accessibilitor Hyperlegible", Verdana, Tahoma, sans-serif !important;
	line-height: 1.5 !important; letter-spacing: 0.12em !important; word-spacing: 0.16em !important;
}
html.accessibilitor-font body p:not(#wp-accessibilitor *) { margin-bottom: 2em !important; }

@media (prefers-reduced-motion: reduce) { #wp-accessibilitor * { transition: none !important; } }
@media print { #wp-accessibilitor { display: none; } }