/*
 * Dimensiones compartidas por las acciones principales del visor.
 * Los controles compactos (filtros, paginacion, cierres y botones de icono)
 * usan solo .boton-estandar-visor y conservan sus medidas especificas.
 */
:root {
	--visor-boton-principal-alto: 2.25rem;
	--visor-boton-principal-padding: 0.9rem;
	--visor-boton-principal-gap: 0.45rem;
	--visor-boton-principal-fuente: 1rem;
}

body .boton-estandar-visor.boton-principal-visor {
	display: inline-flex !important;
	width: auto !important;
	min-width: 0 !important;
	height: var(--visor-boton-principal-alto) !important;
	min-height: var(--visor-boton-principal-alto) !important;
	padding: 0 var(--visor-boton-principal-padding) !important;
	align-items: center !important;
	justify-content: center !important;
	gap: var(--visor-boton-principal-gap);
	box-sizing: border-box !important;
	border: 1px solid var(--visor-boton-borde, #e0e7ef) !important;
	border-radius: var(--visor-boton-radio, 7px) !important;
	background: var(--visor-boton-fondo, #fff) !important;
	box-shadow: none !important;
	color: var(--visor-boton-texto, #003887) !important;
	font-family: var(--visor-font-family, "Inter", "Segoe UI", Roboto, Arial, sans-serif) !important;
	font-size: var(--visor-boton-principal-fuente) !important;
	font-weight: var(--visor-font-semibold, 600) !important;
	line-height: 1 !important;
	letter-spacing: 0 !important;
	text-align: center;
	text-decoration: none !important;
	text-transform: none !important;
	white-space: nowrap;
	appearance: none;
	cursor: pointer;
	transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease !important;
}

body input.boton-estandar-visor.boton-principal-visor {
	display: inline-block !important;
}

body .boton-estandar-visor.boton-principal-visor:is(
	:hover,
	:focus-visible
) {
	border-color: var(--visor-boton-borde-hover, #e0e7ef) !important;
	background: var(--visor-boton-fondo-hover, #eef5fa) !important;
	color: var(--visor-boton-texto-hover, #003887) !important;
	box-shadow: none !important;
}

body .boton-estandar-visor.boton-principal-visor:is(
	.activo,
	.activa,
	.is-active,
	[aria-pressed="true"],
	[aria-expanded="true"],
	[aria-selected="true"]
) {
	border-color: var(--visor-boton-fondo-activo, #003887) !important;
	background: var(--visor-boton-fondo-activo, #003887) !important;
	color: var(--visor-boton-texto-activo, #fff) !important;
	box-shadow: none !important;
}

body .boton-estandar-visor.boton-principal-visor:focus-visible {
	outline: 2px solid rgba(0, 56, 135, 0.22) !important;
	outline-offset: 2px;
}

body .boton-estandar-visor.boton-principal-visor img {
	transition: filter 0.18s ease;
}

body .boton-estandar-visor.boton-principal-visor:is(
	:hover,
	:focus-visible
) img {
	filter: var(--visor-filtro-azul-principal) !important;
}

body .boton-estandar-visor.boton-principal-visor:is(
	.activo,
	.activa,
	.is-active,
	[aria-pressed="true"],
	[aria-expanded="true"],
	[aria-selected="true"]
) img {
	filter: brightness(0) invert(1) !important;
}

body .boton-estandar-visor.boton-principal-visor:is(:disabled, [aria-disabled="true"], .disabled) {
	border-color: #d8e0e8 !important;
	background: #f2f5f8 !important;
	color: #7b8793 !important;
	opacity: 1 !important;
	cursor: not-allowed;
	pointer-events: none;
}