/*
  inventory-v2.css — REDISEÑO FOTO-PROTAGONISTA (maqueta)
  ─────────────────────────────────────────────────────────
  Capa sobre inventory.css: convierte las cards del inventario en
  "portadas" donde la foto ocupa toda la tarjeta y los datos van
  sobrepuestos con un degradado sutil. No toca filtros ni lógica.
  Cargar SIEMPRE después de inventory.css.
*/

/* ── Grid: 2 columnas amplias en desktop, 1 columna en móvil ── */
.inv-grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 1.75rem;
}
@media (max-width: 1100px) {
  .inv-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
  .inv-grid { grid-template-columns: 1fr; gap: 1.1rem; }
}

/* ── Card: la foto ES la card ── */
.pcard {
  position: relative;
  border: 0;
  border-radius: 18px;
  overflow: hidden;
  background: #111;
}
.pcard:hover {
  transform: translateY(-4px);
  box-shadow: 0 28px 56px -26px rgba(0, 0, 0, 0.55);
}
.pcard-media {
  aspect-ratio: 3 / 2;
  border-radius: 0;
}
.pcard:hover .pcard-media img { transform: scale(1.045); }

/* Listón de tipo (esquina inferior): fuera — compite con la foto */
.pcard-type { display: none; }

/* Badge de operación: pastilla translúcida sobre la foto */
.pcard-badge {
  top: 16px; left: 16px;
  background: rgba(10, 10, 10, 0.55);
  color: #fff;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-radius: 999px;
  padding: 0.38rem 0.8rem;
}

/* ── Datos sobrepuestos con degradado ── */
.pcard-body {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 4.5rem 1.35rem 1.15rem;
  gap: 0.22rem;
  background: linear-gradient(to top, rgba(6, 8, 10, 0.82) 0%, rgba(6, 8, 10, 0.55) 45%, rgba(6, 8, 10, 0) 100%);
  pointer-events: none;
}
.pcard-meta { display: none; }
.pcard-price {
  color: #fff;
  font-size: 1.65rem;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35);
}
.pcard-price .per { color: rgba(255, 255, 255, 0.75); }
.pcard-title {
  color: rgba(255, 255, 255, 0.94);
  font-size: 1rem;
}
.pcard-zone { color: rgba(255, 255, 255, 0.82); }
.pcard-zone svg { opacity: 0.85; }
.pcard-specs {
  border-top: 1px solid rgba(255, 255, 255, 0.22);
  color: rgba(255, 255, 255, 0.88);
  margin-top: 0.45rem;
  padding-top: 0.55rem;
}
.pcard-spec svg { opacity: 0.8; }

/* Apartada: foto ligeramente apagada + sello visible */
.pcard.is-apartado .pcard-media img { filter: saturate(0.7) brightness(0.85); }
.pcard-status { top: 16px; right: 16px; }

/* ── Móvil: full-bleed protagonista, todos los datos visibles ── */
@media (max-width: 600px) {
  .pcard-media .pcard-badge { display: inline-block; }
  .pcard-title { display: -webkit-box; }
  .pcard-body { padding: 3.6rem 1.1rem 1rem; }
  .pcard-price { font-size: 1.45rem; }
  .pcard-specs { font-size: 0.8rem; }
}