

/* ============================ PAGINALAYOUT =================================
   Alleen op .single-product; nooit globaal op .pb-main. De pagina is één
   smalle leescontainer; de hero en content-kolommen sturen zelf hun eigen
   2-koloms grid. We neutraliseren pb-common's per-sectie breedte/padding. */
.single-product .pb-main{
  max-width:1160px; margin-inline:auto; padding:8px 24px 64px;
}
.single-product .pb-main > *{ min-width:0 } /* grid-children mogen krimpen */
.single-product .pb-main > section,
.single-product .pb-main > .section{
  max-width:none; margin:0; padding-left:0; padding-right:0;
}

/* ---------- Terug-naar-shop knop (boven de hero) ---------- */
.pb-main .back-link{
  display:inline-flex; align-items:center; gap:6px;
  padding:8px 15px 8px 12px; margin:0 0 4px;
  background:#fff; border:1px solid var(--line); border-radius:var(--r-pill);
  box-shadow:var(--shadow2);
  font-family:Manrope,system-ui,sans-serif; font-size:12.5px; font-weight:850;
  letter-spacing:-.01em; line-height:1; color:var(--brown);
  text-decoration:none; white-space:nowrap; cursor:pointer;
  transition:background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.pb-main .back-link::before{
  content:"\2039"; font-size:18px; line-height:1; font-weight:700; color:var(--accent);
  transition:transform .15s ease;
}
.pb-main .back-link:hover{
  background:var(--cream); border-color:#d9c2b2; color:var(--dark);
  box-shadow:0 10px 20px rgba(77,51,34,.14);
}
.pb-main .back-link:hover::before{ transform:translateX(-3px) }
.pb-main .back-link:focus-visible{ outline:2px solid var(--accent); outline-offset:2px }

/* Kleine, vierkante product-badge (galerij "Patty tip" + workshop "Workshop").
   Overschrijft pb-common's pil-label — alleen op de productpagina. */
.single-product .pb-main .label{
  text-transform:uppercase; letter-spacing:.08em; gap:5px;
  font-size:8px; font-weight:800; padding:3px 6px; border-radius:2px;
}

/* ============================ HERO (galerij | info) =======================
   Kolom 1 = galerij, kolom 2 = koopkolom (sticky) van 360px. */
.pb-main .product-hero{
  display:grid; grid-template-columns:1fr 360px; gap:56px;
  align-items:start; padding:28px 0 8px;
}
.pb-main .product-info{
  position:sticky; top:96px; align-self:start; padding:0;
}

/* ---------- Galerij: native Woo-galerij (pb-gallery.js) ----------
   pb-gallery.js bouwt .pb-gallery-main (grote foto) + .pb-gallery-thumbs
   (strip). Label + hart liggen als overlay op de hoofdfoto. */
.pb-main .product-gallery{ position:relative; padding:0 }
.pb-main .product-gallery > .label.fill{ position:absolute; top:10px; left:10px; z-index:3 }
.pb-main .fav-btn{
  position:absolute; top:10px; right:10px; z-index:3;
  width:36px; height:36px; display:grid; place-items:center;
  border-radius:50%; background:#fff; color:var(--dark);
  font-size:22px; line-height:1; box-shadow:0 5px 14px rgba(77,51,34,.15);
  border:0; cursor:pointer;
}
.pb-main .pb-gallery{ position:relative }
.pb-main .pb-gallery .woocommerce-product-gallery{ opacity:1 !important; margin:0 }

/* hoofdfoto */
.pb-main .pb-gallery-main{
  position:relative; min-height:460px; background:#f5f0eb;
  border:1px solid var(--line); border-radius:6px; box-shadow:var(--shadow2);
  overflow:hidden; display:grid; place-items:center; padding:26px;
}
.pb-main .pb-gallery-main img{
  width:86%; max-width:100%; max-height:400px; object-fit:contain; display:block;
}
/* thumbnail-strip */
.pb-main .pb-gallery-thumbs{
  display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 0; padding:0;
}
.pb-main .pb-gallery-thumb{
  flex:0 0 72px; width:72px; height:72px; padding:6px;
  background:#f5f0eb; border:1px solid var(--line); border-radius:4px;
  display:grid; place-items:center; cursor:pointer; transition:border-color .15s ease;
}
.pb-main .pb-gallery-thumb img{ max-width:100%; max-height:100%; object-fit:contain; display:block }
.pb-main .pb-gallery-thumb:hover{ border-color:var(--accent) }
.pb-main .pb-gallery-thumb.active{ border:2px solid var(--accent); padding:5px }
/* fallback vóór de JS draait: toon alleen de eerste foto */
.pb-main .pb-gallery:not([data-pb-ready]) .woocommerce-product-gallery__wrapper{ margin:0; padding:0; list-style:none }
.pb-main .pb-gallery:not([data-pb-ready]) .woocommerce-product-gallery__image:not(:first-child){ display:none }
.pb-main .pb-gallery:not([data-pb-ready]) .woocommerce-product-gallery__image img{ width:100%; height:auto; display:block }
.pb-main .pb-gallery .woocommerce-product-gallery__trigger{ display:none }

/* ---------- Titel + eyebrow ---------- */
.pb-main .product-info h1{
  font-family:Fraunces,serif; font-size:34px; line-height:1.04; font-weight:700;
  letter-spacing:-.03em; color:var(--brown); margin:0 0 12px;
}
.pb-main .product-info .eyebrow{ margin-bottom:8px }

/* ---------- Rating-regel (native Product Rating) ---------- */
.pb-main .star-rating{
  position:relative; display:inline-block; overflow:hidden;
  width:5.4em; height:1em; line-height:1; vertical-align:middle;
  font-family:Arial,Helvetica,sans-serif; font-size:13px; letter-spacing:.02em;
}
.pb-main .star-rating::before{ content:"\2605\2605\2605\2605\2605"; position:absolute; top:0; left:0; color:#d9c7ba }
.pb-main .star-rating span{ position:absolute; top:0; left:0; overflow:hidden; padding-top:1.5em; white-space:nowrap }
.pb-main .star-rating span::before{ content:"\2605\2605\2605\2605\2605"; position:absolute; top:0; left:0; color:#a96548 }
.pb-main .pb-rating .woocommerce-product-rating{
  display:flex; align-items:center; gap:8px; margin:0 0 14px;
  font-size:12px; color:var(--muted); font-weight:800;
}
.pb-main .pb-rating .woocommerce-review-link{
  color:var(--brown); text-decoration:underline;
  text-decoration-color:var(--accent); text-underline-offset:2px;
}
.pb-main .pb-rating .woocommerce-review-link .count{ font-weight:900 }

/* ---------- Lead + prijs + voorraad ---------- */
.pb-main .product-lead{ font-size:15px; line-height:1.6; color:#5b4c42; margin:0 0 20px }
.pb-main .price-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin:0 0 18px }
.pb-main .product-price-big{
  font-family:Manrope,system-ui,sans-serif; font-size:30px; font-weight:900;
  letter-spacing:-.03em; color:var(--dark);
}
.pb-main .product-price-big .amount{ font-weight:900 }
.pb-main .product-price-big del{ opacity:.45; font-weight:700; font-size:.62em; margin-right:8px }
.pb-main .product-price-big ins{ text-decoration:none; background:none }

/* voorraad-badge (shortcode [pb_stock]) */
.pb-main .stock-label{ display:inline-flex }
.pb-main .pb-stock{
  display:inline-flex; align-items:center; gap:5px;
  font-size:11px; font-weight:900; padding:6px 8px; border-radius:3px; white-space:nowrap;
}
.pb-main .pb-stock::before{ content:""; width:7px; height:7px; border-radius:50% }
.pb-main .pb-stock.in-stock{ background:#e8efe4; color:#5d6b52 }
.pb-main .pb-stock.in-stock::before{ background:var(--green) }
.pb-main .pb-stock.low-stock{ background:#f6e9d4; color:#8a5a1c }
.pb-main .pb-stock.low-stock::before{ background:#c98a2c }
.pb-main .pb-stock.out-of-stock{ background:#f6dcd7; color:#a12f22 }
.pb-main .pb-stock.out-of-stock::before{ background:#c0432f }
.pb-main .screen-reader-text{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* ---------- Maatkeuze (statisch/decoratief) ----------
   Op desktop rustig, zonder omkaderd vlak (zoals responsive.css @1025px). */
.pb-main .variant-box{ margin:0 0 20px; max-width:260px; background:none; border:0; padding:0 }
.pb-main .variant-box label{
  display:block; font-size:11px; text-transform:uppercase; letter-spacing:.08em;
  color:var(--brown); font-weight:900; margin-bottom:7px;
}
.pb-main .variant-options{ display:flex; gap:7px; flex-wrap:wrap }
.pb-main .variant-options span{
  display:inline-flex; align-items:center; min-height:32px; padding:0 10px; cursor:pointer;
  border:1px solid var(--line); background:#fffaf5; color:var(--brown);
  border-radius:3px; font-size:12px; font-weight:850;
  transition:background .12s ease, border-color .12s ease, color .12s ease;
}
.pb-main .variant-options span:hover{ border-color:var(--accent) }
.pb-main .variant-options span.active{ background:var(--brown); color:#fff; border-color:var(--brown) }

/* ---------- Winkelmand: native Add-to-Cart (form.cart) + −/+ stepper ---------- */
.pb-main .cart-panel{ margin-top:0 }
.pb-main .cart-panel .pb-atc > p.stock{ display:none }
.pb-main .cart-panel form.cart{
  display:grid; grid-template-columns:92px 1fr; align-items:center; gap:10px; margin:0;
}
.pb-main .cart-panel .quantity{
  display:flex; align-items:center; width:100%; height:44px; overflow:hidden;
  background:#fff; border:1px solid var(--line); border-radius:3px;
}
.pb-main .cart-panel .quantity .action{ display:none } /* native Bricks −/+ uit */
.pb-main .cart-panel .quantity input.qty{
  order:2; flex:1 1 auto; width:100%; min-width:0; height:44px;
  border:0; background:none; text-align:center;
  font-family:Manrope,system-ui,sans-serif; font-size:14px; font-weight:900; color:var(--dark);
  -moz-appearance:textfield; appearance:textfield;
}
.pb-main .cart-panel .quantity input.qty::-webkit-outer-spin-button,
.pb-main .cart-panel .quantity input.qty::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0 }
.pb-main .cart-panel .quantity .pb-qty-dec{ order:1 }
.pb-main .cart-panel .quantity .pb-qty-inc{ order:3 }
.pb-main .cart-panel .quantity .pb-qty-dec,
.pb-main .cart-panel .quantity .pb-qty-inc{
  flex:0 0 30px; height:44px; background:none; border:0; cursor:pointer;
  color:var(--brown); font-size:20px; font-weight:800; line-height:1;
  display:grid; place-items:center; transition:background .12s ease;
}
.pb-main .cart-panel .quantity .pb-qty-dec:hover,
.pb-main .cart-panel .quantity .pb-qty-inc:hover{ background:#f3ece5 }
.pb-main .cart-panel .single_add_to_cart_button,
.pb-main .cart-panel button.single_add_to_cart_button{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  width:100%; height:44px; margin:0; padding:0 16px;
  background:linear-gradient(135deg,var(--accent),#a96548); color:#fff; border:0;
  border-radius:3px; box-shadow:0 9px 18px rgba(111,72,49,.18);
  font-family:Manrope,system-ui,sans-serif; font-size:13px; font-weight:800; line-height:1;
  letter-spacing:-.01em; text-transform:none; cursor:pointer;
}
.pb-main .cart-panel .single_add_to_cart_button:hover{ background:#b96a47 }
.pb-main .cart-panel .single_add_to_cart_button.loading{ opacity:.7 }
.pb-main .added_to_cart{ display:none }

/* ---------- Bezorg-/vertrouwensblok ---------- */
.pb-main .delivery-list{ display:grid; gap:13px; margin-top:22px }
.pb-main .delivery-item{
  display:grid; grid-template-columns:25px 1fr; gap:8px; align-items:start;
  color:var(--brown); font-size:12px; font-weight:850;
}
.pb-main .delivery-item svg{ width:22px; height:22px; color:var(--accent); stroke-width:1.7 }
.pb-main .delivery-item .di-ico{
  font-size:18px; line-height:1; color:var(--accent); text-align:center;
}
.pb-main .delivery-item .di-text{ display:block }
.pb-main .delivery-item .di-sub{
  display:block; color:var(--muted); font-size:11px; line-height:1.3; font-weight:700; margin-top:1px;
}
.pb-main .delivery-item:empty{ display:none }

/* ============================ CONTENT (hoofd | zijbalk) ====================
   Hoofdkolom (waarom + voordelen + workshop) naast een sticky kenmerken-
   zijbalk (spec-card). */
.pb-main .product-columns{
  display:grid; grid-template-columns:1fr 360px; gap:64px;
  align-items:start; padding:40px 0 8px;
}
.pb-main .product-main-col{ display:flex; flex-direction:column; gap:32px }
.pb-main .product-side-col{ position:sticky; top:96px }

/* ---------- Tekst-secties (clean) ---------- */
.pb-main .product-section.clean{ border:0; padding:0 }
.pb-main .product-section.clean h2,
.pb-main .product-section.clean .brxe-heading{
  font-family:Fraunces,serif; font-size:22px; line-height:1.1; font-weight:700;
  letter-spacing:-.01em; color:var(--brown); margin:0 0 12px;
}
.pb-main .product-section.clean p{ font-size:15px; line-height:1.6; color:#67584f; margin:0 0 10px }

/* voordelen — 2 kolommen op desktop */
.pb-main .benefit-list.clean{
  list-style:none; padding:0; margin:0;
  display:grid; grid-template-columns:repeat(2,1fr); gap:10px 20px;
}
.pb-main .benefit-list.clean li{
  display:grid; grid-template-columns:22px 1fr; gap:8px;
  font-size:13px; line-height:1.4; color:#67584f;
}
.pb-main .benefit-list.clean li::before{
  content:"\2713"; width:20px; height:20px; display:grid; place-items:center;
  background:var(--cream); color:var(--accent); border-radius:50%; font-weight:900; font-size:12px;
}

/* ---------- Workshop-kruisverkoopkaart ----------
   Foto links, tekst rechts. De foto is een leeg Bricks image-slot (.wimg):
   geen gehotlinkte URL — de gebruiker kiest zelf de workshopfoto in Bricks. */
.pb-main .workshop-card{
  position:relative;
  display:flex; flex-direction:row; align-items:stretch; margin:24px 0 0;
  background:#fff8f1; border:1px solid var(--line); border-radius:10px;
  overflow:hidden; box-shadow:var(--shadow2); text-decoration:none;
  transition:box-shadow .15s ease, transform .15s ease;
}
/* de hele kaart klikbaar zonder een blok-in-anchor: een uitgerekte link
   die de kaart bedekt (Bricks-vriendelijk, geen genest anchor-blok). */
.pb-main .workshop-stretch{ position:absolute; inset:0; z-index:2; font-size:0; text-indent:-9999px; overflow:hidden }
.pb-main .workshop-card:hover{ box-shadow:var(--shadow); transform:translateY(-1px) }
.pb-main .workshop-card .wimg,
.pb-main .workshop-card img{
  flex:0 0 220px; width:220px; height:auto; min-height:150px;
  object-fit:cover; display:block; background:#efe0d3;
}
.pb-main .workshop-card-body{
  flex:1; display:flex; flex-direction:column; justify-content:center; padding:22px 26px;
}
.pb-main .workshop-card-body .label{ margin-bottom:9px; align-self:flex-start }
.pb-main .workshop-card-body h3{
  font-family:Fraunces,serif; font-size:19px; font-weight:700; color:var(--brown);
  margin:0 0 6px; letter-spacing:-.01em;
}
.pb-main .workshop-card-body p{ font-size:13.5px; line-height:1.5; color:#5b4c42; margin:0 0 12px }
.pb-main .workshop-card-cta{
  display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:850; color:var(--accent);
}
.pb-main .workshop-card-cta svg{ width:14px; height:14px; stroke-width:2.2 }
.pb-main .workshop-card-cta::after{ content:"\203A"; font-size:15px; line-height:1 }

/* ---------- Kenmerken (spec-card, zijbalk) ----------
   Ondersteunt zowel de echte <table>-opbouw (tr/th/td, zoals in
   product-detail.html) als de div-variant (.spec-row/.spec-k/.spec-v).
   In de zijbalk gestapeld: label boven waarde. */
.pb-main .spec-card h3{
  font-family:Manrope,system-ui,sans-serif; font-size:13px; font-weight:850;
  text-transform:uppercase; letter-spacing:.08em; color:var(--accent); margin:0 0 10px;
}
.pb-main .spec-card .spec-table.clean{ width:100%; border:0; margin:0 }
/* echte table-variant (tr/th/td) */
.pb-main .spec-table.clean{ width:100%; border-collapse:collapse; margin:0 }
.pb-main .spec-table.clean tr{ display:block; padding:12px 0; border-bottom:1px solid var(--line) }
.pb-main .spec-table.clean tr:first-child{ border-top:1px solid var(--line) }
.pb-main .spec-table.clean th,
.pb-main .spec-table.clean td{ display:block; width:auto; padding:0; text-align:left }
.pb-main .spec-table.clean th{
  color:#987b65; text-transform:uppercase; letter-spacing:.08em; font-size:10px; font-weight:900;
}
.pb-main .spec-table.clean td{ margin-top:4px; color:var(--brown); font-weight:800; font-size:14px }
/* div-rij variant (fallback) — zelfde gestapelde look */
.pb-main .spec-table .spec-row{ display:block; padding:12px 0; border-bottom:1px solid var(--line) }
.pb-main .spec-table .spec-row:first-child{ border-top:1px solid var(--line) }
.pb-main .spec-table .spec-k{
  display:block; color:#987b65; text-transform:uppercase; letter-spacing:.08em; font-size:10px; font-weight:900;
}
.pb-main .spec-table .spec-v{ display:block; margin-top:4px; color:var(--brown); font-weight:800; font-size:14px }
.pb-main .spec-table .spec-row:empty{ display:none }

/* ============================ REVIEWS =====================================
   section-head (titel + "Schrijf een review") → review-summary (avg) →
   native Product Reviews (kaartenlijst + formulier). */
.pb-main .pb-reviews-section h2,
.pb-main .pb-reviews-section .brxe-heading{
  font-family:Fraunces,serif; font-size:22px; line-height:1.1; font-weight:700;
  color:var(--brown); margin:0;
}
.pb-main .pb-reviews-section .section-head{ margin-bottom:16px }

/* samenvatting (gemiddelde + totaal) — [pb_rating_summary] of statisch */
.pb-main .review-summary{ display:flex; align-items:center; gap:14px; margin:0 0 16px }
.pb-main .review-summary:empty{ display:none } /* [pb_rating_summary] leeg → geen loze ruimte */
.pb-main .review-summary .avg{
  font-family:Fraunces,serif; font-size:38px; font-weight:700; color:var(--brown); line-height:1;
}
.pb-main .review-summary .stars{ color:#a96548; letter-spacing:.02em; font-size:15px }
.pb-main .review-summary small{ display:block; color:var(--muted); font-size:11.5px; font-weight:700; margin-top:2px }

/* native reviews-lijst als kaarten-grid */
.pb-main .pb-reviews .woocommerce-Reviews-title{ display:none }
.pb-main .pb-reviews .commentlist,
.pb-main .pb-reviews ol.commentlist{
  list-style:none; padding:0; margin:0 0 20px;
  display:grid; grid-template-columns:repeat(3,1fr); gap:12px;
}
.pb-main .pb-reviews .commentlist li.review{ margin:0 }
.pb-main .pb-reviews .comment_container{
  background:#fff8f1; border:1px solid var(--line); box-shadow:var(--shadow2);
  border-radius:5px; padding:16px; display:block;
}
.pb-main .pb-reviews .avatar{ display:none }
.pb-main .pb-reviews .comment-text .star-rating{ margin:0 0 6px }
.pb-main .pb-reviews .meta{ font-size:11px; color:var(--muted); margin:2px 0 6px }
.pb-main .pb-reviews .woocommerce-review__author{ font-weight:900; color:var(--brown); font-style:normal; font-size:13px }
.pb-main .pb-reviews .woocommerce-review__dash,
.pb-main .pb-reviews .woocommerce-review__published-date{ color:var(--muted); font-weight:700; font-size:11px }
.pb-main .pb-reviews .description p,
.pb-main .pb-reviews .comment-text > p:not(.meta){ font-size:14px; line-height:1.5; color:#67584f; margin:0 }
/* review-formulier */
.pb-main .pb-reviews #reply-title,
.pb-main .pb-reviews .comment-reply-title{ font-family:Fraunces,serif; font-size:18px; color:var(--brown); margin:6px 0 14px; display:block }
.pb-main .pb-reviews .must-log-in{ font-size:13px; color:var(--muted) }
.pb-main .pb-reviews .must-log-in a{ color:var(--accent); font-weight:800 }
.pb-main .pb-reviews .comment-form label{ display:block; font-size:12px; font-weight:800; color:var(--brown); margin:10px 0 4px }
.pb-main .pb-reviews .comment-form input[type=text],
.pb-main .pb-reviews .comment-form input[type=email],
.pb-main .pb-reviews .comment-form textarea{
  width:100%; border:1px solid var(--line); border-radius:var(--r); background:var(--paper);
  padding:10px 12px; font:inherit; color:var(--dark);
}
.pb-main .pb-reviews .comment-form-rating .stars a{ color:#a96548; font-size:20px; text-decoration:none }
.pb-main .pb-reviews .form-submit input#submit,
.pb-main .pb-reviews input#submit{
  display:inline-flex; align-items:center; justify-content:center;
  height:44px; margin-top:12px; padding:0 20px;
  background:linear-gradient(135deg,var(--accent),#a96548); color:#fff; border:0; border-radius:3px;
  font-family:Manrope,system-ui,sans-serif; font-size:14px; font-weight:800; cursor:pointer;
}
.pb-main .pb-reviews input#submit:hover{ background:#b96a47 }

/* ============================ RELEVANTE PRODUCTEN =========================
   native Product Related → nette 4-koloms grid met kaarten. */
.pb-main .pb-related .related.products{ margin:0; padding:0 }
.pb-main .pb-related .related.products > h2{ display:none } /* eigen section-head al aanwezig */
.pb-main .pb-related ul.products{
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px;
  margin:0; padding:0; list-style:none;
}
.pb-main .pb-related ul.products li.product{
  position:relative; background:#fff; border:1px solid #eee2d8; border-radius:6px;
  padding:8px; margin:0; text-align:left; list-style:none;
  box-shadow:0 8px 18px rgba(77,51,34,.10); overflow:hidden;
}
.pb-main .pb-related ul.products li.product::after{
  content:"\2661"; position:absolute; top:10px; right:10px;
  width:31px; height:31px; display:grid; place-items:center;
  border-radius:50%; background:#fff; color:#29211c; font-size:21px;
  box-shadow:0 4px 12px rgba(77,51,34,.13); z-index:4;
}
.pb-main .pb-related ul.products li.product a.woocommerce-LoopProduct-link{ display:block; color:inherit; text-decoration:none }
.pb-main .pb-related ul.products li.product img{
  width:100%; height:118px; object-fit:contain; background:#f5f0eb;
  border-radius:5px; padding:8px; margin:0 0 9px;
}
.pb-main .pb-related ul.products li.product .woocommerce-loop-product__title{
  font-family:Manrope,system-ui,sans-serif; font-size:14px; line-height:1.14; font-weight:850;
  color:#201a16; padding:0; margin:0 0 6px; min-height:34px;
}
.pb-main .pb-related ul.products li.product .price{
  display:flex; align-items:center; width:auto; background:none; color:var(--brown);
  border-radius:0; padding:0 50px 0 2px; min-height:40px;
  font-family:Fraunces,serif; font-size:19px; font-weight:600; line-height:1; margin:0; box-shadow:none;
}
.pb-main .pb-related ul.products li.product .price del{ opacity:.6; font-weight:600; margin-right:6px }
.pb-main .pb-related ul.products li.product .price ins{ text-decoration:none }
.pb-main .pb-related ul.products li.product .button,
.pb-main .pb-related ul.products li.product a.button{
  display:inline-flex; align-items:center; justify-content:center;
  position:absolute; right:12px; bottom:12px;
  width:40px; height:40px; min-width:0; margin:0; padding:0;
  background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6h15l-2 9H8L6 6Z'/%3E%3Cpath d='M6 6 5 3H2'/%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='18' cy='20' r='1'/%3E%3C/svg%3E") center/19px 19px no-repeat;
  color:transparent; font-size:0; border:0; border-radius:12px;
  box-shadow:0 6px 14px rgba(111,72,49,.22); cursor:pointer; text-decoration:none;
}
.pb-main .pb-related ul.products li.product .button:hover{ background-color:#b96a47 }
.pb-main .pb-related ul.products li.product a.button::after{ content:none }
.pb-main .pb-related ul.products li.product .added_to_cart{ display:none }

/* ============================ WOO-MELDINGEN (toast) ======================= */
.single-product #brx-content > .woocommerce-notices-wrapper,
.single-product .woocommerce-notices-wrapper{
  position:fixed !important; top:80px; left:50% !important; right:auto !important;
  transform:translateX(-50%) !important; float:none !important; clear:both;
  z-index:200; display:flex; flex-direction:column; gap:10px;
  width:auto !important; max-width:min(560px,calc(100vw - 32px));
  margin:0 !important; padding:0; align-items:stretch; pointer-events:none;
  transition:opacity .35s ease;
}
.single-product .woocommerce-notices-wrapper:empty{ display:none }
.single-product .woocommerce-notices-wrapper.pb-toast-hide{ opacity:0 }
.single-product .woocommerce-notices-wrapper > *{
  pointer-events:auto; margin:0; list-style:none;
  display:flex; align-items:center; flex-wrap:wrap; gap:6px 14px;
  padding:13px 16px; border-radius:9px;
  background:#e8efe4; color:#4b5a41; border:1px solid #cfe0c4;
  box-shadow:0 14px 32px rgba(77,51,34,.18);
  font-family:Manrope,system-ui,sans-serif; font-size:13.5px; font-weight:750; line-height:1.35;
}
.single-product .woocommerce-notices-wrapper .woocommerce-info{ background:#f6ecdd; color:#7a5a2c; border-color:#ecd9bd }
.single-product .woocommerce-notices-wrapper .woocommerce-error{ background:#f6dcd7; color:#9a2f22; border-color:#ecc3bb }
.single-product .woocommerce-notices-wrapper .button{
  order:2; margin-left:auto;
  display:inline-flex; align-items:center; height:34px; padding:0 14px;
  background:var(--brown); color:#fff; border:0; border-radius:6px;
  font-size:12px; font-weight:800; text-decoration:none; white-space:nowrap; cursor:pointer;
}
.single-product .woocommerce-notices-wrapper .button:hover{ background:var(--brown2) }

/* ============================ STICKY KOOPBALK — ALLEEN MOBIEL ============= */
.pb-main .sticky-buy{ display:none }
.pb-main .sticky-buy > div span{ display:block; font-size:11px; font-weight:800; color:var(--muted) }
.pb-main .sticky-buy > div strong{ display:block; font-family:Manrope,system-ui,sans-serif; font-size:19px; font-weight:900; color:var(--dark) }
.pb-main .sticky-buy > div strong del{ display:none }
.pb-main .sticky-buy .cta{ height:40px; white-space:nowrap }

/* ============================ RESPONSIVE =================================
   ≤1024px: hero + content klappen naar één kolom (de exacte mobiele
   ontwerp-volgorde) en de sticky koopbalk verschijnt boven de bottom-nav. */
@media (max-width:1024px){
  .single-product .pb-main{ max-width:none; padding:0 0 40px }
  .pb-main .product-hero,
  .pb-main .product-columns{ display:block; padding:0 }

  /* galerij + info: ontwerp-padding en niet sticky */
  .pb-main .product-info{ position:static; top:auto; padding:10px 18px 16px }
  .pb-main .product-gallery{ padding:14px 18px 8px }
  .pb-main .pb-gallery-main{ min-height:286px; padding:18px }
  .pb-main .pb-gallery-main img{ max-height:250px }
  .pb-main .pb-gallery-thumb{ flex-basis:62px; width:62px; height:62px }

  .pb-main .product-info h1{ font-size:36px; line-height:.96; letter-spacing:-.03em; margin:0 0 9px }
  .pb-main .product-lead{ font-size:14px; line-height:1.55; color:#67584f; margin:0 0 14px }
  .pb-main .price-row{ margin:0 0 10px }
  .pb-main .product-price-big{ font-size:31px }

  /* maatkeuze terug als omkaderd vlak (mobiel ontwerp) */
  .pb-main .variant-box{
    max-width:none; margin:12px 0; padding:12px;
    background:var(--cream); border:1px solid var(--line); border-radius:5px;
  }
  .pb-main .cart-panel{ margin-top:12px }
  .pb-main .delivery-list{ margin-top:14px; gap:8px }

  /* content-secties: ontwerp-padding, geen 2-koloms grid meer */
  .pb-main .product-main-col{ display:block }
  .pb-main .product-section.clean{ padding:20px 18px }
  .pb-main .product-section.clean + .product-section.clean{ padding-top:4px }
  .pb-main .product-section.clean h2,
  .pb-main .product-section.clean .brxe-heading{ font-family:Manrope,system-ui,sans-serif; font-size:20px; font-weight:900 }
  .pb-main .product-section.clean p{ font-size:14px }
  .pb-main .benefit-list.clean{ grid-template-columns:1fr }
  .pb-main .product-side-col{ position:static; top:auto; margin-top:0; padding:0 18px 20px }

  /* workshop-kaart: gestapeld (foto boven) */
  .pb-main .workshop-card{ flex-direction:column }
  .pb-main .workshop-card .wimg,
  .pb-main .workshop-card img{ flex:none; width:100%; height:150px }
  .pb-main .workshop-card-body{ padding:14px 16px 16px }

  /* reviews + related: horizontaal scrollen (mobiel ontwerp) */
  .pb-main .pb-reviews-section .section-head{ padding:0 }
  .pb-main .pb-reviews .commentlist,
  .pb-main .pb-reviews ol.commentlist{
    grid-template-columns:none; display:flex; gap:10px; overflow-x:auto; padding:0 0 2px;
    scrollbar-width:none;
  }
  .pb-main .pb-reviews .commentlist::-webkit-scrollbar{ display:none }
  .pb-main .pb-reviews .commentlist li.review{ flex:0 0 230px }
  .pb-main .pb-related ul.products{
    display:flex; grid-template-columns:none; gap:14px; overflow-x:auto; padding:0 0 18px;
    scrollbar-width:none;
  }
  .pb-main .pb-related ul.products::-webkit-scrollbar{ display:none }
  .pb-main .pb-related ul.products li.product{ flex:0 0 146px }

  /* mobiele koopbalk aan, boven de bottom-nav */
  .pb-main .sticky-buy{
    display:grid; position:sticky; bottom:78px; z-index:40;
    grid-template-columns:1fr auto; align-items:center; gap:10px;
    padding:10px 18px; margin:0;
    background:var(--cream2); border:0; border-top:1px solid #dcc9ba; border-radius:0;
    box-shadow:0 -10px 24px rgba(77,51,34,.12);
  }
}
@media (max-width:767px){
  .pb-main .product-info h1{ font-size:32px }
}

html.pb-lb-lock{ overflow:hidden }

/* ============================ LIGHTBOX ===================================
   Fullscreen foto-viewer (pb-gallery.js, aan <body> gehangen — niet onder
   .pb-main gescoped). z-index boven header/menu/melding. */
.pb-main .pb-gallery-main.pb-zoomable{ cursor:zoom-in }
.pb-main .pb-gallery-main.pb-zoomable::after{
  content:""; position:absolute; bottom:12px; right:12px; z-index:2;
  width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,.92) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236c4d38' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7'/%3E%3C/svg%3E") center/16px 16px no-repeat;
  box-shadow:0 5px 14px rgba(77,51,34,.15);
  opacity:0; transform:translateY(4px); transition:opacity .15s ease, transform .15s ease;
  pointer-events:none;
}
.pb-main .pb-gallery-main.pb-zoomable:hover::after,
.pb-main .pb-gallery-main.pb-zoomable:focus-visible::after{ opacity:1; transform:none }

.pb-lb{
  position:fixed; inset:0; z-index:3000; display:none;
  flex-direction:column; align-items:center; justify-content:center;
  padding:clamp(14px,3vw,40px); font-family:Manrope,system-ui,sans-serif;
}
.pb-lb.open{ display:flex }
.pb-lb-backdrop{
  position:absolute; inset:0; background:rgba(38,27,20,.9);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); animation:pb-lb-fade .2s ease;
}
@keyframes pb-lb-fade{ from{opacity:0} to{opacity:1} }
.pb-lb-panel{
  position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:14px;
  width:100%; max-width:min(940px,100%); max-height:100%;
}
.pb-lb-stage{
  margin:0; flex:1 1 auto; min-height:0; width:100%;
  display:flex; align-items:center; justify-content:center;
  animation:pb-lb-pop .22s cubic-bezier(.2,.8,.25,1);
}
@keyframes pb-lb-pop{ from{opacity:0; transform:scale(.96)} to{opacity:1; transform:none} }
.pb-lb-img{
  max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; display:block;
  background:var(--cream); border-radius:12px; padding:18px; box-shadow:0 30px 60px rgba(0,0,0,.4);
}
.pb-lb-close, .pb-lb-nav{
  position:absolute; z-index:2; display:grid; place-items:center;
  background:#fff; color:var(--dark); border:0; border-radius:50%;
  box-shadow:0 8px 20px rgba(0,0,0,.3); cursor:pointer; line-height:1;
  transition:background .15s ease, transform .15s ease;
}
.pb-lb-close{ top:16px; right:16px; width:44px; height:44px; font-size:26px }
.pb-lb-nav{ top:50%; transform:translateY(-50%); width:48px; height:48px; font-size:30px; font-weight:700 }
.pb-lb-prev{ left:16px } .pb-lb-next{ right:16px }
.pb-lb-close:hover, .pb-lb-nav:hover{ background:var(--cream) }
.pb-lb-prev:hover{ transform:translateY(-50%) translateX(-3px) }
.pb-lb-next:hover{ transform:translateY(-50%) translateX(3px) }
.pb-lb-close:focus-visible, .pb-lb-nav:focus-visible, .pb-lb-thumb:focus-visible{ outline:2px solid var(--accent); outline-offset:2px }
.pb-lb [hidden]{ display:none !important }
.pb-lb-count{
  flex:0 0 auto; color:#fff; font-size:12px; font-weight:800; letter-spacing:.04em;
  background:rgba(0,0,0,.32); padding:5px 12px; border-radius:var(--r-pill);
}
.pb-lb-thumbs{
  flex:0 0 auto; display:flex; gap:8px; max-width:100%; padding:2px; overflow-x:auto; scrollbar-width:none;
}
.pb-lb-thumbs::-webkit-scrollbar{ display:none }
.pb-lb-thumb{
  flex:0 0 54px; width:54px; height:54px; padding:5px; cursor:pointer;
  background:var(--cream); border:2px solid transparent; border-radius:8px;
  opacity:.55; transition:opacity .15s ease, border-color .15s ease;
}
.pb-lb-thumb img{ width:100%; height:100%; object-fit:contain; display:block }
.pb-lb-thumb:hover{ opacity:1 }
.pb-lb-thumb.active{ opacity:1; border-color:var(--accent) }
@media (max-width:767px){
  .pb-lb-close{ width:40px; height:40px; font-size:24px; top:12px; right:12px }
  .pb-lb-nav{ width:40px; height:40px; font-size:26px }
  .pb-lb-prev{ left:8px } .pb-lb-next{ right:8px }
  .pb-lb-img{ padding:12px; border-radius:10px }
  .pb-lb-thumb{ flex-basis:46px; width:46px; height:46px }
}
@media (hover:none){
  .pb-main .pb-gallery-main.pb-zoomable::after{ opacity:1; transform:none }
}