/* =============================================================================
   pg-card-v03.css — product card restyle from design_handoff_prestashop_shop
   (shop.js card()): white bordered card, hover shadow-lg, 4:3 image area with
   hairline base + carrier-cert logo strip, serif 1.35rem name, 2-line blurb,
   "More details ›" link, cert chips + price footer, full-width dark Add button.
   Loaded AFTER theme.css / pg-theme-v02.css — overrides their card rules.
   ============================================================================= */

.pg-product-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--rule, rgba(17, 17, 16, 0.12));
  transition: box-shadow 0.2s ease;
}
.pg-product-card:hover {
  background: #fff;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

/* ---- image area: 4:3, centered, hairline base, optional cert strip ---- */
.pg-card__media-link { display: block; }
.pg-card__media {
  position: relative;
  aspect-ratio: 4 / 3;
  display: grid;
  place-items: center;
  padding: 24px;
  border-bottom: 1px solid var(--rule, rgba(17, 17, 16, 0.12));
  background: #fff;
  overflow: hidden;
}
.pg-card__media--certs { padding-bottom: 64px; }
.pg-card__media img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  padding: 0;
  mix-blend-mode: multiply;
}
.pg-product-card:hover .pg-card__media img { transform: none; }
.pg-card__slot {
  font-family: var(--mono, "IBM Plex Mono", monospace);
  font-size: 0.6rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--muted-2, #8a8880);
}
.pg-card__certstrip {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  border-top: 1px solid var(--rule, rgba(17, 17, 16, 0.12));
  background: #fff;
  padding: 8px 12px;
}
.pg-card__certstrip img { height: 34px; width: auto; max-width: none; }

/* ---- body ---- */
.pg-card__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 16px;
}
.pg-card__meta { margin-top: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.pg-card__name {
  margin: 6px 0 0;
  font-family: var(--serif, "Tiempos Headline", Georgia, serif);
  font-size: 1.35rem;
  font-weight: 600;
  line-height: 1.15;
  min-height: 2.3em;
}
.pg-card__desc {
  margin: 6px 0 0;
  font-family: "Tiempos Text", Georgia, serif;
  font-size: 0.95rem;
  line-height: 1.45;
  min-height: 3em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pg-card__more {
  margin-top: 4px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--sans, "IBM Plex Sans", sans-serif);
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--accent, #0d6efd);
  text-decoration: none;
  align-self: flex-start;
}
.pg-card__more:hover { color: #0a4cb5; text-decoration: none; }
.pg-card__more span { font-size: 0.8em; }

/* ---- footer: cert chips row + price + full-width action ---- */
.pg-card__foot {
  margin-top: auto;
  padding-top: 12px;
  border-top: 0;
  display: block;
}
.pg-card__certchips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-height: 20px;
  margin-bottom: 8px;
}
.pg-cert-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--rule, rgba(17, 17, 16, 0.12));
  background: #fff;
  padding: 2px 8px;
  font-family: var(--sans, "IBM Plex Sans", sans-serif);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.pg-card__priceblock { min-height: 52px; }
.pg-card__actionrow { margin-top: 12px; }
.pg-card__actionrow .pg-card__add {
  display: block;
  width: 100%;
  padding: 10px 0;
  text-align: center;
  border: 0;
  background: var(--ink, #111110);
  color: #fff;
  font-family: var(--sans, "IBM Plex Sans", sans-serif);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
  transition: background-color 0.2s ease;
}
.pg-card__actionrow .pg-card__add:hover { background: var(--accent, #0d6efd); color: #fff; text-decoration: none; }
.pg-card__actionrow .pg-card__add.is-added { background: var(--green, #1f7a4d); }

/* ---- list view (category page toggle): media left, body right ---- */
.pg-products-grid.list-view .pg-product-card { flex-direction: row; }
.pg-products-grid.list-view .pg-card__media-link { width: 240px; flex-shrink: 0; }
.pg-products-grid.list-view .pg-card__media {
  height: 100%;
  aspect-ratio: auto;
  border-bottom: 0;
  border-right: 1px solid var(--rule, rgba(17, 17, 16, 0.12));
}
