/*
 * DSEO Accessibility Manager · el botón y el panel para el visitante (fase 8a; docs/visitor-toolbar.md).
 * Cada herramienta es una marca en <html> (data-dseo-a11y-*). Nada reescribe la página.
 */

/* ── El botón ─────────────────────────────────────────────────────────────────────────────────── */

.dseo-a11y-open {
	position: fixed;
	z-index: 2147483000;
	left: var(--dseo-a11y-pl, auto);
	right: var(--dseo-a11y-pr, auto);
	top: var(--dseo-a11y-pt, auto);
	bottom: var(--dseo-a11y-pb, auto);
	transform: var(--dseo-a11y-pf, none);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5em;
	min-width: var(--dseo-a11y-sv, 48px);
	min-height: var(--dseo-a11y-sv, 48px);
	padding: 0 .75em;
	margin: 0;
	border: 2px solid var(--dseo-a11y-icon, #fff);
	border-radius: calc(var(--dseo-a11y-sv, 48px) / 2);
	background: var(--dseo-a11y-bg, #0b57d0);
	color: var(--dseo-a11y-icon, #fff);
	font: 600 16px/1.2 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .3);
	cursor: pointer;
}
.dseo-a11y:not(.dseo-a11y--label) .dseo-a11y-open { padding: 0; }
.dseo-a11y-open .dseo-a11y-icon { width: calc(var(--dseo-a11y-sv, 48px) * .55); height: calc(var(--dseo-a11y-sv, 48px) * .55); flex: none; }
.dseo-a11y-open:hover { filter: brightness(1.15); }

/* 0.17.0 · El aspecto, con opciones cerradas (decisión 90). De fábrica: borde fino, círculo, sombra suave. */
.dseo-a11y--border-none .dseo-a11y-open   { border-width: 0; }
.dseo-a11y--border-thick .dseo-a11y-open  { border-width: 4px; }
.dseo-a11y--shape-rounded .dseo-a11y-open { border-radius: 12px; }
.dseo-a11y--shape-square .dseo-a11y-open  { border-radius: 4px; }
.dseo-a11y--shadow-none .dseo-a11y-open   { box-shadow: none; }
.dseo-a11y--shadow-strong .dseo-a11y-open { box-shadow: 0 4px 16px rgba(0, 0, 0, .45); }
.dseo-a11y--hover .dseo-a11y-open:hover   { filter: none; background: var(--dseo-a11y-hover); }

/* El foco, por encima de la sombra elegida. */
.dseo-a11y .dseo-a11y-open:focus-visible,
.dseo-a11y-panel button:focus-visible { outline: 3px solid #111; outline-offset: 3px; box-shadow: 0 0 0 6px #ffd800; }

/*
 * 0.17.0 · Por dispositivo (decisión 88). El PHP pone en la raíz --dseo-a11y-x, -y y -size de escritorio, y
 * -x-t, -y-t, -size-t (tableta, 768 a 980 px) y -x-m, -y-m, -size-m (móvil, hasta 767 px) ya resueltas: lo
 * que no se cambió vale lo de escritorio. Aquí se elige la de cada pantalla. Los cortes son los de Divi.
 */
.dseo-a11y { --dseo-a11y-xv: var(--dseo-a11y-x); --dseo-a11y-yv: var(--dseo-a11y-y); --dseo-a11y-sv: var(--dseo-a11y-size, 48px); }
@media (min-width: 768px) and (max-width: 980px) {
	.dseo-a11y { --dseo-a11y-xv: var(--dseo-a11y-x-t, var(--dseo-a11y-x)); --dseo-a11y-yv: var(--dseo-a11y-y-t, var(--dseo-a11y-y)); --dseo-a11y-sv: var(--dseo-a11y-size-t, var(--dseo-a11y-size, 48px)); }
}
@media (max-width: 767px) {
	.dseo-a11y { --dseo-a11y-xv: var(--dseo-a11y-x-m, var(--dseo-a11y-x)); --dseo-a11y-yv: var(--dseo-a11y-y-m, var(--dseo-a11y-y)); --dseo-a11y-sv: var(--dseo-a11y-size-m, var(--dseo-a11y-size, 48px)); }
}

/*
 * 0.14.1 · La distancia al borde crece con el mismo zoom que la página (decisión 78). El zoom del tamaño de
 * texto agranda también los botones fijos de otros plugins, con su distancia al borde: sin esto, el de
 * reabrir de Cookie Manager se montaba sobre el nuestro. El botón propio no crece; solo su distancia.
 */
.dseo-a11y { --dseo-a11y-dx: calc(var(--dseo-a11y-xv) * var(--dseo-a11y-z, 1)); --dseo-a11y-dy: calc(var(--dseo-a11y-yv) * var(--dseo-a11y-z, 1)); }
html[data-dseo-a11y-text="1"] .dseo-a11y { --dseo-a11y-z: 1.15; }
html[data-dseo-a11y-text="2"] .dseo-a11y { --dseo-a11y-z: 1.3; }
html[data-dseo-a11y-text="3"] .dseo-a11y { --dseo-a11y-z: 1.5; }

/*
 * La posición: cada clase pone dónde va el botón (izquierda, derecha, arriba, abajo y desplazamiento), y la de
 * tableta (--t-) y la de móvil (--m-) la cambian en su pantalla. 0.14.2 · Abajo, con el aviso de cookies
 * abierto, encima de él (decisión 81; la altura la pone toolbar.js en --dseo-a11y-lift).
 */
.dseo-a11y--bottom-left { --dseo-a11y-pl: var(--dseo-a11y-dx); --dseo-a11y-pr: auto; --dseo-a11y-pt: auto; --dseo-a11y-pb: max(var(--dseo-a11y-dy), var(--dseo-a11y-lift, 0px)); --dseo-a11y-pf: none; }
.dseo-a11y--bottom-center { --dseo-a11y-pl: 50%; --dseo-a11y-pr: auto; --dseo-a11y-pt: auto; --dseo-a11y-pb: max(var(--dseo-a11y-dy), var(--dseo-a11y-lift, 0px)); --dseo-a11y-pf: translateX(-50%); }
.dseo-a11y--bottom-right { --dseo-a11y-pl: auto; --dseo-a11y-pr: var(--dseo-a11y-dx); --dseo-a11y-pt: auto; --dseo-a11y-pb: max(var(--dseo-a11y-dy), var(--dseo-a11y-lift, 0px)); --dseo-a11y-pf: none; }
.dseo-a11y--center-left { --dseo-a11y-pl: var(--dseo-a11y-dx); --dseo-a11y-pr: auto; --dseo-a11y-pt: 50%; --dseo-a11y-pb: auto; --dseo-a11y-pf: translateY(-50%); }
.dseo-a11y--center-right { --dseo-a11y-pl: auto; --dseo-a11y-pr: var(--dseo-a11y-dx); --dseo-a11y-pt: 50%; --dseo-a11y-pb: auto; --dseo-a11y-pf: translateY(-50%); }
.dseo-a11y--top-left { --dseo-a11y-pl: var(--dseo-a11y-dx); --dseo-a11y-pr: auto; --dseo-a11y-pt: var(--dseo-a11y-dy); --dseo-a11y-pb: auto; --dseo-a11y-pf: none; }
.dseo-a11y--top-center { --dseo-a11y-pl: 50%; --dseo-a11y-pr: auto; --dseo-a11y-pt: var(--dseo-a11y-dy); --dseo-a11y-pb: auto; --dseo-a11y-pf: translateX(-50%); }
.dseo-a11y--top-right { --dseo-a11y-pl: auto; --dseo-a11y-pr: var(--dseo-a11y-dx); --dseo-a11y-pt: var(--dseo-a11y-dy); --dseo-a11y-pb: auto; --dseo-a11y-pf: none; }
@media (min-width: 768px) and (max-width: 980px) {
	.dseo-a11y--t-bottom-left { --dseo-a11y-pl: var(--dseo-a11y-dx); --dseo-a11y-pr: auto; --dseo-a11y-pt: auto; --dseo-a11y-pb: max(var(--dseo-a11y-dy), var(--dseo-a11y-lift, 0px)); --dseo-a11y-pf: none; }
	.dseo-a11y--t-bottom-center { --dseo-a11y-pl: 50%; --dseo-a11y-pr: auto; --dseo-a11y-pt: auto; --dseo-a11y-pb: max(var(--dseo-a11y-dy), var(--dseo-a11y-lift, 0px)); --dseo-a11y-pf: translateX(-50%); }
	.dseo-a11y--t-bottom-right { --dseo-a11y-pl: auto; --dseo-a11y-pr: var(--dseo-a11y-dx); --dseo-a11y-pt: auto; --dseo-a11y-pb: max(var(--dseo-a11y-dy), var(--dseo-a11y-lift, 0px)); --dseo-a11y-pf: none; }
	.dseo-a11y--t-center-left { --dseo-a11y-pl: var(--dseo-a11y-dx); --dseo-a11y-pr: auto; --dseo-a11y-pt: 50%; --dseo-a11y-pb: auto; --dseo-a11y-pf: translateY(-50%); }
	.dseo-a11y--t-center-right { --dseo-a11y-pl: auto; --dseo-a11y-pr: var(--dseo-a11y-dx); --dseo-a11y-pt: 50%; --dseo-a11y-pb: auto; --dseo-a11y-pf: translateY(-50%); }
	.dseo-a11y--t-top-left { --dseo-a11y-pl: var(--dseo-a11y-dx); --dseo-a11y-pr: auto; --dseo-a11y-pt: var(--dseo-a11y-dy); --dseo-a11y-pb: auto; --dseo-a11y-pf: none; }
	.dseo-a11y--t-top-center { --dseo-a11y-pl: 50%; --dseo-a11y-pr: auto; --dseo-a11y-pt: var(--dseo-a11y-dy); --dseo-a11y-pb: auto; --dseo-a11y-pf: translateX(-50%); }
	.dseo-a11y--t-top-right { --dseo-a11y-pl: auto; --dseo-a11y-pr: var(--dseo-a11y-dx); --dseo-a11y-pt: var(--dseo-a11y-dy); --dseo-a11y-pb: auto; --dseo-a11y-pf: none; }
}
@media (max-width: 767px) {
	.dseo-a11y--m-bottom-left { --dseo-a11y-pl: var(--dseo-a11y-dx); --dseo-a11y-pr: auto; --dseo-a11y-pt: auto; --dseo-a11y-pb: max(var(--dseo-a11y-dy), var(--dseo-a11y-lift, 0px)); --dseo-a11y-pf: none; }
	.dseo-a11y--m-bottom-center { --dseo-a11y-pl: 50%; --dseo-a11y-pr: auto; --dseo-a11y-pt: auto; --dseo-a11y-pb: max(var(--dseo-a11y-dy), var(--dseo-a11y-lift, 0px)); --dseo-a11y-pf: translateX(-50%); }
	.dseo-a11y--m-bottom-right { --dseo-a11y-pl: auto; --dseo-a11y-pr: var(--dseo-a11y-dx); --dseo-a11y-pt: auto; --dseo-a11y-pb: max(var(--dseo-a11y-dy), var(--dseo-a11y-lift, 0px)); --dseo-a11y-pf: none; }
	.dseo-a11y--m-center-left { --dseo-a11y-pl: var(--dseo-a11y-dx); --dseo-a11y-pr: auto; --dseo-a11y-pt: 50%; --dseo-a11y-pb: auto; --dseo-a11y-pf: translateY(-50%); }
	.dseo-a11y--m-center-right { --dseo-a11y-pl: auto; --dseo-a11y-pr: var(--dseo-a11y-dx); --dseo-a11y-pt: 50%; --dseo-a11y-pb: auto; --dseo-a11y-pf: translateY(-50%); }
	.dseo-a11y--m-top-left { --dseo-a11y-pl: var(--dseo-a11y-dx); --dseo-a11y-pr: auto; --dseo-a11y-pt: var(--dseo-a11y-dy); --dseo-a11y-pb: auto; --dseo-a11y-pf: none; }
	.dseo-a11y--m-top-center { --dseo-a11y-pl: 50%; --dseo-a11y-pr: auto; --dseo-a11y-pt: var(--dseo-a11y-dy); --dseo-a11y-pb: auto; --dseo-a11y-pf: translateX(-50%); }
	.dseo-a11y--m-top-right { --dseo-a11y-pl: auto; --dseo-a11y-pr: var(--dseo-a11y-dx); --dseo-a11y-pt: var(--dseo-a11y-dy); --dseo-a11y-pb: auto; --dseo-a11y-pf: none; }
}

/* 0.17.0 · El botón flotante, oculto en la pantalla que se eligió (decisión 88). */
@media (min-width: 981px) { .dseo-a11y--d-off .dseo-a11y-open { display: none; } }
@media (min-width: 768px) and (max-width: 980px) { .dseo-a11y--t-off .dseo-a11y-open { display: none; } }
@media (max-width: 767px) { .dseo-a11y--m-off .dseo-a11y-open { display: none; } }

/* 0.15.0 · Los enlaces del final del panel: subrayados, con el foco de la barra. */
.dseo-a11y-links { margin: 0 0 1rem; padding: 0 0 0 1.25rem; }
.dseo-a11y-links li { margin: .25rem 0; }
.dseo-a11y-links a { color: #0b3d91; text-decoration: underline; text-underline-offset: .15em; }
.dseo-a11y-links a:focus-visible { outline: 3px solid #111; outline-offset: 3px; box-shadow: 0 0 0 6px #ffd800; }

/* 0.16.0 · El botón del shortcode y del bloque: hereda la letra de la página; 44 px de alto como mínimo. */
.dseo-a11y-inline { display: inline-flex; align-items: center; min-height: 44px; padding: .4em 1em; border: 2px solid currentColor; border-radius: 6px; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.dseo-a11y-inline:focus-visible { outline: 3px solid #111; outline-offset: 3px; box-shadow: 0 0 0 6px #ffd800; }

.dseo-a11y-footer { margin: 0; padding: 1em; text-align: center; background: #fff; }
.dseo-a11y-footer-link { padding: .5em 1em; min-height: 44px; border: 0; background: none; color: #0b3d91; font: 16px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; text-decoration: underline; cursor: pointer; }

/* ── El panel ─────────────────────────────────────────────────────────────────────────────────── */

.dseo-a11y-panel {
	width: min(26rem, calc(100vw - 2rem));
	max-height: calc(100vh - 2rem);
	padding: 1rem 1.25rem;
	border: 2px solid #111;
	border-radius: 10px;
	background: #fff;
	color: #111;
	font: 16px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	letter-spacing: normal;
	word-spacing: normal;
	text-align: left;
	zoom: 1;
	filter: none;
}
.dseo-a11y-panel::backdrop { background: rgba(0, 0, 0, .45); }
.dseo-a11y-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.dseo-a11y-title { margin: 0; font: 700 1.25rem/1.3 inherit; color: #111; }
.dseo-a11y-sub { margin: 1rem 0 .5rem; font: 700 1rem/1.3 inherit; color: #111; }
.dseo-a11y-note { margin: .5rem 0 0; font-size: .9rem; color: #333; }
.dseo-a11y-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.dseo-a11y-panel button {
	min-height: 44px;
	padding: .5em .75em;
	border: 2px solid #444;
	border-radius: 6px;
	background: #fff;
	color: #111;
	font: inherit;
	text-align: left;
	cursor: pointer;
}
.dseo-a11y-panel .dseo-a11y-tool[aria-pressed="true"] { border-color: #0b3d91; background: #0b3d91; color: #fff; }
.dseo-a11y-panel .dseo-a11y-tool[aria-pressed="true"]::before { content: "✓ "; }
.dseo-a11y-foot { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; margin: 1rem 0 0; }
.dseo-a11y-saved { font-size: .85rem; color: #333; }

/* 0.17.0 · El panel en oscuro si el sistema lo pide, con los contrastes comprobados. */
@media (prefers-color-scheme: dark) {
	.dseo-a11y-panel { border-color: #bdbdbd; background: #1e1f22; color: #f1f1f1; }
	.dseo-a11y-title, .dseo-a11y-sub { color: #f1f1f1; }
	.dseo-a11y-note, .dseo-a11y-saved { color: #d6d6d6; }
	.dseo-a11y-panel button { border-color: #bdbdbd; background: #2b2d31; color: #f1f1f1; }
	.dseo-a11y-panel .dseo-a11y-tool[aria-pressed="true"] { border-color: #8ab4f8; background: #8ab4f8; color: #111; }
	.dseo-a11y-links a { color: #8ab4f8; }
	.dseo-a11y-panel button:focus-visible, .dseo-a11y-links a:focus-visible { outline-color: #fff; }
}

@media (prefers-reduced-motion: no-preference) {
	.dseo-a11y-open { transition: filter .15s; }
}

@media (forced-colors: active) {
	.dseo-a11y-open, .dseo-a11y-panel button { border-color: ButtonText; background: ButtonFace; color: ButtonText; forced-color-adjust: none; }
	.dseo-a11y-panel .dseo-a11y-tool[aria-pressed="true"] { background: Highlight; color: HighlightText; }
}

/* ── Las herramientas ─────────────────────────────────────────────────────────────────────────── */

/* Tamaño de texto: zoom sobre la página, salvo la barra propia (medido con Divi 5, que fija px). */
html[data-dseo-a11y-text="1"] body > :not(#dseo-a11y-root):not(script):not(style):not(#wpadminbar) { zoom: 1.15; }
html[data-dseo-a11y-text="2"] body > :not(#dseo-a11y-root):not(script):not(style):not(#wpadminbar) { zoom: 1.3; }
html[data-dseo-a11y-text="3"] body > :not(#dseo-a11y-root):not(script):not(style):not(#wpadminbar) { zoom: 1.5; }

/* Interlineado y espaciado: los valores de WCAG 1.4.12. */
html[data-dseo-a11y-lh="1"] body :is(p, li, dd, dt, blockquote, td, th, label, figcaption, h1, h2, h3, h4, h5, h6, a, span):not(.dseo-a11y *) { line-height: 1.8 !important; }
html[data-dseo-a11y-space="1"] body :is(p, li, dd, dt, blockquote, td, th, label, figcaption, h1, h2, h3, h4, h5, h6, a, span):not(.dseo-a11y *) { letter-spacing: .12em !important; word-spacing: .16em !important; }
html[data-dseo-a11y-space="1"] body p:not(.dseo-a11y *) { margin-bottom: 2em !important; }

/* Letra legible: del sistema, sin descargar nada; sin tocar los iconos. */
html[data-dseo-a11y-font="1"] body :not(.dseo-a11y *):not(svg):not(svg *):not([class*="icon"]):not([class*="et-pb-icon"]) { font-family: Verdana, Tahoma, "Segoe UI", Arial, sans-serif !important; }

/* Resaltar enlaces. */
html[data-dseo-a11y-links="1"] body a:not(.dseo-a11y *) { text-decoration: underline !important; text-underline-offset: .2em; outline: 2px dashed currentColor !important; outline-offset: 2px; }

/* Contraste alto: un filtro en la raíz (en la raíz no cambia la posición de lo fijo). */
html[data-dseo-a11y-contrast="high"] { filter: contrast(1.4); }

/* Contraste claro y oscuro: colores de texto y de fondo, sin imágenes de fondo detrás del texto. */
html[data-dseo-a11y-contrast="light"] body,
html[data-dseo-a11y-contrast="light"] body *:not(.dseo-a11y):not(.dseo-a11y *):not(img):not(svg):not(svg *):not(video):not(iframe) { background-color: #fff !important; background-image: none !important; color: #000 !important; border-color: #000 !important; text-shadow: none !important; }
html[data-dseo-a11y-contrast="light"] body a:not(.dseo-a11y *) { color: #0000b3 !important; }
html[data-dseo-a11y-contrast="dark"] body,
html[data-dseo-a11y-contrast="dark"] body *:not(.dseo-a11y):not(.dseo-a11y *):not(img):not(svg):not(svg *):not(video):not(iframe) { background-color: #000 !important; background-image: none !important; color: #fff !important; border-color: #fff !important; text-shadow: none !important; }
html[data-dseo-a11y-contrast="dark"] body a:not(.dseo-a11y *) { color: #ffe14d !important; }

/* Reducir movimiento y parar animaciones. */
html[data-dseo-a11y-motion="1"] *, html[data-dseo-a11y-motion="1"] *::before, html[data-dseo-a11y-motion="1"] *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
html[data-dseo-a11y-anim="1"] *, html[data-dseo-a11y-anim="1"] *::before, html[data-dseo-a11y-anim="1"] *::after { animation-play-state: paused !important; }

/* Foco reforzado. */
html[data-dseo-a11y-focus="1"] :focus-visible { outline: 3px solid #111 !important; outline-offset: 3px !important; box-shadow: 0 0 0 6px #ffd800 !important; }
