/* Path: /templates/lt_brewery/css/custom.css */

/* ===== POLICES ===== */
@import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display+SC:wght@700&display=swap');

/* ===== SUPPRIMER CADRE EXTERNE (Accueil + Boutique) ===== */
.browse-view .spacer.product-container,
.vmgroup .spacer.product-container {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}

/* ===== CADRE INTERNE (Carte produit) ===== */
.product-container .card { border: 1px solid #e5e7eb !important; border-radius: 10px; transition: border-color .2s, box-shadow .2s; }
.product-container .card:hover { border-color: #ff7a00 !important; box-shadow: 0 0 0 2px #ff7a00 inset !important; }

/* ===== IMAGES ET ESPACES INTERNES ===== */
.product-container .vm-product-media-container,
.product-container .card .card-img-top { border-bottom: 0 !important; box-shadow: none !important; margin-bottom: 10px !important; padding-bottom: 0 !important; }
.product-container .vm-product-media-container img,
.product-container .card .card-img-top img,
.product-container .browseProductImage { display: block !important; margin: 0 auto !important; max-width: 100%; height: auto; }
.product-container .card .card-body { padding: 10px 12px 12px !important; }
.product-container .card h5.card-title { margin: 6px 0 4px !important; line-height: 1.25; }
.product-container .text-muted.small { margin-bottom: 6px !important; }
.product-container .card hr { display: none !important; }

/* ===== PRIX ===== */
.product-container .product-price,
.product-container .vm-price-value,
.product-container .PricesalesPrice { font-size: 16px !important; font-weight: 700; color: #ff6a00 !important; white-space: nowrap; }
.product-container .vm-price-desc { margin-right: 6px; }
.product-container .price-line { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; }
.product-container .price-line .multi-size-badge { margin-left: auto; }

/* ===== BADGE "X CONTENANCES" ===== */
.product-container .multi-size-badge { display: inline-flex; align-items: center; white-space: nowrap; font-size: 12px; font-weight: 700; line-height: 1.2; padding: 3px 10px; border-radius: 20px; background: #fff7e0; color: #2f7a3d; border: 1px solid #f0a64f; }
.product-container .multi-size-badge::before { content: ""; display: inline-block; width: 14px; height: 14px; margin-right: 6px; border-radius: 50%; background: #fff; border: 1px solid #f0a64f; box-shadow: 0 0 0 2px #fff7e0 inset; background-repeat: no-repeat; background-position: center; background-size: 9px 9px; transform: rotate(-25deg); background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='%232f7a3d'><path d='M28 6h8l2 8-4 6v34h-4V20l-4-6 2-8z'/><rect x='30' y='38' width='4' height='14' rx='1'/></svg>"); }

/* ===== BOUTONS (Accueil + Boutique) ===== */
.spacer.product-container .addtocart-button,
.spacer.product-container .btn-primary { background-color: #0d6efd !important; border-color: #0d6efd !important; color: #fff !important; padding: 8px 10px !important; font-size: 13px !important; line-height: 1.15 !important; }
.spacer.product-container .addtocart-button:hover,
.spacer.product-container .btn-primary:hover { background-color: #28a745 !important; border-color: #28a745 !important; color: #fff !important; }

/* ===== TITRES PRODUITS ===== */
.browse-view .product-container h5.card-title,
.browse-view .product-container h5.card-title a,
.browse-view .product-container h2.product-name,
.browse-view .product-container h2.product-name a,
.browse-view .spacer.product-container .product-name,
.browse-view .spacer.product-container .product-name a,
.vmgroup .product-container h5.card-title,
.vmgroup .product-container h5.card-title a { font-family: "Playfair Display SC", serif !important; font-weight: 700 !important; font-size: 16px !important; text-transform: uppercase !important; line-height: 1.25 !important; color: #03458f !important; text-decoration: none !important; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* ===== FICHE PRODUIT – GRID 2 COLONNES (parent gauche / enfants droite) ===== */
.productdetails-view.pd-grid { display: grid; grid-template-columns: 38% 62%; gap: 30px; align-items: start; }
@media (max-width: 991.98px){ .productdetails-view.pd-grid { grid-template-columns: 1fr; } }
.productdetails-view .vm-product-media-container + .text-muted { text-align: center !important; }
.productdetails-view .price-line { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; }
.productdetails-view .price-line .multi-size-badge { margin-left: auto; }

/* ===== ENFANTS (alignement + proportions) ===== */
.vm-box-children { border: 1px solid #e5e7eb; border-radius: 10px; background: #fff; padding: 12px; }
.vm-child-line { border: 1px dashed #e5e7eb; border-radius: 8px; background: #fafafa; padding: 10px 12px; margin-bottom: 10px; }
.vm-child-line:last-child { margin-bottom: 0; }
.vm-child-wrap { display: grid; grid-template-columns: 1.6fr 0.6fr 0.8fr; align-items: center; gap: 12px; }
.vm-child-info { min-width: 0; }
.vm-child-price { text-align: right; min-width: 140px; }
.vm-child-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }

/* Quantité compacte fiche produit */
.productdetails-view .quantity-box input[type="text"],
.productdetails-view input.quantity-input,
.productdetails-view input.vm2-add_quantity { width: 36px !important; min-width: 36px !important; text-align: center; }

/* Boutons fiche produit et enfants */
.productdetails-view .addtocart-button,
.productdetails-view .addtocart-button.vm-button-correct,
.productdetails-view .btn-primary,
.vm-box-children .addtocart-button,
.vm-box-children .addtocart-button.vm-button-correct { background-color:#0d6efd !important; border-color:#0d6efd !important; color:#fff !important; padding:8px 12px !important; font-size:13px !important; line-height:1.15 !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.productdetails-view .addtocart-button:hover,
.productdetails-view .addtocart-button.vm-button-correct:hover,
.productdetails-view .btn-primary:hover,
.vm-box-children .addtocart-button:hover,
.vm-box-children .addtocart-button.vm-button-correct:hover { background-color:#28a745 !important; border-color:#28a745 !important; color:#fff !important; }

/* Lien “Poser une question…” */
.productdetails-view .ask-a-question { font-weight: 700; font-size: 16px; }

/* ===== Titre DJ-ImageSlider (ILS NOUS FONT CONFIANCE) ===== */
.sp-module.trust .sp-module-title { display:inline-block !important; width:100% !important; max-width:2330px !important; background:#28a745 !important; color:#fff !important; font-family:"Playfair Display SC", serif !important; font-weight:700 !important; font-size:18px !important; line-height:1.25 !important; padding:8px 0 !important; margin:0 auto 12px auto !important; text-transform:uppercase !important; text-decoration:none !important; text-align:center !important; border-radius:4px !important; box-sizing:border-box !important; }
.sp-module.trust { text-align:center !important; }

/* ==========================================================
   ACCUEIL FR — Alignement comportement IT (mobile + tablette + Z Fold)
   ========================================================== */
/* Texte d'intro plus compact sur mobile & tablette */
@media (max-width: 991.98px){
  .sp-page-builder .sp-module-content p,
  .sp-page-builder .sppb-addon p { line-height: 1.45 !important; margin-bottom: 10px !important; }
}

/* Garantir que la zone VM prend toute la largeur */
.vmgroup, .vmgroup .row { width: 100% !important; max-width: 100% !important; margin: 0 auto !important; }

/* ==== Mobile plié (≤ 575px) : 1 produit par ligne ==== */
@media (max-width: 575.98px){
  .vmgroup .row { display:flex !important; flex-wrap:wrap !important; margin:0 !important; }
  .vmgroup .row > [class^="col-"], .vmgroup .row > [class*=" col-"], .vmgroup .row > .product {
    flex:0 0 100% !important; max-width:100% !important; width:100% !important;
    padding:0 !important; float:none !important; margin:0 0 12px 0 !important; box-sizing:border-box !important;
  }
  .vmgroup .spacer.product-container { padding:0 !important; }
}

/* ==== Mobile large / Z Fold fermé (576–767px) : 1 produit par ligne ==== */
@media (min-width:576px) and (max-width:767.98px){
  .vmgroup .row { display:flex !important; flex-wrap:wrap !important; margin:0 !important; }
  .vmgroup .row > [class^="col-"], .vmgroup .row > [class*=" col-"], .vmgroup .row > .product { flex:0 0 100% !important; max-width:100% !important; padding:0 !important; }
}

/* ==== Tablette & Z Fold déplié (768–991px) : 2 produits par ligne ==== */
@media (min-width:768px) and (max-width:991.98px){
  .vmgroup .row { display:flex !important; flex-wrap:wrap !important; margin:0 -6px !important; }
  .vmgroup .row > [class^="col-"], .vmgroup .row > [class*=" col-"], .vmgroup .row > .product {
    flex:0 0 50% !important; max-width:50% !important; padding:0 6px !important; float:none !important;
  }
}

/* ==== Desktop (≥ 992px) : 4 produits par ligne (comme IT/Boutique) ==== */
@media (min-width:992px){
  .vmgroup .row > .product { flex:0 0 25% !important; max-width:25% !important; }
}