/* extranjeria.css — calculadoras de extranjería de España: medios económicos y nacionalidad (24-10-2026).
   Se carga DETRÁS de herramientas.css y laboral.css: las páginas llevan `lt-herr--laboral` y reutilizan la tarjeta de
   resultado, el desglose y las tablas. Aquí solo lo propio, con el prefijo `lt-herr-ext__`. Sin colores nuevos:
   tokens --herr-*. Nada de estilos en línea (CSP). */

/* --- Cabecera: aviso YMYL --- */
.lt-herr-ext__ymyl { margin: 14px 0 0; }

/* --- Formulario --- */
.lt-herr__seg.lt-herr-ext__seg--3 { grid-template-columns: repeat(3, 1fr); }
.lt-herr-ext__tipos { grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
#lt-herr-campo-via, #lt-herr-campo-tipo, #lt-herr-campo-vinculos, #lt-herr-campo-riesgos { grid-column: 1 / -1; }
.lt-herr-ext__checks { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.lt-herr-ext__check {
  display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--herr-divider);
  border-radius: 12px; background: var(--herr-surface); font-size: 15px; line-height: 1.4; cursor: pointer;
}
.lt-herr-ext__check input { margin-top: 3px; flex: none; }

/* Preguntas que dependen del trámite (medios): solo con su trámite marcado. Sin :has se ven siempre. */
.lt-herr--medios .lt-herr__form:has(input[name="via"]) [class*="lt-herr-ext__si-"] { display: none; }
.lt-herr--medios .lt-herr__form:has(input[name="via"][value="no_lucrativa"]:checked) .lt-herr-ext__si-no_lucrativa,
.lt-herr--medios .lt-herr__form:has(input[name="via"][value="estudios"]:checked) .lt-herr-ext__si-estudios,
.lt-herr--medios .lt-herr__form:has(input[name="via"][value="familiar_ue"]:checked) .lt-herr-ext__si-familiar_ue,
.lt-herr--medios .lt-herr__form:has(input[name="via"][value="arraigo_sociolaboral"]:checked) .lt-herr-ext__si-arraigo_sociolaboral {
  display: flex;
}
/* Los ahorros no cuentan en las vías de ingresos periódicos ni con contrato. */
.lt-herr--medios .lt-herr__form:has(input[name="via"][value="reagrupacion"]:checked) .lt-herr-ext__no-ingreso,
.lt-herr--medios .lt-herr__form:has(input[name="via"][value="teletrabajo"]:checked) .lt-herr-ext__no-ingreso,
.lt-herr--medios .lt-herr__form:has(input[name="via"][value="arraigo_social"]:checked) .lt-herr-ext__no-ingreso,
.lt-herr--medios .lt-herr__form:has(input[name="via"][value="arraigo_sociolaboral"]:checked) .lt-herr-ext__no-ingreso {
  display: none;
}
/* Nacionalidad: la fecha de boda solo si está casado; la de solicitud solo si ya la presentó. */
.lt-herr--nacionalidad .lt-herr__form:has(input[name="vinculos"]) .lt-herr-ext__si-casado,
.lt-herr--nacionalidad .lt-herr__form:has(input[name="solicitada"]) .lt-herr-ext__si-solicitada { display: none; }
.lt-herr--nacionalidad .lt-herr__form:has(input[name="vinculos"][value="casado"]:checked) .lt-herr-ext__si-casado,
.lt-herr--nacionalidad .lt-herr__form:has(input[name="solicitada"][value="si"]:checked) .lt-herr-ext__si-solicitada {
  display: flex;
}

/* --- Resultado --- */
.lt-herr-ext__cifras { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; margin: 16px 0 0; }
.lt-herr-ext__cifras div {
  min-width: 0; padding: 10px 12px; border: 1px solid var(--herr-divider); border-radius: 12px; background: var(--herr-canvas);
}
.lt-herr-ext__cifras dt { margin: 0; font-size: 13px; font-weight: 600; color: var(--herr-text-2); }
.lt-herr-ext__cifras dd {
  margin: 2px 0 0; font-family: var(--herr-font-head); font-size: 18px; font-weight: 700; color: var(--herr-ink);
  font-variant-numeric: tabular-nums; overflow-wrap: anywhere;
}
.lt-herr-ext__compara { margin: 14px 0 0; font-size: 15px; line-height: 1.5; color: var(--herr-ink); }
.lt-herr-ext__compara.is-falta strong { color: var(--herr-error-ink); }
.lt-herr-ext__compara.is-llega { color: var(--herr-cuenta-ink); font-weight: 600; }
.lt-herr-ext__nota { margin: 10px 0 0; font-size: 14px; line-height: 1.5; color: var(--herr-text-2); }
.lt-herr-ext__fecha { margin: 6px 0 0; font-family: var(--herr-font-head); font-size: 30px; font-weight: 800; line-height: 1.15; color: var(--herr-ink); }
.lt-herr-ext__via { margin: 8px 0 0; font-size: 15px; font-weight: 600; line-height: 1.45; color: var(--herr-ink); }

/* Requisitos, uno a uno (mismo dibujo que la Ley Beckham) */
.lt-herr-ext__requisitos { margin-bottom: 22px; }
.lt-herr-ext__lista { display: grid; gap: 10px; margin: 10px 0 0; padding: 0; list-style: none; }
.lt-herr-ext__req {
  display: grid; grid-template-columns: 26px 1fr; gap: 10px; align-items: start; padding: 12px 14px;
  border: 1px solid var(--herr-divider); border-radius: 12px; background: var(--herr-surface);
}
.lt-herr-ext__req-icono {
  display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 999px;
  font-size: 15px; font-weight: 800; line-height: 1;
}
.lt-herr-ext__req.is-cumple .lt-herr-ext__req-icono { background: var(--herr-cuenta-bg); color: var(--herr-cuenta-ink); }
.lt-herr-ext__req.is-no .lt-herr-ext__req-icono { background: var(--herr-error-bg); color: var(--herr-error-ink); }
.lt-herr-ext__req.is-duda .lt-herr-ext__req-icono { background: var(--herr-banda-bg); color: var(--herr-banda-ink); }
.lt-herr-ext__req-t { margin: 0; font-size: 15px; font-weight: 700; line-height: 1.35; color: var(--herr-ink); }
.lt-herr-ext__req-d { margin: 4px 0 0; font-size: 14px; line-height: 1.5; color: var(--herr-text-2); }
.lt-herr-ext__req-d a { color: var(--herr-ink); font-weight: 600; }

.lt-herr-ext__tabla th[scope="row"] { white-space: normal; }
.lt-herr-ext__tabla td { white-space: nowrap; }
@media (max-width: 479.98px) {
  .lt-herr-ext__tabla th, .lt-herr-ext__tabla td { padding-left: 8px; padding-right: 8px; font-size: 14px; }
  .lt-herr-ext__fecha { font-size: 24px; }
}