/* ============================================================
 * Goodies Pub France — Pages CATÉGORIE / LISTING
 * Habillage B2B « objet publicitaire » (sobre, orienté quantité).
 * Autonome — utilise les tokens var(--gp-*) définis dans goodies.css.
 * Chargé UNIQUEMENT sur les pages listing (link injecté dans
 * catalog/listing/product-list.tpl) : les sélecteurs globaux
 * (breadcrumb, #left-column, .pagination…) ne touchent donc que
 * ces pages. NE modifie ni head.tpl ni goodies.css.
 * La logique ps_facetedsearch / tri / pagination reste intacte :
 * ici, uniquement de la mise en forme.
 *
 * DURCISSEMENT : le thème parent et plusieurs modules injectent des
 * blocs <style> INLINE après nos <link>. Toutes les règles ci-dessous
 * sont donc préfixées par « body » (spécificité renforcée) et les
 * propriétés critiques de mise en page / d'identité portent
 * !important. Aucune valeur de design n'a été modifiée.
 * ============================================================ */

/* ---- Cadre général ---- */
body .gp-listing{font-family:var(--gp-font-body) !important;color:var(--gp-text) !important}
body .gp-listing #products{margin-top:4px !important}

/* ---- Fil d'ariane + titre catégorie ---- */
body#category nav.breadcrumb,
body#manufacturer nav.breadcrumb,
body#supplier nav.breadcrumb,
body#new-products nav.breadcrumb,
body#best-sales nav.breadcrumb,
body#prices-drop nav.breadcrumb,
body#search nav.breadcrumb,
body nav.breadcrumb{margin:0 0 4px !important}
body nav.breadcrumb ol{display:flex !important;flex-wrap:wrap !important;align-items:center !important;gap:6px !important;list-style:none !important;margin:0 !important;padding:0 !important;font-size:13px !important;color:var(--gp-muted) !important}
body nav.breadcrumb .breadcrumb-item{display:inline-flex !important;align-items:center !important;gap:6px !important}
body nav.breadcrumb .breadcrumb-item a{color:var(--gp-muted) !important;text-decoration:none !important}
body nav.breadcrumb .breadcrumb-item a:hover{color:var(--gp-primary) !important}
body nav.breadcrumb .breadcrumb-item::after{content:"/";color:#D1D5DB !important;margin-left:6px !important}
body nav.breadcrumb .breadcrumb-item:last-child::after{content:none}
body nav.breadcrumb .breadcrumb-item:last-child span{color:var(--gp-text) !important;font-weight:600 !important}
body nav.breadcrumb .breadcrumb-item .la-home{font-style:normal !important}

body .gp-listing .h1.page-heading,
body nav.breadcrumb .page-heading,
body .page-heading{font-family:var(--gp-font-head) !important;font-size:28px !important;font-weight:600 !important;line-height:1.2 !important;letter-spacing:-.4px !important;color:var(--gp-text) !important;margin:2px 0 14px !important;text-wrap:pretty}

/* ---- En-tête catégorie (image + description) ---- */
body #js-product-list-header .block-category{margin-bottom:18px !important}
body #js-product-list-header .category-cover{border:1px solid var(--gp-line) !important;border-radius:var(--gp-radius) !important;overflow:hidden !important;margin-bottom:16px !important}
body #js-product-list-header .category-cover img{display:block !important;width:100% !important;height:auto !important}
body #js-product-list-header .category-description{font-size:15px !important;line-height:1.65 !important;color:var(--gp-muted2) !important;max-width:78ch !important}
body #js-product-list-header .category-description a{color:var(--gp-primary) !important}

/* ---- Sous-catégories ---- */
body .gp-listing #subcategories .subcategory-name{font-family:var(--gp-font-head) !important;color:var(--gp-text) !important}
body .gp-listing #subcategories a{color:var(--gp-primary) !important}

/* ============================================================
 * Barre de sélection (compte + tri + vue + toggler filtres)
 * ============================================================ */
body .gp-listing .products-selection{margin:0 0 18px !important;padding:12px 0 !important;border-top:1px solid var(--gp-line) !important;border-bottom:1px solid var(--gp-line) !important;gap:14px !important}
body .gp-listing .products-selection .showing{font-size:13px !important;color:var(--gp-muted) !important}
body .gp-listing .products-selection .box-sort-by{display:flex !important;align-items:center !important;gap:14px !important;margin-left:auto !important}

/* toggler « Filtrer » (mobile / cat_layout 3) */
body .gp-listing .facated-toggler .filter-button a{display:inline-flex !important;align-items:center !important;gap:8px !important;font-family:var(--gp-font-body) !important;font-size:14px !important;font-weight:600 !important;color:var(--gp-primary) !important;text-decoration:none !important}
body .gp-listing .facated-toggler .filter-button a i{font-size:18px !important}

/* commutateur grille / liste */
body .gp-listing .view-switcher{display:flex !important;align-items:center !important;gap:6px !important}
body .gp-listing .view-switcher a{display:inline-flex !important;align-items:center !important;justify-content:center !important;width:36px !important;height:36px !important;border:1px solid var(--gp-line) !important;border-radius:var(--gp-radius-sm) !important;color:var(--gp-muted) !important;background:#fff !important}
body .gp-listing .view-switcher a.current{border-color:var(--gp-primary) !important;color:var(--gp-primary) !important;background:var(--gp-blue-bg) !important}
body .gp-listing .view-switcher a:hover{border-color:var(--gp-primary) !important}

/* ---- Tri : le <select id="select-sort-order"> (JS écoute le change) ---- */
body .gp-listing .sort-order{min-width:0 !important}
body .gp-listing .sort-order .form-group{margin:0 !important}
body .gp-listing .custom-select,
body .gp-listing #select-sort-order{height:40px !important;padding:0 34px 0 14px !important;border:1px solid var(--gp-line) !important;border-radius:var(--gp-radius) !important;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2.5'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 12px center !important;font-size:14px !important;color:var(--gp-text) !important;cursor:pointer;-webkit-appearance:none !important;-moz-appearance:none !important;appearance:none !important;max-width:100% !important}
body .gp-listing .custom-select:focus,
body .gp-listing #select-sort-order:focus{outline:none;border-color:var(--gp-primary) !important;box-shadow:0 0 0 3px rgba(30,78,140,.15)}

/* ---- Filtres actifs ---- */
body .gp-listing #active-filters:empty{display:none !important}
body .gp-listing #active-filters{margin:0 0 16px !important}
body .gp-listing .active-filters ul,
body .gp-listing #active-filters ul{display:flex !important;flex-wrap:wrap !important;gap:8px !important;align-items:center !important;list-style:none !important;margin:0 !important;padding:0 !important}
body .gp-listing .active-filter-title{font-size:13px !important;color:var(--gp-muted) !important;margin-right:4px !important}
body .gp-listing #active-filters li a,
body .gp-listing .active-filters li a{display:inline-flex !important;align-items:center !important;gap:6px !important;padding:5px 10px !important;border-radius:999px !important;background:var(--gp-blue-bg) !important;color:var(--gp-primary) !important;font-size:12px !important;font-weight:600 !important;text-decoration:none !important}
body .gp-listing #active-filters li a:hover{background:var(--gp-blue-bg2) !important}
body .gp-listing .js-search-filters-clear-all{background:#fff !important;border:1px solid var(--gp-line) !important;color:var(--gp-muted2) !important;border-radius:999px !important;padding:5px 12px !important;font-size:12px !important;font-weight:600 !important;cursor:pointer}
body .gp-listing .js-search-filters-clear-all:hover{border-color:var(--gp-primary) !important;color:var(--gp-primary) !important}

/* ============================================================
 * Colonne facettes (ps_facetedsearch) — habillage seul, JS intact
 * Le module écoute .js-search-link / .custom-control-input /
 * data-search-url : aucun de ces hooks n'est modifié.
 * ============================================================ */
body #left-column,
body #right-column{font-family:var(--gp-font-body) !important}
body #search_filters,
body #_desktop_search_filters_wrapper #search_filters{border:1px solid var(--gp-line) !important;border-radius:var(--gp-radius) !important;background:#fff !important;padding:6px 18px 14px !important;margin-bottom:20px !important}
body #search_filters .title_block,
body #search_filters > .h4,
body #search_filters > .h6:first-child{font-family:var(--gp-font-head) !important;font-size:15px !important;font-weight:700 !important;color:var(--gp-text) !important;margin:12px 0 !important;padding-bottom:12px !important;border-bottom:1px solid var(--gp-line) !important}

/* groupe de facette */
body #search_filters .facet{padding:14px 0 !important;border-bottom:1px solid var(--gp-line2) !important;margin:0 !important}
body #search_filters .facet:last-child{border-bottom:0 !important}
body #search_filters .facet .facet-title{font-family:var(--gp-font-head) !important;font-size:14px !important;font-weight:600 !important;color:var(--gp-text) !important;margin:0 0 10px !important;letter-spacing:-.1px !important}
body #search_filters .facet .title{cursor:pointer;margin-bottom:6px !important}
body #search_filters .facet .collapse-icons i{color:var(--gp-muted) !important}

/* liste de filtres */
body #search_filters .facet ul{list-style:none !important;margin:0 !important;padding:0 !important;max-height:230px !important;overflow:auto !important}
body #search_filters .facet ul li{margin:0 !important}
body #search_filters .facet-label{display:flex !important;align-items:center !important;gap:8px !important;padding:5px 0 !important;margin:0 !important;font-size:14px !important;color:var(--gp-muted2) !important;cursor:pointer;line-height:1.3 !important}
body #search_filters .facet-label:hover{color:var(--gp-text) !important}
body #search_filters .facet-label.active{color:var(--gp-text) !important;font-weight:600 !important}
body #search_filters .facet-label .custom-control-label,
body #search_filters .facet-label .search-link{color:inherit !important;text-decoration:none !important;display:flex !important;align-items:center !important;justify-content:space-between !important;gap:6px !important;flex:1 !important;min-width:0 !important}
body #search_filters .facet-label .text-truncate{overflow:hidden !important;text-overflow:ellipsis !important;white-space:nowrap !important}
body #search_filters .facet-label .magnitude{color:var(--gp-muted) !important;font-size:12px !important;font-weight:400 !important;flex:none !important}

/* cases à cocher / radios aux tokens */
body #search_filters .custom-control{position:relative !important;display:flex !important;align-items:center !important;gap:8px !important;width:100% !important;padding:0 !important}
body #search_filters .custom-control-input{width:17px !important;height:17px !important;flex:none !important;accent-color:var(--gp-primary) !important;cursor:pointer;margin:0 !important}
body #search_filters .custom-control .color{display:inline-block !important;width:18px !important;height:18px !important;border-radius:50% !important;border:1px solid var(--gp-line) !important;flex:none !important}

/* curseur de prix (slider jQuery UI) */
body #search_filters .ui-slider{position:relative !important;height:4px !important;background:var(--gp-line) !important;border:0 !important;border-radius:999px !important;margin:14px 4px 8px !important}
body #search_filters .ui-slider .ui-slider-range{position:absolute !important;height:100% !important;background:var(--gp-primary) !important;border-radius:999px !important}
body #search_filters .ui-slider .ui-slider-handle{width:16px !important;height:16px !important;top:-6px !important;margin-left:-8px !important;background:#fff !important;border:2px solid var(--gp-primary) !important;border-radius:50% !important;cursor:pointer;outline:none;box-shadow:0 1px 3px rgba(0,0,0,.18)}
body #search_filters .facet .ui-slider ~ *,
body #search_filters .range-slider-value,
body #search_filters [data-slider-min]{font-size:13px !important;color:var(--gp-muted2) !important}

/* ============================================================
 * Grille produits — 4 desktop / 3 tablette / 2 mobile
 * ============================================================ */
body .gp-products-grid{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:20px !important;margin:0 0 28px !important}

/* ============================================================
 * Carte produit (miniature)
 * ============================================================ */
body .gp-product-card{position:relative !important;display:flex !important;flex-direction:column !important;background:#fff !important;margin:0 !important}
body .gp-product-card .gp-card-inner,
body .gp-product-card .product-container{display:flex !important;flex-direction:column !important;height:100% !important}

/* --- Média : image carrée, fond blanc, bordure, radius 8 --- */
body .gp-product-card .thumbnail-container,
body .gp-product-card .gp-card-media{position:relative !important;margin:0 !important}
body .gp-product-card .thumbnail-inner{position:relative !important}
body .gp-product-card .product-thumbnail{position:relative !important;display:block !important;aspect-ratio:1/1 !important;border:1px solid var(--gp-line) !important;border-radius:var(--gp-radius) !important;background:#fff !important;overflow:hidden !important}
body .gp-product-card .product-thumbnail img{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;object-fit:contain !important;padding:10px !important;transition:transform .25s ease}
body .gp-product-card:hover .product-thumbnail{box-shadow:0 6px 18px rgba(26,29,33,.10);border-color:var(--gp-blue-line) !important}
body .gp-product-card:hover .product-thumbnail img{transform:scale(1.03)}

/* --- Pastilles / badges (nouveau, promo, éco…) --- */
body .gp-product-card .product-flags{position:absolute !important;top:10px !important;left:10px !important;z-index:2 !important;display:flex !important;flex-direction:column !important;gap:6px !important;list-style:none !important;margin:0 !important;padding:0 !important}
body .gp-product-card .product-flag{display:inline-flex !important;align-items:center !important;padding:4px 9px !important;border-radius:999px !important;font-size:11px !important;font-weight:600 !important;line-height:1 !important;letter-spacing:.1px !important;background:var(--gp-blue-bg) !important;color:var(--gp-primary) !important}
body .gp-product-card .product-flag.new{background:var(--gp-blue-bg2) !important;color:var(--gp-primary) !important}
body .gp-product-card .product-flag.online-only,
body .gp-product-card .product-flag.pack{background:#fff !important;border:1px solid var(--gp-line) !important;color:var(--gp-muted2) !important}
body .gp-product-card .product-flag.discount,
body .gp-product-card .product-flag.on-sale,
body .gp-product-card .product-flag.reduction{background:#E9F3EC !important;color:var(--gp-green) !important}

/* --- Variantes (pastilles couleur) --- */
body .gp-product-card .products-variants{display:flex !important;flex-wrap:wrap !important;gap:6px !important;margin-top:8px !important}
body .gp-product-card .products-variants a{width:18px !important;height:18px !important;border-radius:50% !important;border:1px solid var(--gp-line) !important;display:inline-block !important}

/* --- Actions fonctionnelles (add-to-cart / quickview) : overlay au survol --- */
body .gp-product-card .button-container{position:absolute !important;left:0 !important;right:0 !important;bottom:0 !important;display:flex !important;justify-content:center !important;gap:8px !important;padding:10px !important;opacity:0;transform:translateY(6px);transition:opacity .2s,transform .2s;pointer-events:none}
body .gp-product-card:hover .button-container{opacity:1;transform:none;pointer-events:auto}
body .gp-product-card .button-container .btn,
body .gp-product-card .button-container .quick-view{min-height:38px !important;padding:0 14px !important;border-radius:var(--gp-radius) !important;font-size:13px !important;font-weight:600 !important;background:#fff !important;color:var(--gp-primary) !important;border:1px solid var(--gp-primary) !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;box-shadow:0 2px 8px rgba(26,29,33,.12);text-decoration:none !important;cursor:pointer}
body .gp-product-card .button-container .btn:hover,
body .gp-product-card .button-container .quick-view:hover{background:var(--gp-primary) !important;color:#fff !important}
body .gp-product-card .button-container .product-add-to-cart,
body .gp-product-card .button-container form,
body .gp-product-card .button-container .product-quantity{margin:0 !important}
body .gp-product-card .button-container .product-quantity input[type="number"]{display:none !important}
body .gp-product-card .button-container .out-of-stock{border-color:var(--gp-line) !important;color:var(--gp-muted) !important;background:#fff !important;cursor:default}

/* --- Corps de carte --- */
body .gp-product-card .product-description,
body .gp-product-card .gp-card-body{display:flex !important;flex-direction:column !important;gap:8px !important;padding:12px 2px 4px !important;flex:1 !important}
body .gp-product-card .product-title{margin:0 !important}
body .gp-product-card .product-title a{font-family:var(--gp-font-body) !important;font-size:14px !important;font-weight:600 !important;line-height:1.35 !important;color:var(--gp-text) !important;text-decoration:none !important;display:-webkit-box !important;-webkit-line-clamp:2 !important;-webkit-box-orient:vertical !important;overflow:hidden !important;min-height:2.7em !important}
body .gp-product-card .product-title a:hover{color:var(--gp-primary) !important}

/* --- Prix HT en évidence --- */
body .gp-product-card .product-price-and-shipping{display:flex !important;align-items:baseline !important;flex-wrap:wrap !important;gap:8px !important;margin-top:auto !important}
body .gp-product-card .product-price-and-shipping .price{font-family:var(--gp-font-head) !important;font-size:19px !important;font-weight:700 !important;color:var(--gp-text) !important;letter-spacing:-.3px !important;font-variant-numeric:tabular-nums !important;line-height:1.1 !important}
body .gp-product-card .product-price-and-shipping .price .starting-price{font-family:var(--gp-font-body) !important;font-size:14px !important;font-weight:600 !important;color:var(--gp-text) !important}
body .gp-product-card .product-price-and-shipping .price::after{content:" HT";font-family:var(--gp-font-body) !important;font-size:.62em !important;font-weight:600 !important;color:var(--gp-muted) !important;margin-left:3px !important;letter-spacing:0 !important}
body .gp-product-card .product-price-and-shipping .regular-price{font-size:14px !important;font-weight:400 !important;color:var(--gp-muted) !important;text-decoration:line-through !important}

/* --- Lien « Voir le produit » discret (garde le lien produit) --- */
body .gp-product-card .gp-card-view{margin-top:6px !important;min-height:40px !important;font-size:14px !important;font-weight:600 !important;background:#fff !important;color:var(--gp-primary) !important;border:1px solid var(--gp-primary) !important;border-radius:var(--gp-radius) !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;text-decoration:none !important;transition:background .15s,color .15s}
body .gp-product-card .gp-card-view:hover{background:var(--gp-blue-bg) !important;color:var(--gp-primary) !important}

/* masque le bloc reviews vide éventuel */
body .gp-product-card .product-description .comments_note:empty{display:none !important}

/* ============================================================
 * Pagination
 * ============================================================ */
body .gp-listing nav.pagination,
body .gp-listing .pagination{margin:8px 0 28px !important;border:0 !important}
body .gp-listing .page-list{display:flex !important;flex-wrap:wrap !important;justify-content:center !important;align-items:center !important;gap:6px !important;list-style:none !important;margin:0 !important;padding:0 !important}
body .gp-listing .page-list li{margin:0 !important}
body .gp-listing .page-list li a,
body .gp-listing .page-list li span{display:inline-flex !important;align-items:center !important;justify-content:center !important;min-width:40px !important;height:40px !important;padding:0 10px !important;border:1px solid var(--gp-line) !important;border-radius:var(--gp-radius-sm) !important;background:#fff !important;color:var(--gp-text) !important;font-size:14px !important;font-weight:600 !important;text-decoration:none !important;font-variant-numeric:tabular-nums !important}
body .gp-listing .page-list li a:hover{border-color:var(--gp-primary) !important;color:var(--gp-primary) !important}
body .gp-listing .page-list li.current a,
body .gp-listing .page-list li.current span{background:var(--gp-primary) !important;border-color:var(--gp-primary) !important;color:#fff !important}
body .gp-listing .page-list li.disabled a,
body .gp-listing .page-list li.disabled span{color:#C4CAD2 !important;background:var(--gp-bg2) !important;cursor:default}
body .gp-listing .page-list .spacer{border:0 !important;background:transparent !important;min-width:24px !important;color:var(--gp-muted) !important}

/* bouton « Charger plus » (infinite scroll = button) */
body .gp-listing .load-product .prdLink.btn{background:var(--gp-primary) !important;border-color:var(--gp-primary) !important;color:#fff !important;border-radius:var(--gp-radius) !important;min-height:44px !important;padding:0 20px !important;font-weight:600 !important}
body .gp-listing .load-product .prdLink.btn:hover{background:var(--gp-primary-h) !important}

/* bouton « Haut de page » (mobile) */
body .gp-listing .up .btn{border:1px solid var(--gp-line) !important;border-radius:var(--gp-radius) !important;color:var(--gp-primary) !important;background:#fff !important}

/* ---- Aucun produit ---- */
body .gp-listing #js-product-list h4{font-family:var(--gp-font-head) !important;color:var(--gp-text) !important}

/* ============================================================
 * Responsive : 4 / 3 / 2 colonnes
 * ============================================================ */
@media (max-width:1199px){
  body .gp-products-grid{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:18px !important}
}
@media (max-width:991px){
  body .gp-products-grid{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important}
  body .gp-listing .h1.page-heading,
  body .page-heading{font-size:24px !important}
  /* sur tablette/mobile les actions restent visibles (pas de survol) */
  body .gp-product-card .button-container{opacity:1;transform:none;pointer-events:auto}
}
@media (max-width:767px){
  body .gp-products-grid{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:14px !important}
  body .gp-listing .products-selection{gap:10px !important}
  body .gp-product-card .product-title a{font-size:13px !important;display:-webkit-box !important;-webkit-line-clamp:2 !important;-webkit-box-orient:vertical !important;overflow:hidden !important}
  body .gp-product-card .product-price-and-shipping .price{font-size:17px !important}
  body #search_filters{padding:6px 14px 12px !important}
}
@media (max-width:400px){
  body .gp-products-grid{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px !important}
}