/* Venetti - Salida de bodega por escaneo. Todo bajo #sal-raiz. */

#sal-raiz .sal-sub { color: var(--txt2); max-width: 62ch; margin: .3rem 0 0; }

#sal-raiz .sal-aviso {
  margin: .9rem 0; padding: .75rem .9rem; border-radius: var(--r);
  background: var(--sup2); border: 1px solid var(--bor); color: var(--txt);
}
#sal-raiz .sal-aviso.sal-malo { border-color: var(--rojo); color: var(--rojo); }

#sal-raiz .sal-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: .8rem; margin-top: .6rem;
}
#sal-raiz .sal-campo { display: flex; flex-direction: column; gap: .3rem; }
#sal-raiz .sal-lbl {
  font-size: .74rem; letter-spacing: .04em; text-transform: uppercase; color: var(--txt2);
}
#sal-raiz .sal-in {
  width: 100%; padding: .6rem .7rem; border-radius: var(--r);
  border: 1px solid var(--bor); background: var(--sup); color: var(--txt);
  font-size: 1rem; box-sizing: border-box;
}
#sal-raiz .sal-nota { color: var(--txt2); font-size: .9rem; margin: .8rem 0 0; max-width: 62ch; }
#sal-raiz .sal-check {
  display: flex; align-items: center; gap: .5rem; margin-top: .9rem;
  padding: .6rem .75rem; border-radius: var(--r);
  border: 1px solid var(--bor); background: var(--sup2);
}
#sal-raiz .sal-check input { width: 1.1rem; height: 1.1rem; flex: 0 0 auto; }
#sal-raiz .sal-check span { font-size: .92rem; }

/* captura */
#sal-raiz .sal-captura { display: flex; gap: .5rem; margin-top: .6rem; }
#sal-raiz .sal-campo-cod {
  flex: 1; padding: .85rem .8rem; border-radius: var(--r);
  border: 2px solid var(--verde); background: var(--sup); color: var(--txt);
  font-size: 1.15rem; font-variant-numeric: tabular-nums; letter-spacing: .02em;
  box-sizing: border-box;
}
#sal-raiz .sal-campo-cod:focus { outline: none; border-color: var(--turq); }

#sal-raiz .sal-btn {
  padding: .85rem 1.1rem; border-radius: var(--r); border: 0;
  background: var(--verde); color: #fff; font-size: 1rem; font-weight: 600; cursor: pointer;
}
#sal-raiz .sal-btn:disabled { opacity: .45; cursor: default; }
#sal-raiz .sal-btn-grande { width: 100%; padding: 1rem; font-size: 1.05rem; margin-top: .8rem; }

#sal-raiz .sal-mini {
  padding: .45rem .75rem; border-radius: var(--r); cursor: pointer;
  border: 1px solid var(--bor); background: var(--sup2); color: var(--txt); font-size: .88rem;
}

#sal-raiz .sal-sugs {
  margin-top: .5rem; border: 1px solid var(--bor); border-radius: var(--r);
  background: var(--sup); overflow: hidden;
}
#sal-raiz .sal-sug {
  display: flex; flex-direction: column; align-items: flex-start; gap: .1rem;
  width: 100%; text-align: left; padding: .6rem .75rem;
  border: 0; border-bottom: 1px solid var(--bor); background: none;
  color: var(--txt); font: inherit; cursor: pointer;
}
#sal-raiz .sal-sug:last-child { border-bottom: 0; }
#sal-raiz .sal-sug:hover { background: var(--sup2); }
#sal-raiz .sal-sug-cod { font-weight: 600; font-variant-numeric: tabular-nums; }
#sal-raiz .sal-sug-sub { font-size: .84rem; color: var(--txt2); }

#sal-raiz .sal-ranura:empty { display: none; }
#sal-raiz .sal-ranura { margin-top: .6rem; }

/* eco de la última lectura */
#sal-raiz .sal-eco {
  margin-top: .7rem; padding: .7rem .85rem; border-radius: var(--r);
  border: 1px solid var(--bor); background: var(--sup2);
  font-size: 1rem; line-height: 1.35;
}
#sal-raiz .sal-eco-bien { border-color: var(--verde); color: var(--verde); }
#sal-raiz .sal-eco-ojo  { border-color: var(--ambar); color: var(--ambar); }
#sal-raiz .sal-eco-malo { border-color: var(--rojo);  color: var(--rojo); }

/* totales */
#sal-raiz .sal-kpis { display: flex; gap: 1.6rem; margin: .9rem 0 .2rem; flex-wrap: wrap; }
#sal-raiz .sal-kpi { display: flex; flex-direction: column; }
#sal-raiz .sal-kv { font-size: 1.5rem; font-weight: 700; line-height: 1.1; }
#sal-raiz .sal-kt { font-size: .78rem; color: var(--txt2); text-transform: uppercase; letter-spacing: .04em; }

#sal-raiz .sal-acciones { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }

/* lista */
#sal-raiz .sal-lista { margin-top: .8rem; }
#sal-raiz .sal-vacio { color: var(--txt2); padding: .8rem 0; max-width: 62ch; }
#sal-raiz .sal-fila {
  display: flex; align-items: center; gap: .6rem;
  padding: .55rem 0; border-bottom: 1px solid var(--bor);
}
#sal-raiz .sal-fila-izq { flex: 1; display: flex; flex-direction: column; min-width: 0; }
#sal-raiz .sal-cod { font-weight: 600; font-variant-numeric: tabular-nums; }
#sal-raiz .sal-desc { font-size: .85rem; color: var(--txt2); }
#sal-raiz .sal-tag {
  font-size: .75rem; color: var(--ambar); border: 1px solid var(--ambar);
  border-radius: 999px; padding: .12rem .5rem; white-space: nowrap;
}
#sal-raiz .sal-cant {
  width: 4.2rem; padding: .45rem .4rem; text-align: center;
  border-radius: var(--r); border: 1px solid var(--bor);
  background: var(--sup); color: var(--txt); font-size: 1rem;
}
#sal-raiz .sal-quitar {
  border: 0; background: none; color: var(--txt2);
  font-size: 1.35rem; line-height: 1; cursor: pointer; padding: 0 .3rem;
}
#sal-raiz .sal-quitar:hover { color: var(--rojo); }

/* cámara */
#sal-raiz .sal-cam-caja { margin-top: .7rem; }
#sal-raiz .sal-cam-video {
  width: 100%; max-width: 460px; border-radius: var(--r);
  background: #000; display: block;
}
#sal-raiz .sal-cam-pie { color: var(--txt2); font-size: .85rem; margin: .5rem 0 0; max-width: 62ch; }

@media (max-width: 560px) {
  #sal-raiz .sal-captura { flex-direction: column; }
  #sal-raiz .sal-btn { width: 100%; }
}

/* Lo que la ultima visita dejo pedido y todavia no ha salido. */
#sal-raiz .sal-pend{
  margin:10px 0 0;font-size:13px;line-height:1.45;font-weight:600;
  color:var(--txt);background:color-mix(in srgb, var(--ambar) 14%, transparent);
  border-left:3px solid var(--ambar);border-radius:0 var(--r) var(--r) 0;
  padding:9px 12px;
}