/*
 * VAZZTEC R58 · Imágenes de producto completas y proporcionadas
 * Capa exclusivamente visual. No altera los archivos originales ni el POS.
 */

/* Todos los marcos conservan su tamaño; el margen interior evita que el
   producto se confunda con el borde aun cuando la fotografía llegue justa. */
.inventario-producto-imagen,
.inventario-imagen-editor #previewImagenProducto,
#vistaCatalogoPedidos .catalogo-imagen,
.catalogo-imagen-editor > div:not(.catalogo-image-notices) {
  position: relative;
  box-sizing: border-box;
  background: #fff !important;
}

/* No se fuerza simultáneamente ancho y alto. De esta manera el navegador
   conserva la relación de aspecto real y nunca recorta la fotografía. */
.inventario-producto-imagen > img,
.inventario-imagen-editor #previewImagenProducto > img,
#vistaCatalogoPedidos .catalogo-imagen > img,
.catalogo-imagen-editor > div:not(.catalogo-image-notices) > img {
  display: block;
  position: absolute;
  inset: 5px;
  width: calc(100% - 10px) !important;
  height: calc(100% - 10px) !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0;
  object-fit: contain !important;
  object-position: center center !important;
}

/* En la edición se aprovecha mejor el ancho disponible sin hacer más alto
   el modal ni desplazar sus campos o botones. */
.inventario-imagen-editor #previewImagenProducto {
  min-width: 0;
}

/* La miniatura del catálogo mantiene exactamente la cuadrícula actual. */
#vistaCatalogoPedidos .catalogo-imagen-bloque,
#vistaCatalogoPedidos .catalogo-imagen {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 760px) {
  .inventario-producto-imagen,
  .inventario-imagen-editor #previewImagenProducto,
  #vistaCatalogoPedidos .catalogo-imagen {
    background: #fff !important;
  }

  .inventario-producto-imagen > img,
  .inventario-imagen-editor #previewImagenProducto > img,
  #vistaCatalogoPedidos .catalogo-imagen > img {
    inset: 4px;
    width: calc(100% - 8px) !important;
    height: calc(100% - 8px) !important;
  }
}