/* IL Accessibility – toolbar and feature styles. */

/* ---------- Screen-reader only ---------- */
.ilacc-sr {
	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;
}

/* ---------- Skip link (WCAG 2.4.1) ---------- */
.ilacc-skip-link {
	position: fixed !important;
	top: 8px !important;
	inset-inline-start: 8px !important;
	z-index: 2147483647 !important;
	padding: 12px 18px !important;
	background: #000 !important;
	color: #fff !important;
	font: 700 16px/1.3 Arial, sans-serif !important;
	text-decoration: underline !important;
	border: 3px solid #ffbf00 !important;
	border-radius: 4px !important;
	transform: translateY(-200%) !important;
}
.ilacc-skip-link:focus {
	transform: none !important;
	outline: 3px solid #fff !important;
	outline-offset: 2px !important;
}

/* ---------- Toolbar shell (fixed px sizes so page scaling never affects it) ---------- */
.ilacc-root {
	--ilacc-text: #1a1a1a;
	--ilacc-muted: #4a4a4a;
	--ilacc-bg: #ffffff;
	--ilacc-surface: #f2f4f7;
	--ilacc-border: #6b7280;
	position: fixed;
	bottom: var(--ilacc-offset, 20px);
	z-index: 2147483646;
	font-family: Arial, "Segoe UI", Helvetica, sans-serif;
	font-size: 16px;
	line-height: 1.4;
	letter-spacing: normal;
	word-spacing: normal;
	text-align: start;
}
.ilacc-root.ilacc-side-right { right: 16px; }
.ilacc-root.ilacc-side-left { left: 16px; }
.ilacc-root *,
.ilacc-root *::before,
.ilacc-root *::after { box-sizing: border-box; }

.ilacc-icon { width: 24px; height: 24px; flex: 0 0 auto; display: block; }

/* Trigger: white ring + soft shadow separate the button from the page */
.ilacc-trigger {
	all: unset;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--ilacc-color, #0b4ea2);
	color: var(--ilacc-on-color, #fff);
	border: 3px solid #fff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .35);
	cursor: pointer;
}
.ilacc-trigger .ilacc-icon { width: 34px; height: 34px; }
.ilacc-trigger:hover { filter: brightness(1.12); }
.ilacc-trigger:focus-visible,
.ilacc-root button:focus-visible,
.ilacc-root a:focus-visible {
	outline: 3px solid #ffbf00 !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 6px #000 !important;
}

/* Panel */
.ilacc-panel {
	position: absolute;
	bottom: 68px;
	width: 360px;
	max-width: calc(100vw - 32px);
	max-height: calc(100vh - var(--ilacc-offset, 20px) - 92px);
	overflow: auto;
	background: var(--ilacc-bg);
	color: var(--ilacc-text);
	border: 2px solid #000;
	border-radius: 10px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .3);
}
.ilacc-panel[hidden] { display: none !important; }
.ilacc-side-right .ilacc-panel { right: 0; }
.ilacc-side-left .ilacc-panel { left: 0; }

.ilacc-header {
	position: sticky;
	top: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 10px 12px 10px 16px;
	background: var(--ilacc-color, #0b4ea2);
	color: var(--ilacc-on-color, #fff);
}
[dir="rtl"] .ilacc-header { padding: 10px 16px 10px 12px; }
.ilacc-title {
	margin: 0 !important;
	font-size: 18px !important;
	font-weight: 700 !important;
	color: inherit !important;
}
.ilacc-close {
	all: unset;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 6px;
	color: inherit;
	cursor: pointer;
}
.ilacc-close:hover { background: rgba(0, 0, 0, .2); }

.ilacc-body { padding: 14px; }

/* Font size row */
.ilacc-fontsize {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 10px 12px;
	margin-bottom: 12px;
	background: var(--ilacc-surface);
	border: 1px solid var(--ilacc-border);
	border-radius: 8px;
}
.ilacc-fs-label { font-weight: 700; font-size: 16px; }
.ilacc-fs-controls { display: flex; align-items: center; gap: 8px; }
.ilacc-fs-btn {
	all: unset;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	background: #fff;
	color: var(--ilacc-text);
	border: 2px solid var(--ilacc-border);
	border-radius: 6px;
	cursor: pointer;
}
.ilacc-fs-btn:hover { border-color: #000; }
.ilacc-fs-btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.ilacc-fs-value { min-width: 48px; text-align: center; font-weight: 700; font-size: 16px; }

/* Option grid */
.ilacc-grid {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
}
.ilacc-grid li { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.ilacc-grid li::before, .ilacc-grid li::marker { content: none !important; }

.ilacc-opt {
	all: unset;
	box-sizing: border-box;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	min-height: 84px;
	padding: 10px 8px;
	background: var(--ilacc-surface);
	color: var(--ilacc-text);
	border: 2px solid var(--ilacc-border);
	border-radius: 8px;
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.25;
	cursor: pointer;
}
.ilacc-opt:hover { border-color: #000; }
.ilacc-opt-label { display: block; }

/* Pressed: color + border thickness + check mark (not color alone – WCAG 1.4.1) */
.ilacc-opt[aria-pressed="true"] {
	background: var(--ilacc-color, #0b4ea2);
	color: var(--ilacc-on-color, #fff);
	border: 3px solid #000;
}
.ilacc-check {
	position: absolute;
	top: 6px;
	inset-inline-end: 6px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	display: none;
	background: #fff;
	border: 2px solid #000;
}
.ilacc-check::after {
	content: "";
	position: absolute;
	left: 5px;
	top: 1px;
	width: 5px;
	height: 10px;
	border: solid #000;
	border-width: 0 3px 3px 0;
	transform: rotate(45deg);
}
.ilacc-opt[aria-pressed="true"] .ilacc-check { display: block; }

/* Footer */
.ilacc-footer {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 0 14px 14px;
}
.ilacc-reset,
.ilacc-statement-link {
	all: unset;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	padding: 8px 12px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
}
.ilacc-reset { background: #fff; color: var(--ilacc-text); border: 2px solid var(--ilacc-border); }
.ilacc-reset:hover { border-color: #000; }
.ilacc-statement-link { color: #0b3d91 !important; text-decoration: underline !important; border: 2px solid transparent; }
.ilacc-statement-link:hover { background: var(--ilacc-surface); }
.ilacc-hint { margin: 0 !important; font-size: 13px !important; color: var(--ilacc-muted) !important; text-align: center; }

/* Reading guide */
div.ilacc-guide-bar {
	position: fixed;
	left: 0;
	right: 0;
	height: 12px;
	margin-top: -6px;
	background: rgba(255, 191, 0, .45);
	border-top: 3px solid #000;
	border-bottom: 3px solid #000;
	pointer-events: none;
	z-index: 2147483645;
}
div.ilacc-guide-bar[hidden] { display: none !important; }

/* Footer statement link */
.ilacc-footer-link-wrap { text-align: center; padding: 12px 16px; background: #fff; }
.ilacc-footer-link { color: #0b3d91 !important; text-decoration: underline !important; font: 16px/1.4 Arial, sans-serif !important; }

/* Mobile: panel spans the screen */
@media (max-width: 480px) {
	.ilacc-panel {
		position: fixed;
		left: 8px !important;
		right: 8px !important;
		bottom: calc(var(--ilacc-offset, 20px) + 68px);
		width: auto;
		max-width: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ilacc-root * { transition: none !important; animation: none !important; }
}

/* Windows high contrast / forced colors */
@media (forced-colors: active) {
	.ilacc-trigger, .ilacc-opt, .ilacc-fs-btn, .ilacc-reset { border: 2px solid ButtonText; }
	.ilacc-opt[aria-pressed="true"] { outline: 3px solid Highlight; }
}

/* =====================================================================
   Page features – every selector excludes the toolbar itself.
   ===================================================================== */

/* Readable font */
html.ilacc-readable-font body :not(.ilacc-root, .ilacc-root *, i, .fa, .fas, .far, .fab, [class^="fa-"], [class*=" fa-"], [class*="icon"], .dashicons, code, pre, kbd, samp) {
	font-family: Arial, Helvetica, "Segoe UI", sans-serif !important;
}

/* Dark contrast */
html.ilacc-contrast-dark,
html.ilacc-contrast-dark body,
html.ilacc-contrast-dark body :not(.ilacc-root, .ilacc-root *, img, video, svg, svg *, picture, iframe, canvas) {
	background-color: #000 !important;
	background-image: none !important;
	color: #fff !important;
	border-color: #fff !important;
	text-shadow: none !important;
	box-shadow: none !important;
}
html.ilacc-contrast-dark body a:not(.ilacc-root *),
html.ilacc-contrast-dark body a:not(.ilacc-root *) * {
	color: #ffff00 !important;
	text-decoration: underline !important;
}
html.ilacc-contrast-dark body :is(button, input, select, textarea):not(.ilacc-root *) {
	border: 2px solid #fff !important;
}
html.ilacc-contrast-dark ::placeholder { color: #d0d0d0 !important; }

/* Light contrast */
html.ilacc-contrast-light,
html.ilacc-contrast-light body,
html.ilacc-contrast-light body :not(.ilacc-root, .ilacc-root *, img, video, svg, svg *, picture, iframe, canvas) {
	background-color: #fff !important;
	background-image: none !important;
	color: #000 !important;
	border-color: #000 !important;
	text-shadow: none !important;
	box-shadow: none !important;
}
html.ilacc-contrast-light body a:not(.ilacc-root *),
html.ilacc-contrast-light body a:not(.ilacc-root *) * {
	color: #0000c8 !important;
	text-decoration: underline !important;
}
html.ilacc-contrast-light body :is(button, input, select, textarea):not(.ilacc-root *) {
	border: 2px solid #000 !important;
}

/* Grayscale – a filter on the root element does not break position:fixed */
html.ilacc-monochrome { filter: grayscale(100%) !important; }

/* Highlight links */
html.ilacc-highlight-links body a[href]:not(.ilacc-root *, .ilacc-skip-link) {
	background-color: #ffff00 !important;
	color: #000 !important;
	text-decoration: underline !important;
	text-decoration-thickness: 2px !important;
	outline: 2px solid #000 !important;
	outline-offset: 1px !important;
}
html.ilacc-highlight-links body a[href]:not(.ilacc-root *) * { color: #000 !important; }

/* Highlight headings */
html.ilacc-highlight-headings body :is(h1, h2, h3, h4, h5, h6, [role="heading"]):not(.ilacc-root *) {
	outline: 3px solid #0b4ea2 !important;
	outline-offset: 3px !important;
	background-color: #e8f0fe !important;
	color: #000 !important;
}

/* Strong keyboard focus indicator (WCAG 2.4.7) */
html.ilacc-keyboard-nav body *:focus:not(.ilacc-root *) {
	outline: 4px solid #ffbf00 !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 8px #000 !important;
}

/* Stop animations (WCAG 2.2.2). Ends animations at their final state so
   elements that fade in are not left invisible. */
html.ilacc-stop-animations body *:not(.ilacc-root *),
html.ilacc-stop-animations body *:not(.ilacc-root *)::before,
html.ilacc-stop-animations body *:not(.ilacc-root *)::after {
	animation-duration: .001s !important;
	animation-delay: 0s !important;
	animation-iteration-count: 1 !important;
	transition-duration: .001s !important;
	transition-delay: 0s !important;
	scroll-behavior: auto !important;
}
html.ilacc-stop-animations [data-aos] { opacity: 1 !important; transform: none !important; }
html.ilacc-stop-animations marquee { display: block; }

/* Text spacing – exactly the WCAG 1.4.12 values */
html.ilacc-text-spacing body *:not(.ilacc-root, .ilacc-root *) {
	line-height: 1.5 !important;
	letter-spacing: .12em !important;
	word-spacing: .16em !important;
}
html.ilacc-text-spacing body p:not(.ilacc-root *) { margin-bottom: 2em !important; }

/* Large cursors */
html.ilacc-big-cursor-black,
html.ilacc-big-cursor-black * {
	cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M6 3v38l10-10 7 16 7-3-7-16h14z' fill='%23000' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 6 3, auto !important;
}
html.ilacc-big-cursor-white,
html.ilacc-big-cursor-white * {
	cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M6 3v38l10-10 7 16 7-3-7-16h14z' fill='%23fff' stroke='%23000' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 6 3, auto !important;
}