:root { --vino:#863035; --tinta:#231f20; --gris:#a0a8b1; --fondo:#f4f5f7; --blanco:#fff; }
* { box-sizing:border-box; margin:0; }
body { font-family:'Segoe UI',system-ui,sans-serif; background:var(--fondo); color:var(--tinta); min-height:100vh; }
.centro { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:16px; }
.tarjeta { background:var(--blanco); border-radius:14px; box-shadow:0 10px 30px rgba(35,31,32,.12); padding:36px 32px; width:100%; max-width:380px; }
.tarjeta img.logo { width:100%; max-width:260px; display:block; margin:0 auto 26px; }
.campo { margin-bottom:14px; }
.campo label { display:block; font-size:13px; color:#666; margin-bottom:5px; }
.campo input { width:100%; padding:11px 12px; border:1px solid #d6d9de; border-radius:8px; font-size:15px; }
.campo input:focus { outline:2px solid var(--vino); border-color:var(--vino); }
.boton { width:100%; padding:12px; background:var(--vino); color:#fff; border:0; border-radius:8px; font-size:15px; font-weight:600; cursor:pointer; }
.boton:disabled { opacity:.6; }
.error { background:#fdecec; color:#8f1f1f; border-radius:8px; padding:10px 12px; font-size:13px; margin-bottom:12px; display:none; }
.barra { background:var(--tinta); color:#fff; display:flex; align-items:center; gap:14px; padding:10px 18px; }
.barra img { height:34px; }
.barra .usuario { margin-left:auto; font-size:13px; color:#cfd3d8; }
.barra button { background:transparent; border:1px solid #555; color:#ddd; border-radius:6px; padding:5px 12px; cursor:pointer; }
.contenido { max-width:1000px; margin:30px auto; padding:0 16px; }
.contenido h1 { font-size:20px; margin-bottom:18px; }
.modulos { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:14px; }
.modulo { background:#fff; border-radius:12px; padding:20px; border:1px solid #e4e6ea; text-decoration:none; color:var(--tinta); position:relative; }
.modulo:hover { border-color:var(--vino); }
.modulo h3 { font-size:16px; margin-bottom:6px; }
.modulo p { font-size:13px; color:#777; }
.modulo.pronto { opacity:.55; pointer-events:none; }
.modulo.pronto::after { content:'Próximamente'; position:absolute; top:10px; right:10px; font-size:10px; background:var(--gris); color:#fff; padding:2px 8px; border-radius:10px; }
.pantalla-msg { padding:60px 20px; text-align:center; font-size:16px; }

/* ===== v8 · componentes comunes de Ventas ===== */
.herr{display:flex;gap:10px;margin-bottom:14px;flex-wrap:wrap;align-items:center}
.herr input,.herr select{padding:10px 12px;border:1px solid #d6d9de;border-radius:8px;font-size:14px}
.herr input{flex:1;min-width:200px}
.bt{display:inline-block;padding:10px 16px;border:0;border-radius:8px;background:var(--vino);color:#fff;font-weight:600;cursor:pointer;font-size:13px;text-decoration:none;white-space:nowrap}
.bt:disabled{opacity:.5;cursor:not-allowed}
.bt.g{background:#1d6b2a}.bt.n{background:var(--tinta)}.bt.c{background:#e8ecef;color:var(--tinta)}.bt.r{background:#b3261e}.bt.w{background:#25D366}
.bt.sm{padding:5px 10px;font-size:12px}
table.t{width:100%;border-collapse:collapse;background:#fff;border-radius:10px;overflow:hidden;font-size:13px}
table.t th{background:var(--tinta);color:#fff;text-align:left;padding:9px 10px;font-weight:600}
table.t td{padding:8px 10px;border-bottom:1px solid #eef0f3;vertical-align:middle}
table.t th.num,table.t td.num{text-align:right}
table.t tr.clic{cursor:pointer}
table.t tr.clic:hover td{background:#faf5f5}
table.t td input{padding:5px 7px;border:1px solid #d6d9de;border-radius:6px;font-size:13px}
.panel{background:#fff;border:1px solid #e4e6ea;border-radius:12px;padding:16px 18px;margin-bottom:16px}
.panel h2{font-size:15px;margin-bottom:12px}
.fila{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px;align-items:flex-end}
.fila .c{display:flex;flex-direction:column;gap:4px}
.fila label{font-size:12px;color:#666;font-weight:600}
.fila input,.fila select,.fila textarea{padding:9px 10px;border:1px solid #d6d9de;border-radius:8px;font-size:13px;font-family:inherit}
.sug{position:relative}
.sug .lista{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d6d9de;border-radius:8px;max-height:260px;overflow:auto;z-index:500;box-shadow:0 8px 20px rgba(0,0,0,.12)}
.sug .lista div{padding:8px 10px;cursor:pointer;font-size:13px;border-bottom:1px solid #f2f3f5}
.sug .lista div:hover{background:#faf0f0}
.sug .lista .meta{font-size:11.5px;color:#888}
.pill{font-size:11px;padding:2px 8px;border-radius:10px;background:#e8ecef;white-space:nowrap}
.pill.fnr{background:#f3e2e3;color:#863035}
.pill.ok{background:#e3f2e6;color:#1d6b2a}.pill.warn{background:#fff2cc;color:#7a5c00}.pill.mal{background:#fdecec;color:#8f1f1f}.pill.gris{background:#eee;color:#777}
.est{font-size:11px;padding:2px 8px;border-radius:10px;white-space:nowrap}
.est.PROG{background:#fff2cc;color:#7a5c00}.est.PARC{background:#dbeafe;color:#1e40af}.est.ENT{background:#e3f2e6;color:#1d6b2a}.est.CAN{background:#eee;color:#777}
.tot{margin:14px 0 0 auto;max-width:300px;font-size:14px}
.tot div{display:flex;justify-content:space-between;padding:4px 0}
.tot .g{border-top:2px solid var(--tinta);margin-top:6px;padding-top:8px;font-weight:700;font-size:17px}
.nota{font-size:12px;color:#777;margin:8px 0}
#msg{font-size:13px;margin:0 0 12px;padding:10px 14px;border-radius:8px;display:none;font-weight:600}
.caja{border-radius:10px;padding:11px 14px;font-size:13px;font-weight:600;margin-bottom:14px}
.caja.mal{background:#fdecec;border:1px solid #f0c4c4;color:#8f1f1f}
.caja.warn{background:#fdf3e3;border:1px solid #ecd9b0;color:#7a5c00}
.caja.info{background:#eef2f7;border:1px solid #d3dae3;color:#3a4a5c}
.tabs{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap}
.tabs button{border:1px solid #d6d9de;background:#fff;border-radius:18px;padding:6px 14px;font-size:12.5px;cursor:pointer;font-weight:600;color:#555}
.tabs button.on{background:var(--vino);border-color:var(--vino);color:#fff}
.mapa{height:340px;border-radius:10px;border:1px solid #d6d9de;z-index:0}
.modal-fondo{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;align-items:flex-start;justify-content:center;z-index:1000;overflow:auto;padding:30px 12px}
.modal-fondo.abierto{display:flex}
.modal{background:#fff;border-radius:14px;max-width:760px;width:100%;padding:20px 22px;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.modal h2{font-size:17px;margin-bottom:12px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 18px;font-size:13px}
.grid2 .k{font-size:11.5px;color:#888;font-weight:600;text-transform:uppercase;letter-spacing:.3px}
.grid2 .v{font-size:14px;margin-top:2px}
.vacio{text-align:center;color:#888;padding:20px;font-size:13px}
.pie{text-align:center;color:#9aa0a6;font-size:12px;margin-top:28px}
@media (max-width:640px){ .contenido{margin:16px auto} table.t{font-size:12px} .ocultar-movil{display:none} }
@media print{
  .barra,.no-imprimir,#msg{display:none!important}
  body{background:#fff}
  .contenido{margin:0;max-width:none;padding:0}
  .panel{border:0;padding:0}
  .solo-imprimir{display:block!important}
}
.solo-imprimir{display:none}

/* ===== v9 · despacho ===== */
.ocup{margin:6px 0}
.ocup-l{font-size:12.5px;margin-bottom:3px}
.ocup-b{height:9px;background:#eceef1;border-radius:6px;overflow:hidden}
.ocup-b div{height:100%;border-radius:6px}
.pin{width:26px;height:26px;border-radius:50%;color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.4)}
.vj{font-size:11px;padding:2px 8px;border-radius:10px;white-space:nowrap}
.vj.PLAN{background:#fff2cc;color:#7a5c00}.vj.RUTA{background:#dbeafe;color:#1e40af}.vj.ENT{background:#e3f2e6;color:#1d6b2a}.vj.CAN{background:#eee;color:#777}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.kpi{background:#fff;border:1px solid #e4e6ea;border-radius:10px;padding:12px 14px}
.kpi .k{font-size:11.5px;color:#888;font-weight:600;text-transform:uppercase}
.kpi .v{font-size:22px;font-weight:700;margin-top:2px}
.tarjeta-viaje{background:#fff;border:1px solid #e4e6ea;border-left:5px solid var(--vino);border-radius:10px;padding:14px 16px;margin-bottom:12px}
.parada{border:1px solid #e4e6ea;border-radius:10px;padding:12px 14px;margin-bottom:10px;background:#fff}
.parada .cab{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.parada .num{background:var(--vino);color:#fff;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px}
.firma{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:50px;font-size:12px;text-align:center}
.firma div{border-top:1px solid #333;padding-top:6px}
@media print{ th.solo-imprimir,td.solo-imprimir{display:table-cell!important} .firma.solo-imprimir{display:grid!important} }
.nada,.solo-imprimir.nada,.firma.solo-imprimir.nada{display:none!important}

/* ===== v10 · seguimiento (pensado para celular) ===== */
.grande{display:block;width:100%;text-align:center;padding:16px;font-size:16px;border-radius:12px}
.activa{background:linear-gradient(135deg,#863035,#5e1f23);color:#fff;border-radius:14px;padding:16px 18px;margin-bottom:14px}
.activa .t{font-size:28px;font-weight:700;font-variant-numeric:tabular-nums}
.activa a,.activa button{background:#fff;color:var(--vino)}
.item{background:#fff;border:1px solid #e4e6ea;border-radius:12px;padding:12px 14px;margin-bottom:8px;display:block;color:inherit;text-decoration:none}
.item:hover{border-color:var(--vino)}
.item .l1{display:flex;justify-content:space-between;gap:10px;align-items:center;font-weight:600}
.item .l2{font-size:12.5px;color:#777;margin-top:3px}
.fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px}
.fotos a{display:block;aspect-ratio:1;border-radius:10px;overflow:hidden;background:#eee;position:relative}
.fotos img{width:100%;height:100%;object-fit:cover}
.fotos .et{position:absolute;left:4px;bottom:4px;background:rgba(0,0,0,.6);color:#fff;font-size:10px;padding:1px 6px;border-radius:8px}
.chipsel{display:flex;gap:6px;flex-wrap:wrap}
.chipsel button{border:1px solid #d6d9de;background:#fff;border-radius:16px;padding:6px 12px;font-size:12.5px;cursor:pointer}
.chipsel button.on{background:var(--vino);border-color:var(--vino);color:#fff}
.estrellas button{font-size:26px;background:none;border:0;cursor:pointer;color:#ccc;padding:0 2px}
.estrellas button.on{color:#e0a800}
.dist{font-size:11px;padding:2px 8px;border-radius:10px}
.dist.ok{background:#e3f2e6;color:#1d6b2a}.dist.med{background:#fff2cc;color:#7a5c00}.dist.lejos{background:#fdecec;color:#8f1f1f}
.res{font-size:11px;padding:2px 8px;border-radius:10px;background:#eee}
.res.Vendido{background:#e3f2e6;color:#1d6b2a}.res.Interesado,.res.Cotizó{background:#dbeafe;color:#1e40af}.res.Reprogramar{background:#fff2cc;color:#7a5c00}.res.Sin{background:#fdecec;color:#8f1f1f}
.pe{font-size:11px;padding:2px 8px;border-radius:10px;background:#eee}
.pe.nuevo{background:#eef2f7}.pe.contactado{background:#fff2cc;color:#7a5c00}.pe.cotizado{background:#dbeafe;color:#1e40af}.pe.ganado{background:#e3f2e6;color:#1d6b2a}.pe.perdido{background:#fdecec;color:#8f1f1f}

/* ===== v11 · taller y diesel ===== */
.ot{font-size:11px;padding:2px 8px;border-radius:10px;white-space:nowrap;background:#eee}
.ot.abierta{background:#fff2cc;color:#7a5c00}.ot.diagnostico,.ot.esperando_refaccion,.ot.esperando_autorizacion{background:#fde7d4;color:#8a4b0f}
.ot.en_proceso{background:#dbeafe;color:#1e40af}.ot.cerrada{background:#e3f2e6;color:#1d6b2a}.ot.cancelada{background:#eee;color:#777}
.fs{background:#b3261e;color:#fff;border-radius:10px;padding:10px 14px;font-weight:700;margin-bottom:12px}
.big input{font-size:22px!important;padding:12px!important;font-weight:600}
.ult{font-size:12px;color:#666;margin-top:3px}
.qrs{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.qrt{background:#fff;border:2px solid var(--tinta);border-radius:12px;padding:12px;text-align:center;break-inside:avoid;page-break-inside:avoid}
.qrt .eco{font-size:34px;font-weight:800;letter-spacing:1px}
.qrt .sub{font-size:11px;color:#555}
.lin{border:1px solid #e4e6ea;border-radius:10px;padding:10px 12px;margin-bottom:8px;background:#fff}
.lin.cancelada{opacity:.45;text-decoration:line-through}
.lin .h{display:flex;justify-content:space-between;gap:8px;font-weight:600;font-size:13px}
.lin .d{font-size:12.5px;color:#555;margin-top:3px;white-space:pre-line}
@media print{ .qrs{grid-template-columns:repeat(3,1fr)} .qrt{border:2px solid #000} }

/* ===== v12 · vendedores: tablero, seguimiento de ventas, cartera, pedidos ===== */
.kp{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-bottom:16px}
.kp .c{background:#fff;border:1px solid #e4e6ea;border-radius:12px;padding:12px 14px}
.kp .c .k{font-size:11px;color:#888;font-weight:700;text-transform:uppercase;letter-spacing:.3px}
.kp .c .v{font-size:21px;font-weight:700;margin-top:3px}
.kp .c .s{font-size:12px;color:#777;margin-top:2px}
.kp .c.mal{border-color:#f0c4c4;background:#fffafa}.kp .c.ok{border-color:#cfe6d4}
.barra-av{height:9px;background:#eef0f3;border-radius:6px;overflow:hidden;margin-top:6px}
.barra-av div{height:100%;background:#1d6b2a;border-radius:6px}
.barra-av.warn div{background:#c98a00}.barra-av.mal div{background:#b3261e}
.dos{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px}
.lst{list-style:none;padding:0;margin:0}
.lst li{padding:9px 2px;border-bottom:1px solid #f0f1f3;font-size:13px;display:flex;gap:8px;align-items:center;justify-content:space-between}
.lst li:last-child{border-bottom:0}
.lst .t1{font-weight:600}.lst .t2{font-size:12px;color:#777}
.accesos{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.et{font-size:11px;padding:2px 9px;border-radius:10px;white-space:nowrap;font-weight:600}
.et.nueva{background:#e8ecef;color:#444}.et.contactada{background:#dbeafe;color:#1e40af}.et.negociacion{background:#fff2cc;color:#7a5c00}
.et.ganada{background:#e3f2e6;color:#1d6b2a}.et.perdida{background:#fdecec;color:#8f1f1f}
.tarj{background:#fff;border:1px solid #e4e6ea;border-radius:12px;padding:12px 14px;margin-bottom:10px}
.tarj.hoy{border-left:4px solid var(--vino)}.tarj.vencida{opacity:.75}
.tarj .cab{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;flex-wrap:wrap}
.tarj .cab b{font-size:14px}
.tarj .det{font-size:12.5px;color:#666;margin-top:4px}
.tarj .acc{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.ag{font-variant-numeric:tabular-nums}
td.b0{color:#1d6b2a}td.b30{color:#7a5c00}td.b60{color:#b45309}td.b90,td.b91{color:#8f1f1f;font-weight:600}
.st{font-size:11px;padding:2px 8px;border-radius:10px;font-weight:600;white-space:nowrap}
.st.al_dia{background:#e3f2e6;color:#1d6b2a}.st.vencido{background:#fff2cc;color:#7a5c00}.st.bloqueado{background:#fdecec;color:#8f1f1f}
.linea-t{position:relative;padding-left:22px;margin:4px 0 10px}
.linea-t .p{position:relative;padding:0 0 12px}
.linea-t .p::before{content:'';position:absolute;left:-16px;top:4px;width:10px;height:10px;border-radius:50%;background:#c4c9cf}
.linea-t .p::after{content:'';position:absolute;left:-12px;top:16px;bottom:-2px;width:2px;background:#e4e6ea}
.linea-t .p:last-child::after{display:none}
.linea-t .p.ok::before{background:#1d6b2a}.linea-t .p.warn::before{background:#c98a00}.linea-t .p.mal::before{background:#b3261e}
.linea-t .p .h{font-size:11.5px;color:#888}
.chip-rem{display:inline-block;font-size:11px;padding:2px 8px;border-radius:10px;margin:2px 4px 2px 0;font-weight:600}
.chip-rem.programada{background:#fff2cc;color:#7a5c00}.chip-rem.en_ruta{background:#dbeafe;color:#1e40af}
.chip-rem.entregada{background:#e3f2e6;color:#1d6b2a}.chip-rem.cancelada{background:#eee;color:#888;text-decoration:line-through}
.publico{max-width:640px;margin:0 auto;padding:16px}
.publico .head{background:var(--tinta);color:#fff;border-radius:14px;padding:16px 18px;margin-bottom:14px}
.publico .head img{height:34px;background:#fff;border-radius:6px;padding:3px 8px}
.publico .estado{font-size:22px;font-weight:700;margin:10px 0 2px}
.chk{display:flex;gap:8px;align-items:center}
textarea.ta{width:100%;min-height:70px;padding:9px 10px;border:1px solid #d6d9de;border-radius:8px;font-family:inherit;font-size:13px}
@media print{ .kp .c{border:1px solid #999} }
.caja.ok{background:#e3f2e6;color:#1d6b2a;border-color:#b9dcc0}
.big input.auto{background:#eef7ee;border-color:#1d6b2a!important}
.fila .c{min-width:0}.fila .c input,.fila .c select{max-width:100%;box-sizing:border-box}

/* Caja de crédito (v26) */
.credbox{border-left:5px solid #b3261e;background:#fdf0f0;border-radius:8px;padding:12px 16px;margin:10px 0;color:#8f1f1f}
.credbox.ok{border-color:#1d6b2a;background:#eef7f0;color:#1d6b2a}
.credbox .ct{font-weight:700;font-size:14px}.credbox .cm{font-weight:700;font-size:16px;margin:4px 0}
.credbox .ci{color:#444;font-size:14px;margin:3px 0}.credbox .cl{font-size:14px;margin-top:6px}
.promesa{border-left:5px solid #e0a100;background:#fffaeb;border-radius:8px;padding:10px 16px;margin:10px 0;color:#7a5c00;font-size:14px}
.promesa .pa{font-style:italic;color:#8a6d1a}