/* Catalogue "Commander" (com_content + custom fields, ex-HikaShop), dressed like the old HikaShop listing.
   Layouts: html/com_content/category/catalogue.php, html/com_content/article/produit.php. The .hikashop_* / .hikabtn
   classes are kept so Folium's custom.css rules (button colours, grey description box, name) still apply. */

/* Listing */
.catalogue h1 { margin: 0 0 8px; }
/* HikaShop's grid: no gutter row, 5px column padding */
.catalogue .row, .produit > .row { margin: 0; }
.catalogue .hikashop_product { padding: 0 5px; margin-bottom: 30px; }
.catalogue .hikashop_container { margin: 10px; text-align: center; }
.catalogue .hikashop_product_image { height: 250px; display: flex; align-items: center; justify-content: center; }
.catalogue .hikashop_product_image img { max-width: min(400px, 100%); max-height: 250px; width: auto; height: auto; }
.catalogue .hikashop_product_name { display: block; margin: 20px 0 5px; }
.catalogue .hikashop_product_name a { margin-top: 0; }
.catalogue .hikashop_product_name a:hover { color: #F7A500; text-decoration: none; }

/* Buttons (HikaShop's .hikabtn base + Folium colours from custom.css) */
.catalogue a.hikabtn, .produit a.hikabtn { display: inline-block; padding: 6px 12px; font-size: 14px; font-weight: 400; line-height: 1.42; text-decoration: none; }
.catalogue a.hikabtn:hover, .produit a.hikabtn:hover { background-color: #F7A500; color: #fff; }

/* Product page */
.produit .hikashop_product_left_part, .produit .hikashop_product_right_part { padding: 0 5px; }
.produit h1 { margin: 0 0 8px; overflow-wrap: break-word; }
.produit .hikashop_product_description_main p:last-child { margin-bottom: 0; }
.produit-tarifs { width: 100%; margin: 40px 0 30px; border-collapse: collapse; font-size: 15px; }
.produit-tarifs caption { caption-side: top; padding: 0 0 8px; color: #000E2D; font-weight: 500; }
.produit-tarifs th, .produit-tarifs td { padding: 8px 12px; border-bottom: 1px solid rgba(0, 0, 0, .15); text-align: left; }
.produit-tarifs th { font-weight: 500; color: #000E2D; }
.produit-tarifs .produit-prix { text-align: right; white-space: nowrap; font-weight: 500; color: #000E2D; }
.produit-tarifs th:last-child { text-align: right; }
.produit a.produit-commander { padding: 10px 24px; font-size: 16px; }
.produit-image { height: 420px; display: flex; align-items: center; justify-content: center; }
.produit-image a { width: 100%; }
.produit-image img { margin: 0 auto; max-width: min(400px, 100%); max-height: 400px; width: auto; height: auto; }
.produit-vignettes { display: flex; flex-wrap: wrap; gap: 4px; }
.produit-vignettes button { padding: 0; border: 2px solid transparent; background: none; cursor: pointer; line-height: 0; }
.produit-vignettes button.active, .produit-vignettes button:hover { border-color: #F7A500; }
.produit-vignettes img { width: 60px; height: 60px; object-fit: contain; }

@media (max-width: 767px) {
	.produit-image { height: auto; margin-top: 40px; }
	.produit-tarifs th, .produit-tarifs td { padding: 8px 6px; }
}
