/* SWITCH CRM · estilos de app4.js */
/* ================= EL NEGOCIO =================
   Los datos de la operacion que Nico carga a mano en cada ficha. */
.panel-negocio{margin-top:1rem;padding:.95rem 1rem 1.05rem;border:1px solid var(--bd2);
  border-left:2px solid var(--or);background:var(--b3);box-shadow:var(--sombra)}
.neg-cab{display:flex;align-items:baseline;justify-content:space-between;gap:.6rem;flex-wrap:wrap}
.neg-cab h3{font-size:1.2rem;margin:0}
.neg-estado{font-size:.68rem;letter-spacing:.03em;color:var(--tx3)}
.neg-estado.pendiente{color:var(--or)}
.neg-estado.bien{color:var(--ok)}
.neg-estado.mal{color:var(--alto)}
.neg-ayuda{color:var(--tx3);font-size:.7rem;line-height:1.55;margin:.35rem 0 .7rem}
.neg-atajos{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.75rem}
.neg-atajo{font:inherit;font-size:.66rem;letter-spacing:.03em;cursor:pointer;
  padding:.32rem .62rem;border:1px solid var(--bd2);border-radius:var(--r);
  background:var(--b2);color:var(--tx2);transition:border-color .15s,color .15s,background .15s}
.neg-atajo:hover{border-color:var(--or);color:var(--or);background:rgba(255,106,0,.08)}
.neg-atajo:focus-visible{outline:2px solid var(--or);outline-offset:2px}
.neg-cuerpo{display:grid;gap:.4rem}
.neg-fila{display:grid;grid-template-columns:minmax(0,9rem) minmax(0,1fr) auto;gap:.4rem;align-items:center}
.neg-fila input{width:100%;min-width:0}
.neg-fila .neg-t{font-weight:600}
.neg-x{font:inherit;font-size:1rem;line-height:1;cursor:pointer;width:1.9rem;height:1.9rem;
  border:1px solid transparent;background:transparent;color:var(--tx3)}
.neg-x:hover{color:var(--alto);border-color:var(--bd2);background:var(--b2)}
.neg-pie{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.75rem}
@media(max-width:560px){
  .neg-fila{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"t x" "v v"}
  .neg-fila .neg-t{grid-area:t}
  .neg-fila .neg-v{grid-area:v}
  .neg-fila .neg-x{grid-area:x}
}

/* ================= SUS OPERACIONES ================= */
.ops-cab{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.15rem}
.ops-cab h3{font-size:1.25rem;margin:0}
.ops-ayuda{color:var(--tx3);font-size:.7rem;line-height:1.55;margin:0 0 .75rem}
.panel-ops .kpis{margin-bottom:.85rem}
.ops-lista{display:grid;gap:.55rem}
.op{border:1px solid var(--bd);border-left:2px solid var(--or);background:var(--b3);
  padding:.7rem .8rem;box-shadow:var(--sombra)}
.op-cab{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem;flex-wrap:wrap}
.op-cab strong{font-size:.92rem}
.op-cab .et{margin-left:.25rem}
.op-meta{color:var(--tx3);font-size:.68rem;margin-top:.3rem;line-height:1.5}
.op-chips{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.5rem}
.op-chip{font-size:.66rem;line-height:1.3;padding:.24rem .5rem;border:1px solid var(--bd);
  background:var(--b2);color:var(--tx2)}
.op-chip i{font-style:normal;color:var(--tx3);text-transform:uppercase;letter-spacing:.05em;
  font-size:.6rem;margin-right:.25rem}
.op-extra{margin-top:.45rem;font-size:.72rem;color:var(--or)}
.op-ultimo{margin-top:.4rem;font-size:.72rem;color:var(--tx2);line-height:1.5}
.op-ultimo b{color:var(--tx3);font-weight:600}
.op-sueltos{margin-top:.6rem;font-size:.7rem;color:var(--tx3);line-height:1.55}
@media(max-width:560px){
  .op-cab{flex-direction:column;align-items:stretch}
  .op-cab .btn{align-self:flex-start}
}

/* ================= REVENDEDORES ================= */
.marca-reventa{display:flex;align-items:center;justify-content:space-between;gap:.7rem;flex-wrap:wrap;
  margin-top:1rem;padding:.65rem .8rem;border:1px dashed var(--bd2);background:var(--b3)}
.marca-reventa .mr-txt{font-size:.76rem;color:var(--tx2)}
.marca-reventa .mr-txt b{color:var(--or)}
#cuerpoRevendedores .panel h3{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
#cuerpoRevendedores .fila small.movs{color:var(--or);opacity:.85}
#cuerpoRevendedores .acc{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
@media(max-width:560px){
  .marca-reventa{flex-direction:column;align-items:stretch}
  .marca-reventa .btn{align-self:flex-start}
}

/* Los importes son largos y se partian al medio ("$ 122.000.00" y abajo el
   "0"). Solo los recuadros de plata llevan letra mas chica y sin cortes; los
   que muestran un numero corto siguen grandes como siempre. */
.panel-ops .kpis,
#cuerpoRevendedores .kpis{grid-template-columns:repeat(auto-fit,minmax(155px,1fr))}
.kpi.plata b{white-space:nowrap;word-break:normal;
  font-size:clamp(.95rem, 7cqi, 1.5rem)}