/* =========================================================================
   RENDICIÓN DE CUENTAS LEGISLATIVA — PARTE PÚBLICA
   =========================================================================

   El panel del senador se rediseñó en la 5.1 y la web se quedó una generación
   atrás: bordes de un píxel, radios de tres, la paleta escrita a mano en
   ochenta sitios. Eran dos productos distintos con el mismo contenido.

   Aquí la web adopta el mismo lenguaje que el panel —radios generosos,
   sombras difusas en vez de bordes, píldoras, aire entre bloques— sin
   imponerle una tipografía a la página: la letra la pone el tema.

   LOS COLORES NO ESTÁN AQUÍ. Llegan como variables desde PHP
   (vc_paleta_publica), así que el sitio manda y un tema hijo puede cambiar la
   paleta entera sin tocar este archivo. Los valores de reserva que se ven en
   los var() son los del diseño original, para que la hoja siga funcionando
   aunque se cargue suelta.

   ORDEN
     1. Alcance y tokens locales
     2. Piezas compartidas: etiquetas, botones, vacíos
     3. Buscador y filtros
     4. Listado y tarjeta
     5. Cuenta regresiva
     6. Ficha del proyecto
     7. Recorrido
     8. Proposiciones
     9. Autores
    10. Fuentes y documentos
    11. Tablero de cifras
    12. Distribución de votos
    13. Tablas de desglose
    14. Paginación
    15. Móvil
    16. Impresión y movimiento reducido
   ========================================================================= */

/* =========================================================================
   1. ALCANCE Y TOKENS LOCALES
   ========================================================================= */

/* Todo lo del plugin cuelga de .vc-scope, para no filtrar estilos al tema.
   Las variables --vc-* globales las inyecta PHP en :root. */

.vc-scope {
	--vc-r-xl: 20px;
	--vc-r-lg: 14px;
	--vc-r-md: 10px;
	--vc-r-sm: 8px;
	--vc-pill: 999px;

	/* Sombras difusas y verdosas, nunca grises: sobre papel cálido, una
	   sombra gris se lee como suciedad. */
	--vc-sombra-1: 0 1px 2px rgba(36, 51, 42, 0.04), 0 4px 12px -6px rgba(36, 51, 42, 0.10);
	--vc-sombra-2: 0 2px 4px rgba(36, 51, 42, 0.05), 0 14px 32px -14px rgba(36, 51, 42, 0.18);

	--vc-esp: 20px;
	--vc-transicion: 180ms cubic-bezier(0.2, 0, 0.2, 1);

	color: var(--vc-tinta, #24332A);
	font-family: var(--vc-fuente, inherit);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

.vc-scope *,
.vc-scope *::before,
.vc-scope *::after {
	box-sizing: border-box;
}

.vc-scope :focus-visible {
	outline: 2px solid var(--vc-verde-vivo, #69A04F);
	outline-offset: 2px;
	border-radius: var(--vc-r-sm);
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* =========================================================================
   2. PIEZAS COMPARTIDAS
   ========================================================================= */

/* --- Etiqueta de color (estado, sentido del voto) --------------------- */

.vc-sentido {
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.5;
	white-space: nowrap;
	border-radius: var(--vc-pill);
	color: var(--vc-tono, var(--vc-tinta-2, #5A6B5C));
	border: 1px solid currentColor;
	background: transparent;
}

/* Sobre fondo claro, el contorno solo se pierde. La versión sólida usa el
   color como fondo y deja el texto en blanco: se lee de lejos. */
.vc-sentido--solido {
	color: #FFFFFF;
	background: var(--vc-tono, var(--vc-verde, #034C21));
	border-color: transparent;
}

/* --- Botones ---------------------------------------------------------- */

.vc-boton {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 20px;
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1.3;
	color: #FFFFFF;
	background: var(--vc-verde, #034C21);
	border: 1px solid var(--vc-verde, #034C21);
	border-radius: var(--vc-pill);
	text-decoration: none;
	cursor: pointer;
	transition: background var(--vc-transicion), transform var(--vc-transicion), box-shadow var(--vc-transicion);
}

.vc-boton:hover,
.vc-boton:focus-visible {
	color: #FFFFFF;
	background: var(--vc-verde-hondo, #023A19);
	border-color: var(--vc-verde-hondo, #023A19);
	transform: translateY(-1px);
	box-shadow: 0 8px 18px -8px rgba(3, 76, 33, 0.55);
}

.vc-boton--fantasma {
	color: var(--vc-verde, #034C21);
	background: var(--vc-papel, #FFFFFF);
	border-color: var(--vc-linea, #E4EBDF);
}

.vc-boton--fantasma:hover,
.vc-boton--fantasma:focus-visible {
	color: var(--vc-verde-hondo, #023A19);
	background: var(--vc-verde-agua, #EAF3E4);
	border-color: var(--vc-verde-vivo, #69A04F);
	box-shadow: none;
}

.vc-ext {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	opacity: 0.6;
}

/* --- Estado vacío ----------------------------------------------------- */

.vc-vacio {
	padding: 34px 30px;
	background: var(--vc-fondo, #F5F7F2);
	border-radius: var(--vc-r-lg);
	color: var(--vc-tinta-2, #5A6B5C);
}

.vc-vacio p {
	margin: 0 0 8px;
}

.vc-vacio p:last-child {
	margin-bottom: 0;
}

.vc-vacio__titulo {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--vc-tinta, #24332A);
}

/* =========================================================================
   3. BUSCADOR Y FILTROS
   ========================================================================= */

.vc-buscador {
	padding: 22px 24px;
	background: var(--vc-fondo, #F5F7F2);
	border-radius: var(--vc-r-xl);
	margin-bottom: 20px;
}

.vc-buscador__linea {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	align-items: flex-end;
}

.vc-buscador__campo {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1 1 170px;
	min-width: 150px;
}

.vc-buscador__campo--ancho {
	flex: 2 1 280px;
}

.vc-buscador__etiqueta {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-buscador input[type="search"],
.vc-buscador input[type="date"],
.vc-buscador select {
	width: 100%;
	padding: 10px 14px;
	font-family: inherit;
	font-size: 0.92rem;
	color: var(--vc-tinta, #24332A);
	background: var(--vc-papel, #FFFFFF);
	border: 1px solid transparent;
	border-radius: var(--vc-r-md);
	box-shadow: var(--vc-sombra-1);
	line-height: 1.4;
	transition: border-color var(--vc-transicion), box-shadow var(--vc-transicion);
	appearance: none;
	-webkit-appearance: none;
}

/* La flecha del desplegable, dibujada: así no depende del sistema y sigue a
   la paleta del sitio. */
.vc-buscador select {
	padding-right: 34px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%235A6B5C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
}

.vc-buscador input:hover,
.vc-buscador select:hover {
	border-color: var(--vc-linea, #E4EBDF);
}

.vc-buscador input:focus,
.vc-buscador select:focus {
	outline: none;
	border-color: var(--vc-verde-vivo, #69A04F);
	box-shadow: 0 0 0 3px rgba(105, 160, 79, 0.22);
}

.vc-buscador__campo--fecha {
	flex: 0 1 165px;
	min-width: 140px;
}

.vc-buscador__acciones {
	display: flex;
	margin-top: 16px;
}

.vc-buscador__enviar {
	flex: 0 0 auto;
	padding: 11px 28px;
}

/* --- "Más filtros": un checkbox y su etiqueta, sin JavaScript ---------- */

.vc-buscador__toggle {
	position: absolute;
	opacity: 0;
	pointer-events: none;
	width: 1px;
	height: 1px;
}

.vc-buscador__mas {
	display: none;
}

@media (min-width: 783px) {
	.vc-buscador__extra {
		margin-top: 16px;
		padding-top: 16px;
		border-top: 1px solid var(--vc-linea, #E4EBDF);
	}
}

/* --- Filtros aplicados ------------------------------------------------ */

.vc-aplicados {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 22px;
}

.vc-aplicados__titulo {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-aplicados__chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 14px;
	font-size: 0.85rem;
	color: var(--vc-verde, #034C21);
	background: var(--vc-papel, #FFFFFF);
	border: 1px solid var(--vc-linea, #E4EBDF);
	border-radius: var(--vc-pill);
	text-decoration: none;
	transition: color var(--vc-transicion), border-color var(--vc-transicion), background var(--vc-transicion);
}

.vc-aplicados__chip:hover,
.vc-aplicados__chip:focus-visible {
	color: var(--vc-urgente, #9B2C1F);
	border-color: var(--vc-urgente, #9B2C1F);
	background: var(--vc-urgente-b, #FBEDE9);
}

.vc-aplicados__limpiar {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--vc-tinta-2, #5A6B5C);
}

/* =========================================================================
   4. LISTADO Y TARJETA
   ========================================================================= */

/* El listado se adapta al ancho de su contenedor, no al de la pantalla: si un
   día se coloca dentro de una columna estrecha, se entera. */
.vc-listado {
	container-type: inline-size;
}

.vc-listado__conteo {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 10px;
	margin: 0 0 6px;
	font-size: 0.95rem;
	color: var(--vc-tinta-2, #5A6B5C);
}

.vc-listado__conteo strong {
	font-size: 1.2rem;
	font-weight: 800;
	color: var(--vc-verde, #034C21);
}

.vc-listado__rango {
	font-size: 0.84rem;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-listado__tarjetas {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-top: 18px;
}

.vc-tarjeta {
	display: flex;
	gap: 24px;
	padding: 24px 26px;
	background: var(--vc-papel, #FFFFFF);
	border-radius: var(--vc-r-xl);
	box-shadow: var(--vc-sombra-1);
	transition: box-shadow var(--vc-transicion), transform var(--vc-transicion);
}

.vc-tarjeta:hover {
	box-shadow: var(--vc-sombra-2);
	transform: translateY(-2px);
}

/* La temperatura dice cuánto falta para el debate antes de leer una palabra.
   Es la misma convención del panel del senador, para que quien pasa de uno a
   otro no tenga que aprenderla dos veces. */
/* El degradado va en `to right`, exactamente horizontal. Con un ángulo, la
   longitud del eje depende del alto de la tarjeta, y una tarjeta larga acababa
   teñida de arriba abajo en vez de solo por el canto. */
.vc-tarjeta--inminente {
	box-shadow: var(--vc-sombra-1), inset 4px 0 0 var(--vc-urgente, #9B2C1F);
	background: linear-gradient(to right, var(--vc-urgente-b, #FBEDE9) 0 200px, var(--vc-papel, #FFFFFF) 380px);
}

.vc-tarjeta--cercana {
	box-shadow: var(--vc-sombra-1), inset 4px 0 0 var(--vc-verde-vivo, #69A04F);
	background: linear-gradient(to right, var(--vc-verde-agua, #EAF3E4) 0 200px, var(--vc-papel, #FFFFFF) 380px);
}

.vc-tarjeta__rail {
	flex: 0 0 158px;
	/* Sin esto el `min-width: auto` de los ítems flex deja que una etiqueta
	   larga —«Con ponencia presentada»— ensanche la columna y se coma el
	   título. La etiqueta parte en dos líneas antes que empujar. */
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}

.vc-tarjeta__rail .vc-sentido {
	max-width: 100%;
	white-space: normal;
	text-align: left;
}

.vc-tarjeta__cuerpo {
	flex: 1 1 auto;
	min-width: 0;
}

.vc-tarjeta__eyebrow {
	margin: 0 0 6px;
	font-size: 0.74rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-tarjeta__titulo {
	margin: 0 0 10px;
	font-size: 1.3rem;
	font-weight: 700;
	line-height: 1.28;
	letter-spacing: -0.01em;
}

.vc-tarjeta__titulo a {
	color: var(--vc-verde, #034C21);
	text-decoration: none;
	background-image: linear-gradient(currentColor, currentColor);
	background-size: 0 2px;
	background-repeat: no-repeat;
	background-position: 0 100%;
	transition: background-size var(--vc-transicion);
}

.vc-tarjeta__titulo a:hover,
.vc-tarjeta__titulo a:focus-visible {
	background-size: 100% 2px;
}

.vc-tarjeta__meta {
	margin: 0 0 12px;
	font-size: 0.88rem;
	color: var(--vc-tinta-2, #5A6B5C);
}

.vc-tarjeta__texto p {
	margin: 0 0 10px;
	color: var(--vc-tinta-2, #5A6B5C);
	line-height: 1.65;
}

.vc-tarjeta__texto p:last-child {
	margin-bottom: 0;
}

.vc-tarjeta__resultado,
.vc-tarjeta__proyecto {
	margin: 0 0 10px;
	font-size: 0.88rem;
	color: var(--vc-tinta-2, #5A6B5C);
}

.vc-tarjeta__acciones {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin-top: 18px;
}

.vc-tarjeta__docs-n {
	font-size: 0.84rem;
	color: var(--vc-tinta-3, #8A8F86);
}

/* --- Historial de votos dentro de la tarjeta -------------------------- */

.vc-votos-resumen {
	margin: 16px 0 0;
	padding: 14px 16px;
	background: var(--vc-fondo-2, #F8FAF7);
	border-radius: var(--vc-r-lg);
}

.vc-votos-resumen__titulo {
	margin: 0 0 10px;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.07em;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-votos-resumen__lista {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.vc-voto-linea {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.vc-voto-linea__ctx {
	font-size: 0.85rem;
	color: var(--vc-tinta-2, #5A6B5C);
}

/* La marca de «explicado» es la promesa del sitio hecha visible por voto. */
.vc-voto-linea__marca {
	padding: 2px 9px;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--vc-verde, #034C21);
	background: var(--vc-verde-agua, #EAF3E4);
	border-radius: var(--vc-pill);
}

/* =========================================================================
   5. CUENTA REGRESIVA
   ========================================================================= */

.vc-cuenta {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	padding: 14px 16px;
	width: 100%;
	background: var(--vc-papel, #FFFFFF);
	border-radius: var(--vc-r-lg);
	box-shadow: var(--vc-sombra-1);
}

.vc-cuenta__numero {
	font-size: 2rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.03em;
	color: var(--vc-verde, #034C21);
	font-variant-numeric: tabular-nums;
}

.vc-cuenta__texto {
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.09em;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-cuenta__hito {
	margin-top: 8px;
	font-size: 0.8rem;
	line-height: 1.35;
	color: var(--vc-tinta-2, #5A6B5C);
}

.vc-tarjeta--inminente .vc-cuenta__numero {
	color: var(--vc-urgente, #9B2C1F);
}

/* =========================================================================
   6. FICHA DEL PROYECTO
   ========================================================================= */

.vc-ficha {
	margin: 0 0 26px;
	padding: 20px 24px;
	background: var(--vc-fondo, #F5F7F2);
	border-radius: var(--vc-r-xl);
}

.vc-ficha__estado {
	margin: 0 0 14px;
}

.vc-ficha__datos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 16px 26px;
	margin: 0;
}

.vc-ficha__par {
	margin: 0;
	min-width: 0;
}

.vc-ficha__par dt {
	margin: 0 0 2px;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-ficha__par dd {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--vc-tinta, #24332A);
}

.vc-single-cabecera {
	margin-bottom: 24px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--vc-linea, #E4EBDF);
}

.vc-single-cabecera .vc-tarjeta__meta {
	margin-top: 12px;
	margin-bottom: 0;
}

.vc-single-pie {
	margin-top: 38px;
	padding-top: 26px;
	border-top: 1px solid var(--vc-linea, #E4EBDF);
}

.vc-single-pie__titulo {
	margin: 0 0 16px;
	font-size: 1.1rem;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--vc-verde, #034C21);
}

/* =========================================================================
   7. RECORRIDO
   ========================================================================= */

.vc-tramite {
	list-style: none;
	margin: 0;
	padding: 0 0 0 4px;
	position: relative;
}

/* La línea se dibuja con un pseudoelemento y no con border-left, para poder
   cortarla antes del último punto en vez de dejarla colgando. */
.vc-tramite::before {
	content: "";
	position: absolute;
	left: 9px;
	top: 10px;
	bottom: 10px;
	width: 2px;
	background: var(--vc-linea, #E4EBDF);
}

.vc-tramite__paso {
	position: relative;
	padding: 0 0 26px 34px;
}

.vc-tramite__paso:last-child {
	padding-bottom: 0;
}

.vc-tramite__punto {
	position: absolute;
	left: 3px;
	top: 5px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: var(--vc-tono, var(--vc-verde-vivo, #69A04F));
	box-shadow: 0 0 0 4px var(--vc-papel, #FFFFFF);
}

/* Lo que aún no ha ocurrido se dibuja hueco: un punto lleno promete un hecho. */
.vc-tramite__paso--futuro .vc-tramite__punto {
	background: var(--vc-papel, #FFFFFF);
	border: 2px solid var(--vc-tono, var(--vc-verde-vivo, #69A04F));
}

.vc-tramite__contenido {
	min-width: 0;
}

.vc-tramite__cabecera {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.vc-tramite__titulo {
	font-size: 1.02rem;
	font-weight: 700;
	color: var(--vc-verde, #034C21);
	text-decoration: none;
}

a.vc-tramite__titulo:hover {
	text-decoration: underline;
}

.vc-tramite__tipo {
	padding: 2px 10px;
	font-size: 0.66rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #FFFFFF;
	background: var(--vc-tono, var(--vc-tinta-2, #5A6B5C));
	border-radius: var(--vc-pill);
}

.vc-tramite__tipo--futuro {
	color: var(--vc-tinta-2, #5A6B5C);
	background: transparent;
	border: 1px solid var(--vc-linea, #E4EBDF);
}

.vc-tramite .vc-tarjeta__meta {
	margin: 5px 0 0;
	font-size: 0.86rem;
}

.vc-tramite__justificacion {
	margin-top: 12px;
	padding: 14px 18px;
	background: var(--vc-fondo-2, #F8FAF7);
	border-radius: var(--vc-r-md);
	border-left: 3px solid var(--vc-verde-vivo, #69A04F);
}

.vc-tramite__justificacion-rotulo {
	margin: 0 0 6px;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-tramite__justificacion p {
	margin: 0 0 8px;
	font-size: 0.94rem;
	line-height: 1.65;
	color: var(--vc-tinta-2, #5A6B5C);
}

.vc-tramite__justificacion p:last-child {
	margin-bottom: 0;
}

/* Decirlo cuesta poco y callarlo se nota: un voto sin explicar se declara. */
.vc-tramite__sin-justificar {
	margin: 10px 0 0;
	font-size: 0.86rem;
	font-style: italic;
	color: var(--vc-tinta-3, #8A8F86);
}

/* =========================================================================
   8. PROPOSICIONES
   ========================================================================= */

.vc-proposicion {
	padding: 18px 22px;
	margin-bottom: 14px;
	background: var(--vc-papel, #FFFFFF);
	border-radius: var(--vc-r-lg);
	box-shadow: var(--vc-sombra-1);
}

.vc-proposicion__cabecera {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-bottom: 12px;
}

.vc-proposicion__tipo {
	font-size: 0.8rem;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-proposicion__objetivo {
	margin: 0 0 12px;
	font-weight: 600;
	color: var(--vc-tinta, #24332A);
	line-height: 1.6;
}

.vc-proposicion__texto {
	margin: 0;
	padding: 12px 18px;
	border-left: 3px solid var(--vc-linea, #E4EBDF);
	border-radius: 0 var(--vc-r-md) var(--vc-r-md) 0;
	font-size: 0.93rem;
	color: var(--vc-tinta-2, #5A6B5C);
	background: var(--vc-fondo-2, #F8FAF7);
}

/* El bloque interno se distingue a simple vista: nadie debe confundir
   material de trabajo con algo publicado. */
.vc-interno {
	padding: 22px 24px;
	background: var(--vc-ambar-b, #FBF3E3);
	border: 1px dashed var(--vc-ambar, #B07A1F);
	border-radius: var(--vc-r-xl);
}

.vc-interno .vc-single-pie__titulo {
	color: #8a5a00;
}

.vc-proposicion--interna {
	background: #FFFDF7;
}

.vc-comision__nota {
	margin: 14px 0 0;
	font-size: 0.84rem;
	color: #8a5a00;
}

/* =========================================================================
   9. AUTORES
   ========================================================================= */

.vc-autores {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 18px;
	margin: 12px 0;
}

.vc-autores__etiqueta {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-autores__lista {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 20px;
}

.vc-autor {
	display: flex;
	align-items: center;
	gap: 10px;
}

.vc-autor__foto {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
	flex: 0 0 auto;
	background: var(--vc-verde-agua, #EAF3E4);
	box-shadow: 0 0 0 1px var(--vc-linea, #E4EBDF);
}

.vc-autor__foto--iniciales {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.74rem;
	font-weight: 800;
	color: var(--vc-verde, #034C21);
}

.vc-autor__datos {
	display: flex;
	flex-direction: column;
	line-height: 1.25;
	min-width: 0;
}

.vc-autor__nombre {
	font-size: 0.92rem;
	font-weight: 600;
	color: var(--vc-tinta, #24332A);
	text-decoration: none;
}

.vc-autor__cargo {
	font-size: 0.78rem;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-autores--completo {
	gap: 14px 24px;
	margin: 0 0 26px;
	padding-bottom: 22px;
	border-bottom: 1px solid var(--vc-linea, #E4EBDF);
}

.vc-autores--completo .vc-autores__lista {
	gap: 16px 28px;
}

.vc-autores--completo .vc-autor__foto {
	width: 54px;
	height: 54px;
}

.vc-autores--completo .vc-autor__foto--iniciales {
	font-size: 1.05rem;
}

.vc-autores--completo .vc-autor__nombre {
	font-size: 1rem;
	font-weight: 700;
}

/* =========================================================================
   10. FUENTES Y DOCUMENTOS
   ========================================================================= */

.vc-fuentes__botones {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.vc-fuente {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	padding: 14px 24px;
	color: #FFFFFF;
	background: var(--vc-verde, #034C21);
	border-radius: var(--vc-pill);
	text-decoration: none;
	font-weight: 600;
	line-height: 1.3;
	transition: background var(--vc-transicion), transform var(--vc-transicion), box-shadow var(--vc-transicion);
}

.vc-fuente:hover,
.vc-fuente:focus-visible {
	background: var(--vc-verde-hondo, #023A19);
	color: #FFFFFF;
	transform: translateY(-1px);
	box-shadow: 0 8px 20px -8px rgba(3, 76, 33, 0.55);
}

.vc-fuente__nombre {
	font-size: 0.98rem;
}

.vc-fuente__abrir {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	opacity: 0.7;
}

.vc-single-docs__nota {
	margin: 14px 0 0;
	font-size: 0.84rem;
	color: var(--vc-tinta-3, #8A8F86);
}

/* --- Avisos ----------------------------------------------------------- */

.vc-aviso-autoria {
	padding: 16px 20px;
	margin: 0 0 24px;
	background: var(--vc-verde-agua, #EAF3E4);
	border-left: 3px solid var(--vc-verde-vivo, #69A04F);
	border-radius: var(--vc-r-md);
	font-size: 0.92rem;
	color: var(--vc-tinta-2, #5A6B5C);
}

.vc-aviso-autoria a {
	color: var(--vc-verde, #034C21);
	font-weight: 700;
}

.vc-aviso-sinfecha {
	margin: 0 0 14px;
	padding: 10px 16px;
	font-size: 0.85rem;
	color: #8a5a00;
	background: var(--vc-ambar-b, #FBF3E3);
	border-left: 3px solid var(--vc-ambar, #B07A1F);
	border-radius: var(--vc-r-sm);
}

.vc-aviso-sinfecha a {
	color: #8a5a00;
	font-weight: 700;
}

/* =========================================================================
   11. TABLERO DE CIFRAS
   ========================================================================= */

.vc-tablero {
	margin: 28px 0;
}

.vc-tablero__cabecera {
	margin-bottom: 20px;
}

.vc-tablero__titulo {
	margin: 0;
	font-size: 1.6rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.15;
	color: var(--vc-verde, #034C21);
}

.vc-tablero__bajada {
	margin: 8px 0 0;
	font-size: 1rem;
	color: var(--vc-tinta-2, #5A6B5C);
	max-width: 62ch;
}

.vc-tablero__rejilla {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
	gap: 14px;
}

.vc-tablero--suelto .vc-tablero__rejilla {
	grid-template-columns: minmax(215px, 320px);
}

.vc-cifra {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 22px 24px 20px;
	background: var(--vc-papel, #FFFFFF);
	border-radius: var(--vc-r-xl);
	box-shadow: var(--vc-sombra-1);
	text-decoration: none;
	color: inherit;
	position: relative;
	overflow: hidden;
	transition: box-shadow var(--vc-transicion), transform var(--vc-transicion);
}

/* Una franja de color en el canto: el acento se ve sin teñir toda la tarjeta,
   que a seis tarjetas seguidas resultaría un semáforo. */
.vc-cifra::before {
	content: "";
	position: absolute;
	inset: 0 auto 0 0;
	width: 4px;
	background: var(--vc-acento, var(--vc-verde, #034C21));
}

.vc-cifra--verde { --vc-acento: var(--vc-verde-vivo, #69A04F); }
.vc-cifra--ambar { --vc-acento: var(--vc-ambar, #B07A1F); }
.vc-cifra--urgente { --vc-acento: var(--vc-urgente, #9B2C1F); }
.vc-cifra--neutro { --vc-acento: var(--vc-linea, #E4EBDF); }

.vc-cifra--enlace:hover,
.vc-cifra--enlace:focus-visible {
	box-shadow: var(--vc-sombra-2);
	transform: translateY(-2px);
}

.vc-cifra__valor {
	font-size: 2.6rem;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.035em;
	color: var(--vc-verde, #034C21);
	font-variant-numeric: tabular-nums;
}

.vc-cifra--compacta .vc-cifra__valor {
	font-size: 1.5rem;
	letter-spacing: -0.02em;
}

.vc-cifra--ambar .vc-cifra__valor { color: #8a5a00; }
.vc-cifra--urgente .vc-cifra__valor { color: var(--vc-urgente, #9B2C1F); }

.vc-cifra__rotulo {
	margin-top: 8px;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--vc-tinta-2, #5A6B5C);
}

.vc-cifra__medida {
	display: block;
	width: 100%;
	height: 5px;
	margin-top: 12px;
	background: var(--vc-fondo, #F5F7F2);
	border-radius: var(--vc-pill);
	overflow: hidden;
}

.vc-cifra__relleno {
	display: block;
	height: 100%;
	width: var(--vc-medida, 0%);
	background: var(--vc-acento, var(--vc-verde-vivo, #69A04F));
	border-radius: inherit;
}

.vc-cifra__apoyo {
	margin-top: 12px;
	font-size: 0.86rem;
	line-height: 1.5;
	color: var(--vc-tinta-2, #5A6B5C);
}

/* `margin-top: auto` empuja el enlace al fondo: en una fila de tarjetas de
   distinto alto, los «Ver el listado» quedan alineados en vez de flotar cada
   uno donde acabe su texto. */
.vc-cifra__ir {
	margin-top: auto;
	padding-top: 14px;
	font-size: 0.8rem;
	font-weight: 700;
	color: var(--vc-verde, #034C21);
}

.vc-cifra--enlace:hover .vc-cifra__ir {
	text-decoration: underline;
}

.vc-tablero__distribucion {
	margin-top: 20px;
}

.vc-tablero__pie {
	margin: 18px 0 0;
	font-size: 0.85rem;
	line-height: 1.6;
	color: var(--vc-tinta-3, #8A8F86);
	max-width: 70ch;
}

/* =========================================================================
   12. DISTRIBUCIÓN DE VOTOS
   ========================================================================= */

.vc-dist {
	margin: 24px 0;
	padding: 24px 26px;
	background: var(--vc-papel, #FFFFFF);
	border-radius: var(--vc-r-xl);
	box-shadow: var(--vc-sombra-1);
}

.vc-dist__titulo {
	margin: 0 0 16px;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-dist__barra {
	display: flex;
	width: 100%;
	height: 22px;
	border-radius: var(--vc-pill);
	overflow: hidden;
	background: var(--vc-fondo, #F5F7F2);
	gap: 2px;
}

.vc-dist__tramo {
	flex: 0 0 var(--vc-tramo, 0%);
	background: var(--vc-tono, var(--vc-verde, #034C21));
	min-width: 3px;
}

/* Lo que no fue una decisión se raya: sigue estando, pero no se lee como voto. */
.vc-dist__tramo.es-sin-voto {
	background-image: repeating-linear-gradient(
		45deg,
		rgba(255, 255, 255, 0.45) 0 4px,
		transparent 4px 8px
	);
}

.vc-dist__leyenda {
	list-style: none;
	margin: 18px 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(215px, 1fr));
	gap: 4px 20px;
}

.vc-dist__item {
	margin: 0;
}

.vc-dist__enlace {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 7px 8px;
	margin: 0 -8px;
	border-radius: var(--vc-r-sm);
	text-decoration: none;
	color: inherit;
	transition: background var(--vc-transicion);
}

a.vc-dist__enlace:hover,
a.vc-dist__enlace:focus-visible {
	background: var(--vc-fondo, #F5F7F2);
}

.vc-dist__punto {
	flex: 0 0 auto;
	width: 11px;
	height: 11px;
	border-radius: 3px;
	background: var(--vc-tono, var(--vc-verde, #034C21));
}

.vc-dist__nombre {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 0.9rem;
	color: var(--vc-tinta, #24332A);
}

.vc-dist__n {
	font-size: 0.9rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	color: var(--vc-tinta, #24332A);
}

.vc-dist__pct {
	min-width: 3.4em;
	text-align: right;
	font-size: 0.82rem;
	font-variant-numeric: tabular-nums;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-dist__nota {
	margin: 16px 0 0;
	font-size: 0.83rem;
	line-height: 1.55;
	color: var(--vc-tinta-3, #8A8F86);
}

/* =========================================================================
   13. TABLAS DE DESGLOSE
   ========================================================================= */

/* Una tabla ancha no debe empujar la página: se desplaza dentro de su caja. */
.vc-resumen__caja {
	margin: 24px 0;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.vc-resumen {
	width: 100%;
	min-width: 460px;
	border-collapse: collapse;
	font-size: 0.94rem;
}

.vc-resumen th,
.vc-resumen td {
	padding: 13px 14px;
	text-align: left;
	border-bottom: 1px solid var(--vc-linea, #E4EBDF);
	vertical-align: middle;
}

.vc-resumen thead th {
	font-size: 0.68rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--vc-tinta-3, #8A8F86);
	border-bottom-width: 2px;
}

.vc-resumen tbody th {
	font-weight: 600;
	color: var(--vc-tinta, #24332A);
}

.vc-resumen tbody th a {
	color: var(--vc-verde, #034C21);
	text-decoration: none;
}

.vc-resumen tbody th a:hover {
	text-decoration: underline;
}

.vc-resumen tbody tr:hover {
	background: var(--vc-fondo-2, #F8FAF7);
}

.vc-resumen__n {
	text-align: right;
	width: 14%;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
	font-weight: 700;
}

.vc-resumen__col-barra {
	width: 34%;
}

/* Dos barras superpuestas: el total en claro, la parte en color. Comparar
   catorce números de una columna es trabajo; ver catorce barras, no. */
.vc-resumen__barra {
	display: block;
	position: relative;
	height: 10px;
	border-radius: var(--vc-pill);
	background: var(--vc-fondo, #F5F7F2);
	overflow: hidden;
}

.vc-resumen__total,
.vc-resumen__parte {
	position: absolute;
	inset: 0 auto 0 0;
	width: var(--vc-medida, 0%);
	border-radius: inherit;
}

.vc-resumen__total {
	background: var(--vc-verde-agua, #EAF3E4);
}

.vc-resumen__parte {
	background: var(--vc-verde-vivo, #69A04F);
}

.vc-resumen tfoot th,
.vc-resumen tfoot td {
	font-weight: 800;
	color: var(--vc-verde, #034C21);
	background: var(--vc-fondo-2, #F8FAF7);
	border-bottom: none;
	border-top: 2px solid var(--vc-verde, #034C21);
}

/* =========================================================================
   14. PAGINACIÓN
   ========================================================================= */

.vc-paginacion {
	margin-top: 32px;
}

.vc-paginacion ul {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.vc-paginacion a,
.vc-paginacion span {
	display: inline-block;
	min-width: 42px;
	padding: 9px 15px;
	text-align: center;
	background: var(--vc-papel, #FFFFFF);
	border-radius: var(--vc-pill);
	box-shadow: var(--vc-sombra-1);
	color: var(--vc-verde, #034C21);
	text-decoration: none;
	font-size: 0.9rem;
	font-weight: 600;
	transition: background var(--vc-transicion), color var(--vc-transicion);
}

.vc-paginacion a:hover {
	background: var(--vc-verde-agua, #EAF3E4);
}

.vc-paginacion .current {
	background: var(--vc-verde, #034C21);
	color: #FFFFFF;
}

.vc-paginacion .dots {
	box-shadow: none;
	background: transparent;
	color: var(--vc-tinta-3, #8A8F86);
}

/* --- Agenda (compatibilidad con montajes antiguos) -------------------- */

.vc-agenda__fecha {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
}

.vc-agenda__dia {
	font-size: 2rem;
	font-weight: 800;
	line-height: 1;
	color: var(--vc-verde, #034C21);
}

.vc-agenda__mes {
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--vc-tinta-3, #8A8F86);
}

.vc-agenda__cuenta {
	margin-top: 6px;
	padding: 3px 11px;
	font-size: 0.72rem;
	font-weight: 700;
	color: #FFFFFF;
	background: var(--vc-verde-vivo, #69A04F);
	border-radius: var(--vc-pill);
}

/* =========================================================================
   15. MÓVIL
   ========================================================================= */

@media (max-width: 900px) {
	.vc-tarjeta__rail {
		flex-basis: 132px;
	}
}

@media (max-width: 782px) {

	.vc-buscador {
		padding: 18px 18px;
	}

	.vc-buscador__linea {
		flex-direction: column;
		align-items: stretch;
	}

	.vc-buscador__campo,
	.vc-buscador__campo--ancho {
		flex: 1 1 auto;
		min-width: 0;
	}

	.vc-buscador__enviar {
		width: 100%;
		justify-content: center;
	}

	/* Lo secundario se pliega. El checkbox no lleva name, así que no viaja
	   en la URL y no ensucia los enlaces compartibles. */
	.vc-buscador__mas {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		margin-top: 14px;
		padding: 10px 18px;
		font-size: 0.88rem;
		font-weight: 600;
		color: var(--vc-verde, #034C21);
		background: var(--vc-papel, #FFFFFF);
		border-radius: var(--vc-pill);
		box-shadow: var(--vc-sombra-1);
		cursor: pointer;
		user-select: none;
	}

	.vc-buscador__mas::after {
		content: "▾";
		font-size: 0.78rem;
	}

	.vc-buscador__toggle:checked ~ .vc-buscador__mas::after {
		content: "▴";
	}

	.vc-buscador__toggle:focus-visible ~ .vc-buscador__mas {
		outline: 2px solid var(--vc-verde-vivo, #69A04F);
		outline-offset: 2px;
	}

	.vc-buscador__extra {
		display: none;
		margin-top: 14px;
	}

	.vc-buscador__toggle:checked ~ .vc-buscador__extra {
		display: flex;
	}

	.vc-buscador__mas-cerrar {
		display: none;
	}

	.vc-buscador__toggle:checked ~ .vc-buscador__mas .vc-buscador__mas-abrir {
		display: none;
	}

	.vc-buscador__toggle:checked ~ .vc-buscador__mas .vc-buscador__mas-cerrar {
		display: inline;
	}

	.vc-buscador__campo--fecha {
		flex: 1 1 45%;
		min-width: 0;
	}

	/* La tarjeta se apila y el rail se convierte en una fila: en vertical,
	   ciento cincuenta píxeles de columna izquierda son media pantalla. */
	.vc-tarjeta {
		flex-direction: column;
		gap: 14px;
		padding: 20px;
	}

	.vc-tarjeta:hover {
		transform: none;
	}

	/* El degradado se retira —en 375 px teñiría media tarjeta— pero el canto
	   se queda a la izquierda. Probado arriba, una sombra `inset` horizontal
	   sobre una caja redondeada se curva por las esquinas y parece un anillo
	   a medio dibujar; en vertical se lee limpia. */
	.vc-tarjeta--inminente,
	.vc-tarjeta--cercana {
		background: var(--vc-papel, #FFFFFF);
	}

	.vc-tarjeta__rail {
		flex: 0 0 auto;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		gap: 10px;
	}

	.vc-cuenta {
		flex-direction: row;
		align-items: baseline;
		flex-wrap: wrap;
		gap: 8px;
		width: auto;
		padding: 10px 16px;
	}

	.vc-cuenta__numero {
		font-size: 1.4rem;
	}

	.vc-cuenta__hito {
		flex: 1 1 100%;
		margin-top: 0;
	}

	.vc-tarjeta__titulo {
		font-size: 1.14rem;
	}

	.vc-ficha {
		padding: 18px;
	}

	.vc-ficha__datos {
		grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
		gap: 14px 18px;
	}

	.vc-tablero__rejilla {
		grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
		gap: 10px;
	}

	.vc-cifra {
		padding: 18px 18px 16px;
	}

	.vc-cifra__valor {
		font-size: 2rem;
	}

	.vc-dist,
	.vc-proposicion {
		padding: 18px;
	}

	.vc-fuente {
		width: 100%;
		justify-content: space-between;
	}

	.vc-agenda__fecha {
		flex-direction: row;
		align-items: baseline;
		gap: 8px;
	}

	.vc-agenda__dia {
		font-size: 1.5rem;
	}
}

/* Una pantalla ancha con el listado metido en una columna estrecha no la
   detecta ningún `@media`: la ventana sigue siendo grande. Esto sí. */
@container (max-width: 620px) {

	.vc-listado .vc-tarjeta {
		flex-direction: column;
		gap: 14px;
	}

	.vc-listado .vc-tarjeta__rail {
		flex: 0 0 auto;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
	}

	.vc-listado .vc-cuenta {
		flex-direction: row;
		align-items: baseline;
		flex-wrap: wrap;
		gap: 8px;
		width: auto;
	}

	.vc-listado .vc-cuenta__numero {
		font-size: 1.4rem;
	}

	.vc-listado .vc-cuenta__hito {
		flex: 1 1 100%;
		margin-top: 0;
	}
}

/* =========================================================================
   16. IMPRESIÓN Y MOVIMIENTO REDUCIDO
   ========================================================================= */

@media print {

	.vc-buscador,
	.vc-aplicados,
	.vc-paginacion,
	.vc-cifra__ir {
		display: none !important;
	}

	.vc-scope {
		color: #000;
	}

	.vc-tarjeta,
	.vc-cifra,
	.vc-dist,
	.vc-proposicion {
		box-shadow: none;
		border: 1px solid #CCC;
		/* Que un proyecto no se parta entre dos hojas: impreso, la mitad de
		   una ficha no sirve para nada. */
		break-inside: avoid;
		page-break-inside: avoid;
	}

	.vc-tarjeta {
		background: none;
	}

	/* En papel el enlace no se puede pulsar: se escribe. */
	.vc-fuente::after,
	.vc-tramite__titulo[href]::after {
		content: " (" attr(href) ")";
		font-size: 0.72em;
		font-weight: 400;
		word-break: break-all;
	}
}

@media (prefers-reduced-motion: reduce) {

	.vc-scope *,
	.vc-scope *::before,
	.vc-scope *::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}

	.vc-tarjeta:hover,
	.vc-boton:hover,
	.vc-fuente:hover,
	.vc-cifra--enlace:hover {
		transform: none;
	}
}

/* Contraste alto: los tokens ceden y mandan los colores del sistema. */
@media (forced-colors: active) {

	.vc-sentido,
	.vc-tarjeta,
	.vc-cifra,
	.vc-dist {
		border: 1px solid CanvasText;
	}

	.vc-dist__tramo,
	.vc-cifra__relleno,
	.vc-resumen__parte {
		forced-color-adjust: none;
	}
}