/* «Llegan mañana» y «Rutas» (D23, 06/11/2026). Mismos estilos en portal y admin: mockups aprobados, sistema v7.
   Todo encerrado en .lr para no tocar el resto de la página. Archivo idéntico en optopus y optopus-admin. */
.lr { --menu:#1a2742; --linea:#E7E9EE; --fila-alterna:#F8F9FB; --tinta:#0F172A; --tinta-2:#475467; --tinta-3:#667085;
  --apagado-fondo:#EEF0F3; --marca:#3B5BFD; --marca-hover:#2F4BE6; --marca-suave:#ECF0FF; --marca-tinta:#2A3FC4;
  --atencion:#B45309; --atencion-fondo:#FEF3C7; --problema:#B91C1C; --problema-fondo:#FEE2E2;
  max-width:1280px; margin:0 auto; color:var(--tinta); font-size:14px; font-variant-numeric:tabular-nums; }
.lr * { box-sizing:border-box; }
.lr [hidden] { display:none !important; }
.lr h1 { font-size:24px; font-weight:600; margin:4px 0; color:var(--tinta); } .lr .sub { color:var(--tinta-3); margin:0 0 16px; }
.lr .migas { font-size:12px; color:var(--tinta-3); } .lr .migas a { color:inherit; }
.lr .cab-pag { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; margin-bottom:16px; } .lr .cab-pag .sub { margin:0; }
.lr .volver { font:inherit; font-size:13px; font-weight:600; color:var(--marca-tinta); background:none; border:0; padding:0; cursor:pointer; }
.lr .regla { background:#fff; border:1px solid var(--linea); border-left:3px solid var(--marca); border-radius:10px; padding:12px 14px; font-size:13px; color:var(--tinta-2); margin-bottom:16px; line-height:1.5; }
.lr .regla b { color:var(--tinta); font-weight:600; } .lr .regla p { margin:0; }
.lr .foto { font-size:13px; color:var(--tinta-2); margin:0 0 12px; } .lr .foto b { color:var(--tinta); font-weight:600; }
.lr .kpis { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.lr .kpis.tres { grid-template-columns:repeat(3, minmax(0,1fr)); }
.lr .kpi { background:#fff; border:1px solid var(--linea); border-radius:12px; padding:12px 14px; min-width:0; }
.lr .kpi span { display:block; font-size:12px; color:var(--tinta-3); } .lr .kpi b { font-size:18px; font-weight:600; } .lr .kpi small { display:block; font-size:12px; color:var(--tinta-3); }
.lr .kpi small.problema { color:var(--problema); font-weight:600; }
/* «Atrasado en tránsito» en rojo (John 09/11/2026): el número del KPI y la píldora cuando hay atrasados. */
.lr .etq.atr { background:var(--problema-fondo); color:var(--problema); font-weight:600; } .lr .kpi b.problema { color:var(--problema); } .lr .pildoras button.rojo:not([aria-pressed="true"]) { color:var(--problema); font-weight:600; }
.lr .pildoras { display:flex; gap:4px; flex-wrap:wrap; margin-bottom:14px; }
.lr .pildoras button { font:inherit; font-size:13px; padding:6px 12px; border-radius:999px; border:1px solid transparent; background:none; color:var(--tinta-2); cursor:pointer; }
.lr .pildoras button[aria-pressed="true"] { background:var(--menu); color:#fff; }
.lr .tarjeta { background:#fff; border:1px solid var(--linea); border-radius:16px; padding:18px; margin-bottom:16px; min-width:0; box-shadow:none; }
.lr .cab { display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.lr .cab h2, .lr .h2 { font-size:15px; font-weight:600; margin:0; } .lr .h2 { margin-bottom:10px; } .lr .cab small { font-size:12.5px; color:var(--tinta-3); }
.lr .nota { font-size:12.5px; color:var(--tinta-3); margin:10px 0 0; line-height:1.45; }
.lr .btn { font:inherit; font-size:13px; font-weight:600; border-radius:10px; padding:8px 14px; border:1px solid var(--linea); background:#fff; color:var(--tinta); cursor:pointer; white-space:nowrap; text-decoration:none; display:inline-block; }
.lr .btn.prim { background:var(--marca); border-color:var(--marca); color:#fff; } .lr .btn.prim:hover { background:var(--marca-hover); }
.lr .btn.peligro { color:var(--problema); } .lr .btn:disabled { opacity:.5; cursor:not-allowed; }
.lr .btn:focus-visible, .lr input:focus-visible, .lr select:focus-visible { outline:3px solid var(--marca-suave); outline-offset:1px; }
.lr .tabla-wrap { border:1px solid var(--linea); border-radius:10px; overflow:hidden; }
.lr table.t { width:100%; table-layout:fixed; border-collapse:separate; border-spacing:0; font-size:13px; font-variant-numeric:tabular-nums; }
.lr .t th, .lr .t td { padding:8px 10px; border-bottom:1px solid var(--linea); text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; background:transparent; color:inherit; }
.lr .t thead th { font-size:12px; font-weight:500; color:var(--tinta-3); text-transform:none; letter-spacing:0; }
.lr .t .num { text-align:right; } .lr .t .num + td:not(.num), .lr .t .num + th:not(.num) { padding-left:22px; }
.lr .t tbody:last-child tr:last-child td { border-bottom:0; }
.lr .t tr.f-ag td { background:var(--apagado-fondo); font-weight:600; }
.lr .t tr.f-cli td { background:var(--fila-alterna); } .lr .t tr.f-cli td.num { font-weight:600; }
.lr .t tr.f-total td { font-weight:600; border-bottom:0; }
.lr .t td.n-cli { white-space:normal; overflow-wrap:anywhere; } .lr .n-cli b { font-weight:600; margin-right:6px; white-space:nowrap; } .lr .n-cli .quien { color:var(--tinta-2); }
.lr .t td.n-mio { padding-left:22px; } .lr .mio { font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:12.5px; }
.lr .chip { font-size:11.5px; padding:1px 7px; border-radius:999px; background:var(--apagado-fondo); color:var(--tinta-2); font-weight:500; margin-left:6px; white-space:nowrap; }
.lr .tel { color:var(--marca-tinta); text-decoration:none; } .lr .solo-cel { display:none; color:var(--tinta-3); }
.lr .t td.tarde, .lr .tarde { color:var(--problema); font-weight:600; } .lr .t td.vigilar, .lr .vigilar { color:var(--atencion); font-weight:600; } .lr .t td.nd, .lr .t td.sin, .lr .nd, .lr .sin { color:var(--tinta-3); }
.lr .fallo { display:flex; gap:12px; align-items:flex-start; background:var(--atencion-fondo); border-radius:16px; padding:18px; color:var(--atencion); margin-bottom:16px; }
.lr .fallo b { font-size:15px; font-weight:600; } .lr .fallo p { margin:4px 0 0; font-size:13px; line-height:1.45; } .lr .fallo .btn { margin-top:10px; }
.lr .aviso { border:1px solid #fde68a; background:#fffbeb; color:var(--atencion); border-radius:10px; padding:10px 12px; font-size:13px; margin-bottom:12px; }
/* Llegan mañana */
.lr .t-ll col.c-nom { width:340px; } .lr .t-ll col.c-paq { width:56px; } .lr .t-ll col.c-lbs { width:84px; } .lr .t-ll col.c-dias { width:72px; } .lr .t-ll col.c-fecha { width:96px; }
/* Rutas: lista */
.lr .t-lista col.l-ruta { width:230px; } .lr .t-lista col.l-ag { width:84px; } .lr .t-lista col.l-cas { width:88px; } .lr .t-lista col.l-disp { width:96px; } .lr .t-lista col.l-lbs { width:96px; } .lr .t-lista col.l-tra { width:96px; }
.lr .t-lista tbody tr { cursor:pointer; } .lr .t-lista tbody tr:hover td { background:var(--fila-alterna); }
.lr .t-lista a { color:var(--marca-tinta); font-weight:600; text-decoration:none; }
/* Rutas: detalle, UNA sola rejilla, un tbody por casillero, totales en su propia columna */
.lr .t-det col.c-sel { width:36px; } .lr .t-det col.c-nom { width:290px; } .lr .t-det col.c-est { width:136px; } .lr .t-det col.c-paq { width:56px; } .lr .t-det col.c-lbs { width:84px; } .lr .t-det col.c-dias { width:60px; } .lr .t-det col.c-fecha { width:88px; }
.lr .t-det tr.sel td { background:var(--marca-suave); }
.lr input[type=checkbox] { width:16px; height:16px; margin:0; accent-color:var(--marca); cursor:pointer; vertical-align:middle; }
.lr input[type=checkbox]:disabled { cursor:not-allowed; opacity:.35; }
.lr .etq { display:inline-block; width:112px; text-align:center; font-size:12px; padding:2px 6px; border-radius:999px; background:var(--apagado-fondo); color:var(--tinta-2); vertical-align:middle; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lr .accion { position:sticky; bottom:12px; margin-top:16px; background:var(--menu); color:#fff; border-radius:16px; padding:12px 16px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; z-index:5; }
.lr .cuenta { font-size:15px; font-weight:600; margin-right:auto; } .lr .cuenta small { display:block; font-size:12px; font-weight:400; color:rgba(255,255,255,.72); }
.lr .accion .btn.sec { background:transparent; color:#fff; border-color:rgba(255,255,255,.3); } .lr .accion .btn.prim { border-color:var(--marca); } .lr .accion .btn:disabled { opacity:.45; }
/* Rutas: crear / editar */
.lr .form { display:grid; grid-template-columns:minmax(0,1fr) 160px; gap:12px; margin-bottom:14px; }
.lr .campo { display:flex; flex-direction:column; gap:4px; min-width:0; } .lr .campo.ancho { grid-column:1 / -1; }
.lr .campo label { font-size:12px; color:var(--tinta-3); }
.lr .campo input, .lr .campo select, .lr .t-ed select { font:inherit; font-size:14px; padding:8px 10px; border:1px solid var(--linea); border-radius:10px; background:#fff; color:var(--tinta); width:100%; min-width:0; }
.lr .t-ed select { font-size:13px; padding:4px 6px; }
.lr .err { color:var(--problema); font-size:13px; margin:0 0 10px; }
.lr .chk { display:flex; gap:10px; align-items:flex-start; font-size:13.5px; padding:12px 0; border-top:1px solid var(--linea); margin-top:14px; } .lr .chk small { display:block; color:var(--tinta-3); font-size:12.5px; margin-top:2px; }
.lr .t-ed col.e-cas { width:110px; } .lr .t-ed col.e-par { width:150px; } .lr .t-ed col.e-acc { width:84px; }
.lr .t-ed td.e-nom { white-space:normal; } .lr .av { display:block; color:var(--atencion); font-size:12.5px; }
.lr .quitar { font:inherit; font-size:12.5px; color:var(--tinta-3); background:none; border:0; cursor:pointer; padding:0; }
.lr .t-ed td:last-child, .lr .t-ed th:last-child { text-align:right; }
.lr .pie { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:16px; } .lr .pie .btn.peligro { margin-left:auto; }
.lr .vacio { color:var(--tinta-3); font-size:13px; padding:12px 0 0; margin:0; }
dialog.lr-conf { border:0; border-radius:16px; padding:18px; width:min(480px, calc(100vw - 24px)); box-shadow:0 20px 60px rgba(15,23,42,.25); color:#0F172A; font-variant-numeric:tabular-nums; }
dialog.lr-conf::backdrop { background:rgba(15,23,42,.35); }
dialog.lr-conf[open] { position:fixed; inset:0; margin:auto; height:fit-content; }
dialog.lr-conf h2 { font-size:16px; font-weight:600; margin:0 0 10px; } dialog.lr-conf ul { margin:0; padding-left:18px; font-size:13.5px; line-height:1.55; } dialog.lr-conf li + li { margin-top:4px; }
dialog.lr-conf .pie { display:flex; gap:10px; justify-content:flex-end; margin-top:16px; flex-wrap:wrap; }
dialog.lr-conf .btn { font:inherit; font-size:13px; font-weight:600; border-radius:10px; padding:8px 14px; border:1px solid #E7E9EE; background:#fff; color:#0F172A; cursor:pointer; }
dialog.lr-conf .btn.prim { background:#3B5BFD; border-color:#3B5BFD; color:#fff; }
.lr-toast { position:fixed; left:50%; bottom:24px; transform:translateX(-50%); background:#1a2742; color:#fff; border-radius:10px; padding:10px 16px; font-size:13px; z-index:60; max-width:calc(100vw - 32px); }
.lr-toast.mal { background:#B91C1C; }
@media (max-width:900px) {
  .lr .tarjeta { padding:14px; } .lr .kpis, .lr .kpis.tres { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .lr .t th, .lr .t td { padding:8px 6px; } .lr .t .num + td:not(.num), .lr .t .num + th:not(.num) { padding-left:12px; } .lr .t td.n-mio { padding-left:12px; }
  .lr .t-ll col.c-nom { width:auto; } .lr .t-ll col.c-paq { width:40px; } .lr .t-ll col.c-lbs { width:68px; } .lr .t-ll col.c-dias { width:44px; }
  .lr .t-ll col.c-fecha, .lr .t-ll col.c-resto, .lr .t-ll .c-fecha, .lr .t-ll .c-resto { display:none; }
  .lr .solo-cel { display:block; font-size:12px; margin-top:2px; font-weight:400; }
  .lr .t-lista col.l-ruta { width:auto; } .lr .t-lista col.l-disp { width:50px; } .lr .t-lista col.l-lbs { width:76px; } .lr .t-lista col.l-tra { width:64px; }
  .lr .t-lista col.l-ag, .lr .t-lista col.l-cas, .lr .t-lista col.l-sal, .lr .t-lista .l-ag, .lr .t-lista .l-cas, .lr .t-lista .l-sal { display:none; }
  .lr .t-det col.c-nom { width:auto; } .lr .t-det col.c-est { width:98px; } .lr .t-det col.c-lbs { width:60px; } .lr .t-det col.c-sel { width:30px; }
  .lr .t-det col.c-paq, .lr .t-det col.c-dias, .lr .t-det col.c-fecha, .lr .t-det col.c-resto, .lr .t-det .c-paq, .lr .t-det .c-dias, .lr .t-det .c-fecha, .lr .t-det .c-resto { display:none; }
  .lr .t-det td:first-child, .lr .t-det th:first-child { padding-left:7px; padding-right:4px; }
  .lr .t-det td:nth-child(3), .lr .t-det th:nth-child(3) { padding-left:3px; padding-right:3px; }
  .lr .t-det td.n-mio { padding-left:6px; } .lr .mio { font-size:11.5px; }
  .lr .etq { width:88px; font-size:10.5px; padding:2px 3px; }
  .lr .accion { gap:8px; } .lr .cuenta { width:100%; } .lr .accion .btn { flex:1 1 auto; }
  .lr .form { grid-template-columns:minmax(0,1fr); } .lr .t-ed col.e-cas { width:82px; } .lr .t-ed col.e-par { width:96px; } .lr .t-ed col.e-acc { width:56px; }
  .lr .pie .btn { flex:1 1 auto; } .lr .pie .btn.peligro { margin-left:0; }
}

/* P10 Fase 3 (08/11/2026): «Por revisar en esta ruta» del admin (rutas.js). */
.lr #ru-pend { margin-top:16px; }
.lr #ru-pend h2 { font-size:15px; margin:0 0 10px; }
.lr .rp-tabs { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
.lr .rp-tabs button { font:inherit; font-size:13px; padding:6px 12px; border-radius:999px; border:1px solid var(--linea); background:#fff; color:var(--tinta-2); cursor:pointer; white-space:nowrap; }
.lr .rp-tabs button.on { background:var(--marca-suave); border-color:var(--marca-suave); color:var(--marca-tinta); font-weight:600; }
.lr .rp-t col.rp-cas { width:150px; } .lr .rp-t col.rp-n { width:110px; } .lr .rp-t col.rp-acc { width:330px; }
.lr .rp-t td { vertical-align:middle; } .lr .rp-t tr.f-ag td { white-space:normal; }
.lr .rp-t td.rp-nom { white-space:normal; }
.lr .rp-t .rp-sug { display:block; font-size:12px; color:var(--marca-tinta); font-weight:600; }
.lr .rp-t .rp-mot { display:block; font-size:12px; color:var(--tinta-2); }
.lr .rp-t td.rp-bot { white-space:normal; text-align:right; }
.lr .rp-t td.rp-bot .btn { margin:2px 0 2px 6px; }
.lr .rp-msg { font-size:13px; color:var(--bien); margin:0 0 10px; }
@media (max-width:900px) {
  .lr .rp-t col.rp-cas { width:auto; } .lr .rp-t col.rp-n { width:92px; } .lr .rp-t col.rp-acc { width:140px; }
  .lr .rp-t th { white-space:normal; }
  /* La celda del nombre no se quita (las de al lado se correrían de columna): queda con ancho cero. */
  .lr .rp-t td.rp-nom, .lr .rp-t th:nth-child(2) { visibility:hidden; padding:0; font-size:0; border-left:0; } .lr .rp-t col.rp-nomc { width:0; }
  .lr .rp-t td .solo-cel { white-space:normal; }
  .lr .rp-t td.rp-bot .btn { display:block; width:100%; margin:3px 0; white-space:normal; }
  .lr .rp-t td b, .lr .rp-t td .mio { overflow-wrap:anywhere; }
  .lr .rp-tabs { flex-wrap:nowrap; overflow-x:auto; margin-left:-16px; margin-right:-16px; padding:0 16px 4px; }
}
