/* ==========================================================================
   WTR Accessibility Widget
   1) The widget (button + panel)   2) Site adjustments switched on by classes on <html>
   Every site rule skips the widget itself: :not(#wtr-a11y):not(#wtr-a11y *):not(#wtr-a11y-filter)
   ========================================================================== */

/* ---------- 1. Widget ---------- */
#wtr-a11y {
	--wtr-a11y-color: #0F6B56;
	--wtr-a11y-ink: #0F1A24;
	--wtr-a11y-muted: #5B6670;
	--wtr-a11y-line: #E2E6E9;
	position: fixed;
	z-index: 2147483000;
	bottom: var(--wtr-a11y-bottom, 24px);
	right: var(--wtr-a11y-side, 20px);
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	font-size: 14px;
	line-height: 1.35;
	letter-spacing: normal;
	word-spacing: normal;
	text-align: left;
	color: var(--wtr-a11y-ink);
	-webkit-font-smoothing: antialiased;
}
#wtr-a11y.wtr-a11y--left { right: auto; left: var(--wtr-a11y-side, 20px); }
#wtr-a11y *, #wtr-a11y *::before, #wtr-a11y *::after { box-sizing: border-box; }
#wtr-a11y { isolation: isolate; }
#wtr-a11y svg { display: block; flex: 0 0 auto; }
#wtr-a11y .wtr-a11y__sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Floating button */
#wtr-a11y .wtr-a11y__toggle {
	position: relative; display: grid; place-items: center; width: 56px; height: 56px; margin: 0; padding: 0;
	border: 3px solid #FFFFFF; border-radius: 50%; background: var(--wtr-a11y-color); color: #FFFFFF; cursor: pointer;
	box-shadow: 0 10px 26px -8px rgba(0, 0, 0, .45), 0 0 0 4px color-mix(in srgb, var(--wtr-a11y-color) 22%, transparent);
	transition: transform .2s ease, box-shadow .2s ease;
}
#wtr-a11y .wtr-a11y__toggle:hover { transform: scale(1.07); background: var(--wtr-a11y-color); color: #FFFFFF; }
#wtr-a11y .wtr-a11y__toggle:focus-visible { outline: 3px solid #FFB020; outline-offset: 3px; }
#wtr-a11y .wtr-a11y__toggle-ico { width: 30px; height: 30px; }
#wtr-a11y .wtr-a11y__toggle-ico g { stroke-width: 2.1; }
#wtr-a11y .wtr-a11y__badge {
	position: absolute; top: -2px; right: -2px; width: 14px; height: 14px; border: 2px solid #FFFFFF; border-radius: 50%;
	background: #FFB020; display: none;
}
#wtr-a11y .wtr-a11y__toggle.has-active .wtr-a11y__badge { display: block; }

/* Panel */
#wtr-a11y .wtr-a11y__panel {
	position: absolute; bottom: 70px; right: 0; width: 392px; max-width: calc(100vw - 24px);
	max-height: calc(100vh - var(--wtr-a11y-bottom, 24px) - 96px); overflow-y: auto; overscroll-behavior: contain;
	padding: 0 0 14px; background: #FFFFFF; border-radius: 16px;
	box-shadow: 0 30px 70px -20px rgba(0, 0, 0, .45), 0 0 0 1px rgba(15, 26, 36, .06);
	animation: wtr-a11y-in .22s ease-out;
}
#wtr-a11y.wtr-a11y--left .wtr-a11y__panel { right: auto; left: 0; }
#wtr-a11y .wtr-a11y__panel[hidden] { display: none; }
@keyframes wtr-a11y-in { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }

#wtr-a11y .wtr-a11y__head {
	position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 10px;
	padding: 16px 16px 16px 18px; background: var(--wtr-a11y-color); color: #FFFFFF; border-radius: 16px 16px 0 0;
}
#wtr-a11y .wtr-a11y__title { display: flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 700; color: #FFFFFF; }
#wtr-a11y .wtr-a11y__head-ico { width: 26px; height: 26px; padding: 3px; border-radius: 50%; background: rgba(255, 255, 255, .18); }
#wtr-a11y .wtr-a11y__close {
	display: grid; place-items: center; width: 36px; height: 36px; margin: 0; padding: 0; border: 0; border-radius: 50%;
	background: rgba(255, 255, 255, .16); color: #FFFFFF; cursor: pointer;
}
#wtr-a11y .wtr-a11y__close:hover { background: rgba(255, 255, 255, .3); color: #FFFFFF; }
#wtr-a11y .wtr-a11y__close:focus-visible { outline: 3px solid #FFB020; outline-offset: 2px; }
#wtr-a11y .wtr-a11y__close svg { width: 20px; height: 20px; }
#wtr-a11y .wtr-a11y__hint { margin: 14px 18px 12px; font-size: 13px; line-height: 1.5; color: var(--wtr-a11y-muted); }

#wtr-a11y .wtr-a11y__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 0 16px; }
#wtr-a11y .wtr-a11y__tile {
	position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 7px;
	min-height: 104px; margin: 0; padding: 16px 6px 12px; border: 1.5px solid var(--wtr-a11y-line); border-radius: 12px;
	background: #F7F8F8; color: var(--wtr-a11y-ink); font: inherit; text-align: center; text-transform: none; cursor: pointer;
	transition: border-color .15s ease, background-color .15s ease, transform .15s ease;
}
#wtr-a11y .wtr-a11y__tile:hover { border-color: var(--wtr-a11y-color); background: #FFFFFF; color: var(--wtr-a11y-ink); transform: translateY(-1px); }
#wtr-a11y .wtr-a11y__tile:focus-visible { outline: 3px solid #FFB020; outline-offset: 2px; }
#wtr-a11y .wtr-a11y__tile.is-on {
	border-color: var(--wtr-a11y-color); background: color-mix(in srgb, var(--wtr-a11y-color) 9%, #FFFFFF); color: var(--wtr-a11y-ink);
}
#wtr-a11y .wtr-a11y__ico { width: 28px; height: 28px; color: var(--wtr-a11y-color); }
#wtr-a11y .wtr-a11y__label { font-size: 12.5px; font-weight: 600; line-height: 1.25; color: var(--wtr-a11y-ink); }
#wtr-a11y .wtr-a11y__meta { min-height: 14px; font-size: 11px; font-weight: 600; line-height: 1.2; color: var(--wtr-a11y-color); }
#wtr-a11y .wtr-a11y__dots { display: flex; gap: 4px; margin-top: auto; }
#wtr-a11y .wtr-a11y__dot { width: 16px; height: 4px; border-radius: 4px; background: #D5DADE; }
#wtr-a11y .wtr-a11y__dot.is-on { background: var(--wtr-a11y-color); }
#wtr-a11y .wtr-a11y__check {
	position: absolute; top: 7px; right: 7px; display: none; place-items: center; width: 18px; height: 18px; border-radius: 50%;
	background: var(--wtr-a11y-color); color: #FFFFFF;
}
#wtr-a11y .wtr-a11y__tile.is-on .wtr-a11y__check { display: grid; }
#wtr-a11y .wtr-a11y__check-ico { width: 12px; height: 12px; }
#wtr-a11y .wtr-a11y__check-ico g { stroke-width: 3; }

#wtr-a11y .wtr-a11y__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px 0; }
#wtr-a11y .wtr-a11y__reset {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 46px; margin: 0; padding: 10px 16px;
	border: 0; border-radius: 10px; background: var(--wtr-a11y-ink); color: #FFFFFF; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
}
#wtr-a11y .wtr-a11y__reset:hover { background: var(--wtr-a11y-color); color: #FFFFFF; }
#wtr-a11y .wtr-a11y__reset:focus-visible { outline: 3px solid #FFB020; outline-offset: 2px; }
#wtr-a11y .wtr-a11y__reset svg { width: 18px; height: 18px; }
#wtr-a11y .wtr-a11y__statement { font-size: 13px; font-weight: 600; color: var(--wtr-a11y-color); text-decoration: underline; }
#wtr-a11y .wtr-a11y__kbd { margin-left: auto; font-size: 12px; color: var(--wtr-a11y-muted); }
#wtr-a11y kbd { display: inline-block; padding: 1px 6px; border: 1px solid var(--wtr-a11y-line); border-bottom-width: 2px; border-radius: 4px; background: #F7F8F8; font: inherit; font-size: 11px; color: var(--wtr-a11y-ink); }

@media (max-width: 600px) {
	#wtr-a11y { bottom: var(--wtr-a11y-bottom-mobile, 18px); right: 14px; }
	#wtr-a11y.wtr-a11y--left { left: 14px; }
	#wtr-a11y .wtr-a11y__toggle { width: 52px; height: 52px; }
	#wtr-a11y .wtr-a11y__panel {
		position: fixed; left: 8px; right: 8px; bottom: 8px; width: auto; max-width: none; max-height: calc(100vh - 16px); max-height: calc(100dvh - 16px);
	}
	#wtr-a11y .wtr-a11y__grid { gap: 8px; padding: 0 12px; }
	#wtr-a11y .wtr-a11y__tile { min-height: 96px; padding: 14px 4px 10px; }
	#wtr-a11y .wtr-a11y__label { font-size: 12px; }
	#wtr-a11y .wtr-a11y__kbd { display: none; }
}
@media (max-width: 767px) {
	#wtr-a11y.wtr-a11y--hide-mobile { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	#wtr-a11y .wtr-a11y__panel { animation: none; }
}
@media print { #wtr-a11y, .wtr-a11y-guide, .wtr-a11y-mask { display: none !important; } }

/* Reading guide & mask */
.wtr-a11y-guide {
	position: fixed; top: 0; left: 0; right: 0; z-index: -1; height: 12px; display: none; pointer-events: none;
	background: rgba(255, 176, 32, .35); border-top: 3px solid #FFB020; border-bottom: 3px solid #1A1A1A;
}
.wtr-a11y-mask {
	position: fixed; left: 0; right: 0; z-index: -1; display: none; pointer-events: none; background: rgba(0, 0, 0, .62);
}
.wtr-a11y-mask--top { top: 0; }
.wtr-a11y-mask--bottom { bottom: 0; }

/* ---------- 2. Site adjustments ---------- */

/* Text spacing (letters & words) */
html.wtr-a11y-spacing-1 body :not(#wtr-a11y):not(#wtr-a11y *):not(#wtr-a11y-filter) { letter-spacing: .03em !important; word-spacing: .08em !important; }
html.wtr-a11y-spacing-2 body :not(#wtr-a11y):not(#wtr-a11y *):not(#wtr-a11y-filter) { letter-spacing: .07em !important; word-spacing: .16em !important; }
html.wtr-a11y-spacing-3 body :not(#wtr-a11y):not(#wtr-a11y *):not(#wtr-a11y-filter) { letter-spacing: .12em !important; word-spacing: .24em !important; }

/* Readable font (icon fonts are left alone) */
html.wtr-a11y-readable-font body :not(#wtr-a11y):not(#wtr-a11y *):not(#wtr-a11y-filter):not(i):not([class*="fa-"]):not([class*="eicon"]):not([class*="icon-"]):not(.dashicons):not(svg):not(svg *) {
	font-family: Verdana, Tahoma, "Segoe UI", Arial, sans-serif !important;
}

/* Highlight links / titles */
html.wtr-a11y-links body a:not(#wtr-a11y *) {
	outline: 2px solid #FFB020 !important; outline-offset: 2px !important; text-decoration: underline !important; text-underline-offset: 3px !important;
}
html.wtr-a11y-titles body :is(h1, h2, h3, h4, h5, h6, .elementor-heading-title):not(#wtr-a11y *) {
	outline: 2px dashed #FFB020 !important; outline-offset: 4px !important;
}

/* Stronger keyboard focus */
html.wtr-a11y-focus body *:focus:not(#wtr-a11y *) {
	outline: 3px solid #FFB020 !important; outline-offset: 3px !important; box-shadow: 0 0 0 7px rgba(255, 176, 32, .35) !important;
}

/* Text alignment */
html.wtr-a11y-align-left body :is(p, h1, h2, h3, h4, h5, h6, li, td, th, label, blockquote, figcaption, .elementor-widget-container, .elementor-heading-title):not(#wtr-a11y *) { text-align: left !important; }
html.wtr-a11y-align-center body :is(p, h1, h2, h3, h4, h5, h6, li, td, th, label, blockquote, figcaption, .elementor-widget-container, .elementor-heading-title):not(#wtr-a11y *) { text-align: center !important; }
html.wtr-a11y-align-right body :is(p, h1, h2, h3, h4, h5, h6, li, td, th, label, blockquote, figcaption, .elementor-widget-container, .elementor-heading-title):not(#wtr-a11y *) { text-align: right !important; }

/* Pause animations & transitions (incl. tickers, marquees, carousels driven by CSS) */
html.wtr-a11y-pause body *:not(#wtr-a11y):not(#wtr-a11y *):not(#wtr-a11y-filter),
html.wtr-a11y-pause body *:not(#wtr-a11y):not(#wtr-a11y *):not(#wtr-a11y-filter)::before,
html.wtr-a11y-pause body *:not(#wtr-a11y):not(#wtr-a11y *):not(#wtr-a11y-filter)::after {
	animation: none !important; transition: none !important;
}
html.wtr-a11y-pause { scroll-behavior: auto !important; }
html.wtr-a11y-pause .elementor-invisible { visibility: visible !important; }

/* Hide images (decorative icons stay) */
html.wtr-a11y-hide-images body :is(img, picture, video, figure img, [role="img"]):not(#wtr-a11y *) { visibility: hidden !important; }

/* Big cursor */
html.wtr-a11y-cursor-black, html.wtr-a11y-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='M8 4l30 17-12.5 3.4 7.4 14.8-5.6 2.8-7.4-14.8L8 37z' fill='%23000' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 8 4, auto !important;
}
html.wtr-a11y-cursor-white, html.wtr-a11y-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='M8 4l30 17-12.5 3.4 7.4 14.8-5.6 2.8-7.4-14.8L8 37z' fill='%23fff' stroke='%23000' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 8 4, auto !important;
}

/* Colour filters (saturation / invert) – combined so they can be used together */
html.wtr-a11y-saturation-low { --wtr-a11y-sat: saturate(.45); }
html.wtr-a11y-saturation-high { --wtr-a11y-sat: saturate(2); }
html.wtr-a11y-saturation-mono { --wtr-a11y-sat: grayscale(1); }
html.wtr-a11y-contrast-invert { --wtr-a11y-inv: invert(1) hue-rotate(180deg); }
/* A fixed, click-through layer filters everything below it. (Filtering the page itself would
   break position:fixed elements such as headers, chat and WhatsApp buttons.) */
#wtr-a11y-filter { position: fixed; inset: 0; z-index: 2147482900; display: none; pointer-events: none; }
html:is(.wtr-a11y-saturation-low, .wtr-a11y-saturation-high, .wtr-a11y-saturation-mono, .wtr-a11y-contrast-invert) #wtr-a11y-filter {
	display: block;
	-webkit-backdrop-filter: var(--wtr-a11y-inv, ) var(--wtr-a11y-sat, );
	backdrop-filter: var(--wtr-a11y-inv, ) var(--wtr-a11y-sat, );
}
/* Inverted page: pre-flip photos & videos so they look natural under the inverting layer */
html.wtr-a11y-contrast-invert body :is(img, picture, video, iframe):not(#wtr-a11y *) { filter: invert(1) hue-rotate(180deg); }

/* Dark contrast – text colours everywhere; backgrounds only where the site paints one (marked by the script) */
html.wtr-a11y-contrast-dark body { background-color: #000000 !important; color: #FFFFFF !important; }
html.wtr-a11y-contrast-dark body :not(#wtr-a11y):not(#wtr-a11y *):not(#wtr-a11y-filter):not(img):not(svg *):not(video) {
	color: #FFFFFF !important; border-color: #FFFFFF !important; text-shadow: none !important;
}
html.wtr-a11y-contrast-dark body [data-wtr-a11y-bg]:not(#wtr-a11y *),
html.wtr-a11y-contrast-dark body :is(input, textarea, select, button):not(#wtr-a11y *) {
	background-color: #000000 !important; background-image: none !important;
}
html.wtr-a11y-contrast-dark body :is(a, a *):not(#wtr-a11y *) { color: #FFEB3B !important; }
html.wtr-a11y-contrast-dark body :is(button, .elementor-button, input[type="submit"]):not(#wtr-a11y *) { border: 2px solid #FFEB3B !important; }
html.wtr-a11y-contrast-dark body :is(input, textarea, select):not(#wtr-a11y *) { border: 2px solid #FFFFFF !important; }
html.wtr-a11y-contrast-dark body ::placeholder { color: #CCCCCC !important; }

/* Light contrast */
html.wtr-a11y-contrast-light body { background-color: #FFFFFF !important; color: #000000 !important; }
html.wtr-a11y-contrast-light body :not(#wtr-a11y):not(#wtr-a11y *):not(#wtr-a11y-filter):not(img):not(svg *):not(video) {
	color: #000000 !important; border-color: #000000 !important; text-shadow: none !important;
}
html.wtr-a11y-contrast-light body [data-wtr-a11y-bg]:not(#wtr-a11y *),
html.wtr-a11y-contrast-light body :is(input, textarea, select, button):not(#wtr-a11y *) {
	background-color: #FFFFFF !important; background-image: none !important;
}
html.wtr-a11y-contrast-light body :is(a, a *):not(#wtr-a11y *) { color: #0000CC !important; text-decoration: underline !important; }
html.wtr-a11y-contrast-light body :is(button, .elementor-button, input[type="submit"]):not(#wtr-a11y *) { border: 2px solid #000000 !important; }
html.wtr-a11y-contrast-light body ::placeholder { color: #444444 !important; }

/* Read-aloud mode: show which text can be clicked */
html.wtr-a11y-tts body :is(p, h1, h2, h3, h4, h5, h6, li, a, button, label, .elementor-heading-title, .elementor-icon-box-title, .elementor-icon-box-description):not(#wtr-a11y *):hover {
	outline: 2px solid color-mix(in srgb, #FFB020 80%, transparent) !important; outline-offset: 2px; cursor: help;
}
#wtr-a11y .wtr-a11y__btn-ico { color: currentColor; }
