/* Fix warped step icons when a builder step has no compatible products */
.woocommerce-product-builder-wrapper .woopb-steps .woopb-heading-wrap-icon-add-product .woopb-heading-step-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}
.woocommerce-product-builder-wrapper .woopb-steps .woopb-heading-wrap-icon-add-product .woopb-heading-step-icon img {
  display: block;
  max-width: 100%;
  width: 100%;
  height: auto;
  object-fit: contain;
}
/* Also ensure selected-product thumbnails aren’t stretched */
.woocommerce-product-builder-wrapper .woopb-step-products-added-wrapper .woopb-step-product-thumb img {
  display: block;
  max-width: 100%;
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* === Layout fallback when a step has no compatible products === */
.ConfigContent {
  display: grid !important;
  grid-template-columns: minmax(240px, 22%) minmax(360px, 48%) minmax(260px, 30%) !important;
  column-gap: 20px !important;
  align-items: stretch !important;
}

.ConfigContent .Filtres,
.ConfigContent .Listing,
.ConfigContent .DetailListing {
  display: flex !important;
  flex-direction: column !important;
  min-height: 260px !important;
}

.ConfigContent .Listing .woopb-products {
  min-height: 220px;
  display: block;
}

.ConfigContent .DetailListing .woopb-step-products-added {
  flex: 1 1 auto !important;
  min-height: 220px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: stretch !important;
}

.ConfigContent .Listing .woopb-products > h2 {
  margin: 60px auto 20px;
  padding: 1.4rem 2rem;
  max-width: 360px;
  text-align: center;
  font-size: 1.2rem;
  font-weight: 600;
  color: #4f545b;
  border: 1px dashed #d4d7db;
  border-radius: 10px;
  background: #f7f8f9;
}
.ConfigContent .Listing .woopb-products > h2 + p {
  text-align: center;
  color: #7a8088;
  font-style: italic;
}


.ConfigContent .DetailListing:empty::before {
  content: "Sélectionnez un produit pour afficher les détails";
  color: #9aa0a6;
  font-style: italic;
  text-align: center;
  margin-top: 40px;
}

.ConfigContent .DetailListing {
  position: relative;
  padding: 20px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 0 8px rgba(0,0,0,0.08);
}

.Steps .woopb-steps {
  display: flex !important;
  justify-content: center !important;
  align-items: flex-start !important;
  flex-wrap: wrap !important;
  gap: 15px !important;
  width: 100%;
  margin-bottom: 25px;
}

.Steps .woopb-steps .woopb-wrap-step {
  flex: 0 0 auto !important;
  min-width: 95px !important;
}

.Steps .woopb-step-link {
  display: block;
  font-weight: 600;
  color: #1b1f24;
}