/* dotActual · app · identidad de los formatos de Odoo (cotización, remisión, OC, factura) llevada a la pantalla.
   Arquitectura del documento: abre con la señal (franja amarilla) y cierra con solidez (negro).
   Tinta #1A1A1A: títulos serif, datos y los bloques de peso (menú = encabezado de tabla, barra inferior = pie, íconos de proceso).
   Amarillo #FFF212: franja, dobles barras bajo el título, letra sobre negro, acción principal.
   Verde #1F7145: herencia institucional en acentos (títulos de tarjeta, lema, estados, enlaces). Nunca como bloque de fondo.
   Source Serif 4 (títulos) · Inter (texto) · JetBrains Mono (cifras). El oro #F3C300 es solo del wordmark ARMOR. */
:root{
  --ease-out:cubic-bezier(.23,1,.32,1); --ease-in-out:cubic-bezier(.77,0,.175,1); --ease-drawer:cubic-bezier(.32,.72,0,1);   /* curvas (Emil Kowalski) */
  --verde:#1F7145; --verde-2:#17583A; --crema:#FFFDE7; --boton:#F2F2EE; --amarillo:#FFF212; --tinta:#1A1A1A;
  --body:#FFFFFF; --card:#FFFFFF; --panel:#F2F2EE; --zebra:#F7F7F4; --ink:#1A1A1A; --muted:#6B6B66; --line:#DDDDDD; --line-s:#ECECEA;
  --menta:#BFE3CF; --menta-bg:#E8F4EC; --menta-ink:#1F7145;
  --mant:#F2D27A; --mant-bg:#FFF8DC; --mant-ink:#7A5B00;
  --coral:#E8A39B; --coral-bg:#FBECEA; --coral-ink:#A32D2D;
  --cielo:#B9CDE0; --cielo-bg:#EDF2F7; --cielo-ink:#2F5577;
  --lav:#D3CCE3; --lav-bg:#F3F1F7; --lav-ink:#55497A;
  --gris-bg:#F2F2EE;
  --f-d:"Source Serif 4",Georgia,serif; --f-b:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; --f-m:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --bar-h:64px;
  /* Identidad de marca en cualquier tema del teléfono (Juan, 5-oct-2026): la app declara "light dark" y su tema oscuro ES la marca.
     Los navegadores con modo oscuro forzado (Samsung Internet, Chrome auto-dark) ceden ante un tema propio; con "only light" no todos cedían. */
  color-scheme:light dark;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{margin:0;background:var(--body);color:var(--ink);font-family:var(--f-b);font-size:15px;line-height:1.45;overscroll-behavior-y:contain}
button,input,textarea,select{font:inherit;color:inherit;color-scheme:light}   /* controles nativos siempre claros */
button{cursor:pointer;border:0;background:none;padding:0}
button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--verde);outline-offset:2px}
.mono{font-family:var(--f-m);font-variant-numeric:tabular-nums}
[hidden]{display:none!important}
/* Agenda del equipo (15-oct-2026): una fila por persona; hora en mono; lo que choca en coral, lo sin hora en ámbar */
.ag-nav{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:4px;margin:2px 0 8px}
.ag-nav .btn-link{margin:0;padding:6px 8px;font-size:22px;line-height:1}
.ag-dias{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.ag-dia{display:grid;justify-items:center;gap:1px;padding:6px 0 5px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.ag-dia span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.ag-dia b{font-size:17px}.ag-dia i{font-style:normal;font-size:10.5px;color:var(--verde);font-weight:700;min-height:14px}
.ag-dia.hoy{border-color:var(--verde)}.ag-dia.on{background:var(--tinta);border-color:var(--tinta);color:#fff}.ag-dia.on span{color:#cfcfca}.ag-dia.on i{color:var(--amarillo)}
.ag-p{border:1px solid var(--line);border-radius:14px;padding:9px 11px;margin:0 0 8px;background:var(--card)}
.ag-pn{font-weight:700;font-size:14px;display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.ag-pn small{font-family:var(--f-m);font-size:12px;color:var(--verde)}
.ag-b{display:grid;grid-template-columns:118px 1fr;gap:8px;align-items:start;width:100%;text-align:left;padding:6px 0;border-top:1px solid var(--line-s);font-size:13.5px}
.ag-b:first-of-type{border-top:0}.ag-h{font-size:12.5px;color:var(--verde);font-weight:600;padding-top:1px}
.ag-t small{display:block;font-size:12px;color:var(--muted)}
.ag-b.sinh .ag-h{color:var(--mant-ink)}.ag-b.venc .ag-h{color:var(--coral-ink)}
.ag-b.choca{background:var(--coral-bg);border-radius:8px;padding:6px;margin:2px 0}.ag-b.choca .ag-h,.ag-b.choca b{color:var(--coral-ink)}
.ag-libre{font-size:13px;color:var(--muted);padding:2px 0}
.ag-sig .s b{color:var(--verde)}
.aviso.verde{background:var(--menta-bg);color:var(--menta-ink);border-color:var(--menta)}

/* ---------- estructura ---------- */
#app{min-height:100%;display:flex;flex-direction:column}
.cab{background:#fff;color:var(--ink);border-bottom:1px solid var(--line);padding:calc(env(safe-area-inset-top,0px) + 12px) 16px 12px;position:sticky;top:0;z-index:20}
.cab .escudo{width:34px;height:auto;flex:none}
.cab::before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--amarillo)}
.modo-pruebas+.cab::before{display:none}
.cab .firma{display:grid;gap:3px;margin-top:7px}.cab .firma i{display:block;background:var(--amarillo)}.cab .firma i:first-child{width:52px;height:4px}.cab .firma i:last-child{width:30px;height:2.5px}
.cab .fila{display:flex;align-items:center;gap:10px}
.cab .ey{font-family:var(--f-b);font-weight:700;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--verde);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cab h1{font-family:var(--f-d);font-weight:700;font-size:23px;letter-spacing:.01em;color:var(--tinta);margin:2px 0 0;line-height:1.15;overflow:hidden;text-overflow:ellipsis}
.cab .izq{flex:1;min-width:0}
.cab .atras{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--boton);color:var(--ink);flex:none}
.av{width:34px;height:34px;border-radius:50%;background:var(--verde);display:grid;place-items:center;font-family:var(--f-b);font-weight:700;font-size:12px;color:#fff;flex:none}
.cont{flex:1;padding:14px 14px calc(var(--bar-h) + 24px + env(safe-area-inset-bottom,0px));display:grid;gap:12px;align-content:start}
.lbl{font-family:var(--f-b);font-weight:700;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--verde);margin-top:6px;padding-bottom:6px;background:linear-gradient(var(--amarillo),var(--amarillo)) left bottom/40px 3px no-repeat}

/* ---------- barra inferior (la misma en toda la app) ---------- */
.barra{position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--tinta);
  display:grid;grid-template-columns:repeat(5,1fr);align-items:end;padding:6px 6px calc(8px + env(safe-area-inset-bottom,0px))}
.barra button{display:grid;justify-items:center;gap:2px;font-size:10.5px;color:rgba(255,255,255,.66);padding:4px 0}
.barra button svg{width:22px;height:22px}
.barra button.on{color:var(--amarillo);font-weight:700;background:rgba(255,255,255,.08);border-radius:10px}
.barra button:focus-visible{outline:2px solid var(--amarillo)}
.barra .central{position:relative;top:-12px}
.barra .central span{width:54px;height:54px;border-radius:50%;background:var(--amarillo);color:var(--tinta);display:grid;place-items:center;border:4px solid var(--tinta);box-shadow:0 -2px 10px rgba(26,26,26,.18)}
.barra .central svg{width:24px;height:24px}

/* ---------- piezas ---------- */
.tarj{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 13px;display:grid;gap:5px;box-shadow:none;text-align:left;width:100%}
.tarj .r{display:flex;justify-content:space-between;align-items:center;gap:8px}
.tarj .n{font-family:var(--f-b);font-weight:700;font-size:15px;min-width:0;overflow:hidden;text-overflow:ellipsis}
.tarj .s{font-size:13px;color:var(--muted);line-height:1.4}
button.tarj:active{transform:scale(.985)}
.pill{font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap;flex:none}
.p-planeada{background:var(--lav-bg);color:var(--lav-ink)}
.p-instalacion{background:var(--cielo-bg);color:var(--cielo-ink)}
.p-en_campo{background:var(--menta-bg);color:var(--menta-ink)}
.p-informe{background:var(--mant-bg);color:var(--mant-ink)}
.p-aprobada{background:var(--verde);color:#fff}
.p-rechazada{background:var(--coral-bg);color:var(--coral-ink)}
.p-vencida{background:var(--coral-bg);color:var(--coral-ink)}
.p-hoy{background:var(--mant-bg);color:var(--mant-ink)}
.p-prox{background:var(--gris-bg);color:var(--muted)}
.prog{height:6px;border-radius:99px;background:var(--line);overflow:hidden}
.prog i{display:block;height:100%;background:var(--verde);border-radius:99px}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px;display:grid;gap:2px}
.kpi b{font-family:var(--f-m);font-size:19px;font-weight:600;color:var(--tinta)}
.kpi span{font-size:11.5px;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:7px 12px;font-size:13px;font-weight:600}
.chip.on{background:var(--tinta);color:#fff;border-color:var(--tinta)}
.chip.on small{color:var(--amarillo);opacity:1}
.chip[disabled]{opacity:.38;text-decoration:line-through}
.chip small{font-family:var(--f-m);font-weight:500;opacity:.75;margin-left:3px}
.campo{display:grid;gap:5px}
.campo label{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.campo input,.campo textarea{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:11px 12px;font-size:15px;width:100%}
.campo textarea{min-height:76px;resize:vertical}
.btn{border-radius:12px;padding:14px;font-family:var(--f-b);font-weight:700;font-size:15px;text-align:center;width:100%;display:flex;align-items:center;justify-content:center;gap:8px}
.btn-senal{background:var(--amarillo);color:var(--tinta);box-shadow:inset 0 -2px 0 rgba(26,26,26,.12)}
.btn-tinta{background:var(--tinta);color:#fff}
.btn-blanco{background:var(--card);color:var(--tinta);border:1.5px solid var(--tinta)}
.btn-link{color:var(--verde);font-weight:700;font-size:14px;padding:8px;text-align:center;width:100%}
.btn[disabled]{opacity:.5}
.btn,.chip,.rev-fila,button.tarj,.proc,.teclado button{transition:transform 120ms var(--ease-out)}
.btn:not([disabled]):active,.btn-senal:active{transform:scale(.97)} .chip:active{transform:scale(.96)} .rev-fila:active{transform:scale(.985)} .btn-link:active{opacity:.6}
.fotos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
/* foto con dos puertas: Tomar (cámara) · Subir (galería). Mismo manejador, el teléfono decide qué abre. */
.foto{border:1.5px dashed #C9C9C3;border-radius:12px;background:var(--card);min-height:110px;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;color:var(--muted);font-size:12.5px;overflow:hidden;position:relative;text-align:center}
.foto img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.foto.sola{grid-column:1/-1}
.foto-t{flex:1;display:grid;place-items:center;padding:10px 8px 6px;font-weight:600;color:var(--muted)}
.foto-ops{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:6px;position:relative;z-index:1}
.foto.tiene .foto-ops{background:linear-gradient(to top,rgba(26,26,26,.78),rgba(26,26,26,.45))}
.fo{display:flex;align-items:center;justify-content:center;gap:5px;min-height:38px;border-radius:9px;background:var(--amarillo);color:var(--tinta);font-size:12.5px;font-weight:700;cursor:pointer;position:relative;overflow:hidden;transition:transform 120ms var(--ease-out)}
.fo + .fo{background:#fff;border:1.5px solid var(--tinta)}
.foto.tiene .fo + .fo{border-color:#fff}
.fo svg{width:18px;height:18px;flex:none}
.fo i{font-style:normal}
.fo:active{transform:scale(.96)}
.fo input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.prod-p{cursor:pointer}
.prod-p.abierto{border-color:var(--verde)}
.prod-p .plg{display:flex;align-items:center;gap:7px;margin-top:6px;color:var(--verde);font-weight:600;font-size:13.5px}
.prod-p .plg::after{content:'';width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform 180ms var(--ease-out)}
.prod-p.abierto .plg::after{transform:translateY(2px) rotate(-135deg)}
.talla small a{color:var(--verde);font-weight:600;text-decoration:none}
.preguntas{display:grid;gap:10px}
.pq-t{font-size:14px;font-weight:600;margin:2px 0 6px;color:var(--ink)}
.pq .chips{margin:0}
.fotos-libres{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.fl{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;position:relative;display:flex;flex-direction:column;min-width:0}
.fl img{width:100%;height:118px;object-fit:cover;display:block}
.fl textarea{border:0;border-top:1px solid var(--line-s);border-radius:0;font-size:13px;line-height:1.35;padding:7px 9px;min-height:54px;resize:vertical;background:transparent;width:100%}
.fl-x{position:absolute;top:6px;right:6px;width:30px;height:30px;border-radius:50%;border:0;background:rgba(26,26,26,.72);color:#fff;font-size:19px;line-height:30px;padding:0;cursor:pointer}
.fotos-libres .fl-mas{height:auto;min-height:118px}
.fotos-libres .fl-mas:only-child{grid-column:1/-1;min-height:96px}
.estados{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.estados button{border-radius:12px;padding:13px 4px;font-size:14px;font-weight:700;border:2px solid transparent}
.e-ok{background:var(--menta-bg);color:var(--menta-ink)} .e-ok.on{background:var(--menta);border-color:var(--menta-ink)}
.e-cambio{background:var(--cielo-bg);color:var(--cielo-ink)} .e-cambio.on{background:var(--cielo);border-color:var(--cielo-ink)}
.e-ausente{background:var(--mant-bg);color:var(--mant-ink)} .e-ausente.on{background:var(--mant);border-color:var(--mant-ink)}
.e-rechazo{background:var(--coral-bg);color:var(--coral-ink)} .e-rechazo.on{background:var(--coral);border-color:var(--coral-ink)}
.e-retiro{background:var(--gris-bg);color:var(--muted)} .e-retiro.on{background:#DEDED8;border-color:var(--muted)}
.e-inactivo{background:var(--lav-bg);color:var(--lav-ink)} .e-inactivo.on{background:var(--lav);border-color:var(--lav-ink)}
.interr{display:flex;align-items:center;justify-content:space-between;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:11px 12px;font-size:14px;font-weight:600}
.sw{width:44px;height:26px;border-radius:99px;background:var(--line);position:relative;flex:none;transition:background .15s}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform 150ms var(--ease-out)}
.sw.on{background:var(--verde)} .sw.on::after{transform:translateX(18px)}
.vacio{background:var(--card);border:1px dashed #C9C9C3;border-radius:14px;padding:22px 16px;text-align:center;color:var(--muted);font-size:14px}
.aviso{border-radius:12px;padding:11px 12px;font-size:13.5px;line-height:1.45}
.aviso.ambar{background:var(--mant-bg);color:var(--mant-ink);border:1px solid var(--mant)}
.aviso.rojo{background:var(--coral-bg);color:var(--coral-ink);border:1px solid var(--coral)}
.aviso.azul{background:var(--cielo-bg);color:var(--cielo-ink);border:1px solid var(--cielo)}
.lista-usuarios{display:grid;gap:6px}
.lu{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:9px 11px;font-size:14px}
.lu .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lu .tl{font-family:var(--f-m);font-size:12px;color:var(--muted)}
.punto{width:10px;height:10px;border-radius:50%;flex:none;background:var(--line)}
.d-ok,.d-cambio,.d-usando{background:var(--menta-ink)} .d-ausente,.d-no_disponible,.d-dano{background:var(--mant-ink)} .d-rechazo,.d-inactivo,.d-dejo{background:var(--coral-ink)} .d-retiro,.d-salio{background:var(--muted)}
.pend{font-size:10.5px;font-weight:700;color:var(--mant-ink);background:var(--mant-bg);border-radius:99px;padding:2px 7px}

/* ---------- lanzador ---------- */
/* Tintes de módulo (Juan, 5-oct-2026): "no somos Bancolombia; nuestros colores son negro, amarillo y verde, jugamos con esos tres".
   Cada tinte es una mezcla de tinta #1A1A1A, amarillo #FFF212 y verde #1F7145 con blanco; el ícono y el texto van siempre en tinta. */
:root{--t-amarillo:#FFFAA5;--t-amarillo-2:#FFFDD9;--t-lima:#E9EDAF;--t-lima-2:#F6F8DB;--t-menta:#C5DACF;--t-menta-2:#E4EEE9;--t-salvia:#D0DDD6;--t-salvia-2:#E8EFEC;--t-verde:#C9DCBF;--t-verde-2:#E9F0E3;--t-gris:#E8E7DA;--t-gris-2:#F6F5EF;--t-crema:#FFFDD4;--t-crema-2:#FFFEEE;}
.ic-crm{background:linear-gradient(135deg,var(--t-menta) 0%,var(--t-menta-2) 100%);color:var(--tinta)} .ic-ventas{background:linear-gradient(135deg,var(--t-amarillo) 0%,var(--t-amarillo-2) 100%);color:var(--tinta)}
.ic-bodega{background:linear-gradient(135deg,var(--t-lima) 0%,var(--t-lima-2) 100%);color:var(--tinta)} .ic-compras{background:linear-gradient(135deg,var(--t-verde) 0%,var(--t-verde-2) 100%);color:var(--tinta)}
.ic-fin{background:linear-gradient(135deg,var(--t-gris) 0%,var(--t-gris-2) 100%);color:var(--tinta)} .ic-prog{background:linear-gradient(135deg,var(--t-crema) 0%,var(--t-crema-2) 100%);color:var(--tinta)}

/* ---------- acceso ---------- */
.acceso{min-height:100%;background:#fff;color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:calc(env(safe-area-inset-top,0px) + 30px) 24px calc(env(safe-area-inset-bottom,0px) + 30px)}
.acceso .marca{display:grid;justify-items:center;gap:10px}
.acceso .marca img{width:74px;height:auto}
.acceso .marca b{font-family:var(--f-d);font-weight:700;font-size:30px;letter-spacing:.01em;color:var(--tinta)}
.acceso .marca b::after{content:"";display:block;margin:9px auto 0;width:64px;height:11px;background:linear-gradient(var(--amarillo),var(--amarillo)) center top/64px 5px no-repeat,linear-gradient(var(--amarillo),var(--amarillo)) center bottom/38px 3px no-repeat}
.acceso .marca span{font-family:var(--f-d);font-style:italic;font-size:14px;color:var(--verde)}
.acceso{position:relative;padding-top:calc(env(safe-area-inset-top,0px) + 56px);padding-bottom:calc(env(safe-area-inset-bottom,0px) + 56px)}
.acceso{min-height:100vh;min-height:100dvh}
.ac-franja,.ac-pie{position:absolute;left:0;right:0;text-align:center;font-weight:700;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:10px;padding-right:10px}
.ac-franja{top:0;background:var(--amarillo);color:var(--tinta);padding-top:calc(env(safe-area-inset-top,0px) + 7px);padding-bottom:5px}
.ac-pie{bottom:0;background:var(--tinta);color:var(--amarillo);padding-top:7px;padding-bottom:calc(env(safe-area-inset-bottom,0px) + 7px)}
.ac-pie i{font-style:normal;color:#fff;margin:0 5px}
.acceso .marca.logo{gap:14px}
.acceso .marca.logo img{width:212px}
.acceso .marca.logo span{padding-top:12px;border-top:1.5px solid var(--verde);font-size:14.5px}
.puntos{display:flex;gap:12px;justify-content:center}
.puntos i{width:14px;height:14px;border-radius:50%;border:2px solid #B8B8B2}
.puntos i.on{background:var(--tinta);border-color:var(--tinta)}
.teclado{display:grid;grid-template-columns:repeat(3,72px);gap:12px}
.teclado button{height:64px;border-radius:18px;background:var(--panel);color:var(--tinta);font-family:var(--f-m);font-size:24px;font-weight:600;border:1px solid var(--line-s)}
.teclado button:active{background:var(--amarillo)}
.teclado button.vacio-t{background:none;border:0}
.acceso .err{min-height:20px;color:var(--coral-ink);font-size:14px;font-weight:600}
.acceso .claro{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:18px;padding:18px;width:100%;max-width:420px;display:grid;gap:12px}
.acceso .claro ol{margin:0;padding-left:20px;display:grid;gap:4px;font-size:14px}

/* ---------- avisos flotantes ---------- */
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--bar-h) + 30px + env(safe-area-inset-bottom,0px));z-index:50;background:var(--tinta);color:#fff;border-radius:12px;padding:11px 16px;font-size:14px;font-weight:600;max-width:calc(100% - 32px);box-shadow:0 4px 16px rgba(26,26,26,.25)}
.toast.err{background:var(--coral-ink)}
.toast{transition:opacity 160ms var(--ease-out),transform 160ms var(--ease-out)} @starting-style{.toast{opacity:0;transform:translate(-50%,8px)}}
.toast.sale{opacity:0;transform:translate(-50%,6px);transition-duration:120ms}
.sync{position:fixed;right:12px;top:calc(env(safe-area-inset-top,0px) + 100px);z-index:25;border-radius:999px;padding:5px 11px;font-size:11.5px;font-weight:700;box-shadow:0 1px 4px rgba(26,26,26,.12)}
.sync.ambar{background:var(--mant-bg);color:var(--mant-ink);border:1px solid var(--mant)}
.sync.rojo{background:var(--coral-bg);color:var(--coral-ink);border:1px solid var(--coral)}
.sync.azul{background:var(--cielo-bg);color:var(--cielo-ink);border:1px solid var(--cielo)}
.hoja-fondo{position:fixed;inset:0;z-index:60;display:flex;align-items:flex-end}
.hoja-fondo::before{content:'';position:absolute;inset:0;background:rgba(26,26,26,.45);transition:opacity 200ms var(--ease-out)} @starting-style{.hoja-fondo::before{opacity:0}}
.hoja-fondo.sale::before{opacity:0;transition-duration:180ms}
.hoja{position:relative;transition:transform 300ms var(--ease-drawer)} @starting-style{.hoja{transform:translateY(100%)}}
.hoja-fondo.sale .hoja{transform:translateY(100%);transition:transform 220ms var(--ease-drawer)}
.hoja{background:var(--body);width:100%;border-radius:20px 20px 0 0;padding:16px 16px calc(20px + env(safe-area-inset-bottom,0px));display:grid;gap:10px;max-height:85%;overflow:auto}
.hoja h2{font-family:var(--f-d);font-weight:700;color:var(--tinta);font-size:20px;margin:0 0 4px;padding-bottom:8px;background:linear-gradient(var(--amarillo),var(--amarillo)) left bottom/48px 3px no-repeat}
@media (prefers-reduced-motion:reduce){*,::before,::after{transition-property:opacity,background-color,color,border-color!important;transition-duration:120ms!important} .hoja,.lat,.toast,.btn,.chip,.rev-fila,button.tarj,.proc,.mod,.nv-rapida,.sw::after{transition-property:opacity!important} @starting-style{.hoja{transform:none;opacity:0}.lat{transform:none;opacity:0}.toast{transform:translate(-50%,0)}} .hoja-fondo.sale .hoja,.lat-fondo.sale .lat{transform:none;opacity:0}}
@media (min-width:700px){ .cont{max-width:620px;margin:0 auto;width:100%} }

/* ---------- menú lateral (como ARMOR v2): módulos y sus procesos ---------- */
.cab .menu-b{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--boton);color:var(--ink);flex:none}
.cab .menu-b svg{width:20px;height:20px}
.lat-fondo{position:fixed;inset:0;z-index:70;display:flex}
.lat-fondo::before{content:'';position:absolute;inset:0;background:rgba(26,26,26,.45);transition:opacity 180ms var(--ease-out)} @starting-style{.lat-fondo::before{opacity:0}}

/* ---------- página de módulo: procesos en orden ---------- */
.proc{display:grid;grid-template-columns:40px 1fr auto;gap:10px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;text-align:left;width:100%}
.proc .num{width:30px;height:30px;border-radius:50%;background:var(--tinta);color:var(--amarillo);display:grid;place-items:center;font-family:var(--f-m);font-weight:600;font-size:13px}
.proc .t{display:grid;gap:2px;min-width:0}
.proc .t b{font-size:15px}
.proc .t span{font-size:12.5px;color:var(--muted);line-height:1.35}
.proc.off{opacity:.55}
.proc.off .num{background:var(--panel);color:var(--muted)}
.proc .pill{justify-self:end}
.flujo{display:grid;gap:8px;position:relative}

/* ---------- seguimiento tipo pedido ---------- */
.ruta{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 13px;display:grid}
.paso{display:grid;grid-template-columns:22px 1fr;gap:10px;position:relative;padding-bottom:14px}
.paso:last-child{padding-bottom:0}
.paso::before{content:"";position:absolute;left:10px;top:22px;bottom:0;width:2px;background:var(--line)}
.paso:last-child::before{display:none}
.paso>i{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);background:#fff;display:grid;place-items:center;font-size:12px;font-weight:700;font-style:normal;color:#fff}
.paso.ok>i{background:var(--verde);border-color:var(--verde)}
.paso.ok::before{background:var(--verde)}
.paso.ahora>i{background:var(--amarillo);border-color:var(--tinta);color:var(--tinta)}
.paso.mal>i{background:var(--coral-ink);border-color:var(--coral-ink)}
.paso b{display:block;font-size:14px}
.paso b .quien{display:inline-block}
.paso div>span{display:block;font-size:12.5px;color:var(--muted);line-height:1.4}
.paso.ahora b{color:var(--tinta)}
.paso.espera b{color:var(--muted);font-weight:600}
.quien{display:inline-block;font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:99px;background:var(--panel);color:var(--tinta);margin-left:6px;vertical-align:1px}
.p-sal{background:var(--mant-bg);color:var(--mant-ink)}
.p-ok{background:var(--verde);color:#fff}
.p-cot{background:var(--cielo-bg);color:var(--cielo-ink)}
.acciones{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.acciones .btn{font-size:14px;padding:12px 8px}
.hist{display:grid;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 13px}
.hist div{display:grid;gap:1px;font-size:13px;line-height:1.4}
.hist small{color:var(--muted);font-size:11.5px}
/* pedir: tallas con cantidad */
.tallas{display:grid;gap:6px}
.talla{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px 10px}
.talla .n{font-size:14px;font-weight:600}
.talla .n small{display:block;font-weight:500;color:var(--muted);font-size:11.5px;font-family:var(--f-m)}
.paso-q{display:flex;align-items:center;gap:6px}
.paso-q button{width:34px;height:34px;border-radius:10px;background:var(--boton);font-size:18px;font-weight:700;color:var(--tinta)}
.paso-q input{width:52px;text-align:center;border:1px solid var(--line);border-radius:10px;padding:7px 4px;font-family:var(--f-m);font-size:15px}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.campo input[type=date],.campo input[type=number]{font-family:var(--f-m)}

/* ---------- nunca más ancho que la pantalla (letra grande del celular incluida) ---------- */
html,body{overflow-x:hidden}
.cont,.lista-usuarios,.flujo{grid-template-columns:minmax(0,1fr)}
.tarj,.proc,.lu,.campo,.campo input,.campo textarea{min-width:0;max-width:100%}
.tarj .n,.tarj .s{overflow-wrap:anywhere}
.tarj .r>.pill,.proc .pill{max-width:58%;white-space:normal;text-align:center;line-height:1.25}
.chips{min-width:0}
.chip{max-width:100%;overflow-wrap:anywhere}
.barra button{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- etapa de pruebas: cinta de señalización arriba de todo ---------- */
.modo-pruebas{position:sticky;top:0;z-index:40;padding:calc(env(safe-area-inset-top,0px) + 5px) 12px 5px;font-size:12px;font-weight:600;text-align:center;color:#1A1A1A;
  background:repeating-linear-gradient(135deg,#FFF212 0 14px,#FFE600 14px 28px);border-bottom:2px solid #1A1A1A}
.modo-pruebas b{text-transform:uppercase;letter-spacing:.08em}
.modo-pruebas+.cab{top:calc(env(safe-area-inset-top,0px) + 27px);padding-top:12px}


/* ---------- navegación (v1.8.1): módulos plegables con íconos · cajón en el teléfono, barra lateral en el computador ----------
   Como el documento: lienzo blanco; el negro en franjas, no de fondo (Juan, 3-oct: "el fondo negro es invasivo").
   Franja amarilla arriba · cada módulo es una franja negra con letra amarilla (el encabezado de tabla) · pie negro abajo. */
.lat-fondo.sale::before{opacity:0;transition-duration:160ms}
.lat-fondo.sale .lat{transform:translateX(-100%);transition:transform 160ms var(--ease-out)}
.lat,#lado{background:var(--card);color:var(--ink);display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
.lat{position:relative;width:86%;max-width:330px;height:100%;transition:transform 220ms cubic-bezier(.2,.8,.2,1);box-shadow:8px 0 28px rgba(26,26,26,.18)} @starting-style{.lat{transform:translateX(-100%)}}
.lat :focus-visible,#lado :focus-visible{outline:2px solid var(--tinta);outline-offset:1px}
.nv-franja{flex:none;background:var(--amarillo);color:var(--tinta);font-size:10.5px;font-weight:700;letter-spacing:.04em;text-align:center;padding:calc(env(safe-area-inset-top,0px) + 7px) 10px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nv-yo{display:flex;gap:12px;align-items:center;padding:16px 16px 14px}
.nv-yo img{width:40px;height:auto;flex:none}
.nv-yo b{display:block;font-family:var(--f-d);font-size:19px;font-weight:700;color:var(--tinta);line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nv-firma{display:grid;gap:3px;margin:6px 0 7px}.nv-firma i{display:block;background:var(--amarillo)}.nv-firma i:first-child{width:44px;height:4px}.nv-firma i:last-child{width:26px;height:2.5px}
.nv-yo span{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}
.nv-yo .pt{width:7px;height:7px;border-radius:50%;flex:none}
.pt.ama{background:var(--amarillo);box-shadow:0 0 0 1px #C9BE00} .pt.ver{background:var(--verde)}
.nv-rapida{display:flex;align-items:center;gap:10px;margin:0 12px 10px;padding:11px 12px;border-radius:12px;background:var(--amarillo);color:var(--tinta);font-weight:700;font-size:14px;min-height:44px;box-shadow:inset 0 -2px 0 rgba(26,26,26,.12);transition:transform 120ms var(--ease-out)}
.nv-rapida .nv-ic{color:var(--tinta)}
.nv-rapida:active{transform:scale(.98)}
.nv{display:grid;gap:1px;padding:2px 10px 10px}
.nv-it{position:relative;display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:8px 10px;border-radius:8px;text-align:left;font-size:14.5px;color:var(--ink);transition:background-color .14s ease-out}
.nv-it:active{background:var(--panel)}
.nv-it.on{background:var(--panel);font-weight:700}
.nv-it.on::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:4px;border-radius:0 3px 3px 0;background:var(--amarillo);box-shadow:inset -1px 0 0 rgba(26,26,26,.25)}
.nv-it.on .nv-ic{color:var(--tinta)}
.nv-it[aria-disabled]{color:#9A9A94}
.nv-it[aria-disabled] .nv-ic{color:#B5B5AE}
.nv-ic{position:relative;flex:none;width:22px;height:22px;display:grid;place-items:center;color:var(--muted)}
.nv-ic svg{width:20px;height:20px}
.nv-tx{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nv-c{flex:none;font-family:var(--f-m);font-size:11px;font-variant-numeric:tabular-nums;color:var(--muted);white-space:nowrap}
.nv-c.urg{background:var(--amarillo);color:var(--tinta);font-weight:600;padding:2px 8px;border-radius:999px}
.nv-c.apagado{color:#9A9A94}
.nv-grupo{margin-top:10px}
/* el módulo = encabezado de tabla del formato: franja tinta, mayúsculas amarillas */
.nv-cab{display:flex;align-items:center;gap:10px;width:100%;min-height:42px;padding:6px 10px 6px 8px;border-radius:6px;background:var(--tinta);color:var(--amarillo);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;text-align:left;transition:background-color .14s ease-out}
.nv-cab .mod-ic{width:28px;height:28px;border-radius:7px;color:var(--tinta)}
.nv-cab .mod-ic svg{width:17px;height:17px}
.nv-cab .nv-punto{background:#fff;box-shadow:0 0 0 2px var(--tinta)}
/* acciones rápidas por módulo */
.ar-grupo{margin-top:6px}
.ar-mod{display:flex;align-items:center;gap:10px;width:100%;min-height:46px;padding:7px 10px 7px 8px;border-radius:8px;background:var(--tinta);color:var(--amarillo);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;text-align:left;transition:background-color 140ms var(--ease-out)}
.ar-mod:hover{background:#2A2A28}
.ar-mod .mod-ic{flex:none;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:var(--tinta)}
.ar-mod .mod-ic svg{width:18px;height:18px}
.ar-mod .nv-tx{flex:1}
.ar-n{flex:none;font-family:var(--f-m);font-size:11px;letter-spacing:0;color:rgba(255,255,255,.6)}
.ar-mod .nv-c{text-transform:none;letter-spacing:0}
.ar-mod .nv-c.urg{margin-right:2px}
.ar-mod .nv-chev{color:#fff}
.ar-grupo.abierto .nv-chev{transform:rotate(90deg)}
.ar-cuerpo{display:grid;grid-template-rows:0fr;transition:grid-template-rows 220ms var(--ease-out)}
.ar-grupo.abierto .ar-cuerpo{grid-template-rows:1fr}
.ar-lista{display:grid;gap:4px;padding:6px 0 2px;overflow:hidden;min-height:0}
@media (prefers-reduced-motion:reduce){.ar-cuerpo{transition:none}}
.ar-it{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:var(--card);text-align:left;transition:transform 120ms var(--ease-out),border-color 140ms var(--ease-out)}
.ar-it:active{transform:scale(.99)}
.ar-it:hover{border-color:var(--tinta)}
.ar-ic{flex:none;width:36px;height:36px;border-radius:10px;background:var(--panel);color:var(--tinta);display:grid;place-items:center}
.ar-ic svg{width:19px;height:19px}
.ar-tx{flex:1;min-width:0;display:grid;gap:1px}
.ar-tx b{font-size:15px;font-weight:700;color:var(--ink)}
.ar-tx span{font-size:12px;color:var(--muted);line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
.ar-it .nv-c{color:var(--muted)}
.ar-it .nv-c.urg{color:var(--tinta)}
.nv-punto{position:absolute;top:-2px;right:-2px;width:10px;height:10px;border-radius:50%;background:var(--amarillo);box-shadow:0 0 0 2px var(--tinta)}
.nv-fase{flex:none;font-family:var(--f-m);font-size:10.5px;font-weight:500;letter-spacing:0;text-transform:none;color:rgba(255,255,255,.6)}
.nv-chev{flex:none;width:16px;height:16px;color:#fff;transition:transform .22s cubic-bezier(.2,.8,.2,1)}
.nv-chev svg{width:16px;height:16px;display:block}
.nv-grupo.abierto .nv-chev{transform:rotate(90deg)}
.nv-cuerpo{display:grid;grid-template-rows:0fr;transition:grid-template-rows .22s cubic-bezier(.2,.8,.2,1)}
.nv-grupo.abierto .nv-cuerpo{grid-template-rows:1fr}
.nv-in{overflow:hidden;min-height:0;padding:4px 0 2px 4px}
.nv-in .nv-it{font-size:14px;min-height:42px}
.nv-sep{height:1px;background:var(--line-s);margin:4px 10px}
.nv-pie{margin-top:auto;display:grid;gap:1px;padding:8px 10px 0;border-top:1px solid var(--line-s)}
.nv-plegar{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:8px 10px;border-radius:8px;text-align:left;font-size:14px;color:var(--muted)}
.lat .nv-plegar{display:none}
.nv-lema{margin:8px 4px 12px;padding-top:9px;border-top:1.5px solid var(--verde);font-family:var(--f-d);font-style:italic;font-size:13px;line-height:1.35;color:var(--verde)}
/* el pie del documento: franja tinta a sangre con letra amarilla */
.nv-ver{margin:0 -10px;background:var(--tinta);color:var(--amarillo);font-family:var(--f-b);font-weight:700;font-size:10.5px;text-align:center;padding:7px 10px calc(env(safe-area-inset-bottom,0px) + 7px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nv-ver i{font-style:normal;color:#fff;margin:0 5px}
@media (min-width:960px){
  #lado{position:fixed;top:0;bottom:0;left:0;z-index:40;width:288px;border-right:1px solid var(--line)}
  body.con-lado #app{margin-left:288px}
  body.con-lado .barra,body.con-lado .cab .menu-b{display:none}
  body.con-lado .cont{width:100%;max-width:760px;margin:0 auto;padding-bottom:40px}
  body.con-lado .cab .fila{max-width:760px;margin:0 auto}
  body.con-lado .toast{bottom:28px}
  body.con-lado .hoja-fondo{align-items:center;justify-content:center}
  body.con-lado .hoja{max-width:560px;border-radius:20px;transition:transform 200ms var(--ease-out),opacity 200ms var(--ease-out)}
  @starting-style{body.con-lado .hoja{transform:scale(.97);opacity:0}}
  body.con-lado .hoja-fondo.sale .hoja{transform:scale(.97);opacity:0;transition-duration:150ms}
  body.lado-plegado #lado{width:76px}
  body.lado-plegado #app{margin-left:76px}
  body.lado-plegado #lado .nv-tx,body.lado-plegado #lado .nv-c,body.lado-plegado #lado .nv-fase,body.lado-plegado #lado .nv-chev,body.lado-plegado #lado .nv-cuerpo,body.lado-plegado #lado .nv-lema{display:none}
  body.lado-plegado #lado .nv-franja,body.lado-plegado #lado .nv-ver{font-size:0;padding:0;height:5px}
  body.lado-plegado #lado .nv-yo{justify-content:center;padding:16px 0 12px}
  body.lado-plegado #lado .nv-it,body.lado-plegado #lado .nv-plegar{justify-content:center;padding:8px 0}
  body.lado-plegado #lado .nv-cab{justify-content:center;padding:6px 0}
  body.lado-plegado #lado .nv-rapida{justify-content:center;margin:0 14px 10px;padding:11px 0}
  body.lado-plegado #lado .nv-plegar .nv-ic{transform:scaleX(-1)}
}
@media (prefers-reduced-motion:reduce){.nv-cuerpo,.nv-chev,#lado,body.con-lado #app{transition:none!important}}


/* ---------- inicio (v1.7): módulos con su estado; los de fases futuras en una sola línea ---------- */
.mods{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:10px}
.mod{display:grid;justify-items:start;align-content:start;gap:8px;min-height:116px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--card);text-align:left;transition:transform 120ms var(--ease-out),border-color 140ms var(--ease-out),box-shadow 140ms var(--ease-out)}
.mod:active{transform:scale(.98)}
.mod .ic{position:relative;width:44px;height:44px;border-radius:12px;display:grid;place-items:center}
.mod .ic svg{width:22px;height:22px}
/* un solo lenguaje para el módulo en las tres puertas (menú, inicio, "+"): cuadro tinta con el ícono amarillo (5-oct-2026) */
.mod{border:0;gap:10px;padding:16px 14px 14px;border-radius:16px}
.mod.ic-crm{background:linear-gradient(135deg,var(--t-menta) 0%,var(--t-menta-2) 100%)} .mod.ic-ventas{background:linear-gradient(135deg,var(--t-amarillo) 0%,var(--t-amarillo-2) 100%)} .mod.ic-bodega{background:linear-gradient(135deg,var(--t-lima) 0%,var(--t-lima-2) 100%)} .mod.ic-dist{background:linear-gradient(135deg,var(--t-salvia) 0%,var(--t-salvia-2) 100%)}
.mod.ic-maes{background:linear-gradient(135deg,var(--t-gris) 0%,var(--t-gris-2) 100%)} .mod.ic-compras{background:linear-gradient(135deg,var(--t-verde) 0%,var(--t-verde-2) 100%)} .mod.ic-fin{background:linear-gradient(135deg,var(--t-gris) 0%,var(--t-gris-2) 100%)} .mod.ic-prog{background:linear-gradient(135deg,var(--t-crema) 0%,var(--t-crema-2) 100%)}
/* el ícono del módulo en la tarjeta va sobre un disco blanco translúcido: el degradado respira y el trazo queda nítido */
.mod .mod-ic{background:rgba(255,255,255,.55);width:40px;height:40px;border-radius:12px}
.mod .mod-ic svg{width:24px;height:24px}
.mod{color:var(--tinta)}
.mod .mod-ic{background:transparent;width:30px;height:30px;color:var(--tinta)}
.mod .mod-ic svg{width:26px;height:26px;stroke-width:1.6}
.mod .mod-n{padding-bottom:7px;border-bottom:1.5px solid var(--verde);align-self:stretch}
.mod .mod-e{margin-top:-2px;color:#4A4A46}
.mod:hover{box-shadow:0 2px 10px rgba(26,26,26,.1)}
.mod-punto{background:var(--tinta);box-shadow:0 0 0 2px #fff;top:-4px;right:-8px}
.prox-m{background:var(--t-gris-2);border-color:var(--t-gris)} .prox-m .ic{color:var(--tinta)}
.mod-n{font-size:16px;font-weight:700;color:var(--ink);line-height:1.2}
.mod-e{margin-top:-4px;font-family:var(--f-m);font-size:11.5px;font-variant-numeric:tabular-nums;color:var(--muted)}
.mod-e.urg{background:var(--amarillo);color:var(--tinta);font-weight:600;padding:2px 8px;border-radius:999px}
.mod-punto{position:absolute;top:-3px;right:-3px;width:11px;height:11px;border-radius:50%;background:var(--amarillo);box-shadow:0 0 0 2px var(--card)}
.prox{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:-2px}
.prox-t{font-size:12px;font-weight:600;color:var(--muted);margin-right:2px}
.prox-m{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:3px 11px 3px 4px;border:1px solid var(--line);border-radius:999px;font-size:12.5px;color:var(--muted);background:var(--card)}
.prox-m .ic{width:24px;height:24px;border-radius:999px;display:grid;place-items:center}
.prox-m .ic svg{width:13px;height:13px}
/* página del módulo: cada proceso con su ícono y su número de paso */
.paso-ic{position:relative;width:40px;height:40px;border-radius:12px;background:var(--tinta);color:var(--amarillo);display:grid;place-items:center}
.paso-ic svg{width:20px;height:20px}
.paso-ic i{position:absolute;right:-6px;bottom:-6px;min-width:19px;height:19px;padding:0 4px;border-radius:999px;background:#fff;color:var(--tinta);font:600 10.5px/19px var(--f-m);font-style:normal;text-align:center;box-shadow:0 0 0 1.5px var(--line)}
.proc.off .paso-ic{background:var(--panel);color:var(--muted)}
.proc:active{transform:scale(.985)}
.cons-ic{display:inline-grid;place-items:center;vertical-align:-4px;margin-right:8px;color:var(--tinta)}
.cons-ic svg{width:18px;height:18px}
.teclado svg{width:26px;height:26px}
.nv-in .nv-tx{white-space:normal;line-height:1.25;overflow-wrap:anywhere}
.proc .pill{white-space:nowrap;max-width:none}
/* "No aplica" en preguntas de número o texto (v1.8.3) */
.chips-na{margin-top:6px}
.campo input:disabled{background:var(--panel,#F2F2F2);color:var(--muted,#6B6B6B)}
/* revisión tipo ARMOR en el seguimiento (v1.8.4): todo arranca OK, se toca solo lo que NO está bien */
.rev{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 14px 4px}
.rev-t{font-size:13.5px;color:var(--muted);margin-bottom:4px}.rev-t b{font-size:16px;color:var(--ink)}
.rev-f{border-bottom:1px solid var(--line-s)}.rev-f:last-child{border-bottom:0}
.rev-fila{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:52px;padding:6px 0;text-align:left}
.rev-n{font-size:15px;color:var(--ink);flex:1;min-width:0}
.rev-v{flex:none;min-width:108px;text-align:center;border-radius:10px;padding:9px 10px;font-size:13px;font-weight:700}
.r-ok{background:var(--menta-bg);color:var(--menta-ink)}
.r-aten{background:var(--mant-bg);color:var(--mant-ink)}
.r-mal{background:var(--coral-bg);color:var(--coral-ink)}
.r-na,.r-info{background:var(--gris-bg);color:var(--muted)}
.rev-f.abierta .rev-fila{font-weight:600}
.rev-ops{padding:2px 0 12px}
.rev-foto{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:8px 8px 8px 12px;border:1.5px dashed var(--coral);border-radius:10px;font-size:13.5px;font-weight:600;color:var(--coral-ink);background:var(--coral-bg)}
.rev-foto.tiene{border-style:solid;border-color:var(--menta);color:var(--menta-ink);background:var(--menta-bg)}
.rev-foto-t{flex:1;display:flex;align-items:center;gap:8px;min-width:0}
.rev-foto img{width:40px;height:40px;object-fit:cover;border-radius:6px;flex:none}
.rev-foto .foto-ops{padding:0;gap:6px;flex:none;grid-template-columns:auto auto}
.rev-foto .fo{min-height:34px;padding:0 9px;font-size:12px}
.lbl + .rev{margin-top:8px}
.rev + .preguntas{margin-top:14px}

/* ===== v1.8.5 · más negro en toda la app (Juan, 3-oct-2026), en franjas y bordes, nunca de fondo ===== */
/* encabezado: regla negra bajo el título (como el corte del encabezado del documento), atrás y avatar en negro con amarillo */
.cab{border-bottom:3px solid var(--tinta)}
.cab .atras{background:var(--tinta);color:var(--amarillo)}
.av{background:var(--tinta);color:var(--amarillo);box-shadow:0 0 0 2px var(--amarillo)}
/* títulos de sección = franja negra con letra amarilla (encabezado de tabla de los formatos, como los módulos del menú) */
.lbl{background:var(--tinta);color:var(--amarillo);padding:8px 12px;border-radius:8px;margin-top:8px;letter-spacing:.14em;font-size:10.5px}
.rev .lbl,.hoja .lbl{margin-top:4px}
/* campos: etiqueta en tinta, borde definido y foco negro */
.campo label{color:var(--tinta)}
.campo input,.campo textarea{border:1.5px solid #CFCFC9}
.campo input:focus,.campo textarea:focus{border-color:var(--tinta);outline:none;box-shadow:0 0 0 1px var(--tinta)}
/* tarjetas con barra negra a la izquierda (el "cuadro demarcado" de la factura) */
.tarj{border-left:4px solid var(--tinta)}
/* avisos como el bloque legal de la factura: panel gris, borde gris y barra a la izquierda */
.aviso{border-left-width:4px!important}
.aviso.azul{background:var(--panel);color:var(--tinta);border:1px solid var(--line);border-left:4px solid var(--tinta)}
.aviso.ambar{border-left-color:var(--mant-ink)}
.aviso.rojo{border-left-color:var(--coral-ink)}
/* acción principal: amarillo señal con base negra; secundaria en negro */
.btn-senal{box-shadow:inset 0 -4px 0 var(--tinta);border:1.5px solid var(--tinta)}
/* opciones: borde tinta suave, la elegida negra con letra amarilla */
.chip{border-color:#BDBDB7}
.chip.on{background:var(--tinta);color:var(--amarillo);border-color:var(--tinta)}
/* revisión tipo ARMOR: título y bordes en tinta */
.rev{border:1.5px solid var(--tinta)}
/* buscador en listas de opciones */
.buscar-chips{display:flex;align-items:center;gap:8px;background:var(--card);border:1.5px solid var(--tinta);border-radius:12px;padding:0 12px;margin-bottom:-2px}
.buscar-chips svg{width:18px;height:18px;flex:none;color:var(--tinta)}
.buscar-chips input{border:0;outline:0;background:none;padding:11px 0;font-size:15px;width:100%;min-width:0}
.buscar-nada{font-size:13px;color:var(--muted);padding:2px 2px 0}

/* ---------- Distribución (4-oct-2026) ---------- */
.ic-dist{background:linear-gradient(135deg,var(--t-salvia) 0%,var(--t-salvia-2) 100%);color:var(--tinta)}
.ic-maes{background:linear-gradient(135deg,var(--t-gris) 0%,var(--t-gris-2) 100%);color:var(--tinta)}
a.btn{text-decoration:none;display:flex;align-items:center;justify-content:center;text-align:center}

/* ¿Cómo está el usuario hoy? (4-oct-2026) */
.estados.e4{grid-template-columns:1fr 1fr}
.estados.e5{grid-template-columns:1fr 1fr}.estados.e5 button:first-child{grid-column:1/-1}
.e-dano{background:var(--mant-bg);color:var(--mant-ink)} .e-dano.on{background:var(--mant);border-color:var(--mant-ink)}
.e-usando{background:var(--menta-bg);color:var(--menta-ink)} .e-usando.on{background:var(--menta);border-color:var(--menta-ink)}
.e-dejo{background:var(--coral-bg);color:var(--coral-ink)} .e-dejo.on{background:var(--coral);border-color:var(--coral-ink)}
.e-no_disponible{background:var(--mant-bg);color:var(--mant-ink)} .e-no_disponible.on{background:var(--mant);border-color:var(--mant-ink)}
.e-salio{background:var(--gris-bg);color:var(--muted)} .e-salio.on{background:#DEDED8;border-color:var(--muted)}
.estados button small{display:block;font-weight:500;font-size:11.5px;margin-top:2px;opacity:.85}
.fin-clave{border:2px solid var(--tinta);border-radius:14px;padding:12px;display:grid;gap:8px;background:var(--crema)}

/* Procesando (v1.11.3): bloquea la pantalla mientras Odoo responde una acción */
.ocupado{position:fixed;inset:0;z-index:90;background:rgba(255,255,255,.72);display:flex;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(1px)}
.ocupado[hidden]{display:none}
.ocupado{transition:opacity 120ms var(--ease-out)} @starting-style{.ocupado{opacity:0}}
.ocupado-c{background:var(--body);border:2px solid var(--tinta);border-radius:18px;padding:22px 20px;display:grid;gap:8px;justify-items:center;text-align:center;max-width:320px;box-shadow:0 6px 0 var(--tinta)}
.ocupado-c b{font-family:var(--f-d);font-size:19px;color:var(--tinta)}
.ocupado-c span:last-child{color:var(--muted);font-size:13.5px}
.giro{width:34px;height:34px;border-radius:50%;border:4px solid var(--amarillo);border-top-color:var(--tinta);animation:giro .8s linear infinite}
@keyframes giro{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.giro{animation-duration:2.4s}}

/* hover solo donde hay puntero (Emil): en pantallas táctiles el hover se queda pegado tras el toque */
@media (hover:hover) and (pointer:fine){.nv-it:hover{background:var(--zebra)} .nv-cab:hover{background:#2A2A28} .nv-plegar:hover{background:var(--zebra)} .mod:hover{border-color:var(--tinta);box-shadow:0 2px 10px rgba(26,26,26,.08)} .proc:hover{border-color:var(--tinta)}}

/* ---------- tema oscuro del teléfono: la app se ve IGUAL (la marca no cambia con el tema del dispositivo) ---------- */
@media (prefers-color-scheme:dark){
  :root{color-scheme:light dark}
  html,body{background:#FFFFFF;color:#1A1A1A}
  input,textarea,select,button{color-scheme:light}
  html{scrollbar-color:#DDDDDD #FFFFFF}
}
/* v1.11.20 · usuarios tocables para corregir (fila-botón) y baja en rojo dentro de la hoja */
button.lu-b{width:100%;text-align:left;font:inherit;color:inherit;cursor:pointer;transition:transform 120ms var(--ease-out)}
button.lu-b:active{transform:scale(.985)}
.lu-b>svg{width:16px;height:16px;flex:none;color:var(--muted)}
.btn-link.rojo{color:var(--coral-ink)}
/* v1.12.0 · Mi ruta: número de parada y paradas ya entregadas */
.tarj .num{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--tinta);color:var(--amarillo);font-family:var(--f-m);font-weight:600;font-size:12px;margin-right:4px;vertical-align:middle}
.tarj.hecha{opacity:.62;border-left-color:var(--verde)}
.tarj.hecha .num{background:var(--verde);color:#fff}
.modo-pruebas.real{background:var(--verde);color:#fff;border-bottom-color:var(--tinta)}
.lu-w .nm{white-space:normal;overflow:visible;line-height:1.3}

/* ===== v1.12.37 · escala de color con lógica de Mi Área Segura (Juan, 15-oct-2026: "los fondos negros se ven invasivos";
   "Elite logra con unos colores algo muy impactante, los fondos son blancos") =====
   Negro = ancla en UN bloque arriba (encabezado de pantalla y del menú) y en las franjas delgadas de sección (.lbl).
   Los módulos dejan de ser barras negras: tarjeta blanca con su cuadro pastel. Barra inferior blanca. Amarillo solo para acción y alerta. */
.cab{background:var(--tinta);color:#fff;border-bottom:0}
.cab::before{top:auto;bottom:0;height:3px}
.modo-pruebas+.cab::before{display:block}
.cab .ey{color:var(--amarillo)}
.cab h1{color:#fff}
.cab .atras,.cab .menu-b{background:#2E2E2B;color:#fff}
.cab .av{background:var(--amarillo);color:var(--tinta);box-shadow:none}
.cab .atras:focus-visible,.cab .menu-b:focus-visible,.cab .av:focus-visible{outline:2px solid var(--amarillo)}
/* barra inferior blanca, el activo en tinta sobre pastel amarillo, el "+" amarillo con borde tinta */
.barra{background:#fff;border-top:1px solid var(--line);box-shadow:0 -2px 12px rgba(26,26,26,.05)}
.barra button{color:#6B6B66}
.barra button.on{color:var(--tinta);background:var(--t-amarillo-2);box-shadow:inset 0 0 0 1px var(--t-amarillo)}
.barra button:focus-visible{outline:2px solid var(--tinta)}
.barra .central span{border:2px solid var(--tinta);box-shadow:0 0 0 4px #fff,0 2px 8px rgba(26,26,26,.15)}
/* menú lateral: el bloque negro es la cabecera con el nombre; los módulos son tarjetas claras */
.nv-yo{background:var(--tinta);padding:16px 16px 16px;margin-bottom:12px;border-bottom:3px solid var(--amarillo)}
.nv-yo b{color:#fff}
.nv-yo span{color:#C9C9C3}
.pt.ver{background:#3FBF6F}
.nv-cab{background:var(--card);color:var(--tinta);border:1px solid #DCDCD3;border-radius:12px;min-height:50px;padding:7px 10px 7px 8px;font-size:12.5px}
.nv-cab .mod-ic{width:34px;height:34px;border-radius:9px}
.nv-cab .mod-ic svg{width:19px;height:19px}
.nv-cab .nv-punto{background:var(--amarillo);box-shadow:0 0 0 2px var(--tinta)}
.nv-fase{color:var(--muted)}
.nv-chev{color:var(--tinta)}
.nv-grupo.abierto .nv-cab{border-color:var(--tinta)}
/* hoja "¿Qué vas a hacer?": la misma tarjeta clara por módulo */
.ar-mod{background:var(--card);color:var(--tinta);border:1px solid #DCDCD3;border-radius:12px;min-height:52px}
.ar-mod .mod-ic{width:34px;height:34px;border-radius:9px}
.ar-n{color:var(--muted)}
.ar-mod .nv-chev{color:var(--tinta)}
.ar-grupo.abierto .ar-mod{border-color:var(--tinta)}
/* v1.12.39: el hover viejo (#2A2A28) quedaba pegado al tocar en el teléfono y dejaba la letra tinta sobre negro */
.ar-mod:hover,.nv-cab:hover{background:var(--card)}
.ar-mod:active,.nv-cab:active{background:var(--zebra)}
@media (hover:hover) and (pointer:fine){.nv-cab:hover,.ar-mod:hover{background:var(--zebra);border-color:var(--tinta)}}

/* indicador de sincronización siempre visible (Juan, 15-oct-2026: "debe indicar si está sincronizado") */
.sync.verde{background:#E6F2EA;color:#1F7145;border:1px solid #1F7145}
.sync.gris{background:#F0F0EC;color:#1A1A1A;border:1px solid #9A9A92}
.sync.en-cab{position:absolute;top:auto;right:16px;bottom:7px;z-index:2;padding:2px 9px;font-size:10.5px;box-shadow:none}

/* ===== v1.12.44 · paleta viva + rojo de seguridad (Juan, 15-oct-2026: "siento opaca nuestra app, le falta vida"; "falta un rojo, algo que le dé sabor" → "Exactoooo")
   Pasteles PLANOS y con color (sin degradado a blanco), todos derivados de negro, amarillo y verde: menta, limón, lima, mostaza, gris perla.
   Rojo = el cuarto color de la señalización de seguridad: SOLO para lo vencido o sin soporte (chip, punto, borde, contador). Negro con amarillo = te toca. Verde = al día. */
:root{--rojo:#D62828;
  --t-menta:#BDEBCF;--t-menta-2:#BDEBCF;--t-amarillo:#FFF27A;--t-amarillo-2:#FFF27A;--t-lima:#DDF39A;--t-lima-2:#DDF39A;
  --t-salvia:#FFE08A;--t-salvia-2:#FFE08A;--t-gris:#E6E6DF;--t-gris-2:#E6E6DF;--t-verde:#C8E8B4;--t-verde-2:#C8E8B4;--t-crema:#FFF4B8;--t-crema-2:#FFF4B8}
.mod .mod-n{border-bottom:2px solid var(--tinta)}
.mod .mod-e.toca,.mod .mod-e.rojo,.mod .mod-e.ok{margin-top:-2px;padding:3px 9px;border-radius:999px;font-weight:600;font-size:11px}
.mod .mod-e.toca{background:var(--tinta);color:var(--amarillo)}
.mod .mod-e.rojo{background:var(--rojo);color:#fff}
.mod .mod-e.ok{background:var(--verde);color:#fff}
.mod-punto{background:var(--rojo);box-shadow:0 0 0 2px #fff}
.nv-punto.rojo,.nv-cab .nv-punto.rojo{background:var(--rojo);box-shadow:0 0 0 2px #fff}
.nv-c.urg.rojo,.ar-it .nv-c.urg.rojo{background:var(--rojo);color:#fff}
.p-vencida,.p-rechazada{background:var(--rojo);color:#fff}
.tarj:has(.p-vencida),.tarj:has(.p-rechazada){border-left-color:var(--rojo)}
.cab .menu-b{position:relative}
.cab .menu-b.alerta::after{content:"";position:absolute;top:-3px;right:-3px;width:10px;height:10px;border-radius:50%;background:var(--rojo);box-shadow:0 0 0 2px var(--tinta)}
.barra button{position:relative}
.barra .bad{position:absolute;top:0;left:calc(50% + 3px);min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:var(--rojo);color:#fff;font:700 10px/17px var(--f-b);font-style:normal;text-align:center;box-shadow:0 0 0 2px #fff}

/* ===== v1.12.48 · pasteles con contraste (Juan, 16-oct-2026: con los sólidos "se ve más payaso"; "esto es mucho más calidoso: el contraste del rojo pastel con el menta claro")
   Tarjetas de módulo en pastel claro; los chips van en pastel con letra oscura de su mismo color y borde fino (como el aviso "Falta evidencia" y la píldora "Escanear").
   El rojo sólido queda solo en lo diminuto: el punto de aviso y el contador de Hoy. */
:root{--t-menta:#D9F0E2;--t-menta-2:#D9F0E2;--t-amarillo:#FFF6B3;--t-amarillo-2:#FFF6B3;--t-lima:#ECF5C9;--t-lima-2:#ECF5C9;
  --t-salvia:#FFEBC2;--t-salvia-2:#FFEBC2;--t-gris:#EEEEE8;--t-gris-2:#EEEEE8;--t-verde:#E1F0D6;--t-verde-2:#E1F0D6;--t-crema:#FFF8D6;--t-crema-2:#FFF8D6;
  --rojo-bg:#FBE4E1;--rojo-ink:#A32D2D;--rojo-line:#F0B9B2;--ok-bg:#E3F4EA;--ok-ink:#17583A;--ok-line:#B7DEC6}
.mod .mod-e.rojo{background:var(--rojo-bg);color:var(--rojo-ink);box-shadow:inset 0 0 0 1px var(--rojo-line)}
.mod .mod-e.ok{background:var(--ok-bg);color:var(--ok-ink);box-shadow:inset 0 0 0 1px var(--ok-line)}
.mod .mod-e.toca{background:#fff;color:var(--tinta);box-shadow:inset 0 0 0 1px rgba(26,26,26,.28)}
.nv-c.urg.rojo,.ar-it .nv-c.urg.rojo{background:var(--rojo-bg);color:var(--rojo-ink);box-shadow:inset 0 0 0 1px var(--rojo-line)}
.p-vencida,.p-rechazada{background:var(--rojo-bg);color:var(--rojo-ink)}
.p-hoy{background:var(--mant-bg);color:var(--mant-ink)}
.p-aprobada{background:var(--ok-bg);color:var(--ok-ink)}
.ar-mod .nv-c.urg:not(.rojo),.nv-c.urg:not(.rojo){background:var(--t-amarillo);color:var(--tinta)}

/* ===== v1.12.49 · PALETA DOTACTUAL (Juan, 16-oct-2026: "Definamos nuestra paleta: negro, amarillo, rojo pastel, verde menta pastel, azul… mira las grandes marcas como Bancolombia")
   Dos capas. IDENTIDAD: negro (estructura) y amarillo (marca y acción). ESTADOS en pastel, cada uno fondo + letra oscura + borde fino:
   rojo = alerta (vencido, sin evidencia, rechazado) · amarillo = te toca · azul = en curso · menta = listo (letra = verde institucional).
   Los módulos van en tarjeta BLANCA con barra negra a la izquierda y el ícono en cuadro negro con amarillo: el color lo ponen solo los estados. */
:root{--az-bg:#E4EEFA;--az-ink:#24528A;--az-line:#B9CFEA;--am-bg:#FFF6B3;--am-line:#E9D96A;
  --cielo-bg:var(--az-bg);--cielo-ink:var(--az-ink);--cielo:var(--az-line);--coral-bg:var(--rojo-bg);--coral-ink:var(--rojo-ink);--coral:var(--rojo-line);
  --menta-bg:var(--ok-bg);--menta-ink:var(--ok-ink);--menta:var(--ok-line)}
/* tarjetas de módulo: blancas, barra tinta, ícono en cuadro negro/amarillo */
.mod,.mod.ic-crm,.mod.ic-ventas,.mod.ic-bodega,.mod.ic-dist,.mod.ic-maes,.mod.ic-compras,.mod.ic-fin,.mod.ic-prog{background:#fff;border:1px solid var(--line);border-left:4px solid var(--tinta);border-radius:0 16px 16px 0}
.mod .mod-ic{width:40px;height:40px;border-radius:11px;background:var(--tinta);color:var(--amarillo)}
.mod .mod-ic svg{width:22px;height:22px;stroke-width:1.8}
.mod .mod-n{border-bottom:0;padding-bottom:0}
.mod-punto{top:-4px;right:-4px}
.nv-cab .mod-ic,.ar-mod .mod-ic{background:var(--tinta)!important;color:var(--amarillo)}
.prox-m .ic{background:var(--panel)!important;color:var(--tinta)}
/* chips de estado (tarjeta del módulo, menú, "¿Qué vas a hacer?", píldoras) */
.mod .mod-e{margin-top:-2px;padding:3px 9px;border-radius:999px;font-weight:600;font-size:11px;background:var(--panel);color:var(--muted)}
.mod .mod-e.toca,.nv-c.urg:not(.rojo),.ar-mod .nv-c.urg:not(.rojo),.p-hoy{background:var(--am-bg);color:var(--tinta);box-shadow:inset 0 0 0 1px var(--am-line)}
.mod .mod-e.azul,.p-cot,.p-sal,.p-en_campo,.p-instalacion,.p-informe,.p-planeada{background:var(--az-bg);color:var(--az-ink);box-shadow:inset 0 0 0 1px var(--az-line)}
.mod .mod-e.ok,.p-ok,.p-aprobada{background:var(--ok-bg);color:var(--ok-ink);box-shadow:inset 0 0 0 1px var(--ok-line)}
.mod .mod-e.rojo,.p-vencida,.p-rechazada{background:var(--rojo-bg);color:var(--rojo-ink);box-shadow:inset 0 0 0 1px var(--rojo-line)}
.tarj.hecha .num{background:var(--ok-ink)}
.tarj.hecha{border-left-color:var(--ok-ink)}

/* ===== v1.12.50 · sin bloques negros dentro de la pantalla (Juan, 16-oct-2026: "los íconos y títulos con fondos tan negros me parecen invasivos, es lo que te he comentado desde el comienzo")
   El negro queda SOLO en el encabezado de arriba (y en letra/bordes). Títulos de sección = letra tinta + subraya amarilla corta, sin fondo.
   Íconos = cuadro amarillo pastel con trazo tinta, en módulos, menú, "¿Qué vas a hacer?" y procesos. */
.lbl{background:linear-gradient(var(--amarillo),var(--amarillo)) left bottom/40px 3px no-repeat;color:var(--tinta);padding:0 0 7px;border-radius:0;margin-top:10px;font-size:11px;font-weight:700;letter-spacing:.13em}
.rev .lbl,.hoja .lbl{margin-top:6px}
.mod .mod-ic,.nv-cab .mod-ic,.ar-mod .mod-ic,.paso-ic,.ar-ic{background:var(--am-bg)!important;color:var(--tinta)!important;box-shadow:inset 0 0 0 1px var(--am-line)}
.proc.off .paso-ic{background:var(--panel)!important;color:var(--muted)!important;box-shadow:none}
.mod .mod-ic svg{stroke-width:1.7}

/* ===== v1.12.52 · inicio con color, como Mi Área Segura (Juan, 16-oct-2026: "se ve algo simple; me gusta más Elite con su menú de inicio, cómo resaltan los colores")
   Cada módulo tiene SU pastel (de la paleta dotActual) y lo lleva en las tres puertas: tarjeta del inicio, cuadro del ícono en el menú y en "¿Qué vas a hacer?".
   Tarjeta del inicio: pastel sin borde, ícono en trazo sin cuadro, título con línea fina tinta, chip de estado con borde. Fondo cálido con textura suave de puntos. Sin bloques negros. */
:root{--m-crm:#D7F0E1;--m-ventas:#FFF3B8;--m-bodega:#EEEAE0;--m-dist:#DFE9F8;--m-maes:#F9E3E0;--m-compras:#E3F1D6;--m-fin:#ECECE6;--m-prog:#FFF6D6;--lienzo:#FAF9F5}
body,#app{background-color:var(--lienzo)}
.cont{background-image:radial-gradient(rgba(26,26,26,.07) 1px,transparent 1.3px);background-size:18px 18px;background-attachment:local}
.mod,.mod.ic-crm,.mod.ic-ventas,.mod.ic-bodega,.mod.ic-dist,.mod.ic-maes,.mod.ic-compras,.mod.ic-fin,.mod.ic-prog{border:0;border-radius:18px;min-height:128px;padding:16px 14px 14px}
.mod.ic-crm{background:var(--m-crm)} .mod.ic-ventas{background:var(--m-ventas)} .mod.ic-bodega{background:var(--m-bodega)} .mod.ic-dist{background:var(--m-dist)}
.mod.ic-maes{background:var(--m-maes)} .mod.ic-compras{background:var(--m-compras)} .mod.ic-fin{background:var(--m-fin)} .mod.ic-prog{background:var(--m-prog)}
.mod .mod-ic{background:transparent!important;box-shadow:none!important;width:30px;height:30px;color:var(--tinta)!important}
.mod .mod-ic svg{width:28px;height:28px;stroke-width:1.6}
.mod .mod-n{font-size:17px;align-self:stretch;padding-bottom:8px;border-bottom:1.5px solid var(--tinta)}
.mod .mod-e{background:rgba(255,255,255,.7)}
.mod:hover{box-shadow:0 2px 10px rgba(26,26,26,.08)}
/* el color del módulo en el menú y en "¿Qué vas a hacer?" */
.nv-cab .mod-ic.ic-crm,.ar-mod .mod-ic.ic-crm{background:var(--m-crm)!important}
.nv-cab .mod-ic.ic-ventas,.ar-mod .mod-ic.ic-ventas{background:var(--m-ventas)!important}
.nv-cab .mod-ic.ic-bodega,.ar-mod .mod-ic.ic-bodega{background:var(--m-bodega)!important}
.nv-cab .mod-ic.ic-dist,.ar-mod .mod-ic.ic-dist{background:var(--m-dist)!important}
.nv-cab .mod-ic.ic-maes,.ar-mod .mod-ic.ic-maes{background:var(--m-maes)!important}
.nv-cab .mod-ic.ic-compras,.ar-mod .mod-ic.ic-compras{background:var(--m-compras)!important}
.nv-cab .mod-ic.ic-fin,.ar-mod .mod-ic.ic-fin{background:var(--m-fin)!important}
.nv-cab .mod-ic.ic-prog,.ar-mod .mod-ic.ic-prog{background:var(--m-prog)!important}
.nv-cab .mod-ic,.ar-mod .mod-ic{box-shadow:none!important}
.prox-m .ic.ic-compras{background:var(--m-compras)!important} .prox-m .ic.ic-fin{background:var(--m-fin)!important} .prox-m .ic.ic-prog{background:var(--m-prog)!important}
.lbl{font-size:11.5px}