se convierte en una tarjeta y cada | en una línea con
su etiqueta, sin necesidad de desplazamiento horizontal.
============================================================ */
.buscador-filtro{position:relative;margin:0 0 12px;}
.buscador-filtro i{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--ink-soft);font-size:.85rem;}
.buscador-filtro input{width:100%;padding:10px 14px 10px 36px;}
.orden-movil{display:none;gap:8px;align-items:center;margin:0 0 12px;flex-wrap:wrap;}
.orden-movil label{font-weight:700;font-size:.8rem;color:var(--ink-soft);}
.orden-movil select{flex:1;min-width:140px;}
@media(max-width:760px){
.orden-movil{display:flex;}
.table-responsive--sticky{max-height:none;overflow-y:visible;}
.table-responsive--sticky table thead th{position:static;box-shadow:none;}
.tabla-cards-mobile thead{display:none;}
.tabla-cards-mobile, .tabla-cards-mobile tbody, .tabla-cards-mobile tr, .tabla-cards-mobile td{display:block;width:100%;}
/* La causa del bug "hay que desplazar para ver el valor": la tabla
seguía heredando min-width:880px (regla global) y, en Productos, un
min-width:820px en línea. En móvil ya no es una tabla — es una
columna de tarjetas — así que ambos se anulan aquí a la fuerza
(el !important es necesario porque un estilo en línea gana sobre
cualquier regla normal de hoja de estilos, pero no sobre !important). */
.tabla-cards-mobile{border:none;min-width:0!important;width:100%!important;}
.table-responsive:has(.tabla-cards-mobile){overflow-x:hidden;}
.tabla-cards-mobile tr{background:#fff;border:1px solid var(--line);border-radius:12px;margin:10px;padding:10px 12px;box-shadow:0 1px 2px rgba(0,0,0,.05);}
.tabla-cards-mobile tr.fila-grupo{background:var(--paper);border:none;box-shadow:none;margin:10px 10px 0;padding:6px 10px;font-weight:700;color:var(--orange-deep);}
.tabla-cards-mobile td{border:none;padding:6px 2px;display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:.85rem;min-height:22px;}
.tabla-cards-mobile td[data-label]::before{content:attr(data-label);font-weight:700;color:var(--ink-soft);font-size:.68rem;text-transform:uppercase;letter-spacing:.02em;flex-shrink:0;}
.tabla-cards-mobile td:not([data-label])::before{content:none;}
.tabla-cards-mobile td.td-destacada{padding-top:0;padding-bottom:8px;margin-bottom:4px;border-bottom:1px solid var(--line);font-size:.95rem;}
.tabla-cards-mobile td.td-destacada::before{content:none;}
/* Nombre de producto / cliente: en vez de cortarse en una sola línea,
se apila (etiqueta arriba, valor abajo) y se permiten 2 líneas. */
.tabla-cards-mobile td.col-solo-movil{display:block!important;}
.tabla-cards-mobile td.td-multilinea{display:block;white-space:normal!important;}
.tabla-cards-mobile td.td-multilinea::before{display:block;margin-bottom:2px;}
.tabla-cards-mobile td.td-multilinea .valor-multilinea{
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
overflow:hidden;white-space:normal;line-height:1.3;font-weight:700;
}
.tabla-cards-mobile td.td-acciones{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;justify-content:flex-end;align-items:center;gap:10px;overflow-x:auto;padding-top:8px;margin-top:4px;border-top:1px solid var(--line);}
.tabla-cards-mobile td.td-acciones .btn-view{flex-shrink:0;}
.tabla-cards-mobile td.td-acciones::before{content:none;}
/* Kardex: .cat-table fija el último | en 26px de ancho (pensado para una
sola columna de iconos en escritorio). En tarjetas eso aplastaba los 3
botones y solo se veía uno. Aquí se anula en móvil. */
.cat-table.tabla-cards-mobile td:last-child,
.cat-table.tabla-cards-mobile td.td-acciones{width:100%!important;text-align:right;padding:8px 2px 2px;}
.cat-table.tabla-cards-mobile td{white-space:normal;text-align:right;}
.cat-table.tabla-cards-mobile td:first-child{text-align:right;}
.tabla-cards-mobile td.td-acciones{gap:18px;}
.tabla-cards-mobile .celda-doble{align-items:flex-end;}
.valor-clamp-der{
display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
overflow:hidden;white-space:normal;line-height:1.3;font-weight:700;
text-align:right;max-width:62%;margin-left:auto;
}
.tabla-cards-mobile td:has(.celda-doble){display:block;}
.tabla-cards-mobile td:has(.celda-doble)::before{display:block;margin-bottom:2px;}
.tabla-cards-mobile .celda-doble{align-items:flex-start;}
}
table{width:100%;border-collapse:collapse;text-align:left;min-width:880px;}
th,td{padding:6px 11px;border-bottom:1px solid var(--line);font-size:.79rem;}
th{background:var(--paper);color:var(--ink-soft);font-weight:600;font-size:.7rem;letter-spacing:.03em;white-space:nowrap;}
tr:hover td{background:#fbfaf7;}
td.col-fecha{white-space:nowrap;}
.col-total{white-space:nowrap;}
.col-usuario{white-space:nowrap;}
.col-cliente{white-space:nowrap;}
.col-trunc{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px;}
.desc-cell{max-width:220px;color:var(--ink-soft);}
.desc-clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;max-height:2.7em;}
.status-select{font-weight:600;padding:5px 7px;font-size:.75rem;border-radius:6px;width:auto;min-width:128px;}
.priority-select{font-weight:600;padding:5px 7px;font-size:.75rem;border-radius:6px;width:auto;min-width:108px;}
.pedido-id{font-family:var(--font-body);font-weight:800;letter-spacing:.02em;font-variant-numeric:lining-nums tabular-nums;color:var(--orange-deep);white-space:nowrap;}
th.sortable{cursor:pointer;user-select:none;}
th.sortable:hover{background:#f0ece0;}
.btn-view{border:none;background:none;color:var(--orange-deep);font-size:.95rem;cursor:pointer;padding:2px 4px;}
.btn-delete{margin-left:10px;color:var(--danger);}
.btn-view:hover{opacity:.7;}
/* ---- CLIENTES ---- */
.client-row{border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:.82rem;display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:8px;background:#fff;}
.client-row .info b{display:block;font-size:.88rem;margin-bottom:2px;}
.client-row .info span{color:var(--ink-soft);display:block;font-size:.76rem;}
/* ---- STATS / DASHBOARD ---- */
.stat-row{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:18px;}
@media(max-width:900px){.stat-row{grid-template-columns:repeat(3,1fr);}}
@media(max-width:560px){.stat-row{grid-template-columns:repeat(2,1fr);}}
.stat-card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px 18px;}
.stat-card .num{font-family:var(--font-display);font-size:1.7rem;font-weight:700;line-height:1;}
.stat-card .label{color:var(--ink-soft);font-size:.74rem;margin-top:5px;}
.stat-card .num.money{font-size:1.3rem;}
.chart-card.full{grid-column:1 / -1;}
.chart-card .chart-sub{color:var(--ink-soft);font-size:.72rem;margin:-4px 0 10px;}
.chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
@media(max-width:800px){.chart-grid{grid-template-columns:minmax(0,1fr);}}
.chart-card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;}
.chart-card h3{font-family:'Montserrat',sans-serif;font-size:.95rem;margin:0 0 10px;font-weight:700;}
.chart-wrap{height:260px;position:relative;}
.empty-msg{text-align:center;color:var(--ink-soft);padding:26px;font-size:.85rem;}
/* ---- CATÁLOGO (agregar fila por fila) ---- */
.cat-add-row{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;}
.cat-add-row select{flex:1;min-width:180px;}
.cat-add-row input{width:64px;flex-shrink:0;}
.cat-lines-wrap{margin-top:12px;border:1px solid var(--line);border-radius:10px;}
.cat-table{width:100%;min-width:0;border-collapse:collapse;font-size:.79rem;}
.cat-table th,.cat-table td{padding:8px 9px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap;}
.cat-table th:first-child,.cat-table td:first-child{text-align:left;white-space:normal;}
.cat-table thead th{background:var(--paper);color:var(--ink-soft);font-weight:600;font-size:.68rem;letter-spacing:.02em;}
.cat-table tbody tr:last-child td{border-bottom:none;}
.cat-table th:last-child,.cat-table td:last-child{width:26px;text-align:center;padding-left:2px;padding-right:6px;}
.cat-line-nombre{display:flex;flex-direction:column;}
.cat-line-nombre small{color:var(--ink-soft);font-weight:400;}
.cat-remove{border:none;background:none;color:var(--danger);font-size:.9rem;cursor:pointer;padding:0;}
.cat-totals{display:flex;gap:16px;flex-wrap:wrap;padding:10px 4px 0;font-size:.82rem;}
.cat-totals b{font-family:var(--font-display);}
.hide-costos .cat-col-costo{display:none;}
.cat-box{max-width:820px;}
.cat-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;}
@media(max-width:480px){
.cat-table{font-size:.72rem;}
.cat-table th,.cat-table td{padding:7px 6px;}
.cat-actions{flex-direction:column;}
.cat-actions .btn{width:100%;justify-content:center;text-align:center;}
}
/* ---- SUB-TABS (submódulos Insumos/Empaques/Preparación) ---- */
.subtabs{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap;}
.subtab-btn{padding:8px 14px;border:1px solid var(--line);background:#fff;color:var(--ink-soft);font-weight:600;font-size:.8rem;border-radius:20px;transition:all .12s ease;}
.subtab-btn:hover{border-color:var(--orange);color:var(--ink);}
.subtab-btn.active{background:var(--orange);border-color:var(--orange);color:#fff;}
.subtab-content{display:none;}
.subtab-content.active{display:block;animation:fadeIn .2s ease;}
/* ---- Toggle-style buttons (seleccionar todos / quitar selección) ---- */
.btn-toggle{background:#FDE2CF;color:#74350C;border:1px solid #F7A720;}
.btn-toggle:hover{background:#F7A720;color:#fff;}
/* ---- Receta modal: subtotal por submódulo ---- */
.receta-subtotal{display:flex;justify-content:flex-end;gap:14px;font-size:.82rem;margin-top:6px;padding-right:38px;color:var(--ink-soft);}
.receta-subtotal b{color:var(--orange-deep);min-width:80px;text-align:right;}
/* ---- Receta modal: título de sección (submódulo) ---- */
.receta-seccion-titulo{font-weight:700;font-size:.85rem;display:flex;align-items:center;gap:8px;margin-top:18px;}
.receta-seccion-titulo:first-of-type{margin-top:0;}
.receta-seccion-titulo .receta-badge{background:var(--paper);color:var(--ink-soft);font-size:.68rem;font-weight:600;padding:2px 8px;border-radius:10px;}
/* ---- BOTÓN IMAGEN WHATSAPP ---- */
.btn-img{border:none;background:none;color:var(--green-deep);font-size:.95rem;cursor:pointer;padding:2px 4px;}
.btn-img:hover{opacity:.7;}
/* ---- TARJETA RECIBO (para generar imagen) ---- */
#reciboTemplate{
position:absolute; left:-9999px; top:0;
width:380px; background:#fff; padding:26px 24px;
font-family:var(--font-body); color:var(--ink);
}
.recibo-header{display:flex;align-items:center;gap:10px;border-bottom:2px solid var(--orange);padding-bottom:14px;margin-bottom:16px;}
.recibo-header img{width:60px;height:60px;object-fit:contain;}
.recibo-header .marca{font-family:'Montserrat',sans-serif;font-weight:700;font-size:1.3rem;line-height:1.1;color:var(--ink);}
.recibo-header .marca small{display:block;font-family:var(--font-body);font-weight:600;font-size:.5rem;letter-spacing:-.01em;color:var(--orange-deep);white-space:nowrap;margin-top:4px;}
.recibo-num{font-family:'Montserrat',sans-serif;display:inline-block;background:#FDE2CF;color:var(--orange-deep);font-weight:700;font-size:.78rem;padding:4px 11px;border-radius:20px;margin-bottom:12px;}
.recibo-cliente{font-family:'Montserrat',sans-serif;font-size:1.05rem;font-weight:700;margin-bottom:4px;}
.recibo-meta{font-size:.76rem;color:var(--ink-soft);margin-bottom:14px;}
.recibo-detalle{font-size:.85rem;line-height:1.5;background:var(--paper);border-radius:10px;padding:14px;margin-bottom:16px;}
.recibo-items{display:flex;flex-direction:column;gap:5px;}
.recibo-item-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;}
.recibo-item-nombre{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.66rem;}
.recibo-item-valor{flex-shrink:0;white-space:nowrap;font-size:.7rem;}
.recibo-total-row{font-family:'Montserrat',sans-serif;display:flex;justify-content:space-between;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-weight:700;font-size:.95rem;color:var(--ink);}
.recibo-footer{text-align:center;font-size:.76rem;color:var(--ink-soft);border-top:1px solid var(--line);padding-top:12px;}
.recibo-pago{background:var(--paper);border-radius:10px;padding:12px 14px;margin-bottom:16px;font-size:.78rem;line-height:1.6;display:flex;gap:18px;}
.rp-col{flex:1;min-width:0;}
.rp-it{white-space:nowrap;line-height:1.35;margin-bottom:6px;}
.rp-it:last-child{margin-bottom:0;}
.rp-it b{display:block;font-size:.66rem;}
.recibo-pago b{color:var(--orange-deep);}
/* ============ HUB CRM + SIDEBAR + MÓDULOS (Entrega 1) ============ */
.tabs{display:none!important;}
#hubScreen{display:none;padding:8px 0 20px;}
body.en-hub #hubScreen{display:block;animation:fadeIn .2s ease;}
.hub{display:grid;grid-template-columns:1fr 250px 1fr;gap:92px;align-items:center;max-width:1180px;margin:0 auto;position:relative;}
.hub-col{display:flex;flex-direction:column;gap:18px;}
.hub-card{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px 16px;text-align:left;box-shadow:0 1px 3px rgba(0,0,0,.05);transition:transform .12s,box-shadow .12s;color:var(--ink);}
.hub-card:hover,.hub-card:active{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.10);}
.hub-col.izq .hub-card{flex-direction:row-reverse;text-align:right;}
.hub-ico{flex-shrink:0;width:64px;height:64px;border-radius:50%;border:3px dashed var(--c);display:flex;align-items:center;justify-content:center;color:var(--c);font-size:1.5rem;background:#fff;}
.hub-txt b{display:block;font-family:'Montserrat',sans-serif;font-size:.95rem;color:var(--green);}
.hub-txt small{display:block;color:var(--ink-soft);font-size:.72rem;margin-top:2px;line-height:1.35;}
.hub-centro{text-align:center;display:flex;justify-content:center;position:relative;z-index:1;}
body.en-hub .header-logo{display:none;}
.hub-aro{width:230px;height:230px;border-radius:50%;border:10px solid var(--orange);box-shadow:0 0 0 6px #FDE2CF,0 10px 28px rgba(242,117,7,.25);background:radial-gradient(circle at 30% 25%,#fff,#f6f5f1);margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.hub-aro img{width:96px;height:96px;object-fit:contain;margin-bottom:4px;}
.hub-crm{font-family:'Montserrat',sans-serif;font-weight:700;font-size:2.4rem;letter-spacing:.06em;color:var(--green);line-height:1;}
.hub-angels{font-family:'Alex Brush',cursive;font-size:2.3rem;color:var(--orange-deep);line-height:1;margin-top:2px;}
.hub-config{background:var(--orange);color:#fff;border:none;border-radius:999px;padding:11px 24px;font-weight:700;font-size:.85rem;box-shadow:0 3px 10px rgba(255,151,0,.4);}
.hub-config:hover{background:var(--orange-deep);}
#moduloBar{display:none;margin-bottom:14px;}
body.en-modulo #moduloBar{display:block;}
.mod-top{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
.mod-top h2{margin:0;font-family:'Montserrat',sans-serif;font-size:1.05rem;color:var(--green);flex:1;}
.btn-volver{border:1px solid var(--line);background:#fff;color:var(--green);border-radius:999px;padding:7px 14px;font-weight:700;font-size:.8rem;}
.btn-volver:hover{background:#FDE2CF;}
.mod-pills{display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;border-bottom:1px solid var(--line);}
.mod-pills:empty{display:none;}
.mod-pill{padding:9px 14px;border:none;background:none;color:var(--ink-soft);font-weight:600;font-size:.82rem;white-space:nowrap;border-bottom:2px solid transparent;}
.mod-pill.active{color:var(--orange-deep);border-bottom-color:var(--orange);background:#FDE2CF;border-radius:8px 8px 0 0;}
#sideNav{display:none;}
@media(min-width:901px){
.hub-card{position:relative;z-index:1;}
}
#appContainer:not(.hidden){display:flex;flex-direction:column;min-height:100vh;}
.app-footer{text-align:center;color:var(--ink-soft);font-size:.72rem;padding:22px 10px 8px;border-top:1px solid var(--line);margin-top:auto;}
#appContainer > .app-footer{position:relative;top:0;}
#appContainer > #hubScreen ~ .app-footer{margin-top:auto;}
.app-footer b{color:var(--green);}
.login-footer{margin-top:22px;border:none;}
.btn-nuevo-ped{background:var(--orange)!important;color:#fff!important;border:none;}
.btn-nuevo-ped:hover{background:var(--orange-deep)!important;}
.cfg-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));grid-auto-rows:1fr;gap:14px;align-items:stretch;}
.cfg-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;box-sizing:border-box;min-height:170px;}
.cfg-card h3{margin:0 0 6px;font-family:'Montserrat',sans-serif;font-size:.92rem;color:var(--green);}
.cfg-card p{margin:0 0 12px;font-size:.8rem;color:var(--ink-soft);line-height:1.45;}
@media(min-width:901px){
body.en-modulo #sideNav{display:flex;}
body.en-modulo .container{padding-left:80px;max-width:1300px;}
#sideNav{position:fixed;left:0;top:0;bottom:0;width:58px;background:#FFBE7A;flex-direction:column;align-items:center;gap:6px;padding:12px 0;z-index:60;box-shadow:1px 0 6px rgba(0,0,0,.08);}
#sideNav button{position:relative;width:42px;height:42px;border:none;border-radius:12px;background:none;color:#74350C;font-size:1.05rem;}
#sideNav button:hover{background:rgba(255,255,255,.45);color:#592014;}
#sideNav button.active{background:#74350C;color:#fff;}
#sideNav button::after{content:attr(data-tip);position:absolute;left:52px;top:50%;transform:translateY(-50%);background:#1c1b18;color:#fff;padding:5px 10px;border-radius:6px;font-size:.74rem;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s;}
#sideNav button:hover::after{opacity:1;}
#sideNav .sp{flex:1;}
}
@media(max-width:900px){
.hub{grid-template-columns:1fr 1fr;gap:12px;}
.hub-col{gap:12px;}
.hub-centro{grid-column:1/-1;order:-1;}
.hub-aro{width:170px;height:170px;border-width:8px;}
.hub-crm{font-size:1.9rem;}
.hub-aro img{width:72px;height:72px;margin-bottom:2px;}
.hub-lineas{display:none;}
.hub{align-items:stretch;}
.hub-card,.hub-col.izq .hub-card{flex-direction:column;justify-content:center;text-align:center;padding:12px 8px;gap:8px;height:184px;overflow:hidden;}
.hub-txt small{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.hub-ico{width:56px;height:56px;font-size:1.3rem;}
}
/* ---- Cotizaciones / PQRS ---- */
.al{display:inline-block;padding:3px 9px;border-radius:999px;font-size:.7rem;font-weight:700;white-space:nowrap;}
.al-roja{background:#FBD9D0;color:#8E2A12;}.al-naranja{background:#FFE0B3;color:#8A4B00;}
.al-amarilla{background:#FFF1B8;color:#6B5600;}.al-verde{background:#DDF2DD;color:#1F6B2A;}
.al-na{background:#ECE8DF;color:var(--ink-soft);}.al-ok{background:#E3E8F6;color:#2A3F8E;}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px;}
.chip{background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:.75rem;font-weight:700;}
.tabla-compacta select,.tabla-compacta input[type=date]{padding:5px 6px;font-size:.78rem;border:1px solid var(--line);border-radius:8px;background:#fff;max-width:100%;}
.pqrs-ayuda{font-size:.78rem;color:var(--ink-soft);margin:0 0 12px;}
.pqrs-ayuda summary{cursor:pointer;font-weight:700;color:var(--green);}
.pqrs-ayuda li{margin:4px 0;line-height:1.4;}
#modalPqrs .form-group{margin-bottom:10px;}
#modalPqrs input,#modalPqrs select,#modalPqrs textarea{width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:9px;font-size:.85rem;}
.resumen-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.resumen-grid h3{margin:0 0 8px;font-family:'Montserrat',sans-serif;font-size:.85rem;color:var(--green);}
.mini-stats{display:flex;flex-wrap:wrap;gap:8px;}
.mini{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:8px 12px;min-width:92px;flex:1;}
.mini b{display:block;font-family:'Fraunces',serif;font-size:1.35rem;line-height:1.1;}
.mini small{color:var(--ink-soft);font-size:.7rem;}
.mini.dest{background:#FDE2CF;border-color:#F7A720;}
@media(max-width:700px){.resumen-grid{grid-template-columns:1fr;}}
#kgHead th.sortable{cursor:pointer;white-space:nowrap;user-select:none;}
.res-bloque{background:#fff;border:1px solid var(--line);border-left:6px solid var(--ac);border-radius:12px;padding:10px 14px 12px;margin-bottom:14px;}
.res-bloque h3{margin:0 0 8px;font-family:'Montserrat',sans-serif;font-size:.9rem;color:var(--ac);}
.mini-fila{display:grid;gap:8px;}
.mini-fila[data-n="9"]{grid-template-columns:repeat(9,1fr);}
.mini-fila[data-n="6"]{grid-template-columns:repeat(6,1fr);}
.mini-fila .mini{min-width:0;}
.mini small.lin{display:block;margin-top:3px;line-height:1.35;}
@media(max-width:900px){.mini-fila[data-n]{grid-template-columns:repeat(auto-fill,minmax(98px,1fr));}}
/* Tareas */
.sel-estado{padding:5px 8px;border-radius:999px;border:1px solid transparent;font-size:.74rem;font-weight:700;max-width:100%;}
.e-no{background:#ECE8DF;color:#59544c;}.e-prog{background:#FFE0B3;color:#8A4B00;}.e-esp{background:#FFF1B8;color:#6B5600;}.e-comp{background:#DDF2DD;color:#1F6B2A;}.e-canc{background:#FBD9D0;color:#8E2A12;}
.pri{display:inline-block;padding:3px 10px;border-radius:999px;font-size:.72rem;font-weight:700;}
.pri-Alta{background:#FBD9D0;color:#8E2A12;}.pri-Media{background:#FFE0B3;color:#8A4B00;}.pri-Baja{background:#E3E8F6;color:#2A3F8E;}
.tk-bar{display:inline-block;width:70px;height:8px;border-radius:99px;background:#E8E4D9;overflow:hidden;vertical-align:middle;margin-right:6px;}
.tk-bar i{display:block;height:100%;background:var(--orange);}
.tk-av input{width:62px;padding:4px;border:1px solid var(--orange);border-radius:8px;}
.lapiz{border:none;background:none;color:var(--ink-soft);padding:2px 5px;}
@media(hover:hover){.tk-av .lapiz{opacity:0;}tr:hover .tk-av .lapiz{opacity:1;}}
.fin-venc{color:#B3261E;font-weight:700;}
.fila-inactiva{opacity:.5;}
#modalTarea .form-group{margin-bottom:10px;}
#modalTarea input,#modalTarea select,#modalTarea textarea{width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:9px;font-size:.85rem;}
#tkHead th.sortable{cursor:pointer;white-space:nowrap;user-select:none;}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;margin:0 0 10px;background:#fff;}
.seg button{border:none;background:none;padding:7px 16px;font-size:.8rem;font-weight:700;color:var(--ink-soft);}
.seg button.on{background:var(--orange);color:#fff;}
.kanban{display:grid;grid-template-columns:repeat(5,minmax(245px,1fr));gap:12px;overflow-x:auto;padding-bottom:10px;align-items:start;}
.kcol{background:#EFEBE0;border-radius:12px;padding:8px;min-height:160px;transition:outline .1s;}
.kcol.over{outline:2px dashed var(--orange);background:#FDE2CF;}
.kcol-h{display:flex;justify-content:space-between;align-items:center;font-weight:700;font-size:.82rem;padding:4px 6px 8px;border-bottom:3px solid var(--kc);margin-bottom:8px;}
.kcol-h span{background:#fff;border-radius:999px;padding:1px 9px;font-size:.74rem;}
.kcol-b{max-height:68vh;overflow-y:auto;}
.kcard{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;margin-bottom:8px;box-shadow:0 1px 3px rgba(0,0,0,.06);cursor:grab;}
.kcard.arrastrando{opacity:.4;}
.k-top{display:flex;justify-content:space-between;align-items:center;font-size:.7rem;color:var(--ink-soft);font-weight:700;}
.k-nom{font-weight:700;font-size:.86rem;margin:5px 0;line-height:1.3;word-break:break-word;}
.k-meta,.k-fecha{font-size:.74rem;color:var(--ink-soft);margin-top:3px;}
.k-av{margin-top:7px;font-size:.76rem;}
.k-av input{width:60px;padding:3px;border:1px solid var(--orange);border-radius:8px;}
.k-acc{display:flex;align-items:center;gap:4px;margin-top:8px;}
.k-acc select{flex:1;min-width:0;padding:4px;font-size:.72rem;border:1px solid var(--line);border-radius:8px;background:#fff;}
@media(max-width:900px){.kanban{grid-template-columns:repeat(5,84%);scroll-snap-type:x mandatory;}.kcol{scroll-snap-align:start;}.kcol-b{max-height:none;}}
/* Botón visible para "Modificar productos y cantidades" (edición de pedido) */
.btn-productos-edit{list-style:none;display:flex;align-items:center;gap:12px;width:100%;box-sizing:border-box;cursor:pointer;
background:#FFF3E3;color:var(--green);border:2px solid var(--orange);border-radius:12px;padding:12px 16px;font-weight:700;font-size:.92rem;
transition:background .12s,color .12s;-webkit-tap-highlight-color:transparent;}
.btn-productos-edit::-webkit-details-marker{display:none;}
.btn-productos-edit:hover{background:#FFE3C2;}
.btn-productos-edit > i:first-child{font-size:1.25rem;color:var(--orange);}
.btn-productos-edit span{flex:1;text-align:left;line-height:1.25;}
.btn-productos-edit small{display:block;font-weight:500;font-size:.72rem;color:var(--ink-soft);margin-top:2px;}
.btn-productos-edit .chev{transition:transform .2s;color:var(--orange);}
.det-productos[open] > .btn-productos-edit{background:var(--orange);color:#fff;}
.det-productos[open] > .btn-productos-edit small,.det-productos[open] > .btn-productos-edit i{color:#fff;}
.det-productos[open] > .btn-productos-edit .chev{transform:rotate(180deg);}
/* Tabla de productos del modal de edición: Producto | Cant. | Vr. Venta (máx. 2 líneas por fila) */
.cat-table-simple th:nth-child(2),.cat-table-simple td.cat-cant{width:46px;text-align:center;padding-left:4px;padding-right:4px;font-weight:700;color:var(--ink-soft);}
.cat-table-simple th:nth-child(3),.cat-table-simple td:nth-child(3){width:92px;}
.cat-nom2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.3;word-break:break-word;}
#e_catTotals,#catTotals{justify-content:flex-end;}
/* ---- Menú principal: líneas de conexión animadas hacia el círculo ---- */
.hub-lineas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;overflow:visible;}
.hub-lineas .ln-base{fill:none;stroke:#FFD9A8;stroke-width:7;stroke-linecap:round;opacity:.55;}
.hub-lineas .ln-flow{fill:none;stroke:#FF9700;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:3 13;animation:hubFlow 1.4s linear infinite;}
.hub-lineas .nodo{fill:#fff;stroke:#FF9700;stroke-width:2.5;}
.hub-lineas .nodo-c{fill:#FF9700;}
.hub-lineas .pulso{fill:#FF9700;opacity:0;transform-box:fill-box;transform-origin:center;animation:hubPulso 2.4s ease-out infinite;}
.hub-lineas .paquete{fill:#fff;stroke:#FF9700;stroke-width:2;}
@keyframes hubFlow{to{stroke-dashoffset:-16;}}
@keyframes hubPulso{0%{opacity:.55;transform:scale(1);}100%{opacity:0;transform:scale(3.4);}}
@media(prefers-reduced-motion:reduce){.hub-lineas .ln-flow,.hub-lineas .pulso{animation:none;}}
/* ---- Panel de Control: secciones, tarjetas compactas y ampliar ---- */
.dash-tabs{display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 0 14px;border-bottom:1px solid var(--line);}
.dash-tabs button{border:none;background:none;padding:10px 16px;font-weight:700;font-size:.85rem;color:var(--ink-soft);white-space:nowrap;border-bottom:3px solid transparent;}
.dash-tabs button.on{color:var(--orange-deep);border-bottom-color:var(--orange);background:#FDE2CF;border-radius:10px 10px 0 0;}
.cc-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;}
.cc-head h3{margin:0!important;}
.cc-exp{flex-shrink:0;width:30px;height:30px;border:1px solid var(--line);background:#fff;border-radius:8px;color:var(--ink-soft);}
.cc-exp:hover{background:#FDE2CF;color:var(--orange-deep);}
.cw-scroll{max-height:330px;overflow-y:auto;}
#dashZoomBg{display:none;position:fixed;inset:0;background:rgba(11,11,11,.55);z-index:85;}
body.dash-zoom{overflow:hidden;}
body.dash-zoom #dashZoomBg{display:block;}
.chart-card.zoom{position:fixed;inset:3vh 3vw;z-index:90;overflow:auto;box-shadow:0 20px 60px rgba(0,0,0,.4);margin:0;}
.chart-card.zoom .chart-wrap{height:calc(94vh - 190px)!important;}
.chart-card.zoom .cw-scroll{max-height:none;}
.rfm-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:16px;align-items:start;}
.rfm-tabla table th.sortable{cursor:pointer;white-space:nowrap;user-select:none;}
.chart-card.zoom .rfm-tabla{max-height:calc(94vh - 190px);}
@media(max-width:800px){.chart-grid{grid-template-columns:minmax(0,1fr);}.rfm-grid{grid-template-columns:minmax(0,1fr);}}
/* ---- RFM: dos gráficos arriba, tabla completa abajo ---- */
.rfm-graficos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start;}
.rfm-t{margin:0 0 6px;font-family:'Montserrat',sans-serif;font-size:.82rem;color:var(--green);}
.rfm-g .chart-wrap{height:360px;}
.rfm-tabla table th.sortable{cursor:pointer;white-space:nowrap;user-select:none;}
.rfm-tabla{max-height:420px;}
.chart-card.zoom .rfm-g .chart-wrap{height:min(58vh,560px)!important;}
.chart-card.zoom .rfm-tabla{max-height:none;}
@media(max-width:800px){.rfm-graficos{grid-template-columns:minmax(0,1fr);}}
.rfm-pareto{background:#FFF3E3;border:1px solid #F7A720;border-left:5px solid var(--orange);border-radius:10px;padding:9px 12px;font-size:.85rem;margin:0 0 12px;color:var(--ink);}
.rfm-pareto i{color:var(--orange);margin-right:4px;}
/* ---- Pedidos: estado en letra + rentabilidad ---- */
.est-wrap{display:inline-block;}
.est-oculto{display:none!important;}
.est-btn{display:inline-flex;align-items:center;gap:6px;border:1px solid transparent;background:none;padding:2px 4px;border-radius:999px;cursor:pointer;color:var(--ink);font-weight:600;font-size:.78rem;}
.est-btn:hover{background:#F3EFE5;border-color:var(--line);}
.est-full{display:none;}
.est-caret{font-size:.6rem;color:var(--ink-soft);}
.est-btn.est-cambiado .letra-badge{outline:2px solid var(--orange);outline-offset:2px;}
.menu-estado{position:fixed;z-index:95;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.22);padding:6px;min-width:170px;}
.menu-estado button{display:flex;align-items:center;gap:10px;width:100%;border:none;background:none;padding:8px 10px;border-radius:8px;font-size:.85rem;text-align:left;color:var(--ink);}
.menu-estado button:hover,.menu-estado button.act{background:#FDE2CF;}
.col-rentab{white-space:nowrap;}
.rentab-pos{color:#1F6B2A;font-weight:700;}
.rentab-neg{color:#B3261E;font-weight:700;}
@media(max-width:760px){ .est-full{display:inline;} .est-btn{padding:4px 8px;border-color:var(--line);background:#fff;} }
.hub-aro:active{transform:scale(.985);}
/* ---- Panel: que nada se salga del ancho en el celular ---- */
.dash-pane,.chart-grid>*,.chart-card,.rfm-g{min-width:0;}
.chart-card{max-width:100%;}
@media(min-width:761px){.rfm-tabla table{min-width:640px;}}
/* ---- Rentabilidad ---- */
.rent-sel{margin:0 0 10px;border:1px solid var(--line);border-radius:10px;padding:8px 12px;background:#fff;}
.rent-sel summary{cursor:pointer;font-weight:700;font-size:.85rem;color:var(--green);}
.rent-sel summary small{font-weight:500;color:var(--ink-soft);}
.rent-botones{display:flex;gap:8px;margin:10px 0 6px;}
.rent-lista{max-height:220px;}
.rent-lista label{display:flex;align-items:center;gap:8px;padding:6px 4px;border-bottom:1px solid var(--line);font-size:.8rem;cursor:pointer;}
.rent-lista label span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.rent-lista input{width:auto;}
.gan-pos{color:#1F6B2A;font-weight:700;}.gan-neg{color:#B3261E;font-weight:700;}
/* ---- Configuración: aviso al pasar el mouse (o tocar) sin ampliar la tarjeta ---- */
.cfg-tip{position:relative;}
.cfg-tip .cfg-tipbox{display:none;position:absolute;left:12px;right:12px;bottom:calc(100% - 6px);z-index:30;background:#2b2b2b;color:#fff;font-size:.75rem;line-height:1.4;padding:9px 11px;border-radius:9px;box-shadow:0 8px 22px rgba(0,0,0,.25);}
.cfg-tip:hover .cfg-tipbox,.cfg-tip:focus .cfg-tipbox,.cfg-tip:focus-within .cfg-tipbox{display:block;}
.cfg-tip h3 i.info{color:var(--ink-soft);font-size:.8rem;margin-left:4px;}
/* Tarjetas móviles: el ancho 100% + márgenes dejaba el borde derecho recortado */
@media(max-width:760px){ .tabla-cards-mobile tr{box-sizing:border-box;width:calc(100% - 20px);} }
/* ---- Rentabilidad: títulos fijos y columnas ordenables ---- */
@media(min-width:761px){
.rent-tabla thead th,.rfm-tabla table thead th{position:sticky;top:0;z-index:2;background:#F3EFE5;box-shadow:0 1px 0 var(--line);}
}
.rent-tabla th.sortable{cursor:pointer;white-space:nowrap;user-select:none;}
.rent-tabla th.sortable:hover{background:#EDE8DA;}
.rent-tabla sup{color:#B3261E;font-weight:800;margin-left:1px;}
/* ---- Navegación fija en el celular ---- */
#navMovil,#sheetModulos{display:none;}
@media(max-width:900px){
body.en-modulo #navMovil{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:55;background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 14px rgba(0,0,0,.08);padding:6px 4px calc(6px + env(safe-area-inset-bottom,0px));justify-content:space-around;}
#navMovil button{flex:1;border:none;background:none;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.66rem;font-weight:700;color:var(--ink-soft);padding:4px 0;-webkit-tap-highlight-color:transparent;}
#navMovil button i{font-size:1.15rem;}
#navMovil button.on{color:var(--orange-deep);}
#navMovil .nm-nuevo i{width:44px;height:44px;border-radius:50%;background:var(--orange);color:#fff;display:flex;align-items:center;justify-content:center;margin-top:-20px;box-shadow:0 3px 10px rgba(255,151,0,.55);font-size:1.15rem;}
#navMovil .nm-nuevo.on i{background:var(--orange-deep);}
body.en-modulo .container{padding-bottom:100px;}
#sheetModulos.abierto{display:block;position:fixed;inset:0;z-index:80;}
.sheet-fondo{position:absolute;inset:0;background:rgba(11,11,11,.45);}
.sheet-panel{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:18px 18px 0 0;padding:14px 14px calc(18px + env(safe-area-inset-bottom,0px));max-height:78vh;overflow:auto;box-shadow:0 -8px 30px rgba(0,0,0,.25);}
.sheet-titulo{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-family:'Montserrat',sans-serif;color:var(--green);}
.sheet-titulo button{border:none;background:#F3EFE5;width:32px;height:32px;border-radius:50%;color:var(--ink);}
.sheet-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.sheet-grid button{display:flex;flex-direction:column;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;border-radius:14px;padding:14px 6px;font-size:.74rem;font-weight:700;color:var(--green);text-align:center;}
.sheet-grid button i{font-size:1.4rem;color:var(--orange);}
.sheet-grid button.on{background:#FDE2CF;border-color:var(--orange);}
}
/* ---- Rentabilidad: tarjetas de reparto y tabla ancha (se desplaza hacia la derecha) ---- */
.rent-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin:8px 0 4px;}
.rent-k{background:#fff;border:1px solid var(--line);border-left:6px solid var(--c);border-radius:12px;padding:10px 14px;}
.rent-k small{display:block;color:var(--ink-soft);font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;}
.rent-k b{display:block;font-family:'Montserrat',sans-serif;font-size:1.35rem;color:var(--c);line-height:1.25;}
.rent-k em{font-style:normal;font-size:.75rem;color:var(--ink-soft);}
@media(min-width:761px){ .rent-tabla{min-width:1650px;} }
/* ---- Detalle por pedido ---- */
.dt-scroll{max-height:560px;}
@media(min-width:761px){ .dt-tabla{min-width:1250px;} .dt-tabla thead th{position:sticky;top:0;z-index:2;background:#F3EFE5;box-shadow:0 1px 0 var(--line);} }
.dt-tabla th.sortable{cursor:pointer;white-space:nowrap;user-select:none;}
.dt-cl{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.7rem;font-weight:700;}
/* ---- Selector de productos (Nuevo Pedido / Editar) ---- */
.pp{margin-top:10px;}
.pp-search{position:relative;display:flex;align-items:center;}
.pp-search>i{position:absolute;left:12px;color:var(--ink-soft);pointer-events:none;}
.pp-search input{width:100%;padding:12px 38px 12px 36px;border:2px solid var(--line);border-radius:12px;font-size:.95rem;background:#fff;}
.pp-search input:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,151,0,.18);}
.pp-x{position:absolute;right:6px;border:none;background:none;width:30px;height:30px;color:var(--ink-soft);}
.pp-chips{display:flex;gap:6px;overflow-x:auto;padding:10px 0 4px;-webkit-overflow-scrolling:touch;}
.pp-chip{flex-shrink:0;border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 13px;font-size:.8rem;font-weight:700;color:var(--ink);white-space:nowrap;}
.pp-chip small{color:var(--ink-soft);font-weight:600;margin-left:3px;}
.pp-chip.on{background:var(--orange);border-color:var(--orange);color:#fff;}
.pp-chip.on small{color:#fff;opacity:.85;}
.pp-frec{display:flex;gap:6px;overflow-x:auto;align-items:center;padding:2px 0 6px;}
.pp-frec:empty{display:none;}
.pp-frec-t{flex-shrink:0;font-size:.72rem;font-weight:800;color:var(--orange-deep);}
.pp-pill{flex-shrink:0;border:1px dashed var(--orange);background:#FFF6EA;color:var(--green);border-radius:999px;padding:5px 11px;font-size:.76rem;font-weight:700;white-space:nowrap;}
.pp-lista{max-height:300px;overflow-y:auto;border:1px solid var(--line);border-radius:12px;background:#fff;-webkit-overflow-scrolling:touch;}
.pp-grupo{position:sticky;top:0;z-index:1;background:#F3EFE5;padding:6px 12px;font-size:.72rem;font-weight:800;color:var(--green);text-transform:uppercase;letter-spacing:.04em;}
.pp-it{display:flex;align-items:center;gap:10px;padding:11px 12px;border-bottom:1px solid var(--line);cursor:pointer;min-height:48px;box-sizing:border-box;}
.pp-it:hover{background:#FFF6EA;}
.pp-it.en{background:#FDE2CF;}
.pp-n{flex:1;min-width:0;}
.pp-n b{display:block;font-size:.86rem;line-height:1.3;}
.pp-n small{color:var(--ink-soft);font-weight:700;font-size:.78rem;}
.pp-add{flex-shrink:0;width:32px;height:32px;border-radius:50%;background:var(--orange);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.8rem;}
.pp-st,.qs{display:inline-flex;align-items:center;gap:2px;flex-shrink:0;}
.pp-st button,.qs button{width:32px;height:32px;border-radius:50%;border:1px solid var(--orange);background:#fff;color:var(--orange-deep);font-size:1.1rem;font-weight:800;line-height:1;}
.pp-st span,.qs b{min-width:28px;text-align:center;font-weight:800;}
.qs button{width:26px;height:26px;font-size:1rem;}
.pp-vacio{padding:18px;text-align:center;color:var(--ink-soft);font-size:.85rem;}
.pp-ayuda{margin:6px 2px 0;font-size:.72rem;color:var(--ink-soft);}
@media(max-width:760px){ .pp-lista{max-height:46vh;} }
/* aviso breve */
#toastApp{position:fixed;left:50%;bottom:90px;transform:translateX(-50%) translateY(20px);background:#2b2b2b;color:#fff;padding:10px 16px;border-radius:12px;font-size:.82rem;z-index:300;opacity:0;pointer-events:none;transition:.25s;max-width:90vw;text-align:center;}
#toastApp.on{opacity:1;transform:translateX(-50%) translateY(0);}
/* Detalle por pedido: una sola línea por fila (se desplaza hacia la derecha) */
@media(min-width:761px){ .dt-tabla th,.dt-tabla td{white-space:nowrap;} }
|