/* =========================================================================
 *  logistica/insumo — pestaña nuevo/editar (moderno, responsive)
 *  CLARO por defecto (todo legacy + nuevo light). OSCURO SOLO en el diseño
 *  nuevo (body.g-newdesign.theme-dark). En legacy siempre claro/nativo.
 *  Prefijo lv-ins* / lv-suc* para no colisionar con el tema.
 * ========================================================================= */

.lv-insform { --lv-accent:#2563eb; --lv-bd:#e5e7eb; --lv-bg:#ffffff; --lv-bg2:#f8fafc; --lv-tx:#0f172a; --lv-mut:#64748b; padding: 4px 2px 24px; color: var(--lv-tx); }

/* ---- barra superior (título + acciones) ---- */
.lv-insform-bar { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 14px; margin-bottom: 14px; background: var(--lv-bg); border: 1px solid var(--lv-bd); border-radius: 12px; box-shadow: 0 1px 3px rgba(15,23,42,.06); }
.lv-insform-bar-t { font-size: 17px; font-weight: 700; display: flex; align-items: center; gap: 9px; }
.lv-insform-bar-t > i { color: var(--lv-accent); }
.lv-insform-bar-code { font-weight: 500; font-size: 12px; color: var(--lv-mut); background: var(--lv-bg2); border: 1px solid var(--lv-bd); border-radius: 20px; padding: 2px 10px; }
.lv-insform-bar-code:empty { display: none; }   /* en alta no hay código todavía */
.lv-insform-bar-a { display: flex; align-items: center; gap: 8px; }
/* indicador de atajo dentro del botón Grabar/Actualizar */
.lv-kbd { display: inline-block; margin-left: 7px; padding: 0 6px; font-size: 10.5px; font-weight: 600; line-height: 17px; border-radius: 5px; background: rgba(255,255,255,.22); border: 1px solid rgba(255,255,255,.4); vertical-align: middle; }

/* ---- layout de columnas ---- */
.lv-insform-cols { display: grid; grid-template-columns: 1.35fr 1fr; gap: 14px; margin-bottom: 14px; }
@media (max-width: 900px) { .lv-insform-cols { grid-template-columns: 1fr; } }

/* ---- tarjetas ---- */
/* sin overflow:hidden -> deja salir los desplegables (chosen) de categoría/unidad/igv */
.lv-card { background: var(--lv-bg); border: 1px solid var(--lv-bd); border-radius: 12px; box-shadow: 0 1px 3px rgba(15,23,42,.05); margin-bottom: 14px; }
.lv-card-h { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 11px 14px; font-weight: 700; font-size: 14px; background: var(--lv-bg2); border-bottom: 1px solid var(--lv-bd); border-radius: 12px 12px 0 0; }
.lv-card-h > i { color: var(--lv-accent); }
.lv-card-hint { flex-basis: 100%; font-weight: 400; font-size: 12px; color: var(--lv-mut); }
.lv-card-b { padding: 14px; }
.lv-card-b .form-group { margin-bottom: 12px; }
.lv-card-b .control-label { font-weight: 600; font-size: 12.5px; padding-top: 7px; }

.lv-hint { font-size: 11.5px; color: var(--lv-mut); margin: 2px 0 0; }
.lv-nowrap { white-space: nowrap; padding-left: 0; }
.lv-auto { display: flex; align-items: center; gap: 6px; padding-top: 4px; }
.lv-igv .input-group-addon { background: var(--lv-bg2); }
.lv-prov { border-top: 1px dashed var(--lv-bd); margin-top: 8px; padding-top: 12px; }
.lv-prov .control-label { display: block; margin-bottom: 6px; }

/* ---- sucursales: una por fila (a todo el ancho) -> más espacio para presentaciones ---- */
.lv-sucs { display: grid; grid-template-columns: 1fr; gap: 12px; }
.lv-sucs-load { grid-column: 1/-1; text-align: center; color: var(--lv-mut); padding: 24px; font-size: 24px; }
.lv-sucs-empty { grid-column: 1/-1; text-align: center; color: var(--lv-mut); padding: 24px; }

/* tarjeta de una sucursal */
.lv-suc { border: 1.5px solid var(--lv-bd); border-radius: 11px; background: var(--lv-bg2); transition: border-color .15s, box-shadow .15s, background .15s; }
.lv-suc.is-on { border-color: var(--lv-accent); background: var(--lv-bg); box-shadow: 0 2px 10px rgba(37,99,235,.10); }
.lv-suc-h { display: flex; align-items: center; gap: 10px; padding: 11px 12px; cursor: pointer; user-select: none; }
.lv-suc-name { font-weight: 700; font-size: 13.5px; flex: 1; }
.lv-suc-badge { font-size: 11px; color: var(--lv-mut); background: var(--lv-bg); border: 1px solid var(--lv-bd); border-radius: 20px; padding: 1px 9px; }
.lv-suc.is-on .lv-suc-badge { color: var(--lv-accent); border-color: var(--lv-accent); }

.lv-suc-b { display: none; padding: 0 12px 12px; }
.lv-suc.is-on .lv-suc-b { display: block; }

.lv-suc-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px 14px; padding: 10px 0; border-top: 1px dashed var(--lv-bd); }
.lv-fld { display: flex; flex-direction: column; gap: 4px; }
.lv-fld.lv-fld-wide { grid-column: span 2; min-width: 220px; }
.lv-fld > label { font-size: 11px; font-weight: 600; color: var(--lv-mut); margin: 0; text-transform: uppercase; letter-spacing: .3px; }
.lv-fld .form-control { height: 34px; }
.lv-fld-ro .form-control { background: var(--lv-bg2); color: var(--lv-mut); }
.lv-fld .form-control:disabled { background: var(--lv-bg2); color: var(--lv-mut); cursor: not-allowed; opacity: .7; }

/* presentaciones dentro de una sucursal (editables inline) */
.lv-pres { margin-top: 4px; border-top: 1px dashed var(--lv-bd); padding-top: 10px; }
.lv-pres-t { font-size: 11px; font-weight: 700; color: var(--lv-mut); text-transform: uppercase; letter-spacing: .3px; margin-bottom: 6px; display: flex; align-items: center; justify-content: space-between; }
.lv-pres table { width: 100%; font-size: 12.5px; margin: 0 0 8px; background: transparent; }
.lv-pres table th { font-size: 10px; color: var(--lv-mut); text-transform: uppercase; font-weight: 700; padding: 3px 6px; border-bottom: 1px solid var(--lv-bd); background: transparent; }
.lv-pres table td { padding: 3px 5px; vertical-align: middle; border-color: var(--lv-bd); }
.lv-pres .form-control { height: 30px; font-size: 12.5px; padding: 3px 8px; }
.lv-pres-tbl th:first-child, .lv-pres-tbl td:first-child { width: 1%; white-space: nowrap; text-align: center; }
/* fila base: destacada con acento + barra lateral + ícono */
.lv-pres-base td { font-weight: 600; background: rgba(37,99,235,.08); box-shadow: inset 0 -1px 0 var(--lv-bd); }
.lv-pres-base td:first-child { box-shadow: inset 3px 0 0 var(--lv-accent), inset 0 -1px 0 var(--lv-bd); }
.lv-pres-ic { color: var(--lv-accent); font-size: 14px; }
.lv-pres-mut { color: var(--lv-mut); font-size: 11px; font-weight: 500; }
.lv-pres-badge { font-size: 9.5px; font-weight: 700; color: var(--lv-accent); border: 1px solid var(--lv-accent); border-radius: 20px; padding: 0 6px; text-transform: uppercase; margin-left: 4px; }
.lv-pres-load { color: var(--lv-mut); font-size: 11px; }
body.g-newdesign.theme-dark .lv-pres-base td { background: rgba(59,130,246,.14); }

/* acciones por fila (editar / guardar / borrar) */
.lv-pres-t { text-transform: none; }
.lv-pres-actions { white-space: nowrap; }
.lv-pres-actions .btn { margin: 0 1px; padding: 2px 6px; }

/* toggle LECTURA (texto) <-> EDICIÓN (inputs) POR FILA */
.lv-pres .lv-ed { display: none; }
.lv-ro { display: inline-block; padding: 4px 2px; }
.lv-pres-row.editing .lv-ro { display: none; }
.lv-pres-row.editing .lv-ed { display: block; }
/* por defecto solo "Editar" (lápiz); en edición aparecen "Grabar" (check) y borrar */
.lv-pres-row ._p_done, .lv-pres-row ._p_del { display: none; }
.lv-pres-row.editing ._p_edit { display: none; }
.lv-pres-row.editing ._p_done, .lv-pres-row.editing ._p_del { display: inline-block; }
/* fila para agregar una presentación: Presentación (ancho) / Equiv|Precio / botón */
.lv-pres-add { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 8px; padding-top: 8px; border-top: 1px dashed var(--lv-bd); }
.lv-pres-add ._a_um, .lv-pres-add ._a_btn { grid-column: 1 / -1; }
.lv-pres-add .btn { width: 100%; }

/* sin flechitas en los inputs numéricos (look más limpio) */
.lv-insform input[type=number]::-webkit-inner-spin-button,
.lv-insform input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.lv-insform input[type=number] { -moz-appearance: textfield; }

/* ---- switch iOS ---- */
.lv-switch { position: relative; display: inline-block; width: 42px; height: 23px; margin: 0; flex: 0 0 auto; }
.lv-switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.lv-switch .lv-sl { position: absolute; inset: 0; cursor: pointer; background: #cbd5e1; border-radius: 999px; transition: .2s; }
.lv-switch .lv-sl:before { content: ""; position: absolute; height: 17px; width: 17px; left: 3px; top: 3px; background: #fff; border-radius: 50%; transition: .2s; box-shadow: 0 1px 2px rgba(0,0,0,.25); }
.lv-switch input:checked + .lv-sl { background: var(--lv-accent); }
.lv-switch input:checked + .lv-sl:before { transform: translateX(19px); }

/* ================= dark =================
   El modo oscuro es EXCLUSIVO del diseño nuevo (body.g-newdesign.theme-dark).
   En legacy los skins de SmartAdmin (incluido smart-style-1 "oscuro elegante",
   que solo oscurece header/nav pero deja el CONTENIDO claro) NO deben pintar
   estos formularios de oscuro → siempre claro/nativo. */
body.g-newdesign.theme-dark .lv-insform { --lv-accent:#3b82f6; --lv-bd:#334155; --lv-bg:#0f172a; --lv-bg2:#1e293b; --lv-tx:#e2e8f0; --lv-mut:#94a3b8; }
body.g-newdesign.theme-dark .lv-insform-bar,
body.g-newdesign.theme-dark .lv-card { box-shadow: none; }
body.g-newdesign.theme-dark .lv-switch .lv-sl { background: #475569; }

/* ================= LEGACY: cabeceras estilo nativo =================
   El sistema nativo pinta las cabeceras de panel con `.lv-container header`
   = #404040 charcoal + texto blanco (generic.css, todos los skins). Estos
   formularios usan `.lv-card`, así que replicamos ESE header en legacy:
   cabecera charcoal + CUERPO claro (igual que el panel nativo). Solo aplica
   fuera del diseño nuevo (body:not(.g-newdesign)). */
body:not(.g-newdesign) .lv-insform-bar,
body:not(.g-newdesign) .lv-card-h {
    background: #404040;
    color: #fff;
    border-color: #404040;
}
body:not(.g-newdesign) .lv-insform-bar-t,
body:not(.g-newdesign) .lv-card-h > i,
body:not(.g-newdesign) .lv-insform-bar-t > i { color: #fff; }
body:not(.g-newdesign) .lv-card-hint { color: #c8cdd4; }

/* ================= producto (reusa lv-* de insumo) ================= */
.lv-img-prev { display: block; width: 80px; height: 80px; object-fit: cover; border: 1px solid var(--lv-bd); border-radius: 8px; margin-bottom: 6px; background: var(--lv-bg2); }
.lv-pres-add ._a_pv { max-width: 90px; }
/* fila de agregar presentación (producto): eq / margen / venta en 3 columnas */
.lv-pres-add-nums { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
.lv-pres-add-nums .form-control { max-width: none; }
.lv-precios-tbl { margin-bottom: 0; max-width: 420px; }
.lv-precios-tbl ._precios { max-width: 260px; }
#c_precios .lv-card-h .btn { margin-left: 8px; vertical-align: middle; }
