/* Cliente (2026-09-11, Confluence "¿Qué es el absentismo laboral?"): "haz
 * especial enfasis en replicar 1:1 el sidebar" -- segunda pasada, medido
 * elemento por elemento contra umivaleactiva.es
 * (aria-label="auxNavigation-component", clases .auxlink/.auxlink-2 de
 * Liferay), no solo color/peso como la primera pasada:
 *   - Contenedor: padding 0 15px (no 8px 0 -- el padding real es horizontal).
 *   - Título (h2.tree-toggler.nav-header): 20.8px/700/#3C4858, margin
 *     0 0 10px, SIN margen horizontal (ocupa el ancho completo disponible).
 *   - .line-title (la "línea divisoria" que asumí en la primera pasada):
 *     medida real 0x0 -- el original NO la renderiza visible. Se saca acá.
 *   - Link: padding 5px 25px 5px 10px (no 10px 16px 10px 20px),
 *     line-height 24px (no 1.4).
 *   - Ícono: NO es flex/order -- es position:absolute; top:6px; right:0
 *     dentro de un <a> position:relative, 24px, color #3C4858. Replicado el
 *     posicionamiento; el glifo en sí sigue siendo "›" (el original usa
 *     Material Icons vía ligature "keyboard_arrow_right", que implicaría
 *     sumar una fuente de íconos completa al sitio solo por este detalle --
 *     no se agregó, queda como diferencia menor conocida).
 *   - Cada <li> con borde inferior 0.8px solid #e0e0e0 (confirmado, sin
 *     cambio de la primera pasada). */
/* El ancho real lo fija theme.css ("Layout con sidebar": 24% de la card, =336px
 * a 1400px, igual que el original). Acá queda un ancho por defecto para el
 * editor/preview, donde no existe `.card-flotante .page__sidebar-row`.
 * SIN border-right: medido en umivaleactiva.es, la columna del sidebar no
 * tiene borde ni fondo -- la separación con el contenido es solo el gutter. */
.umivale-sidebar-prestaciones {
	width: 280px;
	min-width: 0;
	flex-shrink: 0;
	align-self: stretch;
	/* Cliente (2026-09-14): "el titulo esta alineado con el breadcrumb" -- en
	 * el original NO deberían estarlo: medido en umivaleactiva.es, tanto el
	 * primer link del breadcrumb como el título del sidebar arrancan en el
	 * mismo x = borde de la card + 30px (el breadcrumb ya estaba validado así,
	 * ver theme.css ".breadcrumbs"). El padding-left de acá (15px) solo cubría
	 * la mitad de ese offset -- las columnas Bootstrap del original suman un
	 * extra ~15px (margen negativo del `.row`) que nuestro layout con flex no
	 * replica.
	 * Cliente (2026-09-18, repetido dos veces): "hay mucho espacio entre los
	 * saltos de linea" / "deben ser mas chicos". La columna real mide 316px
	 * de contenido en producción (padding simétrico 15/15 sobre 346px de
	 * columna); acá, con 30px a la izquierda para el alineado del breadcrumb
	 * + 15px a la derecha, quedaban sólo 301px -- 15px de menos hacían
	 * envolver a una línea de más el ítem más largo ("Accidente de trabajo y
	 * enfermedad profesional, ¿qué debe saber la empresa?": 3 líneas en vez
	 * de 2). Se saca el padding derecho (que no cumple ninguna función
	 * documentada) para recuperar esos 15px sin tocar el ancho de la columna
	 * ni la fórmula del CTA fullscreen, que dependen de que el sidebar mida
	 * 25% -- esto sólo mueve padding interno, no el ancho total.
	 */
	padding: 10px 15px 0 30px;
}
/* `sidebar-promocion-salud/style.css` (y probablemente `sidebar-prevencion/
 * style.css`) tienen su PROPIA copia pegada de la regla de arriba para la
 * misma clase `.umivale-sidebar-prestaciones` (arquitectura de bloques
 * hermanos con CSS duplicado, no reusado) y se cargan sitewide con la MISMA
 * especificidad -- ganan por orden alfabético de carga ("promocion" >
 * "prestaciones"), pisando el `padding-right:0` de arriba. Confirmado en
 * producción que promocion-salud SÍ usa 15/15 simétrico (no se toca su
 * archivo, sin verificar si también necesita este ajuste). Se gana la
 * cascada acotando con la clase que sólo pone ESTE bloque
 * (`wp-block-umivale-sidebar-prestaciones`, generada por Gutenberg por
 * nombre de bloque) en vez de `!important` a ciegas sobre la clase
 * compartida. */
.wp-block-umivale-sidebar-prestaciones.umivale-sidebar-prestaciones {
	padding-right: 0;
}

/* Cliente (2026-09-21, Confluence #160, con captura): "revisa el
 * interlineado" -- sin `line-height` propio, este h2 heredaba el de una
 * escala tipográfica sitewide pensada para otro tamaño (48px, ratio ~2.3),
 * dejando un hueco enorme entre las 2 líneas del título cuando envuelve.
 * Medido en umivaleactiva.es: 27.04px (ratio 1.3, el mismo que ya usa el
 * link de abajo -- ver "line-height 24px" en el comentario de arriba,
 * ratio equivalente para su propio tamaño de fuente). */
.umivale-sidebar-prestaciones__title {
	font-size: 20.8px;
	line-height: 27.04px;
	font-weight: 700;
	color: #3C4858;
	margin: 0 0 10px;
}

.umivale-sidebar-prestaciones__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.umivale-sidebar-prestaciones__list li {
	padding: 0 0 5px;
	border-bottom: 0.8px solid #e0e0e0;
}
.umivale-sidebar-prestaciones__list li:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.umivale-sidebar-prestaciones__link {
	display: block;
	position: relative;
	padding: 5px 25px 5px 10px;
	color: #3C4858;
	font-size: var(--uv-parrafo-s);
	font-weight: 300;
	text-decoration: none;
	line-height: 24px;
	transition: font-weight 0.15s;
}

/* Cliente (2026-09-14): "revisa el sidebar para replicar el hover que
 * tiene". Buscado en ese momento en las 3 hojas de estilo + 3 bloques
 * <style> inline del original: ningún selector tenía :hover con NEGRITA
 * (eso sí era incorrecto, se sacó). Pero no se había probado el hover en
 * vivo con el mouse -- confirmado ahora (2026-09-16, revisión a fondo) que
 * SÍ hay un efecto real: `background-color:#eeeeee` (fondo gris claro, sin
 * bold, sin border-radius, ocupa el ancho completo del link ya que es
 * `display:block`). */
.umivale-sidebar-prestaciones__link.is-active {
	font-weight: 700;
}
.umivale-sidebar-prestaciones__link:hover {
	background-color: #eeeeee;
}

/* Cliente (2026-09-11): "Las flechas del sidebar tambien, son mas grandes en
 * el original". Medido: el original usa el ícono `keyboard_arrow_right` de
 * Material Icons en una caja de 24x24px; el carácter "›" que teníamos medía
 * 7x22px -- mucho más fino. Reemplazado por un SVG inline con el mismo path
 * de Material (24x24, currentColor), sin sumar una fuente de íconos entera. */
.umivale-sidebar-prestaciones__arrow {
	position: absolute;
	top: 6px;
	right: 0;
	display: block;
	width: 24px;
	height: 24px;
	color: #3C4858;
	line-height: 0;
}
.umivale-sidebar-prestaciones__arrow svg {
	display: block;
	width: 24px;
	height: 24px;
}

/* Submenú (sidebar-prevencion, ej. "Trastornos musculoesqueléticos"): medido
 * en umivaleactiva.es -- indentado 10px, sin flecha.
 * Cliente (2026-09-16, revisión a fondo): remedido con más cuidado -- el
 * nivel 2 mide 16px, IGUAL que el nivel 1 (var(--uv-parrafo-s)), no 14px
 * como decía la nota anterior (medición vieja incorrecta, confirmada mal en
 * dos árboles distintos: este y sidebar-promocion-salud). */
.umivale-sidebar-prestaciones__sublist {
	list-style: none;
	margin: 0;
	padding: 0 0 0 10px;
}
.umivale-sidebar-prestaciones__sublist li {
	border-bottom: none;
	padding: 0;
}
.umivale-sidebar-prestaciones__sublist .umivale-sidebar-prestaciones__link {
	padding-right: 10px;
}