/**
 * Collection « Les produits » — bottom packshots under text.
 * Shared height shelf (same scale as other collection pages).
 * Width follows each product’s real aspect ratio via object-fit: contain.
 * Three thumbs always stay visible in one row.
 */

body.cf-v3 .cf-collection-v3-products-btn {
  display: inline-flex;
  align-items: center;
  margin: 18px 0 8px;
  align-self: flex-start;
}

/* Voir les produits — each collection's brand primary */
body.cf-v3 .cf-collection-v3-products-btn.btn-blue {
  background-color: var(--cf-jds-primary);
  color: #fff;
}

body.cf-v3 .cf-collection-v3-products-btn.btn-blue:hover,
body.cf-v3 .cf-collection-v3-products-btn.btn-blue:focus-visible {
  background-color: var(--cf-jds-dark-blue);
  color: #fff;
}

body.cf-collection-adolie-v3 .cf-collection-v3-products-btn.btn-blue {
  background-color: var(--cf-adolie-primary);
}

body.cf-collection-adolie-v3 .cf-collection-v3-products-btn.btn-blue:hover,
body.cf-collection-adolie-v3 .cf-collection-v3-products-btn.btn-blue:focus-visible {
  background-color: var(--cf-adolie-dark-blue);
}

/* Papeterie heritage (Triomphe / Nomaddict / Cuir) */
body.cf-collection-nomaddict-v3 .cf-collection-v3-products-btn.btn-blue {
  background-color: #a80008;
}

body.cf-collection-nomaddict-v3 .cf-collection-v3-products-btn.btn-blue:hover,
body.cf-collection-nomaddict-v3 .cf-collection-v3-products-btn.btn-blue:focus-visible {
  background-color: #860006;
}

body.cf-collection-cuir-v3 .cf-collection-v3-products-btn.btn-blue {
  background-color: #6d4c2f;
}

body.cf-collection-cuir-v3 .cf-collection-v3-products-btn.btn-blue:hover,
body.cf-collection-cuir-v3 .cf-collection-v3-products-btn.btn-blue:focus-visible {
  background-color: #553a25;
}

body.cf-v3 .cf-jds-v3-products-thumbs,
body.cf-v3 .cf-adolie-v3-products-thumbs {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: auto;
  overflow: visible !important;
  flex: 0 0 auto !important;
}

body.cf-v3 .cf-jds-v3-products-thumbs .cf-jds-v3-product-thumb,
body.cf-v3 .cf-adolie-v3-products-thumbs .cf-adolie-v3-product-thumb {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: clamp(280px, 30vw, 380px) !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  overflow: visible !important;
  border-radius: 8px;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  background: transparent !important;
}

body.cf-v3 .cf-jds-v3-products-thumbs .cf-jds-v3-product-thumb img,
body.cf-v3 .cf-adolie-v3-products-thumbs .cf-adolie-v3-product-thumb img {
  width: auto !important;
  max-width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  object-fit: contain !important;
  object-position: bottom center !important;
  display: block !important;
}

@media (max-width: 1024px) {
  body.cf-v3 .cf-jds-v3-products-thumbs .cf-jds-v3-product-thumb,
  body.cf-v3 .cf-adolie-v3-products-thumbs .cf-adolie-v3-product-thumb {
    height: clamp(220px, 28vw, 300px) !important;
  }
}

@media (max-width: 767px) {
  body.cf-v3 .cf-jds-v3-products-thumbs,
  body.cf-v3 .cf-adolie-v3-products-thumbs {
    gap: 8px !important;
  }

  body.cf-v3 .cf-jds-v3-products-thumbs .cf-jds-v3-product-thumb,
  body.cf-v3 .cf-adolie-v3-products-thumbs .cf-adolie-v3-product-thumb {
    height: clamp(160px, 36vw, 220px) !important;
  }
}
