html {
	--a11y-line-height: 1.6;
	--a11y-letter-spacing: 0em;
}

.accessibility-trigger,
.accessibility-panel,
.accessibility-panel * {
	box-sizing: border-box;
}

.accessibility-trigger {
	position: fixed;
	left: 22px;
	bottom: 22px;
	z-index: 1050;
	width: 52px;
	height: 52px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--color-white, #fff);
	border-radius: 50%;
	background: var(--color-primary-500, #155f99);
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24);
	color: var(--color-white, #fff);
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
}

.accessibility-trigger:hover,
.accessibility-trigger:focus-visible {
	background: var(--color-primary-700, #0b416c);
	color: var(--color-white, #fff);
}

.accessibility-trigger:focus-visible,
.accessibility-panel button:focus-visible,
.accessibility-panel input:focus-visible {
	outline: 3px solid #000;
	outline-offset: 3px;
}

.accessibility-panel {
	position: fixed;
	left: 22px;
	bottom: 86px;
	z-index: 1050;
	width: min(360px, calc(100vw - 44px));
	max-height: calc(100vh - 108px);
	overflow-y: auto;
	padding: 20px;
	border: 1px solid var(--color-neutral-300, #ccc);
	border-radius: 18px;
	background: var(--color-white, #fff);
	box-shadow: 0 18px 60px rgba(0, 0, 0, 0.24);
	color: var(--color-neutral-900, #111);
	font-family: var(--bs-font-sans-serif, Arial, sans-serif);
	font-size: 16px;
	line-height: 1.4;
	letter-spacing: normal;
}

.accessibility-panel[hidden] {
	display: none !important;
}

.accessibility-panel__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 6px;
}

.accessibility-panel__header h2 {
	margin: 0;
	font-family: 'Libre Baskerville', var(--bs-font-sans-serif, Arial, sans-serif);
	font-size: 22px;
	line-height: 1.2;
}

.accessibility-panel__close {
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 40px;
	border: 0;
	border-radius: 50%;
	background: var(--color-neutral-100, #f1f1f1);
	color: inherit;
	font-size: 20px;
	cursor: pointer;
}

.accessibility-control {
	padding: 16px 0;
	border-top: 1px solid var(--color-neutral-200, #ddd);
}

.accessibility-control__label {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 10px;
}

.accessibility-control label {
	font-weight: 650;
	cursor: pointer;
}

.accessibility-control output {
	color: var(--color-primary-700, #0b416c);
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
}

.accessibility-control input[type="range"] {
	width: 100%;
	min-height: 28px;
	margin: 0;
	accent-color: var(--color-primary-500, #155f99);
	cursor: pointer;
}

.accessibility-actions {
	border-top: 1px solid var(--color-neutral-200, #ddd);
}

.accessibility-toggle {
	width: 100%;
	min-height: 52px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 0;
	border: 0;
	border-bottom: 1px solid var(--color-neutral-200, #ddd);
	background: transparent;
	color: inherit;
	font: inherit;
	font-weight: 650;
	text-align: left;
	cursor: pointer;
}

.accessibility-toggle strong {
	color: var(--color-neutral-600, #666);
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
}

.accessibility-toggle[aria-pressed="true"] strong {
	color: var(--color-primary-700, #0b416c);
}

.accessibility-reset {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 16px;
	padding: 11px 14px;
	border: 1px solid var(--color-neutral-300, #ccc);
	border-radius: 10px;
	background: var(--color-neutral-100, #f5f5f5);
	color: inherit;
	font: inherit;
	font-weight: 650;
	cursor: pointer;
}

html.a11y-text-size body {
	font-size: 1rem;
}

html.a11y-text-size #contenido {
	font-size: 0.875rem;
}

html.a11y-text-size #contenido :where(input, textarea, select, blockquote) {
	font-size: 0.875rem;
}

html.a11y-text-size #contenido :where(button, .btn) {
	font-size: 1rem;
}

html.a11y-text-size #contenido h1 {
	font-size: 2.5rem;
}

html.a11y-text-size #contenido h2 {
	font-size: 2rem;
}

html.a11y-text-size #contenido h3 {
	font-size: 1.5rem;
}

html.a11y-text-size #contenido h4 {
	font-size: 1.25rem;
}

html.a11y-text-size #contenido h5 {
	font-size: 1.125rem;
}

html.a11y-line-height #contenido,
html.a11y-line-height #contenido :where(p, li, dt, dd, blockquote, figcaption, td, th, label, legend, a, button, input, textarea, select, .btn, .alert, .card-text, .dropdown-item, .content-index-item) {
	line-height: var(--a11y-line-height) !important;
}

html.a11y-letter-spacing #contenido,
html.a11y-letter-spacing #contenido :where(h1, h2, h3, h4, h5, h6, p, li, dt, dd, blockquote, figcaption, td, th, label, legend, a, button, input, textarea, select, .btn, .alert, .card-text, .dropdown-item, .content-index-item) {
	letter-spacing: var(--a11y-letter-spacing) !important;
}

html.a11y-inverted {
	background: #000;
	filter: invert(1);
}

html.a11y-inverted :where(img, video, audio, iframe, canvas, object, embed, .a11y-preserve-colors) {
	filter: invert(1);
}

html.a11y-highlight-links #contenido a[href]:not(.btn):not(:has(img)),
html.a11y-highlight-links #navMain a[href]:not(.navbar-brand):not(.nav-icon-btn):not(.nav-icon-profile):not(:has(img)) {
	padding-inline: 0.14em;
	background-image: linear-gradient(
		to bottom,
		transparent 14%,
		#ffeb3b 14%,
		#ffeb3b 88%,
		transparent 88%
	) !important;
	color: #000 !important;
	text-decoration: none !important;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

html.a11y-highlight-links #contenido :where(button, .btn, [role="button"], a.btn),
html.a11y-highlight-links #navMain :where(button, .nav-icon-btn, .nav-icon-profile) {
	outline: 3px solid #000 !important;
	outline-offset: 3px !important;
	box-shadow: 0 0 0 2px #fff, 0 0 0 5px #000 !important;
}

@media (max-width: 575.98px) {
	.accessibility-trigger {
		left: 14px;
		bottom: 14px;
	}

	.accessibility-panel {
		left: 14px;
		bottom: 78px;
		width: calc(100vw - 28px);
		max-height: calc(100vh - 96px);
		padding: 18px;
	}
}
