/* =========================================================================
   HERRAMIENTAS  ·  [D-219, D-220 · v9.42.0]

   La sexta pestaña, y la hoja de equivalencias que vive en ella.

   UNA DECISIÓN DE FORMA QUE ES DE FONDO: las tarjetas del índice llevan, bajo
   la descripción, una línea con lo que la herramienta CONTESTA. Un índice que
   solo pone títulos obliga a entrar en cada una para saber cuál sirve; con la
   pregunta escrita se elige desde fuera, que es lo que hace falta cuando se
   abre esto con el paciente delante.

   TODO EN TOKENS, sin un solo literal.
   ========================================================================= */

.psf-herr{ padding-bottom:var(--pf-s-8); }

/* ── El índice ─────────────────────────────────────────────────────── */
.psf-herr__cab{ margin:0 0 var(--pf-s-6); }
.psf-herr__h1{
	margin:0 0 var(--pf-s-3); font-family:var(--pf-serif);
	font-size:var(--pf-fs-h1); line-height:1.1; color:var(--pf-brand-deep);
	text-wrap:balance;
}
.psf-herr__lead{
	margin:0 0 var(--pf-s-2); max-width:64ch;
	font-size:var(--pf-fs-body); line-height:1.6; color:var(--pf-ink-soft);
}
.psf-herr__nota{
	margin:0 0 var(--pf-s-3); max-width:64ch;
	font-size:var(--pf-fs-small); line-height:1.6; color:var(--pf-ink-faint-tx);
}

.psf-herr__rejilla{
	display:grid; gap:var(--pf-s-3);
	grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));
}
.psf-herr__t{
	display:block; padding:var(--pf-s-4);
	border:1px solid var(--pf-line); border-radius:var(--pf-r-md);
	background:var(--pf-surface); text-decoration:none;
	transition:border-color .12s, background .12s;
}
.psf-herr__t:hover{ border-color:var(--pf-brand-line); background:var(--pf-brand-tint); }
.psf-herr__t:focus-visible{ outline:3px solid var(--pf-ink); outline-offset:3px; }
.psf-herr__ic{
	display:block; width:var(--pf-s-6); height:var(--pf-s-6);
	margin-bottom:var(--pf-s-2); color:var(--pf-brand-tx);
}
.psf-herr__t-t{
	display:block; margin-bottom:var(--pf-s-2);
	font-family:var(--pf-serif); font-size:var(--pf-fs-h3);
	line-height:1.2; color:var(--pf-brand-deep);
}
.psf-herr__t-d{
	display:block; font-size:var(--pf-fs-small);
	line-height:1.55; color:var(--pf-ink-soft);
}
.psf-herr__t-q{
	display:block; margin-top:var(--pf-s-3); padding-top:var(--pf-s-2);
	border-top:1px solid var(--pf-line);
	font-family:var(--pf-mono); font-size:var(--pf-fs-micro);
	line-height:1.45; color:var(--pf-ink-faint-tx);
}

/* ── Dentro de una herramienta ─────────────────────────────────────── */
.psf-herr__migas{
	margin:0 0 var(--pf-s-4);
	font-size:var(--pf-fs-micro); color:var(--pf-ink-faint-tx);
}
.psf-herr__migas a{ color:var(--pf-brand-tx); }

.psf-herr__pie{ margin-top:var(--pf-s-8); }
.psf-herr__pie-h{
	margin:0 0 var(--pf-s-3); font-family:var(--pf-serif);
	font-size:var(--pf-fs-h3); line-height:1.2; color:var(--pf-brand-deep);
}
.psf-herr__otras{
	display:grid; gap:var(--pf-s-2);
	grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));
}
.psf-herr__otra{
	display:block; padding:var(--pf-s-3);
	border:1px solid var(--pf-line); border-radius:var(--pf-r-sm);
	background:var(--pf-surface); text-decoration:none;
}
.psf-herr__otra:hover{ border-color:var(--pf-brand-line); }
.psf-herr__otra:focus-visible{ outline:3px solid var(--pf-ink); outline-offset:3px; }
.psf-herr__otra-t{
	display:block; font-size:var(--pf-fs-small);
	font-weight:var(--pf-w-semibold); color:var(--pf-brand-tx);
}
.psf-herr__otra-q{
	display:block; margin-top:var(--pf-s-1);
	font-size:var(--pf-fs-micro); line-height:1.45; color:var(--pf-ink-faint-tx);
}

/* ── La tarjeta que queda en el capítulo ───────────────────────────── */
.psf-herr__salto-a{
	display:block; padding:var(--pf-s-4);
	border:2px solid var(--pf-brand-line); border-radius:var(--pf-r-md);
	background:var(--pf-brand-tint); text-decoration:none;
}
.psf-herr__salto-a:hover{ border-color:var(--pf-brand-tx); }
.psf-herr__salto-a:focus-visible{ outline:3px solid var(--pf-ink); outline-offset:3px; }
.psf-herr__salto-e{
	display:block; font-family:var(--pf-mono);
	font-size:var(--pf-fs-micro); letter-spacing:.08em; text-transform:uppercase;
	color:var(--pf-ink-faint-tx);
}
.psf-herr__salto-t{
	display:block; margin:var(--pf-s-1) 0 var(--pf-s-2);
	font-family:var(--pf-serif); font-size:var(--pf-fs-h3);
	line-height:1.2; color:var(--pf-brand-deep);
}
.psf-herr__salto-d{
	display:block; font-size:var(--pf-fs-small);
	line-height:1.55; color:var(--pf-ink-soft);
}
.psf-herr__salto-i{
	display:block; margin-top:var(--pf-s-2);
	font-size:var(--pf-fs-small); font-weight:var(--pf-w-semibold);
	color:var(--pf-brand-tx);
}

/* ── El índice de hojas de paciente ────────────────────────────────── */
.psf-herr__hojas-l{
	display:grid; gap:var(--pf-s-3); margin:var(--pf-s-4) 0;
	grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));
}
.psf-herr__hoja{
	display:block; padding:var(--pf-s-4);
	border:1px solid var(--pf-line); border-radius:var(--pf-r-md);
	background:var(--pf-surface); text-decoration:none;
}
.psf-herr__hoja:hover{ border-color:var(--pf-brand-line); }
.psf-herr__hoja:focus-visible{ outline:3px solid var(--pf-ink); outline-offset:3px; }
.psf-herr__hoja-t{
	display:block; margin-bottom:var(--pf-s-2);
	font-family:var(--pf-serif); font-size:var(--pf-fs-h3);
	line-height:1.2; color:var(--pf-brand-deep);
}
.psf-herr__hoja-d{
	display:block; font-size:var(--pf-fs-small);
	line-height:1.55; color:var(--pf-ink-soft);
}
.psf-herr__hoja-i{
	display:block; margin-top:var(--pf-s-2);
	font-size:var(--pf-fs-small); font-weight:var(--pf-w-semibold);
	color:var(--pf-brand-tx);
}

/* =========================================================================
   LA HOJA DE EQUIVALENCIAS
   ========================================================================= */

.psf-eq{ padding-bottom:var(--pf-s-6); }
.psf-eq__h1{
	margin:0 0 var(--pf-s-3); font-family:var(--pf-serif);
	font-size:var(--pf-fs-h1); line-height:1.1; color:var(--pf-brand-deep);
	text-wrap:balance;
}
.psf-eq__lead{
	margin:0 0 var(--pf-s-4); max-width:64ch;
	font-size:var(--pf-fs-body); line-height:1.6; color:var(--pf-ink-soft);
}
.psf-eq__h2{
	margin:var(--pf-s-8) 0 var(--pf-s-3); font-family:var(--pf-serif);
	font-size:var(--pf-fs-h3); line-height:1.2; color:var(--pf-brand-deep);
}

/* El aviso va ARRIBA de la tabla y no al pie. Una advertencia que explica qué
   significa la cifra, puesta después de la cifra, llega tarde. */
.psf-eq__aviso{
	background:var(--pf-warn-tint); border-left:4px solid var(--pf-warn);
	border-radius:0 var(--pf-r-sm) var(--pf-r-sm) 0;
	padding:var(--pf-s-3) var(--pf-s-4); margin:0 0 var(--pf-s-6);
}
.psf-eq__aviso p{
	margin:0 0 var(--pf-s-2); font-size:var(--pf-fs-small);
	line-height:1.6; color:var(--pf-ink);
}
.psf-eq__aviso p:last-child{ margin-bottom:0; }
.psf-eq__aviso-2{ color:var(--pf-ink-soft); }

.psf-eq__ancla{
	display:flex; flex-wrap:wrap; align-items:center; gap:var(--pf-s-2);
	margin:0 0 var(--pf-s-4); font-size:var(--pf-fs-small);
}
.psf-eq__ancla label{ color:var(--pf-ink-soft); }
.psf-eq__ancla select,
.psf-eq__ancla input{
	padding:var(--pf-s-2) var(--pf-s-3); max-width:100%; box-sizing:border-box;
	border:1px solid var(--pf-line); border-radius:var(--pf-r-sm);
	background:var(--pf-surface); color:var(--pf-ink);
	font-family:var(--pf-sans); font-size:var(--pf-fs-small);
}
.psf-eq__ancla input{ width:7rem; }
.psf-eq__ancla select:focus-visible,
.psf-eq__ancla input:focus-visible{ outline:3px solid var(--pf-ink); outline-offset:2px; }
.psf-eq__conu{ display:flex; align-items:center; gap:var(--pf-s-2); }
.psf-eq__u{
	font-family:var(--pf-sans); font-size:var(--pf-fs-micro);
	color:var(--pf-ink-faint-tx);
}

.psf-eq__scroll{ overflow-x:auto; margin:0 0 var(--pf-s-4); }
.psf-eq__tabla{ width:100%; border-collapse:collapse; font-size:var(--pf-fs-small); }
.psf-eq__tabla th,
.psf-eq__tabla td{
	padding:var(--pf-s-2) var(--pf-s-3);
	border-bottom:1px solid var(--pf-line);
	text-align:left; vertical-align:top;
}
.psf-eq__tabla thead th{
	font-size:var(--pf-fs-micro); color:var(--pf-ink-soft);
	border-bottom:2px solid var(--pf-line);
}
.psf-eq__tabla tbody th{ font-weight:var(--pf-w-semibold); color:var(--pf-ink); }
.psf-eq__tabla td{ font-family:var(--pf-mono); color:var(--pf-ink); }
.psf-eq__rot{
	display:block; font-family:var(--pf-sans); font-weight:400;
	font-size:var(--pf-fs-micro); color:var(--pf-ink-faint-tx);
}
.psf-eq__ref{ background:var(--pf-brand-tint); }
.psf-eq__ref th, .psf-eq__ref td{ border-bottom-color:var(--pf-brand-line); }

/* ── Los tres métodos, arriba del todo ─────────────────────────────── */
/* Tres tarjetas y no un párrafo: lo que hay que entender antes de mirar una
   sola cifra es que son TRES cosas distintas, y tres cajas lo dicen sin
   necesidad de leerlas. */
.psf-eq__metodos{
	display:grid; gap:var(--pf-s-3); margin:0 0 var(--pf-s-4);
	grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));
}
.psf-eq__m{
	padding:var(--pf-s-3); background:var(--pf-surface);
	border:1px solid var(--pf-line); border-radius:var(--pf-r-md);
}
.psf-eq__m-e{
	display:block; font-family:var(--pf-mono);
	font-size:var(--pf-fs-micro); letter-spacing:.08em; text-transform:uppercase;
	color:var(--pf-ink-faint-tx);
}
.psf-eq__m-t{
	display:block; margin:var(--pf-s-1) 0 var(--pf-s-2);
	font-family:var(--pf-serif); font-weight:400;
	font-size:var(--pf-fs-h3); line-height:1.2; color:var(--pf-brand-deep);
}
.psf-eq__m p{
	margin:0; font-size:var(--pf-fs-micro); line-height:1.5; color:var(--pf-ink-soft);
}

.psf-eq__p{
	margin:0 0 var(--pf-s-3); max-width:64ch;
	font-size:var(--pf-fs-small); line-height:1.6; color:var(--pf-ink-soft);
}
.psf-eq__p b{ color:var(--pf-ink); }
/* La frase que resume por qué la página no da una sola cifra. */
.psf-eq__p--sub{
	padding-left:var(--pf-s-3); border-left:3px solid var(--pf-brand-line);
	color:var(--pf-ink);
}

.psf-eq__base{ display:flex; align-items:center; gap:var(--pf-s-2); }

/* El dato que falta se ve, y no se confunde con un cero. */
.psf-eq__no{ color:var(--pf-ink-faint-tx); cursor:help; }
.psf-eq__meta{
	display:block; margin-top:var(--pf-s-1);
	font-family:var(--pf-sans); font-size:var(--pf-fs-micro);
	line-height:1.4; color:var(--pf-ink-faint-tx);
}

.psf-eq__leer{
	margin:0 0 var(--pf-s-4); padding-left:var(--pf-s-4);
	font-size:var(--pf-fs-small); line-height:1.6; color:var(--pf-ink-soft);
}
.psf-eq__leer li{ margin-bottom:var(--pf-s-2); }
.psf-eq__leer b{ color:var(--pf-ink); }

.psf-eq__hueco{
	margin:var(--pf-s-6) 0; padding:var(--pf-s-3) var(--pf-s-4);
	border:1px solid var(--pf-line); border-radius:var(--pf-r-md);
	background:var(--pf-paper-alt);
}
.psf-eq__hueco p{ margin:0 0 var(--pf-s-2); font-size:var(--pf-fs-small); line-height:1.6; color:var(--pf-ink-soft); }
.psf-eq__falta{ color:var(--pf-ink); }
.psf-eq__falta-2{ margin-bottom:0; }
.psf-eq__ausentes{
	margin:0 0 var(--pf-s-3); padding-left:var(--pf-s-4);
	font-size:var(--pf-fs-small); line-height:1.6; color:var(--pf-ink-soft);
}
.psf-eq__fuente{ margin:var(--pf-s-6) 0 0; }
.psf-eq__cita{
	display:block; margin-top:var(--pf-s-1);
	font-size:var(--pf-fs-micro); line-height:1.45; color:var(--pf-ink-faint-tx);
	overflow-wrap:anywhere;
}
/* La cita de la que sale CADA cifra de la tabla no va en letra de nota al pie
   escondida: va entera y legible. Es la única fuente de la página. */
.psf-eq__cita--prin{ color:var(--pf-ink-soft); }

/* ── El móvil ──────────────────────────────────────────────────────── */
/* La tabla se apila en fichas, con los rótulos en el HTML (data-r). Misma
   solución que en la de retirada y en la del cruce. */
@media (max-width:640px){
	.psf-eq__scroll{ overflow-x:visible; }
	.psf-eq__tabla,
	.psf-eq__tabla tbody,
	.psf-eq__tabla tr,
	.psf-eq__tabla td,
	.psf-eq__tabla th{ display:block; width:auto; }
	.psf-eq__tabla thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
	.psf-eq__tabla tr{
		margin-bottom:var(--pf-s-3); padding:var(--pf-s-2);
		border:1px solid var(--pf-line); border-radius:var(--pf-r-sm);
	}
	.psf-eq__tabla tbody th{
		border-bottom:1px solid var(--pf-line);
		margin-bottom:var(--pf-s-2);
	}
	.psf-eq__tabla td{ border-bottom:0; padding:var(--pf-s-1) var(--pf-s-2); }
	.psf-eq__tabla td::before{
		content:attr(data-r) ": ";
		font-family:var(--pf-sans); font-size:var(--pf-fs-micro);
		color:var(--pf-ink-faint-tx);
	}
	.psf-eq__ancla input{ width:6rem; }
}
