:root{--vino:#1b2b47;--vino2:#2c4470;--fondo:#f5f3f0;--tarjeta:#fff;--texto:#1f1d1c;--sub:#6b6663;--borde:#e2ddd8;
--verde:#1f8a4c;--verdeF:#e3f5ea;--amar:#b7791f;--amarF:#fdf2d9;--rojo:#c0392b;--rojoF:#fbe3e0;--gris:#8a8582}
*{box-sizing:border-box}
html,body{margin:0;background:var(--fondo);color:var(--texto);font:16px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-text-size-adjust:100%}
#app{max-width:720px;margin:0 auto;padding-bottom:40px}
.hidden{display:none!important}
header#topbar{display:flex;justify-content:space-between;align-items:center;background:var(--vino);color:#fff;padding:12px 16px;padding-top:calc(12px + env(safe-area-inset-top))}
.brand{font-weight:700;letter-spacing:.3px}.brand span{font-weight:400;opacity:.85}
.who{font-size:14px;opacity:.95}
nav#tabs{display:flex;background:#fff;border-bottom:1px solid var(--borde);position:sticky;top:0;z-index:5}
.tab{flex:1;border:0;background:none;padding:12px 4px;font-size:13px;color:var(--sub);border-bottom:3px solid transparent;cursor:pointer;position:relative}
.tab.active{color:var(--vino);border-bottom-color:var(--vino);font-weight:600}
.badge{background:var(--rojo);color:#fff;border-radius:10px;padding:0 6px;font-size:11px;margin-left:4px}
main{padding:12px}
.card{background:var(--tarjeta);border:1px solid var(--borde);border-radius:12px;padding:14px;margin-bottom:12px}
.card.login{margin-top:15vh}.card.login h1{margin:0 0 16px;color:var(--vino);font-size:22px;text-align:center}.card.login h1 span{font-weight:300}
.card.login .logo{display:block;width:200px;margin:4px auto 14px}
.brand img{height:26px;vertical-align:middle;margin-right:8px;filter:brightness(0) invert(1)}
label{display:block;font-size:13px;color:var(--sub);margin-bottom:10px}
input,select,textarea{display:block;width:100%;margin-top:4px;padding:10px 12px;font-size:16px;border:1px solid var(--borde);border-radius:8px;background:#fff;color:var(--texto)}
input:disabled{background:#f1efec}
button.primary{width:100%;background:var(--vino);color:#fff;border:0;border-radius:10px;padding:13px;font-size:16px;font-weight:600;cursor:pointer;margin-top:6px}
button.primary:disabled{background:var(--gris)}
button.link{background:none;border:0;color:var(--vino);font-size:14px;cursor:pointer;padding:6px 0;text-decoration:underline}
button.sec{background:#fff;border:1px solid var(--borde);border-radius:8px;padding:8px 12px;font-size:14px;cursor:pointer}
.msg{color:var(--rojo);font-size:14px;min-height:1em}
.lista{border:1px solid var(--borde);border-radius:8px;max-height:260px;overflow:auto;background:#fff;margin-top:-6px;margin-bottom:10px}
.lista div{padding:10px 12px;border-bottom:1px solid var(--borde);cursor:pointer;font-size:14px}
.lista div:last-child{border-bottom:0}.lista div:hover{background:#faf7f4}
.lista small{display:block;color:var(--sub)}
.cliente-sel .sub{font-size:13px;color:var(--sub)}
.pill{display:inline-block;font-size:11px;padding:2px 8px;border-radius:10px;background:#eee;color:#333;margin-left:6px;vertical-align:middle}
.pill.ON{background:#e8e3f7;color:#4a2f9c}.pill.OFF{background:#e3eef7;color:#1f4f8a}
.linea{background:#fff;border:1px solid var(--borde);border-left:6px solid var(--gris);border-radius:12px;padding:12px;margin-bottom:10px}
.linea.verde{border-left-color:var(--verde)}.linea.amarillo{border-left-color:var(--amar)}.linea.rojo{border-left-color:var(--rojo)}
.linea .titulo{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.linea .titulo b{font-size:15px}.linea .titulo button{flex:none}
.linea .grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:8px}
.linea .grid label{margin:0}
.linea .info{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;color:var(--sub);margin-top:8px}
.linea .info b{color:var(--texto)}
.sem{display:inline-block;padding:3px 9px;border-radius:10px;font-size:12px;font-weight:600}
.sem.verde{background:var(--verdeF);color:var(--verde)}.sem.amarillo{background:var(--amarF);color:var(--amar)}.sem.rojo{background:var(--rojoF);color:var(--rojo)}.sem.gris{background:#eee;color:#555}
.totales .fila{display:flex;justify-content:space-between;padding:4px 0;font-size:15px}
.aviso{background:var(--rojoF);color:var(--rojo);padding:10px;border-radius:8px;font-size:14px;margin:8px 0}
.aviso.ok{background:var(--verdeF);color:var(--verde)}
.ped{background:#fff;border:1px solid var(--borde);border-radius:12px;padding:12px;margin-bottom:10px;cursor:pointer}
.ped .top{display:flex;justify-content:space-between;align-items:center}
.ped .top b{font-size:15px}.ped .sub{font-size:13px;color:var(--sub);margin-top:2px}
.est{font-size:11px;padding:2px 8px;border-radius:10px;font-weight:600;white-space:nowrap}
.est.borrador{background:#eee}.est.pendiente_autorizacion{background:var(--amarF);color:var(--amar)}.est.autorizado,.est.enviado,.est.facturado{background:var(--verdeF);color:var(--verde)}.est.rechazado,.est.cancelado{background:var(--rojoF);color:var(--rojo)}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;align-items:flex-end;justify-content:center;z-index:2000}
.modal-box{background:#fff;width:100%;max-width:720px;max-height:92vh;overflow:auto;border-radius:16px 16px 0 0;padding:16px}
.modal-box h3{margin:0 0 6px}
table{width:100%;border-collapse:collapse;font-size:13.5px;background:#fff}
th,td{padding:8px 6px;border-bottom:1px solid var(--borde);text-align:right}
th:first-child,td:first-child{text-align:left}th{color:var(--sub);font-weight:600;font-size:12px}
.tr-rojo td{color:var(--rojo)}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#222;color:#fff;padding:10px 16px;border-radius:10px;font-size:14px;z-index:30}
.fila{display:flex;gap:10px}.fila>label{flex:1}
.right{text-align:right}
@media (min-width:600px){.linea .grid{grid-template-columns:1fr 1fr 1fr 1fr}}

.car{background:#fff;border:1px solid var(--borde);border-radius:12px;padding:12px;margin-bottom:8px;cursor:pointer;display:flex;justify-content:space-between;gap:10px;align-items:center}
.car b{font-size:15px}.car .sub{font-size:12.5px;color:var(--sub)}.car .num{text-align:right;white-space:nowrap}.car .num b{display:block;font-size:15px}
.car.venc{border-left:6px solid var(--rojo)}.car.ok{border-left:6px solid var(--verde)}
.venc-txt{color:var(--rojo);font-weight:600}
.aviso.warn{background:var(--amarF);color:var(--amar)}

/* v4: menú lateral */
header#topbar{gap:10px}
header#topbar .brand{flex:1;font-size:17px}
button.icono{background:none;border:0;color:#fff;font-size:22px;cursor:pointer;padding:0 4px}
nav#menu{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:25}
.menu-box{background:#fff;width:270px;max-width:80vw;height:100%;overflow:auto;box-shadow:2px 0 12px rgba(0,0,0,.2);display:flex;flex-direction:column}
.menu-head{background:var(--vino);color:#fff;padding:18px 16px;padding-top:calc(18px + env(safe-area-inset-top))}
.menu-head b{display:block;font-size:16px}.menu-head small{opacity:.8}
.menu-box button{text-align:left;background:none;border:0;border-bottom:1px solid var(--borde);padding:14px 16px;font-size:15px;color:var(--texto);cursor:pointer}
.menu-box button.active{color:var(--vino);font-weight:700;background:#f6f4f1}
.menu-box button.salir{margin-top:auto;color:var(--rojo);border-top:1px solid var(--borde)}
.menu-sep{padding:12px 16px 4px;font-size:11px;letter-spacing:.5px;text-transform:uppercase;color:var(--sub)}
/* visitas */
.vis{background:#fff;border:1px solid var(--borde);border-radius:12px;padding:12px;margin-bottom:8px}
.vis .top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.vis .acciones{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.vis .acciones button{flex:1;min-width:90px}
.est.pedido{background:var(--verdeF);color:var(--verde)}.est.no_compro{background:var(--rojoF);color:var(--rojo)}.est.cobro{background:#e3eef7;color:#1f4f8a}.est.otro,.est.pendiente{background:#eee}
.est.aprobado,.est.alta{background:var(--verdeF);color:var(--verde)}
/* promos */
.promo{background:#fff;border:1px solid var(--borde);border-left:6px solid var(--amar);border-radius:12px;padding:12px;margin-bottom:8px;display:flex;justify-content:space-between;gap:10px;align-items:center}
.promo .num b{font-size:17px;color:var(--vino)}
/* avance */
.kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
.kpi div{background:#f6f4f1;border-radius:10px;padding:10px;text-align:center}
.kpi b{display:block;font-size:17px}.kpi small{color:var(--sub);font-size:11.5px}
.barra{display:flex;height:10px;border-radius:6px;overflow:hidden;margin-top:10px;background:#eee}
.barra i{display:block;height:100%}.barra .v{background:var(--verde)}.barra .a{background:var(--amar)}.barra .r{background:var(--rojo)}
.foto-mini{width:64px;height:64px;object-fit:cover;border-radius:8px}

/* v5: portal proveedor */
body.tema-prov{--vino:#17504a;--vino2:#1f6a62;--fondo:#f1f4f2}
.prov-head{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--vino);color:#fff;border:0}
.prov-head b{font-size:18px}.prov-head .sub{color:#fff;opacity:.85}.prov-head img{height:40px;filter:brightness(0) invert(1)}
.kpi.cuatro{grid-template-columns:repeat(2,1fr)}
@media (min-width:600px){.kpi.cuatro{grid-template-columns:repeat(4,1fr)}}
.acuerdo{background:#fff;border:1px solid var(--borde);border-radius:12px;padding:14px;margin-bottom:10px}
.acuerdo .top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.acuerdo .pct{font-size:22px;font-weight:700;color:var(--vino)}
.acuerdo .barra{height:14px}
.acuerdo .barra .ok{background:var(--vino)}
.acuerdo .barra .falta{background:#e6e3df}
.chk{display:inline-flex;align-items:center;gap:6px;font-size:13px;margin-right:12px}
.chk input{width:auto;display:inline;margin:0}

/* BI proveedor */
.bar-row{display:grid;grid-template-columns:150px 1fr 80px;gap:8px;align-items:center;font-size:13px;padding:4px 0}
.bar-row .b{height:14px;border-radius:4px;background:var(--vino)}
.bar-row .b.ant{background:#c9c4be;margin-top:2px}
.bar-row .n{text-align:right;font-weight:600}
.bar-row small{color:var(--sub)}
.up{color:var(--verde);font-weight:600}.down{color:var(--rojo);font-weight:600}
@media (max-width:600px){.bar-row{grid-template-columns:100px 1fr 70px}}
.car .num .sub{display:block}
.est.pendiente_cobranza{background:var(--amarF);color:var(--amar)}
#btnAvisos{position:relative;font-size:19px}
#btnAvisos .badge{position:absolute;top:-4px;right:-6px}

/* apoyos de proveedores */
.acuerdo .acciones{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.acuerdo .acciones button{flex:1;min-width:110px}
.acuerdo .acciones button.link{flex:0 0 auto;min-width:0}
.acuerdo table small{color:var(--sub)}
details.card>summary{list-style:none}
details.card>summary::-webkit-details-marker{display:none}
details.card>summary::before{content:"＋ ";color:var(--vino);font-weight:700}
details.card[open]>summary::before{content:"－ "}
.ap-total{display:flex;justify-content:space-between;align-items:center;gap:8px;background:#f6f4f1;border-radius:10px;padding:10px 12px;margin:0 0 10px}
.ap-total b{font-size:17px;color:var(--vino)}
.fila>label{min-width:0}
input[type=date]{min-width:0}

/* mapa y ruta por zonas */
#mapa{height:68vh;min-height:360px;border-radius:12px;border:1px solid var(--borde);margin-bottom:10px;background:#e8e6e1}
.leyenda{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px}.leyenda i{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:5px;vertical-align:-1px}
.chip{display:inline-block;font-size:11px;font-weight:600;padding:1px 7px;border-radius:9px;margin-right:4px}
.chip.activo{background:var(--verdeF);color:var(--verde)}.chip.reactivar{background:var(--amarF);color:var(--amar)}.chip.dormido,.chip.nunca{background:var(--rojoF);color:var(--rojo)}.chip.ubicar{background:#ece6f6;color:#5b3a8c}.chip.zona{background:#eef1f6;color:#1b2b47}
.leaflet-popup-content{font-size:13px;line-height:1.35}.leaflet-popup-content .sec,.leaflet-popup-content select{margin-top:6px}

#mapa{position:relative;z-index:0}
.gpop{font-size:13px;line-height:1.45;max-width:260px;color:#222}
.gpop select,.gpop button{margin-top:6px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media(max-width:480px){.grid2{grid-template-columns:1fr}}
.est.rep-pendiente{background:#eee}.est.rep-entregado{background:var(--verdeF);color:var(--verde)}.est.rep-parcial{background:var(--amarF);color:var(--amar)}.est.rep-no_entregado{background:var(--rojoF);color:var(--rojo)}
.est.gasto-pendiente{background:var(--amarF);color:var(--amar)}.est.gasto-aprobado{background:var(--verdeF);color:var(--verde)}.est.gasto-rechazado{background:var(--rojoF);color:var(--rojo)}

/* ===== v63: tablet y PC. Todo va dentro de @media (min-width:768px): en el celular no cambia nada ===== */
@media (min-width:768px){
  #app{max-width:1100px}
  main{padding:16px}
  /* listas de pedidos, visitas, cartera, avisos, etc. en 2+ columnas */
  #misLista,#autLista,#facLista,#prLista,#carLista,#visHoy,#taLista,#proVigentes,#avLista,#avCards,#apListaAdm,#saLista{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:12px;align-items:stretch}
  :is(#misLista,#autLista,#facLista,#prLista,#carLista,#visHoy,#taLista,#proVigentes,#avLista,#avCards,#apListaAdm,#saLista)>*{margin:0!important;min-width:0}
  :is(#misLista,#autLista,#facLista,#prLista,#carLista,#visHoy,#taLista,#proVigentes,#avLista,#avCards,#apListaAdm,#saLista)>:is(.sub,.menu-sep,.aviso,table,h3,details,p){grid-column:1/-1}
  :is(#facLista,#carLista,#visHoy,#taLista,#avLista,#apListaAdm,#saLista,#misLista,#prLista,#autLista)>.card:only-child{grid-column:1/-1}
  #facLista>.card{grid-column:1/-1}
  /* ventanas de detalle centradas */
  .modal{align-items:center;padding:24px}
  .modal-box{max-width:860px;border-radius:16px;max-height:88vh}
  #mapa{height:72vh}
}
@media (min-width:1024px){
  /* menú fijo a la izquierda cuando hay sesión */
  #app:has(>#topbar:not(.hidden)){max-width:none;padding-left:240px}
  #app:has(>#topbar:not(.hidden)) #btnMenu{display:none}
  #app:has(>#topbar:not(.hidden)) nav#menu{display:block!important;inset:0 auto 0 0;width:240px;background:#fff;border-right:1px solid var(--borde);z-index:20}
  #app:has(>#topbar:not(.hidden)) .menu-box{width:100%;max-width:none;box-shadow:none}
  .menu-box button:hover{background:#f6f4f1}
  header#topbar{padding-left:24px;padding-right:24px}
  main{max-width:1400px;margin:0 auto;padding:20px 24px}
  #view-login{max-width:440px;margin:0 auto}
  #view-nuevo{max-width:1000px}
  #misLista,#autLista,#facLista,#prLista,#carLista,#visHoy,#taLista,#proVigentes,#avLista,#apListaAdm,#saLista{grid-template-columns:repeat(auto-fill,minmax(380px,1fr))}
  #avCards{grid-template-columns:repeat(auto-fill,minmax(520px,1fr))}
  /* mapa grande con la lista de "sin ubicar" a un lado */
  #view-mapa:not(.hidden){display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:0 12px;align-items:start}
  #view-mapa>.card{grid-column:1/-1}
  #view-mapa #mapa{height:calc(100vh - 230px);min-height:480px}
  #view-mapa:has(#mapSinUbicar:empty) #mapa{grid-column:1/-1}
  #mapSinUbicar{max-height:calc(100vh - 230px);overflow:auto}
  #mapSinUbicar>.card{margin:0}
  table{font-size:14px}
}
@media (min-width:768px){#avCards .kpi.cuatro{grid-template-columns:repeat(2,1fr)}}

/* v67: botón de cancelar pedido (rojo, mismo estilo que los demás) */
button.sec.peligro{color:var(--rojo);border-color:#ecbcb6;background:#fff}
button.sec.peligro:hover{background:var(--rojoF)}

/* v73: cotizaciones */
.est.cotizacion{background:#ece6f6;color:#5b3a8c}

/* número de cliente Intelisis al inicio, letra normal */
.cli-num { font-weight: 400; color: var(--vino); margin-right: 2px; }
/* títulos de tablas fijos al bajar (v102): las tablas largas tienen su propio scroll y el encabezado se queda arriba */
thead th{position:sticky;top:0;z-index:2;background:var(--tarjeta);box-shadow:inset 0 -1px 0 var(--borde)}
div[style*="overflow:auto"]:has(> table){max-height:75vh}
/* v107: en PC usar todo el ancho (sin franjas blancas a los lados) y tablas sin desplazamiento lateral cuando caben */
@media (min-width:1024px){
  main{max-width:none}
  #view-nuevo{max-width:1200px}
  .card div[style*="overflow:auto"]{overflow-x:auto;overflow-y:auto}
  th,td{padding:8px 10px}
  td small{white-space:normal}
}

/* v108: menú por secciones desplegables */
.menu-box .mgrupo{display:flex;flex-direction:column}
.menu-box button.mgrupo-tit{display:flex;justify-content:flex-start;align-items:center;padding:13px 16px 9px;font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--vino);background:#faf8f6;border-bottom:1px solid var(--borde)}
.menu-box button.mgrupo-tit::after{content:"▾";font-size:13px;color:var(--sub);margin-left:auto;order:2}
.mgrupo.cerrado>button.mgrupo-tit::after{content:"▸"}
.mgrupo.cerrado>.mgrupo-items{display:none}
.mgrupo-items{display:flex;flex-direction:column}
.mgrupo-items>button{padding-left:24px!important}
.mgrupo:not(:has(.mgrupo-items>button:not(.hidden))){display:none}
.mgrupo.cerrado:has(.mgrupo-items>button:not(.hidden) .badge:not(.hidden))>button.mgrupo-tit::before{content:"●";color:var(--rojo);font-size:10px;margin-left:8px;order:1}
.mgrupo.cerrado:has(.mgrupo-items>button.active)>button.mgrupo-tit{color:var(--vino)}
/* v110: recomendaciones con scroll propio (4–5 a la vista) */
.reco-scroll{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding-right:4px;border-bottom:1px dashed var(--borde);
  -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent)}
.reco-mas{text-align:center;margin:4px 0 2px;font-weight:600;color:var(--vino)}
.reco-mas.fin{font-weight:400;color:var(--sub)}
.reco-scroll.al-final{-webkit-mask-image:none;mask-image:none}
/* v111: barra "ver como" (admin viendo la app como otro usuario, solo lectura) */
#verComoBar{position:fixed;top:0;left:0;right:0;z-index:3000;display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;
  background:#f4b400;color:#1f1d1c;padding:8px 14px;font-size:14px;box-shadow:0 2px 6px rgba(0,0,0,.2)}
#verComoBar button{background:#1f1d1c;color:#fff;border:0;border-radius:8px;padding:6px 12px;font-weight:600;cursor:pointer}
body.ver-como{padding-top:var(--vc-h,44px)}
body.ver-como #app nav#menu{top:var(--vc-h,44px)!important}
/* v112: nada se sale a los lados en el cel — las tablas anchas se deslizan dentro de su recuadro */
.tabla-scroll{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
html,body{overflow-x:clip}
body{overflow-wrap:break-word}
.kpi{grid-template-columns:repeat(3,minmax(0,1fr))}
.kpi.cuatro{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:600px){.kpi.cuatro{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:768px){#avCards .kpi.cuatro{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kpi b{font-size:clamp(13px,4.3vw,17px);overflow-wrap:anywhere}
@media (min-width:600px){.kpi b{font-size:17px}}
/* v113: login con "ver contraseña" y recordar usuario */
.pass-wrap{position:relative;display:block}
.pass-wrap input{padding-right:46px}
.ver-pass{position:absolute;right:4px;top:calc(50% + 2px);transform:translateY(-50%);background:none;border:0;font-size:18px;padding:6px 8px;cursor:pointer;width:auto;margin:0}
#loginForm .chk{margin:8px 0 10px}
/* v115: INICIO renovado */
.ini-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin:4px 2px 14px}
.ini-head h2{margin:0;font-size:22px;color:var(--vino);letter-spacing:-.2px}
.ini-head .sub{font-size:13.5px;color:var(--sub);margin-top:2px}
.ini-sync{font-size:12.5px;color:var(--sub);background:#fff;border:1px solid var(--borde);border-radius:999px;padding:5px 12px;display:flex;align-items:center;gap:6px}
.ini-sync:empty{display:none}
.ini-sync .punto{width:8px;height:8px;border-radius:50%;background:var(--verde);display:inline-block}
.ini-hero{padding:18px;display:grid;gap:18px;border-radius:16px}
.ini-et{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--sub);font-weight:600}
.ini-big{font-size:clamp(28px,8vw,38px);font-weight:700;color:var(--vino);letter-spacing:-.5px;line-height:1.15;margin:4px 0 6px}
.ini-cmp{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ini-cmp .sub{font-size:13px;color:var(--sub)}
.chip-var{display:inline-flex;align-items:center;gap:3px;font-size:12.5px;font-weight:700;padding:3px 8px;border-radius:999px;white-space:nowrap}
.chip-var.sube{background:var(--verdeF);color:var(--verde)}
.chip-var.baja{background:var(--rojoF);color:var(--rojo)}
.ini-mini{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.ini-mini>div{flex:1;min-width:90px;background:#f6f4f1;border-radius:10px;padding:8px 10px}
.ini-mini span{display:block;font-size:11.5px;color:var(--sub);text-transform:uppercase;letter-spacing:.4px}
.ini-mini b{font-size:17px;color:var(--texto)}
.ini-mini small{display:block;font-size:11.5px}
.ini-avance{margin-top:14px}
.ini-avance .sub{font-size:12.5px;color:var(--sub);margin-bottom:6px}
.barra{position:relative;display:block;height:8px;background:#ece8e3;border-radius:999px;overflow:visible}
.barra>i{position:absolute;inset:0 auto 0 0;background:var(--vino);border-radius:999px}
.barra>em{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--amar);border-radius:2px}
.barra.mini{height:5px;margin-top:8px}
.barra.mini>i{background:var(--rojo)}
.ini-canales{display:grid;gap:6px;margin-top:14px;border-top:1px solid var(--borde);padding-top:12px}
.ini-canales>div{display:grid;grid-template-columns:1fr auto 74px;align-items:center;gap:8px;font-size:14px}
.ini-canales b{font-variant-numeric:tabular-nums}
.ini-canales .chip-var{justify-self:end}
.ini-hero-graf{min-width:0}
.g-ley{display:flex;gap:14px;align-items:center;font-size:12.5px;color:var(--sub);margin-bottom:6px;flex-wrap:wrap}
.g-ley span{display:inline-flex;align-items:center;gap:6px}
.g-sw{display:inline-block;width:14px;height:3px;border-radius:2px;background:var(--vino);vertical-align:middle;margin-right:4px}
.g-sw.ant{background:repeating-linear-gradient(90deg,#a39d97 0 4px,transparent 4px 7px)}
.g-caja{position:relative}
.g-svg{width:100%;height:190px;display:block;overflow:visible;touch-action:pan-y}
.g-grid{stroke:#ece8e3;stroke-width:1;vector-effect:non-scaling-stroke}
.g-base{stroke:#d9d3cc;stroke-width:1;vector-effect:non-scaling-stroke}
.g-eje{font-size:11px;fill:#8a8582}
.g-ant{fill:none;stroke:#a39d97;stroke-width:2;stroke-dasharray:5 4;vector-effect:non-scaling-stroke}
.g-act{fill:none;stroke:var(--vino);stroke-width:2.5;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.g-area{fill:var(--vino);opacity:.08}
.g-pto{fill:var(--vino);stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke}
.g-cruz{stroke:#b9b2ab;stroke-width:1;stroke-dasharray:3 3;vector-effect:non-scaling-stroke}
.g-tip{position:absolute;top:0;width:150px;background:#fff;border:1px solid var(--borde);border-radius:10px;box-shadow:0 4px 14px rgba(0,0,0,.12);padding:8px 10px;font-size:12.5px;pointer-events:none;line-height:1.5}
.ini-sec{margin-bottom:14px}
.ini-tit{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:8px}
.ini-tit b{font-size:15.5px}
.ini-tit .link{font-size:13px;padding:0}
.ini-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:14px}
.ini-tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:2px;background:#fff;border:1px solid var(--borde);border-radius:14px;padding:12px 12px 12px 14px;font:inherit;color:inherit;min-width:0;overflow:hidden}
button.ini-tile{cursor:pointer;width:auto;margin:0}
button.ini-tile:hover{border-color:#cfc8c0;box-shadow:0 2px 10px rgba(0,0,0,.05)}
.ini-tile::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--gris)}
.ini-tile.t-bien::before{background:var(--verde)}.ini-tile.t-aviso::before{background:var(--amar)}.ini-tile.t-alerta::before{background:var(--rojo)}.ini-tile.t-neutro::before{background:var(--vino)}
.ini-tile .ico{font-size:16px;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:#f3f0ec;margin-bottom:4px}
.ini-tile.t-bien .ico{background:var(--verdeF);color:var(--verde);font-weight:700}.ini-tile.t-aviso .ico{background:var(--amarF)}.ini-tile.t-alerta .ico{background:var(--rojoF)}
.t-et{font-size:12px;color:var(--sub);text-transform:uppercase;letter-spacing:.4px;font-weight:600}
.t-val{font-size:clamp(18px,5.4vw,24px);font-weight:700;color:var(--texto);line-height:1.2;overflow-wrap:anywhere}
.t-sub{font-size:12px;color:var(--sub);line-height:1.35}
.ini-tile .barra.mini{width:100%}
.ini-cols{display:grid;gap:12px}
.ini-cols>.card{margin:0}
.ini-vis{display:grid;grid-template-columns:80px 1fr auto;gap:10px;align-items:center;margin-top:8px;font-size:14px}
.ini-vis .barra>i{background:var(--verde)}
.ini-vis .sub{font-size:12.5px;color:var(--sub)}
.ini-aviso{font-size:13.5px;margin-top:8px;padding:6px 10px;border-left:3px solid var(--vino);background:#f8f6f3;border-radius:0 8px 8px 0}
@media (min-width:600px){.ini-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:1024px){
  #view-inicio{max-width:1320px}
  .ini-hero{grid-template-columns:minmax(300px,420px) minmax(0,1fr);align-items:start;padding:22px 24px}
  .ini-hero-graf{padding-top:4px}
  .g-svg{height:250px}
  .ini-cols{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
}
@media (min-width:600px){.ini-tiles.tres{grid-template-columns:repeat(3,minmax(0,1fr))}}
.g-svg{height:auto;max-width:100%}
@media (max-width:599px){.ini-tiles.tres>:nth-child(3){grid-column:1/-1}}
/* v116: metas, comparaciones por días hábiles, alertas y tiendas */
.ini-cmp{gap:6px}
.chip-var em{font-style:normal;font-weight:500;opacity:.85}
.ini-nota{font-size:12px!important;color:var(--sub);margin-top:6px;line-height:1.35}
.meta-blk{margin-top:14px}
.meta-top{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--sub);margin-bottom:6px}
.meta-top b{font-size:18px;color:var(--texto)}
.barra.meta{height:12px}
.barra.meta>i{background:var(--vino)}
.meta-blk.adelante .barra>i,.meta-blk.lograda .barra>i{background:var(--verde)}
.meta-blk.cerca .barra>i{background:var(--amar)}
.meta-blk.atras .barra>i{background:var(--rojo)}
.barra.meta>em{top:-4px;bottom:-4px;width:3px;background:var(--texto);border-radius:2px}
.meta-txt{font-size:13px;color:var(--sub);margin-top:6px;line-height:1.4}
.meta-blk.atras .meta-txt b{color:var(--rojo)}.meta-blk.adelante .meta-txt b,.meta-blk.lograda .meta-txt{color:var(--verde)}
.ini-sinmeta{margin-top:12px;font-size:13px;color:var(--sub);background:#f6f4f1;border-radius:10px;padding:8px 10px}
.ini-sinmeta .link{font-size:13px;padding:0}
.ini-mini .dest{background:#eef1f7}
.g-sw.meta{background:repeating-linear-gradient(90deg,var(--amar) 0 2px,transparent 2px 5px)}
.g-meta{fill:none;stroke:var(--amar);stroke-width:2;stroke-dasharray:2 4;stroke-linecap:round;vector-effect:non-scaling-stroke}
.ini-equipo{padding:16px}
.eq-fila{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"nom var" "av av";gap:4px 10px;padding:10px 0;border-top:1px solid var(--borde)}
.eq-fila:first-of-type{border-top:0}
.eq-nom{grid-area:nom;display:flex;flex-direction:column;min-width:0}
.eq-nom .sub{font-size:12.5px;color:var(--sub)}
.eq-av{grid-area:av;min-width:0}
.eq-av .meta-blk{margin-top:2px}
.eq-av .meta-top{margin-bottom:4px}.eq-av .meta-top b{font-size:14px}
.eq-av .barra.meta{height:8px}
.eq-var{grid-area:var;align-self:start}
.al-fila{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--borde)}
.al-fila:first-of-type{border-top:0}
.al-fila[data-hist]{cursor:pointer}
.al-fila .sub{font-size:12.5px;color:var(--sub);margin-top:2px}
.al-fila .num{text-align:right;white-space:nowrap;display:flex;flex-direction:column}
.al-fila .num .sub{font-size:11.5px}
.cart-barra{display:flex;gap:2px;height:14px;border-radius:7px;overflow:hidden;background:#ece8e3;margin:6px 0 10px}
.cart-barra i{display:block;min-width:3px}
.ct0{background:#7fb995}.ct1{background:#f0c36a}.ct2{background:#e59a52}.ct3{background:#d4683f}.ct4{background:#a8322a}
.cart-ley{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:6px 10px}
.cart-ley>div{display:grid;grid-template-columns:10px 1fr;column-gap:6px;align-items:center;font-size:12.5px}
.cart-ley i{width:10px;height:10px;border-radius:3px;grid-row:span 3}
.cart-ley span{color:var(--sub)}.cart-ley b{font-size:14px}.cart-ley small{color:var(--sub)}
.mt-tabla td,.mt-tabla th{vertical-align:middle}
.mt-tabla input{margin:0;min-width:130px}
.mt-tabla .mt-total td{background:#f6f4f1}
.mt-tabla small{color:var(--sub)}
.mi-meta .mi-meta-num{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tienda-hero{grid-template-columns:1fr!important}
.barras-dia{display:flex;gap:3px;align-items:flex-end;height:150px;padding-top:6px}
.bd{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0;height:100%}
.bd-col{position:relative;flex:1;width:100%;display:flex;align-items:flex-end}
.bd-col i{display:block;width:100%;background:var(--vino);border-radius:4px 4px 0 0;min-height:1px}
.bd-col i.ok{background:var(--verde)}
.bd-col em{position:absolute;left:-1px;right:-1px;height:2px;background:var(--amar)}
.bd.futuro .bd-col i{background:transparent}
.bd.domingo{opacity:.4}
.bd small{font-size:9.5px;color:var(--sub)}
/* en el cel primero lo que hay que atender */
@media (max-width:1023px){
  #view-inicio:not(.hidden){display:flex;flex-direction:column}
  #iniHead{order:0}#iniPend{order:1}#iniVenta{order:2}#iniFact{order:3}#iniCards{order:4}
}
@media (min-width:1024px){
  .eq-fila{grid-template-columns:minmax(160px,220px) minmax(0,1fr) 150px;grid-template-areas:"nom av var";align-items:center}
  .eq-var{align-self:center;justify-self:end}
  .ini-cols{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.ini-tit .sub{font-size:12.5px;color:var(--sub);font-weight:400;text-align:right}
.ini-tit .sub .g-sw{vertical-align:middle}
#mtCrec{max-width:110px}
.cart-sub{font-size:13px;color:var(--sub);margin:12px 0 2px}
.mt-pasos{margin:8px 0 6px 18px;padding:0;font-size:13.5px;line-height:1.5}
.mt-pasos li{margin-bottom:3px}
.reto-et{color:var(--amar);font-weight:600}
#mtCrec,#mtReto{max-width:120px}
.mt-regla{color:var(--sub);font-size:11px}
/* v119: mi tienda completa */
.mtd-tk>div{display:flex;flex-direction:column;gap:3px;align-items:flex-start}
.mtd-tk span.chip-var{display:inline-flex;flex-wrap:wrap;font-size:11px;padding:2px 7px;text-transform:none;letter-spacing:0;white-space:normal;line-height:1.25}
.mtd-tk span.chip-var.sube{color:var(--verde)}.mtd-tk span.chip-var.baja{color:var(--rojo)}
.mtd-tk span.chip-var em{font-size:10.5px}
@media (max-width:599px){.mtd-tk>div{min-width:calc(50% - 5px)}}
.mtd-nota{font-size:12.5px;margin-top:10px}
.mtd-yo .eq-nom b{color:var(--vino)}
.barra.meta.mtd-ok>i{background:var(--verde)}
.mtd-bod{color:var(--verde);font-size:13px}.mtd-sin{color:var(--rojo);font-size:13px}
#view-mitienda .ini-cols,#iniTienda .ini-cols{margin-bottom:12px}
/* v121: globo de Inicio (General / tiendas) */
.ini-switch{display:flex;gap:6px;margin:0 0 12px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ini-switch::-webkit-scrollbar{display:none}
.ini-switch button{flex:0 0 auto;width:auto;margin:0;border:1px solid var(--borde);background:#fff;color:var(--texto);border-radius:999px;padding:7px 14px;font:inherit;font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap}
.ini-switch button.on{background:var(--vino);border-color:var(--vino);color:#fff}
.ini-switch:empty{display:none}
@media (max-width:1023px){#iniSwitch{order:-1}#iniTienda{order:5}}
@media (max-width:599px){.ini-switch button{flex:1 1 0;min-width:0;padding:7px 6px;font-size:13px;overflow:hidden;text-overflow:ellipsis}}
.ini-switch .sw-ic{font-style:normal;margin-right:5px}
@media (max-width:419px){.ini-switch .sw-ic{display:none}}
/* v122: traspasos */
.tr-pedir{width:auto;margin:0 0 2px;padding:6px 10px;font-size:13px}
.tr-form{background:#f6f4f1;border-radius:10px;padding:10px;margin:2px 0 8px}
.tr-form .fila{gap:8px;margin-top:6px}.tr-form input{margin:0}.tr-form button{width:auto;margin:0}
.tr-est{font-size:13px}.tr-est.pendiente{color:var(--amar)}.tr-est.surtido{color:var(--verde)}.tr-est.rechazado{color:var(--rojo)}.tr-est.cancelado{color:var(--sub)}
.tr-acc{display:flex;gap:10px;justify-content:flex-end}
/* v123: comisión por línea y por pedido */
.com-chip{display:inline-block;font-size:12px;font-weight:600;padding:1px 8px;border-radius:999px;background:#fff;border:1.5px solid #ccc;color:var(--texto)}
.com-chip.verde{border-color:var(--verde);color:var(--verde)}
.com-chip.amarillo{border-color:var(--amar);color:var(--amar)}
.com-chip.rojo{border-color:var(--rojo);color:var(--rojo)}
.com-chip.especial{border-color:#1d4f9a;color:#1d4f9a}
.com-chip b{font-weight:700}
.com-tot{display:grid;grid-template-columns:1fr auto;gap:0 10px;align-items:baseline;background:#f3f8f4;border:1px solid #d5e9db;border-radius:10px;padding:8px 12px;margin:8px 0}
.com-tot b{font-size:17px;color:var(--verde)}
.com-tot small{grid-column:1/-1;color:var(--sub);font-size:12px}
.banco-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:4px 16px}
.banco-grid h4{margin:8px 0 2px;font-size:14px}
.com-mezcla{display:grid;grid-template-columns:1fr auto;gap:0 10px;align-items:baseline;border-radius:10px;padding:8px 12px;margin:8px 0 0}
.com-mezcla.ok{background:var(--verdeF)}.com-mezcla.ok b{color:var(--verde)}
.com-mezcla.baja{background:var(--rojoF)}.com-mezcla.baja b{color:var(--rojo)}
.com-mezcla b{font-size:17px}.com-mezcla small{grid-column:1/-1;color:var(--sub);font-size:12px}
.kpi.tres{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:420px){.kpi.tres{grid-template-columns:1fr 1fr}.kpi.tres>:nth-child(3){grid-column:1/-1}}
/* v126: en PC "Mi venta" y la tarjeta de la vendedora lado a lado (las facturas quedan más arriba) */
@media (min-width:1024px){
  #avTop:has(#avMeta:not(:empty)){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start;margin-bottom:12px}
  #avTop:has(#avMeta:not(:empty)):has(#avCards>.card:only-child){align-items:stretch}
  #avTop:has(#avMeta:not(:empty)) #avMeta>.card,#avTop:has(#avMeta:not(:empty)) #avCards>.card{margin:0;height:100%}
  #avTop:has(#avMeta:not(:empty)) #avCards{grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr}
}
/* ===== v128: TEMA GENERAL — misma línea en toda la app =====
   Tarjetas: mismo radio, aire y sombra suave; título de tarjeta igual en todas; en filas de PC las tarjetas
   miden lo mismo (grid con stretch) y su contenido se reparte en columna; estados vacíos dentro de tarjeta. */
:root{--radio:16px;--sombra:0 1px 2px rgba(27,43,71,.05),0 4px 14px rgba(27,43,71,.04)}
.card{border-radius:var(--radio);padding:16px 18px;box-shadow:var(--sombra)}
.card>b:first-child{display:block;font-size:15.5px;margin-bottom:8px;color:var(--texto)}
.card>b:first-child+.sub{margin-top:-4px}
.card.vacio{color:var(--sub);text-align:center;padding:22px 18px}
.card .sub{line-height:1.45}
/* en filas (PC/tablet) cada tarjeta ocupa toda la altura de su fila y empuja abajo los enlaces/botones */
@media (min-width:768px){
  :is(#misLista,#autLista,#facLista,#prLista,#carLista,#visHoy,#taLista,#proVigentes,#avLista,#avCards,#apListaAdm,#saLista,.ini-cols)>.card{height:100%;display:flex;flex-direction:column}
  :is(#misLista,#autLista,#facLista,#prLista,#carLista,#visHoy,#taLista,#proVigentes,#avLista,#avCards,#apListaAdm,#saLista,.ini-cols)>.card>:last-child:is(button,.link){margin-top:auto;align-self:flex-start}
  #avTop .mi-meta{display:flex;flex-direction:column}
  #avTop .mi-meta .meta-blk{margin-top:auto}
}
/* mosaicos de cifras (kpi) con la misma altura y texto centrado */
.kpi>div{display:flex;flex-direction:column;justify-content:center;min-height:68px}
/* textos secundarios: mismo tamaño y color en toda la app (las reglas específicas mandan) */
.sub{font-size:13.5px;color:var(--sub)}
.aviso .sub,.prov-head .sub{color:inherit}
.mi-meta-mini{margin:12px 0 4px}
.mi-meta-mini .chip-var{font-size:12px;padding:2px 7px}
.card.vacio{grid-column:1/-1}
/* ===== v129: sin subrayados — los enlaces de acción son "globos" (pastillas) ===== */
button.link{display:inline-flex;align-items:center;gap:4px;width:auto;margin:2px 0;padding:5px 12px;border-radius:999px;border:1px solid transparent;
  background:#eef1f6;color:var(--vino);font-size:13px;font-weight:600;line-height:1.2;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .15s,border-color .15s}
button.link:hover{background:#e0e6f0;border-color:#cfd7e4}
button.link:disabled{opacity:.5;cursor:default}
button.link.peligro{background:var(--rojoF);color:var(--rojo)}
button.link.peligro:hover{background:#f7d2cd;border-color:#efb8b0}
button.link.ok{background:var(--verdeF);color:var(--verde)}
button.link.ok:hover{background:#cfeedb;border-color:#b5e2c5}
button.link.cerrar{background:#f1eeea;color:var(--sub)}
.ini-tit .link,.ini-sinmeta .link{font-size:12.5px;padding:4px 11px}
/* títulos de sección con su globo a la derecha, alineados */
.ini-tit{align-items:center}
/* enlaces <a> (mapa, WhatsApp, teléfono, foto): sin subrayado, también en globo; los que ya son botón (.sec) o fotos no cambian */
a:not(.sec):not([data-q]):not(:has(img)){display:inline-flex;align-items:center;padding:3px 10px;margin:1px 0;border-radius:999px;background:#eef1f6;color:var(--vino);font-weight:600;font-size:.92em;text-decoration:none;white-space:nowrap}
a:not(.sec):not([data-q]):not(:has(img)):hover{background:#e0e6f0}
a.sec{text-decoration:none}
#modalBox>button.link.cerrar:last-child{display:flex;margin:14px auto 2px;padding:7px 22px}
/* v131: en PC el nombre ya está arriba del menú fijo; no se repite en la barra (en cel sí, porque el menú está oculto) */
@media (min-width:1024px){#app:has(>#topbar:not(.hidden)) #whoNombre{display:none}}

/* ===== v132: PORTAL DE CLIENTES (B2B) ===== */
.pill.portal{background:#e6f0fb;color:#1f4f8a;font-weight:600}
body.tema-cliente #app{padding-bottom:84px}
.p-hero{background:linear-gradient(135deg,var(--vino),var(--vino2));color:#fff;border:0}
.p-hero .sub,.p-hero .p-cli{color:rgba(255,255,255,.85)}
.p-hero .p-cli select{margin-top:4px}
.p-hero button.primary{background:#fff;color:var(--vino);margin-top:12px}
.p-hola{font-size:22px;font-weight:700}
.p-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}
.p-tile{background:#fff;border:1px solid var(--borde);border-radius:14px;padding:12px;cursor:pointer;display:flex;flex-direction:column;gap:2px;min-height:86px}
.p-tile small{color:var(--sub);font-size:12px}.p-tile b{font-size:19px;color:var(--vino)}.p-tile span{font-size:12.5px;color:var(--sub)}
.p-tile.t-rojo{border-color:#f0b9b2;background:var(--rojoF)}.p-tile.t-rojo b{color:var(--rojo)}
.p-tile.t-promo{border-color:#bfe3cc;background:var(--verdeF)}.p-tile.t-promo b{color:var(--verde)}
.p-carrusel{display:flex;gap:10px;overflow-x:auto;padding:8px 2px 4px;scroll-snap-type:x mandatory}
.p-mini{flex:0 0 140px;scroll-snap-align:start;border:1px solid var(--borde);border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:4px;background:#fff}
.p-mini img{width:100%;height:110px;object-fit:contain;cursor:pointer}
.p-mini-n{font-size:12.5px;line-height:1.25;height:2.5em;overflow:hidden}.p-mini-p{font-weight:700;color:var(--vino)}.p-mini-p small{font-weight:400;color:var(--sub)}
.p-mini button.sec{padding:6px;font-size:13px}
img.sin{opacity:.25;padding:18px}
.p-asesor{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:6px}
.p-asesor a.sec{text-decoration:none;padding:8px 12px;border:1px solid var(--borde);border-radius:8px;color:var(--vino);font-size:14px}
.p-cat-top{position:sticky;top:0;z-index:4}
.p-chips{display:flex;gap:6px;overflow-x:auto;padding:2px 0 8px}
.p-chip{flex:none;border:1px solid var(--borde);background:#fff;border-radius:18px;padding:6px 12px;font-size:13px;cursor:pointer;white-space:nowrap}
.p-chip.on{background:var(--vino);border-color:var(--vino);color:#fff}
.p-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.p-art{background:#fff;border:1px solid var(--borde);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.p-art.agot{opacity:.6}
.p-foto{position:relative;background:#fff;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;cursor:pointer;border-bottom:1px solid var(--borde)}
.p-foto img{max-width:100%;max-height:100%;object-fit:contain}
.p-badge{position:absolute;left:8px;font-size:11px;font-weight:700;padding:2px 8px;border-radius:10px}
.p-badge.p-promo{top:8px;background:var(--verde);color:#fff}
.p-badge.pocas{bottom:8px;background:var(--amarF);color:var(--amar)}
.p-badge.agotado{bottom:8px;background:var(--rojoF);color:var(--rojo)}
.p-info{padding:10px;display:flex;flex-direction:column;gap:3px;flex:1}
.p-nom{font-size:13.5px;font-weight:600;line-height:1.25;cursor:pointer}
.p-marca{font-size:12px;color:var(--sub)}
.p-precio{font-size:17px;font-weight:800;color:var(--vino);margin-top:2px}.p-precio small{font-size:11.5px;font-weight:400;color:var(--sub)}
.p-precio s{font-size:12.5px;font-weight:400;color:var(--sub)}.p-precio.grande{font-size:22px;margin-top:8px}
.p-caja{font-size:12.5px;color:var(--sub)}.p-vig{font-size:11.5px;color:var(--verde)}
.p-cant{display:flex;flex-direction:column;gap:6px;margin-top:auto;padding-top:6px}
.p-cant select{margin:0;padding:6px 8px;font-size:13px}
.p-step{display:flex;align-items:center;border:1px solid var(--borde);border-radius:10px;overflow:hidden}
.p-step button{width:38px;height:36px;border:0;background:#f4f1ed;font-size:18px;cursor:pointer;color:var(--vino)}
.p-step input{margin:0;border:0;border-radius:0;text-align:center;padding:6px 2px;font-size:16px;font-weight:700;min-width:0}
.p-mas{grid-column:1/-1;text-align:center;color:var(--sub);padding:16px;cursor:pointer}
.p-carrito-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(12px + env(safe-area-inset-bottom));width:min(696px,calc(100% - 24px));background:var(--vino);color:#fff;border-radius:14px;padding:10px 12px;display:flex;justify-content:space-between;align-items:center;gap:10px;z-index:20;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.p-carrito-bar button{background:#fff;color:var(--vino);border:0;border-radius:10px;padding:9px 14px;font-weight:700;font-size:14px;cursor:pointer;flex:none}
.p-carrito{margin:10px 0}
.p-cl{display:flex;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--borde)}
.p-cl img{width:52px;height:52px;object-fit:contain;flex:none}
.p-cl-i{flex:1;min-width:0}.p-cl-t{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex:none}
.p-cl-t button.sec{padding:5px 8px;font-size:12.5px}
.p-det h3{margin-top:10px}
.p-det-fotos{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory}
.p-det-foto{flex:0 0 100%;width:100%;max-height:340px;object-fit:contain;scroll-snap-align:center}
.p-atr{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.p-atr span{background:#f6f4f1;border-radius:10px;padding:6px 10px;font-size:13px}.p-atr small{display:block;color:var(--sub);font-size:11px}
.p-ok{text-align:center;padding:10px 0}.p-ok-i{width:64px;height:64px;border-radius:50%;background:var(--verdeF);color:var(--verde);font-size:34px;line-height:64px;margin:0 auto 8px}
.p-pasos{display:flex;gap:4px;margin-top:8px}
.p-pasos span{flex:1;text-align:center;font-size:10.5px;color:var(--sub);border-top:4px solid #e7e2dc;padding-top:4px}
.p-pasos span.ok{color:var(--verde);border-top-color:var(--verde);font-weight:600}
.p-fac{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--borde)}
.card.p-fac{padding:12px 14px;border-bottom:1px solid var(--borde)}
.p-docs{display:flex;gap:6px;flex:none}.p-docs button.sec{padding:6px 10px;font-size:13px;font-weight:600;color:var(--vino)}
.p-uuid{font-size:11px;word-break:break-all}
.p-acuse{width:100%;max-height:260px;object-fit:cover;border-radius:10px;margin-top:8px}
.p-banco{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:8px 0}
.p-banco>div small{display:block;color:var(--sub);font-size:11.5px}.p-banco>.sub,.p-banco>.ancho{grid-column:1/-1}
body.tema-cliente textarea{font:inherit}
#view-pcatalogo .fila{flex-wrap:wrap}#view-pcatalogo .fila>label{min-width:200px}
.kpi div.rojo b{color:var(--rojo)}
.p-barras{display:flex;align-items:flex-end;gap:4px;height:130px;margin-top:10px}
.p-barras>div{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:3px}
.p-barras span{display:block;width:100%;background:var(--vino2);border-radius:6px 6px 0 0;min-height:2px}
.p-barras small{font-size:10.5px;color:var(--sub)}
.p-cta{cursor:pointer}.p-cta.inact{opacity:.6}
.p-chips-cli{display:flex;flex-wrap:wrap;gap:6px;margin:-4px 0 10px}
@media (min-width:600px){.p-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.p-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:1024px){.p-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.p-carrito-bar{width:min(900px,calc(100% - 300px));left:calc(50% + 130px)}}
#paPre td:nth-child(2),#paPre th:nth-child(2){text-align:left}
#view-portaladm textarea{font:inherit}
/* v135: fotos del catálogo más chicas (alto fijo) y sin foto = silueta chica en gris */
.p-foto{aspect-ratio:auto;height:120px;padding:8px}
.p-foto img{width:100%;height:100%;object-fit:contain}
.p-foto img.sin{width:30px;height:64px;padding:0;opacity:.18}
.p-mini img.sin{padding:28px 0;opacity:.18}
.p-cl img.sin{padding:8px 14px;opacity:.18}
.p-det-foto.sin{max-height:110px;padding:16px 0;opacity:.18}
@media (min-width:600px){.p-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}.p-foto{height:130px}}
@media (min-width:1024px){.p-grid{grid-template-columns:repeat(auto-fill,minmax(185px,1fr))}}
/* v136: carrusel "Lo que sueles comprar" con flechas, rueda del mouse y barra visible */
.p-car-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.p-car-nav{display:flex;gap:6px;align-items:center;flex:none}
.p-car-nav button.sec{width:34px;height:34px;padding:0;font-size:20px;line-height:1;border-radius:50%;margin:0}
.p-car-nav button.sec:disabled{opacity:.3;cursor:default}
.p-car-nav button.link{margin:0;padding:4px 6px;font-size:13px}
.p-carrusel{scrollbar-width:thin;scrollbar-color:#d9d2ca transparent;padding-bottom:8px}
.p-carrusel::-webkit-scrollbar{height:6px}.p-carrusel::-webkit-scrollbar-thumb{background:#d9d2ca;border-radius:3px}
@media (hover:hover) and (pointer:fine){.p-carrusel{scroll-snap-type:none}}
@media (hover:none){.p-car-nav button.sec{display:none}}
/* v137: escáner de códigos de barras con la cámara (Nuevo pedido) */
.art-buscar{display:flex;gap:8px;align-items:flex-end}.art-buscar>label{flex:1;min-width:0}
.art-buscar>button.sec{flex:none;width:52px;height:43px;font-size:22px;padding:0;margin-bottom:10px}
.esc-cam{position:relative;margin-top:8px;border-radius:10px;overflow:hidden;background:#000}
.esc-cam video{width:100%;height:42vh;max-height:340px;display:block;object-fit:cover}
.esc-guia{position:absolute;left:8%;right:8%;top:32%;bottom:32%;border:2px solid rgba(255,255,255,.9);border-radius:8px;box-shadow:0 0 0 999px rgba(0,0,0,.28);pointer-events:none}
.esc-msg{margin-top:6px;min-height:22px}.esc-ok{color:var(--verde)}
.esc-lista{max-height:22vh;overflow:auto;margin-top:4px}
.esc-lista div{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--borde);font-size:14px}.esc-lista b{flex:none}
/* v138: códigos de caja */
.cc-art{padding:12px 14px}
.cc-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.cc-nom{min-width:0}
.cc-btns{display:flex;gap:6px;flex:none}.cc-btns button.sec{width:44px;height:40px;padding:0;font-size:19px}
.cc-cods{display:flex;flex-direction:column;gap:3px;margin-top:6px;font-size:13px;color:var(--sub)}.cc-cods b{color:var(--texto);word-break:break-all}
.cc-ok{color:var(--verde)}.cc-pend{color:var(--amar)}.cc-sin{color:var(--rojo);font-weight:600}
.cc-cods button.link{padding:0 4px;font-size:13px}
.cc-conf{display:flex;flex-direction:column;gap:8px;margin:10px 0}
.cc-cod{font-size:22px;font-weight:800;letter-spacing:1px;color:var(--vino);word-break:break-all;margin:6px 0}
.cc-resp{max-height:45vh;overflow:auto}.cc-resp>div{padding:8px 4px;border-bottom:1px solid var(--borde);cursor:pointer}.cc-resp small{display:block;color:var(--sub)}
/* inventario físico (v139) */
.iv-tit{display:flex;justify-content:space-between;align-items:center;gap:8px}
.iv-abierto{cursor:pointer;border-color:var(--verde)}
.iv-sitios{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.iv-sitios button{width:auto}
.iv-hist{display:flex;justify-content:space-between;gap:8px;padding:9px 2px;border-bottom:1px solid var(--borde);cursor:pointer}
.iv-reglas{margin:8px 0 10px 18px;padding:0;font-size:13px;color:var(--sub)}
.iv-cab .link{padding:0;margin-bottom:4px}
.iv-tabs{display:flex;margin:10px -14px -14px;border-top:1px solid var(--borde)}
.iv-busca{display:flex;gap:8px;align-items:flex-end}.iv-busca label{flex:1;margin-bottom:0;min-width:0}.iv-busca button.primary{width:auto;flex:none;margin:0;padding:11px 14px}
.iv-contar>.sub{margin-top:8px}
.iv-res{border:1px solid var(--borde);border-radius:8px;max-height:45vh;overflow:auto;margin-top:6px;background:#fff}
.iv-res>div{padding:9px 12px;border-bottom:1px solid var(--borde);cursor:pointer}.iv-res small{display:block;color:var(--sub)}
.iv-linea{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--borde)}
.iv-linea>span:first-child{flex:1;min-width:0}.iv-linea small{display:block;color:var(--sub)}
.iv-linea .iv-q{flex:none;text-align:right;font-weight:600}.iv-linea .iv-q small{display:inline;font-weight:400}
.iv-linea button.link{flex:none;padding:4px;text-decoration:none}.iv-linea button.sec{width:auto;flex:none;margin:0}
.iv-linea.vieja{opacity:.5}
.iv-recontar{border-color:var(--amar);background:var(--amarF)}.iv-recontar[data-rec]{cursor:pointer}
.iv-aviso{background:#f3f1ee;border-radius:8px;padding:8px 10px;margin:8px 0;font-size:13px}
.iv-aviso.rec{background:var(--amarF);color:#6b4a10}.iv-aviso.mal{background:var(--rojoF);color:var(--rojo)}
.iv-cant input{font-size:22px;text-align:center}
.iv-tot{font-size:15px;margin:2px 0 10px}
.iv-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:8px}
.iv-kpis>div{background:#f7f5f2;border-radius:10px;padding:8px;text-align:center;min-width:0}
.iv-kpis b{display:block;font-size:18px}.iv-kpis span{font-size:11px;color:var(--sub)}
.iv-kpis .ok b{color:var(--verde)}.iv-kpis .mal b{color:var(--rojo)}
.iv-cajas{margin-top:4px}
.iv-acciones{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 4px;align-items:center}.iv-acciones button{width:auto;margin:0}
.iv-fila{padding:12px 14px;border-left:4px solid var(--borde)}
.iv-fila.mal{border-left-color:var(--rojo)}.iv-fila.ok{border-left-color:var(--verde)}.iv-fila.amar{border-left-color:var(--amar)}
.iv-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.iv-top>span:first-child{min-width:0}.iv-top small{display:block;color:var(--sub)}
.iv-est{flex:none;font-size:12px;font-weight:600;color:var(--sub);text-align:right;max-width:45%}.iv-est.mal{color:var(--rojo)}.iv-est.ok{color:var(--verde)}.iv-est.amar{color:var(--amar)}
.iv-nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:8px 0 4px}
.iv-nums>div{min-width:0}.iv-nums span{display:block;font-size:11px;color:var(--sub)}.iv-nums b{font-size:15px}.iv-nums small{color:var(--sub);font-weight:400}
.iv-mas{color:var(--verde)}.iv-menos{color:var(--rojo)}
.iv-btns{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.iv-btns button{width:auto;margin:0;padding:6px 10px;font-size:13px}
.iv-calc{background:#f7f5f2;border-radius:10px;padding:8px 12px;margin:10px 0}
.iv-calc>div{display:flex;justify-content:space-between;gap:10px;padding:3px 0;font-size:14px}.iv-calc .tot{border-top:1px solid var(--borde);margin-top:3px;padding-top:6px}
.iv-movs{max-height:34vh;overflow:auto;margin-top:4px}
.iv-mov{display:flex;gap:8px;align-items:center;padding:6px 0;border-bottom:1px solid var(--borde);font-size:13px}
.iv-mov>span:first-child{flex:none;width:70px;color:var(--sub);font-variant-numeric:tabular-nums}.iv-mov>span:nth-child(2){flex:1;min-width:0}.iv-mov>b{flex:none}
.iv-mov small{color:var(--sub)}.iv-mov.cerca{background:var(--amarF)}.iv-mov.vieja{opacity:.5}.iv-mov button.link{flex:none;padding:2px 4px;text-decoration:none}
.iv-marca{font-size:12px;font-weight:700;color:var(--vino);text-align:center;padding:5px 0}
@media (max-width:420px){.iv-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.iv-nums b{font-size:14px}}

/* ===== Verificación de carga (v140) ===== */
.cg-ok{color:var(--verde)}
.cg-acc{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;align-items:center}.cg-acc button{width:auto;margin:0}.cg-acc button.primary{flex:1 1 160px}
.cg-abierta{cursor:pointer;border-color:var(--verde)}
.barra.cg-barra{height:10px;margin:10px 0 6px}.barra.cg-barra>i{background:var(--verde)}
.cg-dias{display:flex;align-items:center;gap:6px;margin:0;font-size:13px;color:var(--sub)}.cg-dias select{width:auto;margin:0;padding:4px 8px}
.cg-grupo{border-top:1px solid var(--borde);margin-top:10px;padding-top:8px}
.cg-gtit{display:flex;justify-content:space-between;align-items:center;gap:8px}
.cg-doc{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:6px 0 6px 6px;font-size:14px}
.cg-doc label.chk{margin:0;align-items:flex-start}.cg-doc button.link{flex:none;font-size:12px}
.cg-bloque.ok{border-color:var(--verde)}
.cg-docs{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 2px}
.cg-chip{display:inline-flex;align-items:center;gap:2px;background:#f3f1ee;border-radius:999px;padding:3px 4px 3px 10px;font-size:12.5px}
.cg-chip.mal{background:var(--rojoF);color:var(--rojo)}.cg-chip button.link{padding:0 6px;margin:0;font-size:12px;text-decoration:none}
.cg-det{margin-top:8px}.cg-det>summary{cursor:pointer;color:var(--vino);font-size:14px;padding:4px 0}
.cg-art{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--borde)}
.cg-art>span:first-child{flex:1;min-width:0}.cg-art small{display:block;color:var(--sub)}
.cg-art.ok{opacity:.65}.cg-art.ok .cg-q{color:var(--verde)}.cg-art.mal .cg-q{color:var(--rojo)}.cg-art.toca{cursor:pointer}
.cg-q{flex:none;text-align:right;font-weight:600;font-size:14.5px}.cg-q small{font-weight:400}.cg-q button.link{display:flex;margin:2px 0 0 auto;font-size:12px}
.cg-mini{display:block;height:4px;background:#ece8e3;border-radius:4px;margin-top:5px;overflow:hidden}.cg-mini>i{display:block;height:100%;background:var(--verde)}
.cg-esc{display:flex;gap:8px;align-items:center;padding:7px 0;border-bottom:1px solid var(--borde);font-size:13.5px}
.cg-esc>span:nth-child(2){flex:1;min-width:0}.cg-esc small{display:block;color:var(--sub)}.cg-esc.mal b{color:var(--rojo)}.cg-esc.desh{opacity:.45;text-decoration:line-through}
.cg-hora{flex:none;width:64px;color:var(--sub);font-variant-numeric:tabular-nums;font-size:12px}
.cg-esc button.link{flex:none;font-size:16px;padding:4px 10px;text-decoration:none}
.cg-fijo{position:sticky;top:0;z-index:5;background:var(--tarjeta);border:1px solid var(--borde);border-radius:var(--radio,16px);padding:10px 12px 8px;margin-bottom:12px;box-shadow:0 6px 16px rgba(27,43,71,.10)}
.cg-fijo-cab .link{padding:0;margin-bottom:2px}.cg-fijo-cab .barra.cg-barra{margin:6px 0 4px}
.cg-fijo .cg-res{margin:8px 0;min-height:70px;padding:12px}
.cg-fijo .iv-busca input{flex:1;min-width:0;margin:0}
.cg-res{border-radius:14px;padding:18px 16px;margin-bottom:12px;text-align:center;background:#eef1f6;color:var(--sub);min-height:84px;display:flex;flex-direction:column;justify-content:center;gap:4px;font-size:16px;transition:background .15s}
.cg-res b{font-size:20px;line-height:1.25}.cg-res span{font-size:16px}
.cg-res.ok{background:var(--verde);color:#fff}.cg-res.fin{background:#0f6b37;color:#fff}
.cg-res.mal{background:var(--rojo);color:#fff;animation:cgParpadeo .25s 3}
.cg-res button.sec{margin:8px auto 0;width:auto}
@keyframes cgParpadeo{50%{filter:brightness(1.35)}}
.cg-lector input{font-size:20px;letter-spacing:.5px}
.cg-lector-pie{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:4px}.cg-lector-pie #cgFoco{cursor:pointer}
.cg-modo{display:flex;gap:6px;margin-bottom:8px}
.cg-modo button{flex:1;border:1px solid var(--borde);background:#fff;border-radius:10px;padding:10px 6px;font-size:15px;cursor:pointer}
.cg-modo button.on{background:var(--vino);color:#fff;border-color:var(--vino);font-weight:600}
.cg-elegir{max-height:52vh;overflow:auto;margin:8px 0}
.cg-opc{display:block;width:100%;text-align:left;margin:0 0 6px}.cg-opc small{display:block;color:var(--sub)}
.cg-cam-ok,.cg-cam-mal{font-size:17px}
@media (min-width:900px){.cg-res b{font-size:24px}.cg-modo button{font-size:17px;padding:16px}}

/* v141: Cajas y tarimas, ¿cómo funciona? */
.cg-como{margin-top:10px;background:#f7f5f2;border-radius:10px;padding:8px 12px}.cg-como>summary{cursor:pointer;color:var(--vino);font-weight:600;font-size:14px}
.cg-como ol{margin:8px 0 6px 18px;padding:0;font-size:14px;line-height:1.45}.cg-como li{margin-bottom:6px}
.cc-art.cc-completo{opacity:.75}
.cc-acc{flex-wrap:wrap}.cc-acc button{flex:1 1 150px}
.cg-sec{font-size:13px;font-weight:700;color:var(--sub);text-transform:uppercase;letter-spacing:.04em;margin:4px 4px 8px}
.cg-gtit .cg-armar{width:auto;margin:0;padding:8px 18px;font-size:14px;flex:none}
.cg-listo{align-items:center;border-bottom:1px solid var(--borde)}.cg-listo .cg-l{flex:1;min-width:0;cursor:pointer}.cg-listo small{display:block;color:var(--sub)}

/* v142: lo que lleva cada producto, grande y claro */
.cg-q{min-width:120px}.cg-lleva-t{display:block;font-weight:400;color:var(--sub);font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.cg-lleva{display:block;font-size:17px;font-weight:700;color:var(--texto);line-height:1.2}
.cg-q small.cg-falta{color:var(--amar)}.cg-q small.cg-ok{color:var(--verde)}
.cg-art.ok .cg-lleva{color:var(--verde)}
/* v145: perfiles del portal y visto bueno */
.p-tile.t-aprobar{border-color:#f0d58c;background:var(--amarF)}.p-tile.t-aprobar b{color:var(--amar)}
.p-sols .p-sol{cursor:pointer;margin-top:8px}
.p-cl.p-quitada{opacity:.5}.p-cl.p-quitada .p-nom{text-decoration:line-through}
.p-cl-i .p-step{margin-top:6px;max-width:150px}

/* v146: lector físico (TC15 / Bluetooth) */
@keyframes ivMas{0%{background:#c8f0d2;transform:scale(1.06)}100%{background:inherit;transform:none}}
.iv-mas{animation:ivMas .45s ease-out}
.iv-lector{margin:4px 0 2px}