/* Usendi Transport Suite · PRIVADO · Propiedad de Usendi.
   Interfaz web. Sin estilos en línea (la política de seguridad no los permite): todo vive aquí. */
@font-face{font-family:Barlow;font-weight:400;font-display:swap;src:url(/assets/barlow-400.woff2) format("woff2")}
@font-face{font-family:Barlow;font-weight:500;font-display:swap;src:url(/assets/barlow-500.woff2) format("woff2")}
@font-face{font-family:Barlow;font-weight:600;font-display:swap;src:url(/assets/barlow-600.woff2) format("woff2")}
@font-face{font-family:Barlow;font-weight:700;font-display:swap;src:url(/assets/barlow-700.woff2) format("woff2")}
@font-face{font-family:Michroma;font-weight:400;font-display:swap;src:url(/assets/michroma-400.woff2) format("woff2")}

:root{
  --tinta:#12161C;--tinta2:#1D232C;--naranja:#FF5000;--naranja-osc:#D94300;--papel:#F7F5F1;--blanco:#fff;
  --linea:#E2DED6;--linea2:#CFC9BD;--suave:#6B6F76;--texto:#12161C;
  --verde:#1E9E52;--verde-f:#DDF3E5;--ambar:#E8A800;--ambar-f:#FFF1C2;--rojo:#D6322B;--rojo-f:#F9DAD7;--azul:#2563A8;--azul-f:#DCE9F7;
  --radio:8px;--sombra:0 1px 3px rgba(18,22,28,.12),0 4px 14px rgba(18,22,28,.06);
  --lateral:248px;--alto-cab:56px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:68px}
body{margin:0;background:var(--papel);color:var(--texto);font:400 15px/1.5 Barlow,"Segoe UI",system-ui,Arial,sans-serif;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:Michroma,Barlow,sans-serif;font-weight:400;margin:0 0 .5em;line-height:1.2}
h1{font-size:19px}h2{font-size:15px}h3{font-size:13px;letter-spacing:.02em}h4{font-size:12px}
p{margin:.4em 0 .8em}
a{color:var(--azul)}
button,input,select,textarea{font:inherit;color:inherit}
code,.mono{font-family:ui-monospace,"Courier New",monospace;font-size:.88em}
code{background:#EEEAE2;padding:1px 5px;border-radius:4px;word-break:break-all}
small,.suave{color:var(--suave)}
.ico{width:18px;height:18px;flex:none;vertical-align:-3px}
.oculto,[hidden]{display:none!important}
.oculto-copia{position:fixed;left:-9999px;top:0}
.nowrap{white-space:nowrap}
.der{text-align:right}.centro{text-align:center}
.mt{margin-top:16px}.mb{margin-bottom:16px}.mt2{margin-top:28px}
:focus-visible{outline:3px solid var(--naranja);outline-offset:2px}

/* ───────── preferencias de lectura (accesibilidad) ───────── */
html[data-texto=grande] body{zoom:1.15}
html[data-texto=enorme] body{zoom:1.32}
html[data-contraste=alto]{--suave:#2B3038;--linea:#8B8579;--linea2:#5A5548;--verde-f:#C5EBD2;--ambar-f:#FFE48A;--rojo-f:#F5BDB8;--azul-f:#C4DAF2}
html[data-contraste=alto] .btn{border-width:2px;border-color:#12161C}
html[data-contraste=alto] a{text-decoration:underline}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.saltar{position:absolute;left:-999px;top:6px;background:var(--naranja);color:#fff;padding:8px 14px;border-radius:6px;z-index:90;font-weight:700}
.saltar:focus{left:8px}
.buscar-orden{display:none;align-items:center;gap:2px;background:var(--tinta2);border:1px solid #3a424e;border-radius:8px;padding-left:10px}
.buscar-orden input{background:transparent;border:0;color:#fff;min-height:36px;width:200px;padding:0}
.buscar-orden input::placeholder{color:#AEB3BB}
.buscar-orden input:focus-visible{outline:none}
.buscar-orden:focus-within{outline:3px solid var(--naranja)}
@media(min-width:760px){.buscar-orden{display:flex}}
.nav-txt{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.nav-txt small{color:var(--suave);font-weight:400;font-size:12px}
.nav.activo .nav-txt small{color:#6A4A38}
.siguiente-paso{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:#FFF3EC;border:1px solid #FFCFB5;border-left:5px solid var(--naranja);border-radius:var(--radio);padding:10px 14px;margin-bottom:14px}
.siguiente-paso .crece{min-width:220px}
.bola-n{flex:none;width:30px;height:30px;border-radius:50%;background:var(--naranja);color:#fff;display:flex;align-items:center;justify-content:center;font:400 12px Michroma,sans-serif}

/* ───────── estructura ───────── */
#app{min-height:100vh}
.cab{position:sticky;top:0;z-index:30;height:var(--alto-cab);background:var(--tinta);color:#fff;display:flex;align-items:center;gap:10px;padding:0 12px}
.cab .logo{height:22px;display:block}
.cab .empresa{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:34vw}
.cab .sep{flex:1}
.cab .btn-icono{color:#fff}
.cab select{background:var(--tinta2);color:#fff;border:1px solid #3a424e;border-radius:6px;padding:5px 8px;max-width:44vw}
.insignia{position:relative}
.insignia b{position:absolute;top:-5px;right:-6px;min-width:18px;height:18px;border-radius:9px;background:var(--rojo);color:#fff;font:700 11px/18px Barlow,sans-serif;text-align:center;padding:0 4px}
.insignia b.am{background:var(--ambar);color:var(--tinta)}
.cuerpo{display:flex}
.lateral{position:fixed;z-index:25;top:var(--alto-cab);left:0;bottom:0;width:var(--lateral);background:var(--blanco);border-right:1px solid var(--linea);overflow-y:auto;transform:translateX(-100%);transition:transform .18s;padding:10px 0 24px}
.lateral.abierto{transform:none}
.velo{position:fixed;inset:var(--alto-cab) 0 0 0;background:rgba(18,22,28,.45);z-index:24}
.grupo{padding:10px 18px 4px;font:400 10px Michroma,sans-serif;color:var(--suave);text-transform:uppercase;letter-spacing:.08em}
.nav{display:flex;align-items:center;gap:10px;padding:10px 18px;color:var(--texto);text-decoration:none;border-left:4px solid transparent;font-weight:500;min-height:44px}
.nav:hover{background:var(--papel)}
.nav.activo{border-left-color:var(--naranja);background:#FFF3EC;font-weight:700}
.nav .n{margin-left:auto;background:var(--rojo);color:#fff;border-radius:10px;font-size:11px;font-weight:700;padding:0 7px;line-height:18px}
.nav .n.am{background:var(--ambar);color:var(--tinta)}
.principal{flex:1;min-width:0;padding:16px 14px 80px}
.pagina{max-width:1180px;margin:0 auto}
.titulo{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.titulo h1{margin:0}
.titulo .sub{color:var(--suave);margin:4px 0 0;font-size:14px}
.titulo .acciones{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
@media(min-width:960px){
  .lateral{transform:none}.velo{display:none}.principal{margin-left:var(--lateral);padding:22px 28px 80px}
  #btn-menu{display:none}.cab .empresa{max-width:none}
}

/* ───────── botones y formularios ───────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:8px 16px;border-radius:var(--radio);border:1px solid var(--linea2);background:var(--blanco);color:var(--tinta);font-weight:600;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn:hover{background:var(--papel)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.primario{background:var(--naranja);border-color:var(--naranja);color:#fff}
.btn.primario:hover{background:var(--naranja-osc)}
.btn.oscuro{background:var(--tinta);border-color:var(--tinta);color:#fff}
.btn.peligro{background:var(--rojo);border-color:var(--rojo);color:#fff}
.btn.chico{min-height:32px;padding:4px 10px;font-size:13px}
.btn.grande{min-height:52px;font-size:17px;padding:12px 22px}
.btn.bloque{display:flex;width:100%}
.btn-icono{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:0;background:transparent;border-radius:var(--radio);cursor:pointer;color:inherit}
.btn-icono:hover{background:rgba(127,127,127,.18)}
.campo{display:flex;flex-direction:column;gap:4px;margin-bottom:14px;min-width:0}
.campo>label,.campo>.rotulo{font-weight:600;font-size:14px}
.campo .req{color:var(--rojo)}
.campo .ayuda{font-size:13px;color:var(--suave)}
.campo .error{font-size:13px;color:var(--rojo);font-weight:600}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input[type=time],input[type=datetime-local],input[type=search],input[type=url],input[type=tel],select,textarea{width:100%;min-height:42px;padding:8px 11px;border:1px solid var(--linea2);border-radius:var(--radio);background:var(--blanco)}
textarea{min-height:88px;resize:vertical}
input:disabled,select:disabled,textarea:disabled{background:#EFEDE8;color:var(--suave)}
input.malo,select.malo,textarea.malo{border-color:var(--rojo);background:#FFF6F5}
input[type=checkbox],input[type=radio]{width:20px;height:20px;accent-color:var(--naranja);flex:none}
.check{display:flex;align-items:flex-start;gap:9px;min-height:30px;font-weight:500}
.rejilla{display:grid;gap:0 16px;grid-template-columns:1fr}
@media(min-width:720px){.rejilla.c2{grid-template-columns:1fr 1fr}.rejilla.c3{grid-template-columns:1fr 1fr 1fr}.rejilla.c4{grid-template-columns:repeat(4,1fr)}}
.fila{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.fila.fin{justify-content:flex-end}
.fila>.crece{flex:1;min-width:160px}
.filtros{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px}
.filtros .campo{margin:0;min-width:140px}
.filtros .campo.ancho{flex:1;min-width:200px}

/* ───────── tarjetas, tablas, etiquetas ───────── */
.tarjeta{background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radio);padding:16px;box-shadow:var(--sombra);margin-bottom:16px}
.tarjeta>h2:first-child,.tarjeta>h3:first-child{margin-top:0}
.tarjeta.vacia{text-align:center;color:var(--suave);padding:34px 16px}
.tarjeta.vacia .ico{width:34px;height:34px;color:var(--linea2);display:block;margin:0 auto 8px}
.cols{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:900px){.cols.c2{grid-template-columns:1fr 1fr}.cols.c3{grid-template-columns:repeat(3,1fr)}.cols.c21{grid-template-columns:2fr 1fr}.cols.c12{grid-template-columns:1fr 2fr}}
.numeros{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));margin-bottom:16px}
.numero{background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radio);padding:12px 14px}
.numero b{display:block;font:400 26px/1.1 Michroma,sans-serif}
.numero span{font-size:13px;color:var(--suave)}
.numero.rojo{border-left:5px solid var(--rojo)}.numero.amarillo{border-left:5px solid var(--ambar)}.numero.verde{border-left:5px solid var(--verde)}
.tabla-caja{overflow-x:auto;border:1px solid var(--linea);border-radius:var(--radio);background:var(--blanco);margin-bottom:16px}
table.tabla{border-collapse:collapse;width:100%;font-size:14px}
.tabla th{background:var(--tinta);color:#fff;text-align:left;font-weight:600;padding:9px 10px;white-space:nowrap;position:sticky;top:0}
.tabla td{padding:9px 10px;border-top:1px solid var(--linea);vertical-align:top}
.tabla tbody tr:hover td{background:#FBFAF7}
.tabla tr.clic{cursor:pointer}
.tabla td.acc{white-space:nowrap;text-align:right}
.tabla td:first-child{white-space:nowrap}
.tabla .sub{display:block;color:var(--suave);font-size:12.5px;white-space:normal;max-width:42ch}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;margin:0}
.kv dt{color:var(--suave);font-weight:600}.kv dd{margin:0;min-width:0;word-break:break-word}
.etq{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:12px;font-size:12.5px;font-weight:700;background:#ECE9E2;white-space:nowrap}
.etq.verde{background:var(--verde-f);color:#146B38}.etq.amarillo{background:var(--ambar-f);color:#7A5A00}.etq.rojo{background:var(--rojo-f);color:#9B1F19}.etq.azul{background:var(--azul-f);color:#1B4B80}.etq.gris{background:#ECE9E2;color:#4A4E55}.etq.naranja{background:#FFE4D6;color:#A63400}
.sem{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--verde);vertical-align:-1px;margin-right:6px;flex:none}
.sem.amarillo{background:var(--ambar)}.sem.rojo{background:var(--rojo)}.sem.gris{background:#B9B5AB}
.barra{height:8px;background:#E8E4DB;border-radius:4px;overflow:hidden}
.barra>i{display:block;height:100%;background:var(--verde);border-radius:4px}
.barra>i.amarillo{background:var(--ambar)}.barra>i.rojo{background:var(--rojo)}
.pestanas{display:flex;gap:2px;border-bottom:2px solid var(--linea);margin-bottom:16px;overflow-x:auto}
.pestana{padding:10px 16px;border:0;background:transparent;font-weight:600;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px;color:var(--suave);white-space:nowrap}
.pestana.activa{color:var(--tinta);border-bottom-color:var(--naranja)}
.paginador{display:flex;gap:10px;align-items:center;justify-content:flex-end;margin:-6px 0 16px;color:var(--suave)}

/* ───────── avisos y ayuda ───────── */
.aviso{display:flex;gap:11px;padding:12px 14px;border-radius:var(--radio);border:1px solid var(--linea2);background:var(--blanco);margin-bottom:14px;align-items:flex-start}
.aviso .ico{margin-top:2px}
.aviso.info{background:var(--azul-f);border-color:#B5CFEA}.aviso.ok{background:var(--verde-f);border-color:#A9DDBC}.aviso.ojo{background:var(--ambar-f);border-color:#EDD27A}.aviso.mal{background:var(--rojo-f);border-color:#EBB1AC}
.aviso>div{min-width:0}.aviso b{display:block}.aviso p{margin:2px 0}
.aviso ul{margin:4px 0 0 18px;padding:0}
.ayuda-panel{border-left:5px solid var(--azul);background:var(--azul-f);border-radius:var(--radio);padding:14px 16px;margin-bottom:16px}
.ayuda-panel h3{margin-top:0}
.ayuda-panel ol,.ayuda-panel ul{margin:4px 0 8px 20px;padding:0}
.ayuda-panel li{margin:3px 0}
.ayuda-panel details{margin-top:6px}
.ayuda-panel summary{cursor:pointer;font-weight:600}
.btn-ayuda{border-color:var(--azul);color:var(--azul)}
.sugerencia{font-size:13px;color:var(--suave);margin:2px 0 0}
.toasts{position:fixed;z-index:100;right:12px;bottom:12px;left:12px;display:flex;flex-direction:column;gap:8px;align-items:flex-end;pointer-events:none}
.toast{pointer-events:auto;display:flex;gap:9px;align-items:flex-start;max-width:520px;background:var(--tinta);color:#fff;padding:12px 15px;border-radius:var(--radio);box-shadow:var(--sombra);font-weight:500}
.toast.error{background:var(--rojo)}.toast.aviso{background:#8A6500}
.modal-fondo{position:fixed;inset:0;z-index:60;background:rgba(18,22,28,.55);display:flex;align-items:flex-start;justify-content:center;padding:4vh 10px;overflow-y:auto}
.modal{background:var(--blanco);border-radius:10px;box-shadow:0 12px 40px rgba(0,0,0,.35);width:100%;max-width:560px}
.modal.ancho{max-width:860px}.modal.angosto{max-width:420px}
.modal-cab{display:flex;align-items:center;justify-content:space-between;padding:12px 8px 8px 18px;border-bottom:1px solid var(--linea)}
.modal-cab h2{margin:0}
.modal-cuerpo{padding:16px 18px}
.modal-pie{display:flex;gap:10px;justify-content:flex-end;padding:12px 18px;border-top:1px solid var(--linea);background:var(--papel);border-radius:0 0 10px 10px;flex-wrap:wrap}
.cargando{padding:40px;text-align:center;color:var(--suave)}
.cargando::before{content:"";display:block;width:26px;height:26px;margin:0 auto 10px;border:3px solid var(--linea2);border-top-color:var(--naranja);border-radius:50%;animation:gira .8s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}

/* ───────── inicio de sesión ───────── */
.entrada{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:var(--tinta)}
.entrada .caja{width:100%;max-width:410px;background:var(--blanco);border-radius:12px;padding:26px 24px;box-shadow:0 14px 50px rgba(0,0,0,.4)}
.entrada .logo{display:block;height:26px;margin:0 0 18px}
.entrada h1{font-size:16px}
.entrada .pie{margin-top:16px;font-size:12.5px;color:var(--suave);text-align:center}

/* ───────── puesta en marcha ───────── */
.pasos{list-style:none;margin:0;padding:0;counter-reset:p}
.paso{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:14px 0;border-top:1px solid var(--linea)}
.paso:first-child{border-top:0}
.paso .bola{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:400 13px Michroma,sans-serif;background:#ECE9E2;color:var(--suave)}
.paso.hecho .bola{background:var(--verde);color:#fff}
.paso.pendiente .bola{background:var(--naranja);color:#fff}
.paso.opcional .bola{background:var(--azul-f);color:var(--azul)}
.paso h3{margin:0 0 3px}
.paso .para{margin:0 0 4px;color:var(--suave)}
.paso .como{margin:6px 0;font-size:14px}
.chequeo{display:flex;gap:10px;padding:10px 0;border-top:1px solid var(--linea);align-items:flex-start}
.chequeo:first-child{border-top:0}

/* ───────── seguimiento / órdenes ───────── */
.tarjeta-orden{display:block;text-decoration:none;color:inherit}
.lista-ordenes{display:grid;gap:10px}
.orden-fila{display:grid;gap:4px 12px;grid-template-columns:auto 1fr auto;align-items:center;background:var(--blanco);border:1px solid var(--linea);border-left:6px solid var(--verde);border-radius:var(--radio);padding:11px 13px;cursor:pointer}
.orden-fila.amarillo{border-left-color:var(--ambar)}.orden-fila.rojo{border-left-color:var(--rojo)}.orden-fila.gris{border-left-color:#B9B5AB}
.orden-fila:hover{box-shadow:var(--sombra)}
.orden-fila .num{font-weight:700}
.orden-fila .det{grid-column:1/-1;color:var(--suave);font-size:13.5px}
.cinta{display:flex;gap:0;overflow-x:auto;padding:4px 0 10px;margin:0 -2px}
.etapa-cinta{flex:1;min-width:110px;text-align:center;position:relative;padding:0 4px}
.etapa-cinta::before{content:"";position:absolute;top:15px;left:-50%;right:50%;height:4px;background:var(--linea2)}
.etapa-cinta:first-child::before{display:none}
.etapa-cinta.hecha::before,.etapa-cinta.activa::before{background:var(--verde)}
.etapa-cinta .punto{position:relative;width:34px;height:34px;border-radius:50%;margin:0 auto 5px;background:var(--blanco);border:3px solid var(--linea2);display:flex;align-items:center;justify-content:center;font:400 11px Michroma,sans-serif;color:var(--suave)}
.etapa-cinta.hecha .punto{background:var(--verde);border-color:var(--verde);color:#fff}
.etapa-cinta.activa .punto{border-color:var(--naranja);color:var(--naranja);box-shadow:0 0 0 4px #FFE4D6}
.etapa-cinta.activa.amarillo .punto{border-color:var(--ambar);box-shadow:0 0 0 4px var(--ambar-f)}
.etapa-cinta.activa.rojo .punto{border-color:var(--rojo);box-shadow:0 0 0 4px var(--rojo-f)}
.etapa-cinta .nom{font-size:12.5px;font-weight:600;line-height:1.25}
.etapa-cinta .tm{font-size:12px;color:var(--suave)}
.linea-tiempo{list-style:none;margin:0;padding:0 0 0 14px;border-left:3px solid var(--linea)}
.linea-tiempo li{position:relative;padding:0 0 12px 14px}
.linea-tiempo li::before{content:"";position:absolute;left:-22px;top:5px;width:11px;height:11px;border-radius:50%;background:var(--tinta)}
.linea-tiempo .cuando{font-size:12.5px;color:var(--suave)}
.hash{font-family:ui-monospace,monospace;font-size:11.5px;color:var(--suave)}
.evidencia{display:inline-block;margin:4px 8px 4px 0;vertical-align:top}
.evidencia img,img.evidencia{display:block;max-width:180px;max-height:140px;width:auto;height:auto;object-fit:contain;border:1px solid var(--linea);border-radius:6px}

/* ───────── mis tareas (móvil primero) ───────── */
.tarea{background:var(--blanco);border:1px solid var(--linea);border-left:6px solid var(--naranja);border-radius:var(--radio);padding:14px;margin-bottom:12px}
.tarea h3{margin:0 0 4px;font-size:14px}
.tarea .dir{font-weight:600;font-size:16px}
.tarea .acciones{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.firma{display:block;width:100%;height:180px;border:2px dashed var(--linea2);border-radius:var(--radio);background:#fff;touch-action:none}
.foto-prev{max-width:100%;max-height:220px;border-radius:6px;border:1px solid var(--linea);display:block;margin-top:6px}

/* ───────── mapa ───────── */
.mapa-caja{border:1px solid var(--linea);border-radius:var(--radio);background:#fff;overflow:hidden}
.mapa-caja svg{display:block;width:100%;height:auto;background:var(--papel)}
.leyenda-mapa{display:flex;flex-wrap:wrap;gap:6px 14px;padding:8px 12px;font-size:13px;border-top:1px solid var(--linea)}
.leyenda-mapa span{display:inline-flex;align-items:center;gap:5px}

/* ───────── datos / carga masiva ───────── */
.entidades{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.entidad{display:block;text-decoration:none;color:inherit;background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radio);padding:12px 14px}
.entidad:hover{border-color:var(--naranja);box-shadow:var(--sombra)}
.entidad b{display:block}.entidad span{font-size:13px;color:var(--suave)}
.entidad .cuenta{float:right;background:var(--papel);border-radius:10px;padding:0 8px;font-weight:700;font-size:13px}
.zona-soltar{border:3px dashed var(--linea2);border-radius:var(--radio);padding:26px;text-align:center;background:var(--blanco);cursor:pointer}
.zona-soltar.sobre{border-color:var(--naranja);background:#FFF3EC}
.zona-soltar .ico{width:30px;height:30px;color:var(--suave)}
.error-fila td{background:var(--rojo-f)!important}
.ok-fila td{background:var(--verde-f)!important}

/* ───────── calendarios ───────── */
.semana{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.dia-sem{border:1px solid var(--linea);border-radius:var(--radio);padding:8px;background:var(--blanco);min-height:96px}
.dia-sem h4{margin:0 0 6px;text-align:center}
.bloque-h{display:flex;align-items:center;justify-content:space-between;gap:4px;background:var(--verde-f);border-radius:5px;padding:3px 6px;margin-bottom:4px;font-size:13px;font-weight:600}
.bloque-h button{border:0;background:transparent;cursor:pointer;padding:0;color:var(--rojo)}
.anual{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.mes-caja{border:1px solid var(--linea);border-radius:var(--radio);padding:8px 10px;background:var(--blanco)}
.mes-caja h4{margin:0 0 4px}
.mes-caja table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:12.5px}
.mes-caja th{color:var(--suave);font-weight:600;padding:1px 0}
.mes-caja td{text-align:center;padding:3px 0;border:1px solid #fff}
.mes-caja td.abierto{background:#DDF3E5}.mes-caja td.especial{background:#FFE9A8}.mes-caja td.cerrado{background:#EFC9C6}
.leyenda-cal{display:flex;gap:16px;flex-wrap:wrap;margin:8px 0 14px;font-size:13.5px}
.leyenda-cal i{display:inline-block;width:14px;height:14px;border-radius:3px;margin-right:5px;vertical-align:-2px;border:1px solid var(--linea2)}
.leyenda-cal .abierto{background:#DDF3E5}.leyenda-cal .especial{background:#FFE9A8}.leyenda-cal .cerrado{background:#EFC9C6}

/* ───────── gráficos simples ───────── */
.barras{display:grid;gap:7px}
.barras .b{display:grid;grid-template-columns:minmax(90px,170px) 1fr 54px;gap:8px;align-items:center;font-size:13.5px}
.barras .b .riel{height:14px;background:#ECE9E2;border-radius:3px;overflow:hidden}
.barras .b .riel>i{display:block;height:100%;background:var(--naranja)}
.grafico-dias{width:100%;height:auto;display:block}
.codigo-caja{position:relative;background:var(--tinta);color:#E8E4DB;border-radius:var(--radio);padding:14px;font:13px/1.5 ui-monospace,"Courier New",monospace;white-space:pre-wrap;word-break:break-all;max-height:340px;overflow:auto}
.codigo-caja+.fila{margin-top:8px}
.flujo-h{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.flujo-h .et{background:var(--tinta);color:#fff;border-radius:6px;padding:4px 10px;font-weight:600;font-size:13px}
.flujo-h .fl{color:var(--suave)}

@media print{
  .cab,.lateral,.velo,.toasts,.no-imprimir,.btn{display:none!important}
  .principal{margin:0!important;padding:0!important}
  body{background:#fff}
  .tarjeta{box-shadow:none;break-inside:avoid}
}

/* ───────── fichas (contratos, etc.) ───────── */
.kv-rejilla{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px 24px;margin-bottom:8px}
.kv-rejilla .kv{display:flex;flex-direction:column;gap:1px;font-size:14px}
.kv-rejilla .kv b{font-size:15px}
.tabla td.der,.tabla th.der{white-space:nowrap}
.alerta-fila{border-left:5px solid var(--linea2);padding:6px 0 6px 12px;margin:10px 0}
.alerta-fila.rojo{border-left-color:var(--rojo)}.alerta-fila.amarillo{border-left-color:var(--ambar)}.alerta-fila.azul{border-left-color:#3B7DD8}
.alerta-fila p{margin:4px 0}

/* ───────── asistente de conexiones ───────── */
.opciones-grandes{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-bottom:12px}
.opcion-grande{display:flex;flex-direction:column;gap:4px;text-align:left;padding:14px;border:2px solid var(--linea2);border-radius:var(--radio);background:var(--blanco);cursor:pointer;font:inherit;color:inherit;min-height:44px}
.opcion-grande span{color:var(--suave);font-size:14px}
.opcion-grande[aria-pressed=true]{border-color:var(--naranja);background:#FFF3EC}
.mapa-fila{flex-wrap:nowrap;align-items:flex-start;margin-bottom:6px}
.mapa-fila .campo{flex:1;min-width:0;margin:0}
textarea.codigo{width:100%;font:13px/1.45 ui-monospace,Menlo,Consolas,monospace;background:#12161C;color:#F7F5F1;border-radius:var(--radio);padding:10px;border:0;resize:vertical}
.codigo-caja code{background:transparent;color:inherit;padding:0}
.codigo-caja{margin:8px 0}

/* ───────── v1.1 · tipos de logística, dónde está la carga, centro de control ───────── */
:root{--morado:#7A4DB3;--morado-f:#EADFF7;--seg-long:#2563A8;--seg-mid:#7A4DB3;--seg-last:#FF5000}
.etq.morado{background:var(--morado-f);color:#54308A}
.seg-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:12px;font-size:12.5px;border:1px solid var(--linea2);background:var(--blanco);white-space:nowrap}
.seg-chip.azul{border-color:var(--seg-long);background:var(--azul-f);color:#1B4B80}
.seg-chip.morado{border-color:var(--seg-mid);background:var(--morado-f);color:#54308A}
.seg-chip.naranja{border-color:var(--seg-last);background:#FFE4D6;color:#A63400}
.segs{gap:8px;margin-top:10px}
.leyenda-seg{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 14px}
.cuadro{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px;vertical-align:-1px;background:#B9B5AB}
.cuadro.seg-long_haul{background:var(--seg-long)}.cuadro.seg-mid_mile{background:var(--seg-mid)}.cuadro.seg-last_mile{background:var(--seg-last)}

/* avance de una orden */
.barra-avance{height:12px;border-radius:7px;background:#EEEAE2;overflow:hidden;margin:10px 0 4px}
.barra-avance>i{display:block;height:100%;border-radius:7px;background:var(--verde);transition:width .4s}
.barra-avance.amarillo>i{background:var(--ambar)}.barra-avance.rojo>i{background:var(--rojo)}
.donde-caja{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border:1px solid var(--linea);border-radius:var(--radio);background:var(--papel)}
.donde-caja .ico{width:28px;height:28px;color:var(--naranja);margin-top:2px}
.donde-texto{font-size:16px}
.numero b.chica{font:700 16px/1.3 Barlow,sans-serif}
.faltan{margin:8px 0 0;padding-left:22px}.faltan li{margin:4px 0}
.corto{min-width:170px;max-width:260px}
.etiquetas-barra{align-items:flex-end;gap:10px}
.etiquetas-barra .campo{margin:0}

/* dónde está mi carga */
.lugares{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));margin-bottom:14px}
.lugar{display:grid;grid-template-columns:auto 1fr auto;gap:2px 10px;align-items:center;text-align:left;padding:10px 12px;background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radio);cursor:pointer;border-left:5px solid var(--azul)}
.lugar:hover{box-shadow:var(--sombra)}
.lugar.vehiculo{border-left-color:var(--naranja)}.lugar.retiro{border-left-color:#8A8F98}
.lugar.amarillo{border-left-color:var(--ambar)}.lugar.rojo{border-left-color:var(--rojo)}
.lugar-ico .ico{width:24px;height:24px;color:var(--tinta2)}
.lugar-txt{display:flex;flex-direction:column;min-width:0}.lugar-txt b{overflow-wrap:anywhere}
.lugar-n{display:flex;flex-direction:column;align-items:flex-end;line-height:1.1}.lugar-n b{font:400 22px/1 Michroma,sans-serif}
.lugar-sem,.lugar-areas{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12.5px;color:var(--suave)}
.lugar-sem span{display:inline-flex;align-items:center}
.quitar{cursor:pointer}

/* leer un bulto */
.leer-form .grande-input{font-size:22px;padding:14px 12px;letter-spacing:.04em}
.btn.grande{padding:12px 20px;font-size:16px}
.casilla{display:flex;gap:8px;align-items:center;margin-top:10px;cursor:pointer}
.casilla input{width:20px;height:20px}
.visor{margin-top:12px}.visor video{width:100%;max-height:360px;background:#000;border-radius:var(--radio);display:block;margin-bottom:8px}
.leer-resultado{margin:12px 0}
.leer-ok{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--radio);border:2px solid var(--verde);background:var(--verde-f)}
.leer-ok.mal{border-color:var(--rojo);background:var(--rojo-f)}
.leer-ok>.ico{width:32px;height:32px;flex:none;margin-top:2px}
.leer-ok.bien>.ico{color:var(--verde)}.leer-ok.mal>.ico{color:var(--rojo)}
.leer-ok .grande{font-size:19px}

/* centro de control */
.pagina-centro .tarjeta h3{margin-bottom:8px}
.flujo-tarjeta{margin-bottom:14px}
.flujo-cajas{display:flex;gap:0;overflow-x:auto;padding:6px 2px 10px;align-items:stretch}
.caja-etapa{position:relative;flex:0 0 150px;min-width:150px;margin-right:22px;padding:8px 10px;background:var(--blanco);border:2px solid var(--linea2);border-radius:10px;cursor:pointer;display:flex;flex-direction:column;gap:3px;border-top-width:6px}
.caja-etapa:last-child{margin-right:0}
.caja-etapa:not(:last-child)::after{content:"";position:absolute;right:-22px;top:50%;width:22px;height:2px;background:var(--linea2)}
.caja-etapa:not(:last-child)::before{content:"";position:absolute;right:-22px;top:calc(50% - 4px);border-left:7px solid var(--linea2);border-top:5px solid transparent;border-bottom:5px solid transparent;margin-right:-1px}
.caja-etapa.verde{border-color:var(--verde)}.caja-etapa.amarillo{border-color:var(--ambar)}.caja-etapa.rojo{border-color:var(--rojo);background:#FFF6F5}.caja-etapa.gris{border-color:var(--linea2)}
.caja-etapa.seg-long_haul{border-top-color:var(--seg-long)}.caja-etapa.seg-mid_mile{border-top-color:var(--seg-mid)}.caja-etapa.seg-last_mile{border-top-color:var(--seg-last)}
.caja-etapa:hover,.caja-etapa:focus-visible{box-shadow:var(--sombra)}
.caja-cab{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:11px;color:var(--suave)}
.caja-n{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--tinta);color:#fff;font-weight:700;font-size:11px}
.caja-nom{font-size:13px;line-height:1.2;min-height:32px;overflow-wrap:anywhere}
.caja-num{display:flex;align-items:baseline;gap:5px}.caja-num b{font:400 26px/1 Michroma,sans-serif}.caja-num small{font-size:11.5px}
.caja-sem{display:flex;gap:10px;font-size:12.5px;min-height:18px}.caja-sem span{display:inline-flex;align-items:center}
.caja-pie{display:flex;justify-content:space-between;gap:6px;font-size:11px;color:var(--suave);border-top:1px dashed var(--linea);padding-top:4px;margin-top:auto}
.dona-caja{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.dona{width:130px;height:130px;flex:none}.dona-n{font:400 22px Michroma,sans-serif;fill:var(--tinta)}
.leyenda{list-style:none;margin:0;padding:0;font-size:13px}.leyenda li{margin:3px 0}
.columnas{width:100%;height:auto;display:block}.columnas .eje{font:11px Barlow,sans-serif;fill:var(--suave)}
.filas-apiladas{display:flex;flex-direction:column;gap:6px}
.fila-apilada{display:grid;grid-template-columns:minmax(90px,30%) 1fr auto;gap:8px;align-items:center;text-align:left;background:none;border:0;padding:4px 2px;cursor:pointer;border-radius:6px}
.fila-apilada:hover{background:var(--papel)}
.fila-apilada .nom{overflow-wrap:anywhere;font-size:13.5px;font-weight:600}
.fila-apilada .cifras{font-size:13px;text-align:right}.fila-apilada .cifras small{display:block}
.apilada{display:flex;height:14px;border-radius:7px;overflow:hidden;background:#EEEAE2;min-width:60px}
.apilada i{display:block;height:100%}.apilada i.verde{background:var(--verde)}.apilada i.amarillo{background:var(--ambar)}.apilada i.rojo{background:var(--rojo)}
.numero.clicable{text-align:left;cursor:pointer;font:inherit}.numero.clicable:hover{box-shadow:var(--sombra)}
.matriz td{vertical-align:middle}
.puntos{display:flex;flex-wrap:wrap;gap:3px;align-items:center;min-width:140px}
.pe{display:inline-block;width:14px;height:14px;border-radius:50%;border:2px solid var(--linea2);background:var(--blanco);box-sizing:border-box;vertical-align:middle}
.pe.completada{background:var(--verde);border-color:var(--verde)}.pe.completada.amarillo{background:var(--ambar);border-color:var(--ambar)}.pe.completada.rojo{background:var(--rojo);border-color:var(--rojo)}
.pe.activa{background:var(--blanco);border-width:4px;border-color:var(--verde)}.pe.activa.amarillo{border-color:var(--ambar)}.pe.activa.rojo{border-color:var(--rojo)}
.pe.omitida{opacity:.4}
.pe.seg-long_haul{box-shadow:0 3px 0 -1px var(--seg-long)}.pe.seg-mid_mile{box-shadow:0 3px 0 -1px var(--seg-mid)}.pe.seg-last_mile{box-shadow:0 3px 0 -1px var(--seg-last)}
@media print{.pagina-centro .no-imprimir,.pagina-centro .filtros{display:none}.flujo-cajas{flex-wrap:wrap;overflow:visible}.pagina-centro .tarjeta{break-inside:avoid}}

.flujo-h .et.seg-long_haul{background:var(--seg-long)}.flujo-h .et.seg-mid_mile{background:var(--seg-mid)}.flujo-h .et.seg-last_mile{background:var(--naranja-osc)}

/* Aviso de propiedad intelectual de Usendi */
.aviso-pi{margin:14px 14px 0;font-size:11.5px;line-height:1.35;color:var(--suave)}
.entrada .pie.aviso-pi{margin:8px 0 0;font-size:11.5px}

/* Guías de configuración (Usendi Transport Suite) */
.asistente{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:900px){.asistente{grid-template-columns:230px 1fr}}
.pasos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.pasos .btn{width:100%;justify-content:flex-start;text-align:left}
.tarjeta.interna{background:var(--papel,#F7F5F1);margin-bottom:10px}
.lista-chk{list-style:none;padding:0;margin:10px 0}
.lista-chk li{padding:6px 0;border-bottom:1px solid var(--linea)}
.tabla tfoot tr.total td{font-weight:700;border-top:2px solid var(--linea);background:var(--papel,#F7F5F1)}

.mapa-caja .pulso{opacity:.28;transform-box:fill-box;transform-origin:center;animation:pulso 1.8s ease-out infinite}
@keyframes pulso{0%{transform:scale(.6);opacity:.5}100%{transform:scale(1.8);opacity:0}}
@media(prefers-reduced-motion:reduce){.mapa-caja .pulso{animation:none}}
pre.codigo{background:#12161C;color:#F7F5F1;padding:10px;border-radius:8px;overflow:auto;white-space:pre-wrap;word-break:break-all;font-size:12.5px;margin:6px 0}
.dist-panel{margin:8px 0 12px;padding:10px 12px;border:1px solid #E2DED6;border-radius:8px;background:#fff}
.dist-fila{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.dist-celda{display:grid;gap:2px}.dist-celda b{font-size:19px}
.dist-hecho{color:#12161C}.dist-falta{color:#FF5000}
.dist-prog{width:100%;height:10px;margin-top:8px;accent-color:#FF5000}

/* ───────── Usendi WMS: tarjetas de números y vistas de mano (PDT) ───────── */
.cuadro-num{display:flex;flex-direction:column;gap:2px;padding:12px 14px;background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radio);text-decoration:none;color:inherit;box-shadow:var(--sombra)}
.cuadro-num .n{font:700 26px/1.1 Barlow,sans-serif}.cuadro-num span{color:var(--suave);font-size:13.5px}
a.cuadro-num:hover{border-color:var(--naranja)}
.tarea-grande{background:var(--blanco);border:1px solid var(--linea);border-left:8px solid var(--naranja);border-radius:var(--radio);padding:16px;margin-bottom:14px}
.tarea-grande .que{font:700 22px/1.2 Barlow,sans-serif;margin:0 0 6px}
.tarea-grande .lugar-g{font:700 34px/1.1 Michroma,Barlow,sans-serif;letter-spacing:.02em;margin:6px 0;overflow-wrap:anywhere}
@media (max-width:420px){.tarea-grande .lugar-g{font-size:22px}}
.tarea-grande .flecha{color:var(--suave);font-size:20px;margin:0 8px}
.tarea-grande .cant{font:700 28px/1 Barlow,sans-serif}
.pdt .btn{min-height:52px;font-size:17px}
.dos-col{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:900px){.dos-col{grid-template-columns:1fr 1fr}}
.sub-linea{display:block;color:var(--suave);font-size:12.5px}
.chip{display:inline-block;padding:1px 8px;border-radius:10px;background:#EEEAE2;font-size:12.5px;font-weight:600}
.chip.rojo{background:var(--rojo-f);color:var(--rojo)}.chip.verde{background:var(--verde-f);color:var(--verde)}.chip.amarillo{background:var(--ambar-f)}

/* Portal del dueño */
.fila-campos { display: grid; grid-template-columns: 2fr 1fr; gap: .5rem; margin-bottom: .5rem; }
.fila-botones { display: flex; flex-wrap: wrap; gap: .75rem; }
/* enlace al Portal Usendi en el encabezado: icono + palabra; en pantallas angostas solo el icono */
.cab .enlace-portal{width:auto;gap:6px;padding:0 10px;margin-right:12px;font-size:13px;font-weight:600;text-decoration:none}
@media(max-width:1000px){.cab .enlace-portal span{display:none}.cab .enlace-portal{padding:0;width:40px;margin-right:4px}}