/* ------------------------------------------------------------------
   Módulo VENTA · borradores, por formalizar, iniciales por cobrar
   Usa los tokens de css/estilos.css (azul #4839FF, líneas, sellos).
------------------------------------------------------------------- */

/* ---------- la sección ---------- */
.venta-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:1.2rem;align-items:start}
#sec-ventas .panel>header .nota{text-align:right}

/* ---------- formulario del borrador: pensado para el pulgar ---------- */
.venta-form{display:grid;gap:.95rem;padding:1rem 1.1rem 1.2rem}
.venta-campo{display:grid;gap:.35rem;border:none;min-width:0}
.venta-campo>label,.venta-campo>legend,.venta-et{font-size:.8rem;font-weight:700;color:var(--tinta-2)}
.venta-campo>legend{margin-bottom:.35rem}
.venta-opc{font-weight:500;color:var(--tinta-3)}
.venta-form input,.venta-input-grande{
  width:100%;padding:.72rem .85rem;border:1.5px solid var(--linea-fuerte);border-radius:10px;
  background:#fff;font-size:1.02rem;min-height:46px
}
.venta-form input:focus,.venta-input-grande:focus{border-color:var(--azul);outline:none;box-shadow:0 0 0 3px var(--azul-tinte-2)}
.venta-fila2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,8.5rem);gap:.5rem}
.venta-campo-fecha input{max-width:13rem}
.venta-ayuda{font-size:.78rem;color:var(--tinta-2);min-height:1.1em;display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.venta-form .chip{min-height:44px;padding:.45rem .9rem}
.venta-guardar{width:100%;min-height:48px;font-size:1rem}
.venta-guardar-barra{display:block}
.venta-dejo-pago{display:grid;gap:.45rem;margin-top:.45rem;padding:.7rem;border:1.5px solid var(--linea);border-radius:11px;background:var(--azul-tinte)}
.venta-dejo-pago[hidden]{display:none}
.venta-dejo-pago .chip{min-height:40px}
.venta-dejo-pago select{padding:.6rem .5rem;border:1.5px solid var(--linea-fuerte);border-radius:9px;background:#fff;width:100%;min-height:44px}

/* sugerencias del buscador */
.venta-combo{position:relative}
.venta-sug{display:grid;gap:.3rem}
.venta-sug:not(:empty){margin-top:.35rem}
.venta-sug-op{display:flex;justify-content:space-between;gap:.6rem;align-items:center;width:100%;text-align:left;
  padding:.6rem .75rem;border:1.5px solid var(--linea);border-radius:10px;background:#fff;min-height:44px}
.venta-sug-op b{font-size:.9rem;font-weight:650;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.venta-sug-op span{font-size:.76rem;color:var(--tinta-2);white-space:nowrap;font-variant-numeric:tabular-nums}

/* ---------- filas de la bandeja ---------- */
.venta-filtros:not(:empty){padding:.7rem 1.05rem;border-bottom:1px solid var(--linea)}
.venta-fila{display:flex;align-items:center;gap:.7rem;padding:.75rem 1.05rem;border-bottom:1px dashed var(--linea-fuerte)}
.venta-fila:last-child{border-bottom:none}
.venta-fila .desc{flex:1;min-width:0}
.venta-fila .desc>b{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;font-size:.92rem;font-weight:650}
.venta-fila .desc span{display:block;font-size:.76rem;color:var(--tinta-2);margin-top:.1rem}
.venta-fila .desc .venta-lleva{color:var(--tinta);font-size:.84rem}
.venta-fila .monto-c{font-weight:700;text-align:right;font-size:.95rem;white-space:nowrap}
.venta-fila .monto-c .bs{font-size:.68rem;margin-top:.1rem}
.venta-acciones{display:flex;gap:.3rem;flex:none}
.venta-pie{font-size:.8rem;color:var(--tinta-2);padding:.7rem 1.05rem;border-top:1px solid var(--linea);display:flex;align-items:center;gap:.3rem;flex-wrap:wrap;max-width:none}

/* ---------- hoja del plan ---------- */
.venta-origen{background:var(--azul-tinte);border:1px solid var(--azul-tinte-2);border-radius:10px;padding:.6rem .8rem;font-size:.84rem;color:var(--tinta)}
.venta-parte{display:grid;gap:.4rem;padding:.6rem;border:1.5px solid var(--linea);border-radius:11px;background:#fff}
.venta-parte-fila{display:grid;grid-template-columns:minmax(0,8.5rem) minmax(0,1fr) auto;gap:.45rem;align-items:center}
.venta-parte-fila select{padding:.6rem .5rem;border:1.5px solid var(--linea-fuerte);border-radius:9px;background:#fff;width:100%}
.venta-eq{font-size:.75rem;color:var(--tinta-2)}
.venta-eq:empty{display:none}
#vp-partes{display:grid;gap:.45rem}
#venta-ini-partes{display:grid;gap:.45rem}
.venta-falta{display:grid;gap:.4rem;background:var(--ambar-tinte);border:1.5px solid #f0d9a8;border-radius:11px;padding:.7rem .8rem}
.venta-falta p{font-size:.84rem;color:var(--tinta)}
.venta-aviso{font-size:.84rem;color:var(--rojo);background:var(--rojo-tinte);border-radius:9px;padding:.55rem .75rem}
.venta-ok{font-size:.84rem;color:var(--verde)}
.venta-ok:empty{display:none}
.venta-corte{font-size:.86rem;display:grid;gap:.35rem}
.venta-corte:empty{display:none}
.venta-check{display:flex;gap:.5rem;align-items:flex-start;font-size:.82rem;color:var(--tinta-2);cursor:pointer}
.hoja .venta-check input,.hoja .venta-vip input{width:auto}

.venta-anticipo{display:grid;gap:.15rem;padding:.65rem .8rem;border:1.5px solid #bfe3cc;border-radius:11px;background:var(--verde-tinte);font-size:.86rem}
.venta-anticipo span{font-size:.78rem;color:var(--tinta-2)}

/* ---------- aviso con acción («Ver venta»): arriba, por encima de la hoja ---------- */
#venta-aviso{position:fixed;top:.8rem;left:50%;transform:translateX(-50%);z-index:95;display:none;align-items:center;gap:.6rem;
  width:max-content;max-width:min(94vw,560px);background:var(--azul-noche);color:#fff;padding:.6rem .7rem .6rem 1rem;border-radius:12px;
  box-shadow:var(--sombra);font-size:.9rem}
#venta-aviso.visible{display:flex}
#venta-aviso .btn.linea{background:#fff;color:var(--azul-osc);border-color:#fff;flex:none;min-height:36px}
.venta-aviso-x{color:#D7D3FF;font-size:1.3rem;line-height:1;padding:.2rem .4rem;flex:none;min-width:32px;min-height:32px}
@media (prefers-reduced-motion:no-preference){
  #venta-aviso.visible{animation:venta-baja .2s ease-out}
  @keyframes venta-baja{from{opacity:0;transform:translateX(-50%) translateY(-6px)}to{opacity:1;transform:translateX(-50%)}}
}

/* ---------- casilla de cliente personal ---------- */
.venta-vip{display:flex;gap:.6rem;align-items:flex-start;padding:.8rem 1.05rem;font-size:.88rem;cursor:pointer;border-bottom:1px dashed var(--linea-fuerte)}
.hoja .venta-vip{padding:.6rem 0;border-bottom:none}
.venta-vip input{width:20px;height:20px;margin-top:.1rem;accent-color:var(--azul);flex:none}
.venta-vip input:disabled{cursor:not-allowed}
.venta-vip small{display:block;font-size:.76rem;color:var(--tinta-2);margin-top:.1rem}
.venta-exp .fila-cuota .desc span+span{margin-top:.1rem}
.venta-falta-linea{color:var(--ambar) !important;font-weight:650}

/* ---------- botones: pulsado inmediato, hover sólo con ratón ---------- */
#sec-ventas .btn,#hoja .btn,#venta-btn-borrador{transition:background-color .09s ease-out, transform .09s ease-out}
#sec-ventas .btn:active,#hoja .btn:active,#venta-btn-borrador:active,
.venta-sug-op:active,#sec-ventas .chip:active{transform:scale(.97)}
#sec-ventas .btn[data-cargando],#hoja .btn[data-cargando]{position:relative;color:transparent !important;pointer-events:none}
#sec-ventas .btn[data-cargando]::after,#hoja .btn[data-cargando]::after{content:'';position:absolute;inset:0;margin:auto;width:18px;height:18px;border-radius:50%;
  border:2px solid rgba(255,255,255,.55);border-top-color:#fff;animation:venta-gira .7s linear infinite}
@keyframes venta-gira{to{transform:rotate(360deg)}}
@media (hover:hover) and (pointer:fine){
  .venta-sug-op:hover{border-color:var(--azul);background:var(--azul-tinte)}
}
@media (prefers-reduced-motion:reduce){
  #sec-ventas .btn,#hoja .btn,#venta-btn-borrador{transition:none}
  #sec-ventas .btn:active,#hoja .btn:active,#venta-btn-borrador:active,.venta-sug-op:active,#sec-ventas .chip:active{transform:none}
  #sec-ventas .btn[data-cargando]::after,#hoja .btn[data-cargando]::after{animation-duration:2s}
}

/* ---------- responsivo ---------- */
/* En el teléfono, «Guardar borrador» queda fijo abajo (y encima del teclado: --venta-kb). */
@media (max-width:720px){
  .venta-guardar-barra{position:sticky;bottom:var(--venta-kb,0px);z-index:6;background:#fff;
    margin:0 -1.1rem -1.2rem;padding:.6rem 1.1rem calc(.7rem + env(safe-area-inset-bottom));border-top:1px solid var(--linea)}
}
@media (max-width:920px){
  .venta-grid{grid-template-columns:minmax(0,1fr)}
  /* dueño y cobranza ven primero lo que hay que formalizar */
  #sec-ventas.venta-formaliza #venta-panel-form{order:2}
}
@media (max-width:520px){
  .venta-fila{flex-wrap:wrap}
  .venta-fila .desc{flex-basis:100%}
  .venta-acciones{margin-left:auto}
  .venta-parte-fila{grid-template-columns:minmax(0,8.2rem) minmax(0,1fr) auto}
  .venta-fila2.venta-precio-fecha{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .venta-fila2{grid-template-columns:minmax(0,1fr) minmax(0,7rem)}
}
.venta-parte > select[data-k="tipoBien"]{padding:.6rem .5rem;border:1.5px solid var(--linea-fuerte);border-radius:9px;background:#fff;width:100%}