/* Last Mile comparte el shell y los tokens de Cráneo Rutas. */
.lm-shell { width: 100%; min-width: 0; max-width: 1560px; }
.lm-page-head { margin-bottom: 24px; }
.lm-toolbar, .lm-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.lm-toolbar { padding: 18px 20px; margin-bottom: 20px; align-items: end; }
.lm-toolbar .lm-field { flex: 0 1 240px; }
.lm-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 20px 0; }
.lm-summary > .card { padding: 20px; margin-top: 0; border-top: 3px solid var(--primary); }
.lm-summary strong { display: block; font-size: 32px; margin-top: 10px; font-variant-numeric: tabular-nums; }
.lm-section { padding: 24px; margin: 18px 0; }
.lm-section h2, .lm-editor h2 { font-size: 19px; margin: 0 0 12px; }
.lm-form { display: flex; flex-wrap: wrap; gap: 16px; align-items: end; }
.lm-field { display: flex; flex-direction: column; gap: 7px; min-width: 140px; flex: 1; }
.lm-field > span { font-size: 12px; font-weight: 600; color: var(--text-2); }
.lm-field .input { width: 100%; min-width: 0; }
.lm-form > .lm-field { flex: 1 1 150px; }
.lm-table-wrap { overflow-x: auto; margin-top: 18px; border: 1px solid var(--border); border-radius: 10px; }
.lm-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.lm-table th { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap;
  text-align: left; padding: 12px; border-bottom: 1px solid var(--border); color: var(--text-3); background: var(--surface-2); }
.lm-table td { padding: 14px 12px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.lm-table tr:last-child td { border-bottom: 0; }
.lm-table tbody tr:hover { background: var(--primary-soft); }
.lm-table small { display: block; color: var(--text-3); margin-top: 5px; }
.lm-table .lm-field > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.lm-status { display: inline-block; border-radius: 20px; padding: 5px 9px; font-size: 11px; font-weight: 700;
  white-space: nowrap; color: var(--text-2); background: var(--neutral-bg); }
.lm-status.is-ok { color: var(--ok); background: var(--ok-bg); }
.lm-status.is-no { color: var(--danger); background: var(--danger-bg); }
.lm-success { color: var(--ok); }
.lm-empty { text-align: center; padding: 40px 12px; color: var(--text-3); }
.lm-modal { position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.7); display: flex;
  align-items: center; justify-content: center; padding: 20px; }
.lm-editor { padding: 28px; width: min(640px,100%); max-height: 90dvh; overflow: auto; }
.lm-editor .lm-field { flex-basis: 220px; }
.lm-editor .lm-actions { width: 100%; justify-content: flex-end; margin-top: 12px; }
.lm-flota { min-width: 0; }
.lm-flota-note { padding: 14px 18px; border-left: 3px solid var(--primary); background: var(--primary-soft);
  border-radius: 8px; font-size: 13px; line-height: 1.6; color: var(--text-2); margin: 0 0 22px; }
.app--last-mile .btn:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
@media (max-width: 650px) {
  .lm-shell { padding: 16px; }
  .app--last-mile .topbar { padding: 12px 16px; gap: 8px; }
  .app--last-mile .topbar h1 { font-size: 15px; }
  .app--last-mile .topbar .badge { font-size: 10px; }
  .lm-toolbar { padding: 16px; }
  .lm-toolbar .lm-field { flex: 1 1 140px; }
  .lm-section { padding: 16px; }
  .lm-summary { gap: 8px; }
  .lm-summary > .card { padding: 12px; }
  .lm-summary span { display: block; font-size: 11px; line-height: 1.5; }
  .lm-summary strong { font-size: 26px; }
  .lm-modal { padding: 12px; }
  .lm-editor { padding: 18px; }
}
/* #99: tarifarios de Ultima Milla. */
.lm-tarifas .lm-tarifas-form { align-items: stretch; }
.lm-tarifas .lm-tarifas-form > .lm-table-wrap { flex: 1 1 100%; margin-top: 0; }
.lm-tarifa-celda { display: flex; flex-direction: column; gap: 4px; min-width: 130px; }
.lm-tarifa-celda .input { width: 100%; min-width: 0; }
.lm-tarifa-celda small { font-size: 11px; }
.lm-check { display: flex; align-items: center; gap: 8px; flex: 1 1 100%; font-size: 13px; }
.lm-tarifas .lm-table th small { display: block; font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--text-2); }
/* #99 (v1.0.14): la tarifa guardada es un valor cerrado en pesos; el campo lleva el signo; la proxima
   vigencia se ve al lado; «Cargar modificación» y su ayuda ocupan el ancho del formulario. */
.lm-tarifa-cerrada { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.lm-tarifa-proxima { color: var(--primary); font-weight: 600; }
.lm-importe { display: flex; align-items: center; gap: 6px; }
.lm-importe-signo { color: var(--text-2); font-weight: 600; }
.lm-importe .input { flex: 1 1 auto; }
.lm-tarifas .lm-tarifas-form > .lm-tarifas-acciones, .lm-tarifas .lm-tarifas-form > .lm-tarifas-ayuda { flex: 1 1 100%; }
.lm-tarifas-acciones { justify-content: flex-end; }
.lm-tarifas-ayuda { margin: 0; }
/* #110 (v1.0.17): Heavy and Bulky. La red del centro elegido en «Nueva citación», el resultado de la ruta
   (ID Ruta, Km y Cumplimiento juntos, con la ayuda del PNU debajo), el estado PNU y una grilla de MELI por red. */
.lm-red-nombre { display: flex; align-items: center; min-height: 38px; font-weight: 600; color: var(--text); }
.lm-resultado { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: flex-start; flex: 1 1 100%; min-width: 0;
  padding-top: 14px; border-top: 1px solid var(--border); }
.lm-resultado-titulo { flex: 1 1 100%; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-3); }
.lm-editor .lm-resultado .lm-field { flex: 1 1 150px; }
.lm-ayuda { flex: 1 1 100%; font-size: 12px; color: var(--text-2); }
.lm-km-invalido { font-size: 12px; color: var(--danger); }
.lm-field .input:disabled::placeholder { color: var(--text-3); }
.lm-aviso { flex: 1 1 100%; margin: 0; font-size: 13px; color: var(--danger); }
.lm-status.is-pnu { color: var(--info); background: var(--info-bg); }
.lm-tarifas .lm-tarifas-form > .lm-tarifas-red { flex: 1 1 100%; min-width: 0; }
.lm-tarifas-red + .lm-tarifas-red { margin-top: 14px; }
.lm-tarifas-red h3 { font-size: 15px; margin: 0 0 8px; }
.lm-tarifas-red .lm-table-wrap { margin-top: 0; }
.lm-tarifas-red-nota { margin: 0 0 10px; font-size: 13px; }
/* Con 6 rangos (H&B) el tipo centrado en su grupo queda lejos de su primera fila: va arriba, con sus ayudantes. */
.lm-tarifas-red tbody th[scope="rowgroup"] { vertical-align: top; padding-top: 16px; }
.lm-form > .lm-field--tipo { flex: 1 1 220px; }
/* v1.0.18: «Asignación automática» en Operación y «Centros habilitados» en Flota (MELI). */
.lm-auto > .muted { margin: 0 0 14px; line-height: 1.6; }
.lm-auto .lm-form > .lm-field { flex: 0 1 220px; }
.lm-propuesta { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--border); }
.lm-propuesta h3 { font-size: 16px; margin: 0 0 6px; }
.lm-criterio { margin: 0; font-size: 12px; line-height: 1.6; }
.lm-sin-cubrir { margin-top: 16px; }
.lm-sin-cubrir h4 { font-size: 13px; margin: 0 0 6px; padding-left: 8px; border-left: 3px solid var(--warn); }
.lm-sin-cubrir ul, .lm-omitidos ul { margin: 0; padding-left: 18px; font-size: 13px; line-height: 1.6; }
.lm-propuesta .lm-sin-centros-aviso { margin-top: 12px; padding: 8px 12px; border-radius: 8px; border-left: 3px solid var(--warn);
  background: var(--warn-bg); color: var(--text); }
.lm-propuesta .lm-actions { justify-content: flex-end; margin-top: 16px; }
.lm-resultado-auto { margin-top: 16px; font-size: 13px; }
.lm-resultado-auto .lm-success { font-weight: 600; margin: 0 0 6px; }
.lm-omitidos p { margin: 0 0 4px; padding-left: 8px; border-left: 3px solid var(--warn); }
.lm-centros > .muted { margin: 0 0 10px; line-height: 1.6; }
.lm-centros-tabla th.lm-centros-red { text-align: center; text-transform: none; letter-spacing: 0; font-weight: 600; color: var(--text-2);
  border-bottom: 1px solid var(--border); }
.lm-centros-tabla .lm-centro-col { text-align: center; width: 72px; }
.lm-centros-tabla td input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--primary); }
.lm-centros-tabla td input[type="checkbox"]:disabled { opacity: .35; }
/* El amarillo de --warn no se lee como texto sobre blanco (tema claro): va de fondo, con el texto del tema. */
.lm-table small.lm-sin-centros { display: inline-block; padding: 1px 7px; border-radius: 10px; background: var(--warn-bg); color: var(--text); font-weight: 600; }

/* #112: el reemplazo individual conserva el editor; un cupo ocupado abre esta previa separada. */
.lm-row-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.lm-intercambio { width: min(760px,100%); }
.lm-intercambio > .muted { line-height: 1.5; }
.lm-intercambio-previa { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--border); }
.lm-intercambio-previa h3 { margin: 0 0 12px; font-size: 16px; }
.lm-intercambio-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.lm-intercambio-cupo { display: flex; flex-direction: column; gap: 7px; min-width: 0; padding: 14px;
  border: 1px solid var(--border); border-radius: 10px; background: var(--surface-2); font-size: 13px; }
.lm-intercambio-cupo span { overflow-wrap: anywhere; }
.lm-intercambio-despues { color: var(--primary); font-weight: 700; }
.lm-intercambio-padron { padding: 8px; border-left: 3px solid var(--warn); border-radius: 4px;
  background: var(--warn-bg); color: var(--text); line-height: 1.45; overflow-wrap: anywhere; }
.lm-intercambio-advertencias { margin: 14px 0 0; padding: 12px 12px 12px 30px; border-left: 3px solid var(--warn);
  border-radius: 8px; background: var(--warn-bg); color: var(--text); font-size: 13px; line-height: 1.55; }
@media (max-width: 650px) {
  .lm-row-actions { min-width: 138px; }
  .lm-row-actions .btn { flex: 1 1 100%; }
  .lm-intercambio-grid { grid-template-columns: 1fr; }
  .lm-intercambio > .lm-actions { position: sticky; bottom: -18px; z-index: 1; margin: 12px -18px -18px;
    padding: 12px 18px 18px; border-top: 1px solid var(--border); background: var(--surface); }
}

/* #89 (v1.0.18): la liquidación de Última Milla. Cuatro tarjetas de totales, la tabla por proveedor y patente (la
   fila del proveedor como encabezado de su grupo), el detalle con el «cómo se calculó» de cada lado, los ajustes
   (el anulado tachado), la referencia de adicionales por km dentro del diálogo y el total negativo en rojo. */
.lm-liquidacion-resumen { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.lm-liquidacion-resumen strong { font-size: 24px; }
.lm-liquidacion-resumen small { display: block; margin-top: 6px; font-size: 12px; color: var(--text-3); }
.lm-liquidacion-csv { margin-top: 4px; }
.lm-liquidacion-csv .lm-field { flex: 0 1 280px; }
.lm-liquidacion-tabla td, .lm-liquidacion-tabla tfoot th { white-space: nowrap; font-variant-numeric: tabular-nums; }
.lm-liquidacion-tabla th, .lm-liquidacion-tabla td { padding-left: 10px; padding-right: 10px; }
/* El desglose por estado va debajo de la cantidad y se parte en dos renglones: no puede ensanchar la tabla. */
.lm-liquidacion-tabla td small { white-space: normal; max-width: 150px; }
.lm-liquidacion-proveedor th, .lm-liquidacion-proveedor td { background: var(--surface-2); }
.lm-liquidacion-proveedor th, .lm-liquidacion-tabla tfoot th { text-transform: none; letter-spacing: 0; font-size: 13px; color: var(--text); }
.lm-liquidacion-tabla tr.is-abierta td { background: var(--primary-soft); }
.lm-liquidacion-tabla tfoot th, .lm-liquidacion-tabla tfoot td { padding: 12px; border-top: 2px solid var(--border); text-align: left; }
.lm-ajustes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; min-width: 220px; }
.lm-ajustes li.is-anulado > span { text-decoration: line-through; color: var(--text-3); }
.lm-negativo { color: var(--danger); }
.lm-anular { margin-top: 14px; }
.lm-referencia { flex: 1 1 100%; font-size: 12px; padding: 12px 14px; border-left: 3px solid var(--info); background: var(--info-bg); border-radius: 8px; }
.lm-referencia p { margin: 0 0 8px; color: var(--text-2); }
.lm-referencia .lm-table td { padding: 6px 10px; }
@media (max-width: 900px) { .lm-liquidacion-resumen { grid-template-columns: repeat(2, minmax(0, 1fr)); } }