/* RESET & BASE */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: sans-serif; font-size: 16px; line-height: 1.5; background-color: #fff; color: #333; }

/* CONTAINER GÉNÉRAL */
.container { max-width: 1200px; margin: 0 auto; padding: 0 1rem; display: flex; flex-direction: column; /*min-height: 100vh;*/ }
@media (min-width: 1024px){ .container { padding: 0 2rem; } }

/* HEADER */
header { padding: 1rem 0; }

/* Cart */
.cart{ display:flex; align-items:center; font-size:1.2rem; background:#fff; color:#333; padding:.4rem .7rem; border-radius:9999px; }
.cart-icon{ margin-right:.3rem; }
.cart-count{ font-weight:bold; color:green; }
.cart-color-0{ border:2px solid grey; }
.cart-color-1{ border:2px solid green; }

/* CONTENU PRINCIPAL */
main{ flex:1; padding:2rem 0; }
h1{ margin-bottom:1rem; padding-bottom:.5rem; }
/* ===== Titre <h1 class="h2_like"> =====
   -> visuellement identique à un <h2> mais garde la sémantique H1 pour le SEO
   -> utile pour les titres secondaires dans les pages produits / rayons
*/
.h2_like {
  font-size: 1.4rem;           /* taille d’un h2 */
  line-height: 1.3;
  font-weight: 700;
  color: #0f172a;              /* bleu-noir doux */
  margin: 0 0 0 0;
  padding: 1.2rem 0 0 0;
  border: none;                /* ne pas hériter de styles h1 */
}

/* Variante responsive : titre légèrement réduit sur mobile */
@media (max-width: 640px) {
  .h2_like {
    font-size: 1.25rem;
  }
}

/* PARAGRAPHES / LISTES / TABLE */
p{ font-size:1.125rem; margin-bottom:1rem; }
ul{ list-style: disc inside; padding-left:1rem; margin-bottom:1rem; }
li{ margin-bottom:.5rem; font-size:1.1rem; }
table{ width:100%; border-collapse:collapse; margin-bottom:2rem; background:#fff; border:1px solid #ddd; }
th,td{ padding:.75rem; text-align:left; border:1px solid #ddd; }
th{ background:#f0f0f0; font-weight:bold; }
tr:nth-child(even){ background:#f9f9f9; }

/* LIENS */
a{ color:#0066cc; text-decoration:none; }
a:hover{ text-decoration:underline; }

/* COULEURS RAPIDES */
.f-blue{ color:#007bff; }
.f-green{ color:#28a745; }
.f-red{ color:#dc3545; }

/* BARRE MESSAGE HAUT */
.msg-pub{ display:flex; align-items:center; justify-content:center; gap:.5rem; padding:.55rem .8rem; margin:.25rem 0 .5rem; background:#f8fafc; border:1px solid #e5e7eb; border-radius:8px; color:#0f172a; font-size:.95rem; line-height:1.35; text-align:center; }
.msg-pub:empty{ display:none; }
.msg-pub a{ color:#0ea5e9; text-decoration:none; font-weight:600; }
.msg-pub a:hover{ text-decoration:underline; }
.msg-pub::before{ content:"ℹ️"; font-size:1rem; }
.msg-pub.msg-pub--alert{ background:#fff7ed; border-color:#fed7aa; color:#7c2d12; }
.msg-pub.msg-pub--alert::before{ content:"⚠️"; }
@media (max-width:640px){ .msg-pub{ font-size:.88rem; padding:.45rem .65rem; } }

/* TOP BAR */
.top-bar{ display:flex; justify-content:space-between; align-items:center; }
.top-bar a{ text-decoration:none; }
@media (min-width:768px){ .top-bar{ font-size:1.5rem; } }
.site-name{ font-size:1.2rem; font-weight:bold; color:#333; }

/* BADGE GOOGLE */
.rating-badge{ display:inline-flex; align-items:center; gap:.4rem; border:1px solid #e5e7eb; border-radius:9999px; padding:.35rem .6rem; background:#fff; white-space:nowrap; }
.rating-badge .stars{ letter-spacing:.08em; }
@media (max-width:767px){ .rating-badge{ justify-content:center; } }
.top-bar .rating-badge{ font-size:.95rem; line-height:1.2; font-weight:400; padding:.3rem .55rem; }
.top-bar .rating-badge .stars{ color:#6b7280; font-size:.95em; }
.top-bar .rating-badge strong{ font-weight:700; }
.top-bar .rating-badge span{ color:#64748b; }

/* BOUTON CADDIE / FAVORIS */
a.btnpanier, a.btnpanier:visited{ text-decoration:none; display:inline-flex; align-items:center; transition: color .2s ease; }
a.btnpanier:hover, a.btnpanier:focus, a.btnpanier:active{ text-decoration:none; color:red; }
.top-bar a.btnpanier:hover{ transform:none; text-shadow:none; }
@media (hover:none){ a.btnpanier:hover{ color:inherit; text-shadow:none; } }

.puce-caddie-haut{ display:inline-flex; align-items:center; gap:.35rem; padding:.35rem .6rem; border-radius:9999px; font-weight:600; border:2px solid transparent; }
.puce-caddie-haut-color-0{ border-color:#9ca3af; background:#f3f4f6; color:#6b7280; }
.puce-caddie-haut-color-1{ border-color:#22c55e; background:#ecfdf5; color:#166534; animation:cartPulse 1.2s ease-in-out infinite; }
@keyframes cartPulse{ 0%{ box-shadow:0 0 0 0 rgba(34,197,94,.45);} 100%{ box-shadow:0 0 0 10px rgba(34,197,94,0);} }
.puce-caddie-haut-icon{ margin-right:.3rem; }
.puce-caddie-haut-count{ font-weight:800; }

.fav{ display:inline-flex; align-items:center; gap:.35rem; padding:.35rem .6rem; border-radius:9999px; font-weight:600; border:1px solid transparent; }
.fav-color-0{ border-color:#9ca3af; background:#f3f4f6; color:#6b7280; }
.fav-color-1{ border-color:#f43f5e; background:#fff1f2; color:#be123c; animation:favPulse 1.5s ease-in-out; }
@keyframes favPulse{ 0%{ box-shadow:0 0 0 0 rgba(244,63,94,.4);} 100%{ box-shadow:0 0 0 10px rgba(244,63,94,0);} }
.fav-icon{ font-size:.7rem; }
.fav-count{ font-weight:600; }
a.btnfavoris, a.btnfavoris:visited{ text-decoration:none; display:inline-flex; align-items:center; transition: color .2s ease; }
a.btnfavoris:hover .fav-icon{ transform:scale(1.2); color:#dc2626; }

/* RECHERCHE ENTÊTE */
.header-actions{ display:flex; align-items:center; gap:.75rem; margin-top:.5rem; flex-wrap:nowrap; }
.header-actions .search-wrap{ flex:1; }
.header-actions .search-bar{ margin:0; max-width:none; }
.search-bar{ display:flex; }
@media (min-width:768px){ .search-bar{ max-width:none; margin-left:0; margin-right:0; } }
.search-bar input{ flex:1; padding:.6rem; font-size:1rem; border:1px solid #0078b4; border-radius:5px 0 0 5px; }
.search-bar button{ background:#0078b4; color:#FFF; border:1px solid #0078b4; padding:.6rem 1rem; border-radius:0 5px 5px 0; cursor:pointer; }

/* NAV PRINCIPALE */
.main-nav{ display:flex; justify-content:space-around; padding:.5rem 0; font-size:.9rem; background:#f8f8f8; }
.main-nav a{ color:#666; text-decoration:none; padding:.5rem; }
@media (min-width:1024px){ .main-nav{ justify-content:flex-end; gap:1rem; font-size:1rem; } }

/* FOOTER */
footer{ background:#eee; padding:1rem 0; margin-top:auto; color:rgba(69,54,37,.6); }
.footer-columns{ display:grid; grid-template-columns:1fr; gap:2rem; margin-bottom:1.5rem; }
@media (min-width:768px){ .footer-columns{ grid-template-columns:repeat(2,1fr); } }
.footer-col a{ color:blue; text-decoration:none; font-size:.8rem; }
.footer-col a:hover{ text-decoration:underline; }
.footercontenu{ margin-bottom:.5rem; color:rgba(69,54,37,.6); }
.footersstitre{ font-size:1rem; margin:1rem 0 .5rem; font-weight:bold; font-family:Verdana; color:rgba(69,54,37,.6); letter-spacing:.20em; border-bottom:1px solid rgba(69,54,37,.2); padding-bottom:.5em; max-width:1024px; }
.copyright{ text-align:center; color:#999; font-size:.9rem; margin:2rem; }

/* ICONES */
.icon{ vertical-align:middle; fill:#333; cursor:pointer; transition: transform .2s ease, fill .3s ease; border:2px solid rgba(69,54,37,.2); border-radius:5px; padding:1px; }
.icon:hover{ fill:#ff5722; transform:scale(1.2) rotate(-5deg); }
.icon-trash:hover{ animation:shake .4s ease; }
@keyframes shake{ 0%{transform:rotate(0)} 25%{transform:rotate(-10deg)} 50%{transform:rotate(5deg)} 75%{transform:rotate(-5deg)} 100%{transform:rotate(0)} }

html{ scroll-behavior:smooth; }

/* CADDIE (paiement / relais) — inchangé */
.caddie-pay{ margin:.75rem 0 1rem; padding:14px 16px; background:linear-gradient(180deg,#f7fbff 0%, #ffffff 100%); border:1px solid #e5f1f8; border-radius:12px; box-shadow:0 6px 16px rgba(0,0,0,.05); }
.caddie-pay-title, .caddie-recap-title{ font-weight:700; font-size:1.125rem; line-height:1.35; margin:.1rem 0 .5rem; color:#0b3a53; }
.caddie-pay-note{ margin:.2rem 0 .8rem; font-size:.95rem; font-style:italic; color:#075985; opacity:.85; }
.caddie-logoscb{ display:flex; align-items:center; gap:.75rem; padding-left:3rem; margin:.25rem 0 .75rem; }
.caddie-logoscb input[type="image"], .caddie-logoscb img{ height:28px; width:auto; object-fit:contain; display:inline-block; border:0; background:transparent; line-height:0; padding:0; margin:0; }
.caddie-pay-others{ margin-top:.5rem; color:#6b7280; white-space:nowrap; font-size:.95rem; }
.caddie-pay-others a{ color:#1e40af; text-decoration:none; }
.caddie-pay-others a:hover{ text-decoration:underline; }
@media (max-width:380px){ .caddie-pay-others{ white-space:normal; } .caddie-logoscb{ flex-wrap:wrap; row-gap:.5rem; } }

.caddie-recap{ margin:.75rem 0 1rem; padding:12px 14px; background:linear-gradient(180deg,#CCC 0%, #999 100%); border:1px solid #666; border-radius:12px; box-shadow:0 6px 16px rgba(0,0,0,.05); }
.caddie-recap > h2{ margin:.1rem 0 .5rem; color:#0288d1; }
.caddie-recap .tablecaddie thead th, .caddie-recap .b-tablecaddie thead th{ color:#075985; border:none; padding:8px 0 6px; }
.caddie-recap .tablecaddie tbody tr + tr td, .caddie-recap .b-tablecaddie tbody tr + tr td{ border-top:1px dashed #e9eff5; }
.caddie-recap .tablecaddie tbody tr:last-child td, .caddie-recap .b-tablecaddie tbody tr:last-child td{ border-top:2px solid #dfeff8; font-weight:700; }
.caddie-recap .tablecaddie tbody tr:last-child td.b-text-right:last-child, .caddie-recap .b-tablecaddie tbody tr:last-child td.b-text-right:last-child{ color:#0288d1; font-size:1.05rem; }

.caddie-tablerecap{ width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--caddie-border,#e5eef6); box-shadow:0 2px 12px rgba(0,0,0,.04); font-family:Arial,sans-serif; }
.caddie-tablerecap thead th{ background:#f4f6f8; color:#444; font-weight:700; padding:.75rem .5rem; border-bottom:1px solid var(--caddie-border,#e5eef6); }
.caddie-tablerecap tbody td{ padding:.65rem .5rem; border-top:1px solid var(--caddie-border,#e5eef6); vertical-align:top; }
.caddie-tablerecap tbody tr:hover{ background:#fbfdff; }
.caddie-tablerecap tr.caddie-tablerecap-total td{ border-top:2px solid #dfeff8; font-weight:700; }
.caddie-tablerecap tr.caddie-tablerecap-total td:last-child{ color:#0288d1; font-size:1.05rem; }
.caddie-tablerecap-txtcenter{ text-align:center; }
.caddie-tablerecap-txtleft{ text-align:left; }
.caddie-tablerecap-txtright{ text-align:right; }
.caddie-tablerecap-price{ color:#000; white-space:nowrap; }

/* Adresses / Relais */
.caddie-address-container{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:1.25rem; }
.caddie-address-block{ background:#f8f8f8; padding:1em; border-radius:8px; box-shadow:0 0 6px rgba(0,0,0,.05); flex:1 1 320px; min-width:280px; }
.caddie-address-title{ font-weight:700; margin:0 0 .35em; color:#0b3a53; }
.caddie-pay-address, .caddie-pay-telmail{ margin-top:.15em; line-height:1.35; padding-left:1rem; background:#FFF; border-radius:8px; box-shadow:0 0 6px rgba(0,0,0,.05); }
.caddie-relysearch .b-fieldset, .caddie-searchgls{ background:linear-gradient(180deg,#f7fbff 0%, #ffffff 100%); border:1px solid #e5f1f8; border-radius:12px; padding:12px; box-shadow:0 6px 16px rgba(0,0,0,.05); }
.caddie-searchgls{ display:flex; flex-wrap:nowrap; gap:12px; align-items:flex-end; }
.caddie-searchgls > div{ display:flex; flex-direction:column; flex:1 1 0; min-width:180px; }
.caddie-searchgls > div:last-child{ flex:0 0 auto; }
.caddie-searchgls .b-label{ display:block; margin:0 0 4px; color:#075985; font-weight:600; }
.caddie-searchgls .b-input{ border-color:#d7e9f6; height:38px; }
.caddie-searchgls .b-button-grey{ margin-left:4px; height:38px; line-height:36px; padding:0 16px; }
@media (max-width:900px){
  .caddie-searchgls{ flex-wrap:wrap; }
  .caddie-searchgls > div{ flex:1 1 100%; min-width:100%; }
  .caddie-searchgls .b-button-grey{ margin-left:0; width:100%; }
}
.caddie_relay-list{ display:grid; grid-template-columns:1fr; gap:.6rem; margin:.6rem 0 0; }
.caddie_relay-list table{ width:100%; background:#fff; border:1px solid #e9eff5; border-radius:12px; box-shadow:0 6px 16px rgba(0,0,0,.05); border-collapse:separate; border-spacing:0; overflow:hidden; }
.caddie_relay-list table th{ width:140px; text-align:center; vertical-align:middle; padding:12px; background:linear-gradient(#f7fbff,#ffffff); border-right:1px dashed #e9eff5; }
.caddie_relay-list table td{ padding:12px; border:none; color:#0f172a; }
.caddie_relay-list table td strong{ color:#0288d1; }
.caddie_relay-list table td small{ color:#6b7280; }
.caddie_relay-list .b-button-green{ min-width:118px; padding:.5rem .9rem; }
.caddie_relay-list + br{ display:none; }
@media (max-width:640px){
  .caddie_relay-list table th{ width:120px; padding:10px; }
  .caddie_relay-list table td{ padding:10px; }
}

/* ACCESSIBILITÉ */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}
a:focus-visible, button:focus-visible{ outline:2px solid #60a5fa; outline-offset:2px; }










/* =========================
   ww-filters formulaire filtres affichage v2 : marque / prix mini / prix maxi / trier
   ========================= */

/* Résumé résultats */
.ww-formresult{
  display:flex;
  flex-wrap:wrap;
  gap:.35rem .5rem;
  align-items:center;
  margin:.35rem 0 1rem;
  font-size:.98rem;
  color:#111827;
}
.ww-formresult .ww-count{ font-weight:800; }

/* Barre de filtres – responsive, sans scroll horizontal */
.ww-filters{
  display:grid;
  /* auto-fit → remplit toute la ligne avec autant de colonnes que possible */
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap:.6rem;
  align-items:end;
  padding:.75rem .9rem;
  margin:.5rem 0 .6rem;
  overflow:visible;
  width:100%;
  box-sizing:border-box;
}

/* Éléments internes */
.ww-filters > div{ min-width:0; } /* autorise la contraction */

/* Labels */
.ww-filters label{
  display:block;
  margin:0 0 .25rem;
  font-size:.9rem;
  color:#374151;
}

/* Champs */
.ww-filters select,
.ww-filters input[type="number"],
.ww-filters input[type="text"]{
  width:100%;
  height:40px;
  padding:.5rem .65rem;
  border:1px solid #d1d5db;
  border-radius:8px;
  background:#fff;
  box-sizing:border-box;
}

/* Bouton */
.ww-filters button{
  width:100%;
  height:40px;
}

/* Responsive : garde des proportions agréables */
@media (max-width:900px){
  .ww-filters{
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }
}
@media (max-width:600px){
  .ww-filters{
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width:420px){
  .ww-filters{
    grid-template-columns: 1fr;
  }
}
 



/* ww-breadcrumb */

.ww-breadcrumb1 { margin: 15px 0 0 0; }
/* Fil d’Ariane */
.ww-breadcrumb ol {  list-style: none; margin: 10px 0 8px; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem; font-size: .7rem;}
.ww-breadcrumb a { color: #0066cc; font-size: .8rem;}
.ww-breadcrumb ol li { display: inline-flex; align-items: center; font-size: .8rem;}
.ww-breadcrumb ol li + li::before { content: "›"; margin: 0 .35rem; color: #999; font-weight: 600; line-height: 1; }





/* ====== LIGNE LOGO + PHRASE ====== */
.ww-brand-legend-line{
  max-width: 1024px; margin: .35rem auto 1.25rem auto;
  display:flex; align-items:center; gap:.75rem; justify-content:center;
}
.ww-brand-legend-line .ww-logo-box{
  display:flex; align-items:center; justify-content:center;
  border:1px solid #e5e7eb; border-radius:10px; background:#fff; padding:.35rem .5rem; min-width: 106px;
}
.ww-brand-legend-line .ww-legend-text{ color:#374151; text-align:left; }



/* ====== HERO (style atelier/chauffagiste) ====== /*/
.dc-hero, .ww-hero{ margin:.25rem 0 1rem 0; padding:1rem 1.25rem; border:1px solid #cbd5e1; border-radius:12px;
  background: linear-gradient(180deg, #f3f4f6 0%, #ffffff 70%), repeating-linear-gradient(135deg, rgba(0,0,0,.025) 0, rgba(0,0,0,.025) 8px, transparent 8px, transparent 16px);
  box-shadow:0 4px 18px rgba(0,0,0,.06);
  display:grid; grid-template-columns:56px 1fr; gap:1rem; align-items:center;
}
.dc-intro {}

.dc-hero .ico, .ww-hero .ico{ width:56px; height:56px; border-radius:12px; border:1px solid #94a3b8;
  background: radial-gradient(ellipse at 30% 30%, rgba(255,255,255,.4), transparent 60%), linear-gradient(180deg,#e5e7eb,#cbd5e1);
  box-shadow: inset 0 2px 6px rgba(0,0,0,.08), 0 2px 8px rgba(0,0,0,.06); display:flex; align-items:center; justify-content:center;
}
.dc-hero .ico svg, .ww-hero .ico svg{ width:28px; height:28px; color:#1f2937; }
.dc-hero h1, .ww-hero h1{ margin:0; font-size:2.05rem; line-height:1.2; font-weight:900; letter-spacing:.2px; color:#111827; }
.dc-hero .sub, .ww-hero .sub{ margin-top:.25rem; font-size:.96rem; color:#374151; }
.dc-hero .accent, .ww-hero .accent{ display:inline-block; width:68px; height:3px; background:#334155; border-radius:999px; margin:.55rem 0 0 0; }



.dc-badges{ display:flex; flex-wrap:wrap; gap:.35rem; }
.dc-badge-k{ display:inline-block; padding:.28rem .6rem;  background:#eef2ff; color:#1e3a8a; border:1px solid #e0e7ff; border-radius:999px; }
.dc-badge-k .ww-x{ margin-left:.45rem; text-decoration:none; font-weight:800; color:#1f2937; border-radius:6px; padding:0 .2rem; }
.dc-badge-k .ww-x:hover{ color:#b91c1c; background:rgba(185,28,28,.08); }
.dc-badge--promo{display:inline-block;background:#fee2e2;color:#b91c1c;border:1px solid #fecaca;border-radius:9999px;padding:.12rem .36rem;font-size:.75rem;line-height:1;font-weight:700}



