/* laboral.css — reglas propias de esta herramienta (fase 1, 20-10-2026: salieron de herramientas.css).
   Se carga DETRÁS de herramientas.css, que trae los tokens --herr-* y las piezas comunes .lt-herr__*.
   Solo esta herramienta toca este fichero. */

/* ==========================================================================
   Calculadora laboral (finiquito / liquidación / indemnización)
   De aquí al final, solo reglas .lt-herr-laboral__*: no se toca ninguna regla
   de días hábiles (lo prueba herramientas/tests/test_laboral_render.py).

   Tokens: los --herr-* de .lt-herr, que son los --lt-* de legaltica-ds.css con
   su valor de reserva (el embebible solo carga esta hoja). No hay colores
   nuevos: el ámbar de «depende de un juez» es el de la banda (--herr-banda-*)
   y el verde de «lo que te deben seguro» es el de «cuenta» (--herr-cuenta-*).
   El rojo de marca queda para UNA cosa por resultado: el total.

   Nada de estilos en línea (CSP sin 'unsafe-inline'): las barras de
   «Comparar» son <rect width="…%"> de SVG, que es un atributo de presentación.
   ========================================================================== */

/* --- Paso 01: la pregunta que se abre dentro del paso («¿Qué dice la carta?») ---
   Sin :has (navegadores viejos) se ve siempre y no pasa nada: el servidor ignora
   la respuesta si el motivo no es despido. */
.lt-herr-laboral__sub {
  position: relative; margin: 14px 0 0; padding: 16px; min-width: 0;
  border: 1px solid var(--herr-divider); border-radius: 14px; background: var(--herr-canvas);
}
/* Muesca que apunta a la tarjeta de arriba: la pregunta nace de «Me despidieron» */
.lt-herr-laboral__sub::before {
  content: ''; position: absolute; top: -7px; left: 28px; width: 12px; height: 12px;
  border-top: 1px solid var(--herr-divider); border-left: 1px solid var(--herr-divider);
  background: var(--herr-canvas); transform: rotate(45deg);
}
.lt-herr-laboral__sub-titulo {
  float: left; width: 100%; margin: 0 0 12px; padding: 0;
  font-family: var(--herr-font-head); font-size: 17px; font-weight: 600; line-height: 1.25; color: var(--herr-ink);
}
.lt-herr-laboral__sub-titulo + * { clear: both; }
.lt-herr-laboral__sub .lt-herr__tipo { background: var(--herr-surface); }
.lt-herr__form:not(:has(input[name="motivo"][value="despido"]:checked)) .lt-herr-laboral__sub { display: none; }
@media (prefers-reduced-motion: no-preference) {
  .lt-herr-laboral__sub { animation: lt-herr-laboral-entra .25s ease-out; }
}
@keyframes lt-herr-laboral-entra { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* --- Descarte: sector público, empleo doméstico, alta dirección --- */
.lt-herr-laboral__descarte {
  display: flex; align-items: flex-start; gap: 12px; margin-top: 14px; min-height: 44px; padding: 12px 14px;
  border: 1px dashed var(--herr-border-fuerte); border-radius: 12px; cursor: pointer;
  font-size: 14px; line-height: 1.45; color: var(--herr-text-2);
}
.lt-herr-laboral__descarte input {
  flex: none; width: 22px; height: 22px; margin: 0; accent-color: var(--herr-ink); cursor: pointer;
}
.lt-herr-laboral__descarte input:focus-visible { outline: 3px solid var(--herr-primary); outline-offset: 2px; }
.lt-herr-laboral__descarte:has(input:checked) { border-style: solid; border-color: var(--herr-ink); color: var(--herr-ink); }
.lt-herr-laboral__descarte-aviso {
  display: none; flex-direction: column; gap: 12px; margin-top: 10px; padding: 16px;
  border: 1px solid var(--herr-banda-borde); border-radius: 12px; background: var(--herr-banda-bg); color: var(--herr-banda-ink);
}
.lt-herr-laboral__descarte-aviso p { margin: 0; font-size: 14px; line-height: 1.55; }
.lt-herr-laboral__descarte-aviso strong { color: var(--herr-ink); }
.lt-herr__form:has(.lt-herr-laboral__descarte input:checked) .lt-herr-laboral__descarte-aviso { display: flex; }
/* Con el descarte marcado no se calcula: fuera los pasos 02 y 03, «Afinar» y «Calcular» */
.lt-herr__form:has(.lt-herr-laboral__descarte input:checked) .lt-herr-laboral__sin-descarte { display: none; }
.lt-herr-laboral__descarte-aviso .lt-herr__cta-boton { align-self: flex-start; }

/* --- Campos: pista bajo el campo y defecto dicho en pantalla --- */
.lt-herr-laboral__pista { font-size: 13px; font-weight: 500; line-height: 1.45; color: var(--herr-muted); }
.lt-herr-laboral__defecto {
  display: inline-block; margin-left: 6px; padding: 2px 8px; border-radius: 999px; background: var(--herr-hundido);
  font-size: 12px; font-weight: 600; color: var(--herr-text-2); white-space: nowrap;
}

/* Campos que dependen de otra respuesta (PROPUESTA §5): mismo patrón que __sub, con :has y sin JS.
   Sin :has la regla no vale y el campo se ve siempre; el servidor ignora lo que no aplica. */
.lt-herr__form:has(input[name="pagas"][value="12"]:checked) .lt-herr-laboral__si-prorrata,
.lt-herr__form:has(input[name="periodo"][value="anual"]:checked) .lt-herr-laboral__si-prorrata { display: none; }
.lt-herr__form:not(:has(input[name="contrato"][value="fijo"]:checked, input[name="contrato"][value="obra"]:checked)) .lt-herr-laboral__si-pactado { display: none; }
.lt-herr__form:not(:has(input[name="liquidacion"][value="tarde"]:checked)) .lt-herr-laboral__si-tarde { display: none; }

/* Campos que no tienen por qué ocupar todo el ancho (stepper de vacaciones en «Afinar») */
.lt-herr-laboral__campo-corto { width: 100%; max-width: 320px; }

/* --- Importe con moneda (mismo marco que el stepper −/+) --- */
.lt-herr-laboral__dinero {
  display: flex; align-items: stretch; height: 50px; overflow: hidden; border: 1.5px solid var(--herr-border);
  border-radius: var(--herr-r-ctl); background: var(--herr-surface); transition: border-color .2s, box-shadow .2s;
}
.lt-herr-laboral__dinero:focus-within { border-color: var(--herr-ink); box-shadow: 0 0 0 4px rgba(22, 32, 46, .08); }
.lt-herr-laboral__dinero .lt-herr__control {
  flex: 1; min-width: 0; height: 100%; border: 0; border-radius: 0; box-shadow: none;
  font-family: var(--herr-font-head); font-size: 20px; font-weight: 600; font-variant-numeric: tabular-nums;
}
.lt-herr-laboral__dinero .lt-herr__control:focus { box-shadow: none; }
.lt-herr-laboral__moneda {
  flex: none; display: flex; align-items: center; padding: 0 14px; background: var(--herr-canvas);
  font-family: var(--herr-font-head); font-size: 14px; font-weight: 600; color: var(--herr-text-2);
}
.lt-herr-laboral__moneda:first-child { border-right: 1px solid var(--herr-divider); }
.lt-herr-laboral__moneda:last-child { border-left: 1px solid var(--herr-divider); }
.lt-herr-laboral__campo-error .lt-herr-laboral__dinero,
.lt-herr-laboral__campo-error > .lt-herr__control { border-color: var(--herr-error-ink); }

/* Segmentado de dos opciones (periodo, pagas, ¿prorrateadas?): el de días hábiles es de tres */
.lt-herr__seg.lt-herr-laboral__seg--2 { grid-template-columns: repeat(2, 1fr); }

/* --- «Calculando…» (lo marca el JS mientras llega el fragmento) --- */
.lt-herr-laboral__salida[aria-busy="true"] > * { opacity: .45; transition: opacity .2s; }
.lt-herr-laboral__calcular[aria-busy="true"] { pointer-events: none; }
.lt-herr-laboral__calcular[aria-busy="true"]::after {
  content: ''; width: 18px; height: 18px; border: 2.5px solid rgba(255, 255, 255, .45); border-top-color: #fff;
  border-radius: 999px; animation: lt-herr-laboral-gira .8s linear infinite;
}
@keyframes lt-herr-laboral-gira { to { transform: rotate(360deg); } }

/* ==========================================================================
   Resultado
   ========================================================================== */

/* Tres escenarios (CL, algún caso de MX): a 360 px no caben tres columnas.
   En móvil, una fila por escenario con el nombre a la izquierda y el total a la derecha. */
.lt-herr__pestanas.lt-herr-laboral__pestanas--3 { grid-template-columns: 1fr; }
.lt-herr-laboral__pestanas--3 .lt-herr__pestana { flex-direction: row; align-items: baseline; justify-content: space-between; gap: 12px; }
@media (min-width: 640px) {
  .lt-herr__pestanas.lt-herr-laboral__pestanas--3 { grid-template-columns: repeat(3, 1fr); }
  .lt-herr-laboral__pestanas--3 .lt-herr__pestana { flex-direction: column; align-items: stretch; }
}
.lt-herr-laboral__pestana-total { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* La columna izquierda mide lo que mide la tarjeta: la cifra se ajusta a ella, no a la ventana */
.lt-herr-laboral__principal { container-type: inline-size; }

/* Condición ENCIMA de la cifra: ámbar = «depende de un juez» en toda la herramienta */
.lt-herr-laboral__condicion {
  display: flex; align-items: flex-start; gap: 10px; margin: 0; padding: 10px 12px;
  border: 1px solid var(--herr-banda-borde); border-radius: 10px; background: var(--herr-banda-bg);
  font-size: 14px; font-weight: 700; line-height: 1.4; color: var(--herr-banda-ink);
}
.lt-herr-laboral__condicion svg { flex: none; margin-top: 1px; }
.lt-herr-laboral__seguro {
  display: flex; align-items: flex-start; gap: 10px; margin: 0; padding: 10px 12px; border-radius: 10px;
  background: var(--herr-cuenta-bg); font-size: 14px; font-weight: 700; line-height: 1.4; color: var(--herr-cuenta-ink);
}
.lt-herr-laboral__seguro svg { flex: none; margin-top: 1px; }

.lt-herr-laboral__total { display: flex; flex-direction: column; gap: 4px; }
.lt-herr-laboral__total p { margin: 0; }
.lt-herr-laboral__total-pre { font-size: 17px; color: var(--herr-ink-soft); }
.lt-herr-laboral__cifra {
  display: block; max-width: 100%; overflow-wrap: anywhere;
  font-family: var(--herr-font-head); font-weight: 700; line-height: 1; letter-spacing: -.03em;
  font-variant-numeric: tabular-nums; color: var(--herr-primary);
  font-size: clamp(36px, 11vw, 64px);             /* sin container queries */
}
@supports (font-size: 1cqi) {
  /* 12 caracteres («$11.861.333») caben a 360 px: 13cqi ≈ 41 px en una columna de 318 px */
  .lt-herr-laboral__cifra { font-size: clamp(34px, 13cqi, 64px); }
}
.lt-herr-laboral__dec { font-size: .5em; letter-spacing: 0; vertical-align: .62em; margin-left: .04em; }
.lt-herr-laboral__bruto { font-size: 14px; font-weight: 600; color: var(--herr-text-2); }

/* Reparto: Finiquito / Indemnización bajo la cifra. Filas, no columnas: los importes
   de CO (12 caracteres) no caben en tres columnas a 360 px. */
.lt-herr-laboral__reparto {
  margin: 0; overflow: hidden; border: 1px solid var(--herr-border); border-radius: var(--herr-r-ctl); background: var(--herr-surface);
}
.lt-herr-laboral__reparto > div {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 11px 14px;
  border-top: 1px solid var(--herr-divider);
}
.lt-herr-laboral__reparto > div:first-child { border-top: 0; }
.lt-herr-laboral__reparto dt { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 14px; font-weight: 600; color: var(--herr-text-2); }
.lt-herr-laboral__reparto dd {
  flex: none; margin: 0; font-family: var(--herr-font-head); font-size: 18px; font-weight: 600;
  font-variant-numeric: tabular-nums; color: var(--herr-ink); white-space: nowrap;
}
.lt-herr-laboral__marca { flex: none; width: 10px; height: 10px; border-radius: 3px; }
.lt-herr-laboral__marca--seguro { background: var(--herr-cuenta-ink); }
.lt-herr-laboral__marca--motivo { background: var(--herr-ink); }
.lt-herr-laboral__marca--juez { background: var(--herr-banda-ink); }

/* --- Desglose por concepto: lista, no tabla. Cada concepto, tres líneas a 360 px:
       nombre ......... importe
       fórmula con sus números
       norma ↗                                                             --- */
.lt-herr-laboral__desglose { display: flex; flex-direction: column; gap: 26px; }
.lt-herr-laboral__desglose-h {
  margin: 0; font-family: var(--herr-font-head); font-size: clamp(19px, 2vw, 22px); font-weight: 600; color: var(--herr-ink);
}
.lt-herr-laboral__grupo { margin: 0; }
.lt-herr-laboral__grupo-cab {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 2px 14px;
  padding-bottom: 10px; border-bottom: 2px solid var(--herr-ink);
}
.lt-herr-laboral__grupo-h {
  display: flex; align-items: center; gap: 9px; margin: 0; font-family: var(--herr-font-head); font-size: 18px; font-weight: 600;
  color: var(--herr-ink);
}
.lt-herr-laboral__grupo-sub {
  margin: 0; font-family: var(--herr-font-head); font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums;
  color: var(--herr-ink); white-space: nowrap;
}
.lt-herr-laboral__grupo-desc { grid-column: 1 / -1; margin: 0; font-size: 13.5px; line-height: 1.45; color: var(--herr-text-2); }
.lt-herr-laboral__grupo--seguro .lt-herr-laboral__grupo-cab { border-bottom-color: var(--herr-cuenta-ink); }
.lt-herr-laboral__conceptos { margin: 0; padding: 0; list-style: none; }
.lt-herr-laboral__concepto {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "nombre importe" "formula formula" "norma norma";
  gap: 4px 16px; padding: 14px 0; border-bottom: 1px solid var(--herr-divider);
}
@media (min-width: 768px) {
  /* Con sitio, el importe se queda en su columna y la fórmula no pasa por debajo */
  .lt-herr-laboral__concepto { grid-template-areas: "nombre importe" "formula importe" "norma importe"; }
}
.lt-herr-laboral__concepto-nombre { grid-area: nombre; margin: 0; font-size: 15px; font-weight: 700; line-height: 1.35; color: var(--herr-ink); }
.lt-herr-laboral__concepto-importe {
  grid-area: importe; margin: 0; align-self: start; font-family: var(--herr-font-head); font-size: 17px; font-weight: 600;
  line-height: 1.3; font-variant-numeric: tabular-nums; color: var(--herr-ink); text-align: right; white-space: nowrap;
}
.lt-herr-laboral__concepto.is-cero .lt-herr-laboral__concepto-importe { color: var(--herr-muted); }
.lt-herr-laboral__formula {
  grid-area: formula; margin: 0; font-size: 13.5px; line-height: 1.5; font-variant-numeric: tabular-nums;
  color: var(--herr-text-2); overflow-wrap: anywhere;
}
.lt-herr-laboral__formula b { font-weight: 700; color: var(--herr-ink-soft); }
.lt-herr-laboral__norma { grid-area: norma; margin: 0; font-size: 13px; line-height: 1.4; }
.lt-herr-laboral__norma a {
  display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 0; color: var(--herr-text-2);
  text-decoration: underline; text-decoration-color: var(--herr-border-fuerte); text-underline-offset: 3px; font-weight: 600;
}
.lt-herr-laboral__norma a:hover { color: var(--herr-primary); text-decoration-color: currentColor; }
.lt-herr-laboral__norma svg { flex: none; }

/* --- «Supuestos», «Lo que no incluye», «Fuente y fecha»: los plegables de días hábiles --- */
.lt-herr-laboral__plegables { display: flex; flex-direction: column; margin-top: 20px; border-bottom: 1px solid var(--herr-divider); }
.lt-herr-laboral__plegable-cuerpo { margin: 0; padding: 0 0 16px; }
@media (min-width: 768px) { .lt-herr-laboral__plegable-cuerpo { padding-left: 34px; } }
.lt-herr-laboral__lista { margin: 0; padding: 0 0 0 18px; font-size: 14px; line-height: 1.6; color: var(--herr-ink-soft); }
.lt-herr-laboral__lista li + li { margin-top: 6px; }
.lt-herr-laboral__fuentes { margin: 0; }
.lt-herr-laboral__fuente {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 16px; padding: 10px 0;
  border-bottom: 1px solid var(--herr-divider); font-size: 14px; line-height: 1.45;
}
.lt-herr-laboral__fuente:last-child { border-bottom: 0; }
.lt-herr-laboral__fuente dt { font-weight: 700; color: var(--herr-ink); }
.lt-herr-laboral__fuente dd { margin: 0; }
.lt-herr-laboral__fuente-valor { font-family: var(--herr-font-head); font-weight: 600; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.lt-herr-laboral__fuente-origen { grid-column: 1 / -1; font-size: 13px; color: var(--herr-muted); }
.lt-herr-laboral__fuente-origen a {
  display: inline-flex; align-items: center; min-height: 44px; color: inherit; text-decoration: underline; text-underline-offset: 2px;
}

/* --- CO: «Posible sanción por no pagarte a tiempo» (aparte, nunca sumada al total) --- */
.lt-herr-laboral__moratoria {
  display: grid; gap: 16px; margin-top: 20px; padding: clamp(20px, 3vw, 30px); scroll-margin-top: calc(var(--lt-header-h-effective, 0px) + 12px);
  border: 1px solid var(--herr-border); border-radius: var(--herr-r-card); background: var(--herr-surface);
  box-shadow: inset 4px 0 0 var(--herr-banda-ink); container-type: inline-size;
}
@media (min-width: 900px) {
  .lt-herr-laboral__moratoria { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); column-gap: 40px; align-items: start; }
  .lt-herr-laboral__moratoria-cab { grid-column: 1 / -1; }
}
.lt-herr-laboral__moratoria-cab { display: flex; flex-direction: column; gap: 6px; }
.lt-herr-laboral__moratoria-h {
  margin: 0; font-family: var(--herr-font-head); font-size: clamp(20px, 2.2vw, 24px); font-weight: 600; line-height: 1.2; color: var(--herr-ink);
}
.lt-herr-laboral__moratoria-fuera { margin: 0; font-size: 14px; line-height: 1.5; color: var(--herr-text-2); }
.lt-herr-laboral__moratoria-cifra { display: flex; flex-direction: column; gap: 10px; }
.lt-herr-laboral__moratoria-cifra .lt-herr-laboral__cifra { color: var(--herr-ink); font-size: clamp(32px, 10vw, 52px); }
@supports (font-size: 1cqi) { .lt-herr-laboral__moratoria-cifra .lt-herr-laboral__cifra { font-size: clamp(32px, 11cqi, 52px); } }
.lt-herr-laboral__moratoria-detalle { display: flex; flex-direction: column; gap: 12px; }
.lt-herr-laboral__moratoria-detalle .lt-herr-laboral__concepto { padding-top: 0; }

/* --- Comparar con lo que me ofrecen --- */
.lt-herr-laboral__comparar {
  display: flex; flex-direction: column; gap: 16px; margin-top: 20px; padding: clamp(20px, 3vw, 30px);
  border: 1px solid var(--herr-border); border-radius: var(--herr-r-card); background: var(--herr-surface);
}
.lt-herr-laboral__comparar-h { margin: 0; font-family: var(--herr-font-head); font-size: clamp(20px, 2.2vw, 24px); font-weight: 600; line-height: 1.2; color: var(--herr-ink); }
.lt-herr-laboral__comparar-texto { margin: 0; max-width: 62ch; font-size: 14px; line-height: 1.55; color: var(--herr-text-2); }
.lt-herr-laboral__comparar-fila { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.lt-herr-laboral__comparar-fila .lt-herr__campo { flex: 1 1 220px; max-width: 360px; }
.lt-herr-laboral__comparar-fila .lt-herr__boton-oscuro { flex: 0 0 auto; }
.lt-herr-laboral__comparacion { display: flex; flex-direction: column; gap: 14px; }
.lt-herr-laboral__comparacion[hidden] { display: none; }
.lt-herr-laboral__veredicto {
  margin: 0; font-family: var(--herr-font-head); font-size: clamp(19px, 2.2vw, 24px); font-weight: 600; line-height: 1.3;
  letter-spacing: -.01em; color: var(--herr-ink); text-wrap: balance;
}
.lt-herr-laboral__veredicto strong { font-variant-numeric: tabular-nums; white-space: nowrap; }
.lt-herr-laboral__comparacion.is-menos .lt-herr-laboral__veredicto strong { color: var(--herr-primary); }
.lt-herr-laboral__comparacion.is-cubre .lt-herr-laboral__veredicto strong { color: var(--herr-cuenta-ink); }
.lt-herr-laboral__barras { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.lt-herr-laboral__barra { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; }
.lt-herr-laboral__barra-nombre { font-size: 13.5px; font-weight: 600; color: var(--herr-text-2); }
.lt-herr-laboral__barra-valor { font-family: var(--herr-font-head); font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.lt-herr-laboral__barra svg { grid-column: 1 / -1; display: block; width: 100%; height: 12px; overflow: visible; }
.lt-herr-laboral__b-pista { fill: var(--herr-divider); }
.lt-herr-laboral__barra--oferta .lt-herr-laboral__b-valor { fill: var(--herr-ink); }
.lt-herr-laboral__barra--minimo .lt-herr-laboral__b-valor { fill: var(--herr-cuenta-ink); }
.lt-herr-laboral__barra--juez .lt-herr-laboral__b-valor { fill: var(--herr-banda-ink); }
/* Lo que falta hasta el mínimo, en rojo claro: el hueco es el mensaje */
.lt-herr-laboral__b-hueco { fill: var(--herr-primary); opacity: .3; }

/* --- Barra fija inferior: línea pequeña «Total estimado» encima de la cifra --- */
.lt-herr-laboral__dock-pre { display: block; font-size: 12px; font-weight: 600; line-height: 1.2; color: var(--herr-muted); }

/* --- Descarte como resultado (si llega por GET con la casilla marcada) --- */
.lt-herr-laboral__fuera {
  display: flex; flex-direction: column; gap: 12px; padding: clamp(20px, 3vw, 30px);
  border: 1px solid var(--herr-border); border-radius: var(--herr-r-card); background: var(--herr-surface);
}
.lt-herr-laboral__fuera h2 { margin: 0; font-family: var(--herr-font-head); font-size: clamp(20px, 2.2vw, 24px); font-weight: 600; color: var(--herr-ink); }
.lt-herr-laboral__fuera p { margin: 0; max-width: 62ch; font-size: 15px; line-height: 1.6; color: var(--herr-ink-soft); }

@media (prefers-reduced-motion: reduce) {
  .lt-herr-laboral__sub { animation: none; }
  .lt-herr-laboral__calcular[aria-busy="true"]::after { animation-duration: 2.4s; }
}

/* --- Lo que pone laboral.js: sin :has, enseña y esconde con estas clases lo que el CSS haría solo --- */
.lt-herr .lt-herr-laboral__js-oculto { display: none; }
.lt-herr__form .lt-herr-laboral__descarte-aviso.lt-herr-laboral__js-visible { display: flex; }
/* Área de texto temporal de «Copiar» cuando no hay API de portapapeles (sin estilos en línea) */
.lt-herr-laboral__portapapeles { position: fixed; top: 0; left: 0; opacity: 0; pointer-events: none; }
/* Adonde lleva el flujo guiado: la sub-pregunta y el veredicto, bajo la cabecera fija y sobre la barra */
.lt-herr-laboral__sub, .lt-herr-laboral__comparacion {
  scroll-margin-top: calc(var(--lt-header-h-effective, 0px) + 12px);
  scroll-margin-bottom: calc(var(--herr-dock-h, 0px) + 12px);
}
/* Barra en «Falta»: parece apagado pero actúa (lleva a lo que falta); por eso no lleva aria-disabled.
   --herr-text-2 y no --herr-muted: sobre --herr-hundido da 4,86:1 (el muted, 4,23:1, no pasa AA). */
.lt-herr__dock .lt-herr__dock-boton.lt-herr-laboral__dock-falta { background: var(--herr-hundido); color: var(--herr-text-2); }
/* «Comparar» mientras hay un cálculo en vuelo: se ve apagado y, si se pulsa, el envío se encola */
.lt-herr-laboral__comparar button[aria-disabled="true"] { opacity: .55; }

/* ==========================================================================
   T13a · Arreglos de la verificación en móvil y de la revisión de diseño.
   Todo acotado a la página laboral: `.lt-herr--laboral` es la clase del
   contenedor de laboral/pagina.html y laboral/embed.html. Días hábiles
   comparte los defectos de I1, I2 y del toque en la barra en WebKit; aquí no
   se le toca nada.
   ========================================================================== */

/* I1 + D2: legaltica-ds.css baja en móvil `button.lt-btn` y `a.lt-btn` a 12,5 px (y `a.lt-btn` lleva su
   propio padding), y su especificidad (0,1,1) gana a la clase sola. Con el contenedor delante, ganan estas. */
.lt-herr--laboral button.lt-herr__calcular { font-size: 17px; }
.lt-herr--laboral a.lt-herr__cta-boton, .lt-herr--laboral a.lt-herr__cta-boton:link,
.lt-herr--laboral a.lt-herr__cta-boton:visited {
  min-height: 48px; padding: 14px 22px; font-size: 16px; line-height: 1.2; text-align: center; white-space: normal;
}

/* I2: la opción no elegida del segmentado, con --herr-text-2 (4,86:1 sobre --herr-hundido; el muted daba 4,23).
   La elegida sigue en tinta: `:has(input:checked)` pesa más. */
.lt-herr--laboral .lt-herr__seg-op span { color: var(--herr-text-2); }
/* M6: «¿Ya te pagaron la liquidación?» tiene cuatro opciones: dos por fila en móvil */
.lt-herr__seg.lt-herr-laboral__seg--4 { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 560px) { .lt-herr__seg.lt-herr-laboral__seg--4 { grid-template-columns: repeat(4, 1fr); } }

/* I5 + M10: con un resultado pintado, «Recalcular» es secundario (la acción principal es el CTA) y el
   aviso de orientativo se queda solo junto al resultado. */
.lt-herr--laboral .lt-herr-laboral__form--resultado button.lt-herr__calcular,
.lt-herr--laboral .lt-herr-laboral__form--resultado button.lt-herr__calcular:hover {
  background: var(--herr-surface); color: var(--herr-ink); box-shadow: inset 0 0 0 1.5px var(--herr-border-fuerte);
  transform: none;
}
.lt-herr--laboral .lt-herr-laboral__form--resultado button.lt-herr__calcular:hover { box-shadow: inset 0 0 0 1.5px var(--herr-ink); }
.lt-herr-laboral__form--resultado .lt-herr-laboral__calcular[aria-busy="true"]::after {
  border-color: rgba(22, 32, 46, .25); border-top-color: var(--herr-ink);
}
.lt-herr-laboral__form--resultado .lt-herr__enviar .lt-herr__orientativo { display: none; }


/* D4: la norma bajo el título del escenario, con 44 px de toque como las del desglose; con franja de
   condición va dentro de su frase (enlace en línea de texto) */
.lt-herr-laboral__norma-esc a { display: inline-flex; align-items: center; min-height: 44px; }
.lt-herr-laboral__condicion a.lt-herr-laboral__condicion-norma {
  color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 2px;
}

/* I6: el plazo para reclamar, junto al total y destacado */
.lt-herr__nota.lt-herr-laboral__plazo {
  border: 1px solid var(--herr-banda-borde); background: var(--herr-surface); color: var(--herr-ink);
}
.lt-herr-laboral__plazo a {
  color: var(--herr-ink); font-weight: 700; text-decoration: underline; text-underline-offset: 3px;
  overflow-wrap: anywhere;
}
/* I7: «De esto, X te lo deben en cualquier caso», bajo la cifra de un escenario que depende de un juez */
/* 20-10: «Si un juez lo declara improcedente: 25.886 € · 21.939 € más», bajo el total del escenario bajo. */
.lt-herr-laboral__mejor {
  display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 2px 12px; margin: 16px 0 0;
  padding: 14px 16px; border: 1px solid var(--herr-primary); border-radius: 14px;
  background: color-mix(in srgb, var(--herr-primary) 7%, var(--herr-surface)); color: var(--herr-ink);
  text-decoration: none;
}
.lt-herr-laboral__mejor:hover { background: color-mix(in srgb, var(--herr-primary) 12%, var(--herr-surface)); }
.lt-herr-laboral__mejor:focus-visible { outline: 3px solid var(--herr-primary); outline-offset: 2px; }
.lt-herr-laboral__mejor-pre { grid-column: 1 / -1; font-size: 14px; font-weight: 600; line-height: 1.35; }
.lt-herr-laboral__mejor-cifra {
  font-family: var(--herr-font-head); font-size: 30px; font-weight: 700; line-height: 1.1; letter-spacing: -.02em;
  color: var(--herr-primary);
}
.lt-herr-laboral__mejor-mas { font-size: 14px; font-weight: 700; white-space: nowrap; }
.lt-herr-laboral__total .lt-herr-laboral__de-esto {
  display: flex; align-items: baseline; gap: 8px; margin-top: 6px; font-size: 14px; font-weight: 600; line-height: 1.45;
  color: var(--herr-cuenta-ink);
}

/* D7: el resultado que ya no corresponde a los datos, atenuado */
.lt-herr-laboral__salida.is-caducado > .lt-herr__resultados,
.lt-herr-laboral__salida.is-caducado > .lt-herr-laboral__moratoria { opacity: .55; transition: opacity .2s ease; }

/* M4: la moratoria tiene un solo concepto; su importe ya es la cifra de arriba */
.lt-herr-laboral__moratoria .lt-herr-laboral__concepto-importe { display: none; }
/* M8: a 1440 px, líneas de lectura y no de 150 caracteres */
.lt-herr-laboral__plegable-cuerpo { max-width: 72ch; }
/* I9: la nota del dato (radicado, autos…) en «Fuente y fecha» */
.lt-herr-laboral__fuente .lt-herr-laboral__fuente-nota { grid-column: 1 / -1; font-size: 13px; line-height: 1.5; color: var(--herr-text-2); }

/* I10: la guía en párrafos cortos y listas, con aire entre ellos */
.lt-herr--laboral .lt-herr__seccion p + p, .lt-herr--laboral .lt-herr__seccion p + ul,
.lt-herr--laboral .lt-herr__seccion ul + p { margin-top: 14px; }
.lt-herr-laboral__guia-lista {
  margin: 0; max-width: 66ch; padding-left: 22px; font-size: 16.5px; line-height: 1.7; color: var(--herr-ink-soft);
}
.lt-herr-laboral__guia-lista li + li { margin-top: 6px; }

/* I4: barra fija con resultado en una sola fila: la cifra (enlace al resultado) a la izquierda y el CTA */
@media (max-width: 767.98px) {
  .lt-herr--laboral .lt-herr__dock.is-resultado {
    flex-wrap: nowrap; gap: 10px; padding-top: 8px; padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
  }
  .lt-herr--laboral .lt-herr__dock.is-resultado .lt-herr__dock-acciones { flex: 0 1 auto; min-width: 0; }
  .lt-herr--laboral .lt-herr__dock a.lt-herr-laboral__dock-ver,
  .lt-herr--laboral .lt-herr__dock a.lt-herr-laboral__dock-ver:hover {
    flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; min-width: 0; min-height: 44px;
    color: var(--herr-text-2); text-decoration: none;
  }
  .lt-herr--laboral .lt-herr__dock a.lt-herr-laboral__dock-ver[hidden] { display: none; }
  .lt-herr--laboral .lt-herr__dock a.lt-herr-laboral__dock-ver:focus-visible { outline: 3px solid var(--herr-ink); outline-offset: 2px; border-radius: 6px; }
  .lt-herr--laboral .lt-herr__dock .lt-herr-laboral__dock-ver .lt-herr-laboral__dock-pre {
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
  }
  .lt-herr--laboral .lt-herr__dock .lt-herr-laboral__dock-ver strong {
    font-family: var(--herr-font-head); font-size: 18px; font-weight: 700; line-height: 1.2; color: var(--herr-primary);
    font-variant-numeric: tabular-nums; white-space: nowrap;
  }
  /* ≥ 16 px como el resto de acciones; en dos líneas si no cabe, sin salirse de la fila */
  .lt-herr--laboral .lt-herr__dock .lt-herr__dock-boton,
  .lt-herr--laboral .lt-herr__dock a.lt-herr__dock-cta { font-size: 16px; }
  .lt-herr--laboral .lt-herr__dock.is-resultado a.lt-herr__dock-cta {
    max-width: 12.5em; padding: 6px 14px; line-height: 1.2; text-align: center; white-space: normal;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lt-herr-laboral__salida.is-caducado > .lt-herr__resultados,
  .lt-herr-laboral__salida.is-caducado > .lt-herr-laboral__moratoria { transition: none; }
}

/* ES: «¿Te dieron 15 días de preaviso?» solo con despido objetivo (mismo patrón :has que los demás
   condicionales; sin :has se ve siempre y el servidor solo lo usa con despido objetivo). */
.lt-herr__form:not(:has(input[name="motivo"][value="despido"]:checked)) .lt-herr-laboral__si-objetivo,
.lt-herr__form:not(:has(input[name="causa"][value="objetivo"]:checked)) .lt-herr-laboral__si-objetivo { display: none; }

/* --- Fase 2 (auditoría 19-10-2026) --- */

/* P2-4: el foco de teclado en los campos de texto y fecha se ve (antes, sombra al 8 %). */
.lt-herr--laboral .lt-herr__control:focus-visible { outline: 3px solid var(--herr-primary); outline-offset: 2px; }

/* P1-3: enlace a la otra calculadora de España, bajo la entradilla. */
.lt-herr-laboral__hermana { margin: .5rem 0 0; color: var(--herr-ink-soft); font-size: .95rem; }
.lt-herr-laboral__hermana a { color: var(--herr-primary); font-weight: 600; text-underline-offset: 3px; }

/* P1-5: ejemplo resuelto y tabla de días por año, dentro de la guía. En el móvil la tabla se desplaza
   dentro de su caja: la página no tiene scroll horizontal. */
.lt-herr-laboral__tabla-envoltura { overflow-x: auto; margin: 1rem 0; border: 1px solid var(--herr-border);
  border-radius: var(--herr-r-card); background: var(--herr-surface); }
.lt-herr-laboral__tabla { width: 100%; border-collapse: collapse; font-size: .92rem; }
.lt-herr-laboral__tabla caption { caption-side: top; text-align: left; padding: .75rem 1rem .25rem;
  font-family: var(--herr-font-head); font-weight: 600; color: var(--herr-ink); }
.lt-herr-laboral__tabla th, .lt-herr-laboral__tabla td { padding: .6rem 1rem; text-align: left;
  vertical-align: top; border-top: 1px solid var(--herr-divider); }
.lt-herr-laboral__tabla thead th { border-top: 0; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em;
  color: var(--herr-muted); font-weight: 600; }
.lt-herr-laboral__tabla tbody th { font-weight: 600; color: var(--herr-ink); }
.lt-herr-laboral__tabla tfoot th, .lt-herr-laboral__tabla tfoot td { font-weight: 700; color: var(--herr-ink);
  border-top: 2px solid var(--herr-border-fuerte); }
.lt-herr-laboral__tabla td { color: var(--herr-ink-soft); }
.lt-herr-laboral__tabla a { color: var(--herr-primary); }
.lt-herr-laboral__num { text-align: right !important; white-space: nowrap; font-variant-numeric: tabular-nums; }
.lt-herr-laboral__tabla-norma { display: block; font-weight: 400; font-size: .8rem; margin-top: .15rem; }
.lt-herr-laboral__tabla-pie { font-size: .88rem; color: var(--herr-muted); }
.lt-herr-laboral__tabla-formula { display: block; font-weight: 400; font-size: .82rem; color: var(--herr-ink-soft); margin-top: .2rem; }
.lt-herr-laboral__solo-movil { display: none; }
/* En el móvil la fórmula va bajo el concepto: el importe y el total se ven sin desplazar la tabla. */
@media (max-width: 599.98px) {
  .lt-herr-laboral__solo-ancho { display: none; }
  .lt-herr-laboral__solo-movil { display: block; }
  .lt-herr-laboral__tabla th, .lt-herr-laboral__tabla td { padding: .55rem .6rem; overflow-wrap: anywhere; hyphens: auto; }
  .lt-herr-laboral__tabla { font-size: .85rem; }
}

/* 20-10: la unidad del salario («/ mes») dentro de la caja, más suave que la moneda */
.lt-herr-laboral__unidad { margin-left: 2px; font-weight: 500; color: var(--herr-muted); white-space: nowrap; }
