/* PRODUCTPAGINA: SCHUINE KLEURBLOKJES EN MINDER RUIMTE TOT DE KOOPKNOP (07-10-2026, variant C, keuze Martijn).
   Voorbeeld en metingen: Downloads/Previews/_met-beeld/productpagina-07-10-2026/Productpagina-kleur-en-ruimte-07-10-2026.html
   Geladen door inc/tt-productpagina.php, alleen op een productpagina.

   Alles hangt onder .single-product-page en de hoofdkoopknop .wd-single-add-cart, zodat de kaarten in
   de carrousels onderaan (.wd-product) en de productkaart in de winkel niet geraakt worden. De
   elementor-element-klassen komen uit het productsjabloon 31237; een product met een ander sjabloon
   krijgt alleen de kleurblokjes. */

/* >>> thema-productpagina: ALLES hieronder leunt op Woodmart (.wd-swatch) en het Elementor-sjabloon 31237
   (.elementor-element-...) en vervalt bij de overstap naar Bricks (Webshop/CLAUDE.md, harde regel Bricks-klaar).
   Wat dan WEL meegaat is het ontwerp: blokjes 32 x 19 met schuinte -18 graden en raakzone 48 x 44, prijs en
   sterren op een regel, Size chart rechts op de regel van Size, 16 pixels boven de koopknop. */

/* 1. DE KLEUREN. Zelfde maten als het blad achter het plusje in de winkel (inc/tt-kaart-plus.css,
   .tt-kp-kleur i): 32 x 19, schuinte -18 graden, rand wit 40 procent, een gouden ring om de gekozen
   kleur en een grijze schuine streep door een uitverkochte. Het knopvlak is 40 x 24 en ::after
   maakt de raakzone 48 x 44, zodat een duim hem raakt zonder dat de rij hoger wordt. Daarvoor moet
   overflow op visible, want Woodmart zet hidden op .wd-swatch en dat knipt zowel de ring als de raakzone af. */
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round{display:flex!important;flex-wrap:wrap!important;gap:8px!important;margin:0 0 0 -4px!important;padding:0!important}
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg{width:40px!important;height:24px!important;min-width:0!important;border-radius:0!important;display:grid!important;place-items:center!important;margin:0!important;padding:0!important;overflow:visible!important;background:none!important;box-shadow:none!important;outline:none!important;-webkit-tap-highlight-color:transparent}
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg::after{content:""!important;position:absolute!important;inset:-10px -4px!important;width:auto!important;height:auto!important;background:none!important;border:0!important;border-radius:0!important;opacity:1!important;box-shadow:none!important;transform:none!important;mask:none!important;-webkit-mask:none!important;font-size:0!important}
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg .wd-swatch-bg{width:32px!important;height:19px!important;border:1px solid rgba(255,255,255,.4)!important;border-radius:1px!important;transform:skewX(-18deg);background-size:cover;background-position:center;transition:box-shadow .15s;box-shadow:none}
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg.wd-active .wd-swatch-bg{box-shadow:0 0 0 2px #1a1a1a,0 0 0 3.5px #cb9500!important}
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg .wd-swatch-bg::before,
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg .wd-swatch-bg::after{content:none!important}
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg.wd-disabled .wd-swatch-bg,
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg.tt-uit .wd-swatch-bg{opacity:.5}
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg.wd-disabled,
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg.tt-uit{opacity:1!important}
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg.wd-disabled::before,
.single-product-page .wd-single-add-cart form.variations_form .wd-swatches-product.wd-shape-round .wd-swatch.wd-bg.tt-uit::before{content:""!important;position:absolute!important;inset:auto!important;left:50%!important;top:50%!important;width:38px!important;height:2px!important;border-radius:1px!important;background:#cfcfcf!important;opacity:1!important;transform:translate(-50%,-50%) rotate(-45deg)!important;z-index:2}

/* 2. DE RUIMTE. Was 20 tussen titel, sterren, prijs en keuzeblok, 10 onder elk label, een eigen regel
   voor Size chart en 40 boven de koopknop: 387 pixels van titel tot knop op een telefoon, 472 op de
   computer. Nu staan prijs en sterren op een regel (prijs links, sterren rechts), met titel en prijs
   dicht op elkaar, Size chart rechts op de regel van Size en 16 boven de knop: 279 en 358 pixels.
   De kolom wordt daarvoor een raster van twee kolommen waarin alles over de volle breedte loopt
   behalve prijs en sterren; de volgorde (order) van het sjabloon blijft gelden.
   "(1 customer review)" wordt "(1)", anders past een afgeprijsde prijs op een telefoon van 360
   niet meer naast de sterren. Op de computer komt de prijs zo direct onder de titel, boven de beschrijving. */
.single-product-page .elementor-element-1ead6a5b{display:grid!important;grid-template-columns:minmax(0,1fr) auto;column-gap:14px;row-gap:0!important;align-items:center}
.single-product-page .elementor-element-1ead6a5b>*{grid-column:1/-1;margin-top:20px!important}
.single-product-page .elementor-element-1ead6a5b>.elementor-element-cf71038{margin-top:0!important}
.single-product-page .elementor-element-1ead6a5b>.elementor-element-4a10b1bc{grid-column:1;order:2!important;margin-top:10px!important}
.single-product-page .elementor-element-1ead6a5b>.elementor-element-4c99a678{grid-column:2;order:3!important;margin-top:10px!important;justify-self:end}
.single-product-page .elementor-element-1ead6a5b>.elementor-element-412c24e5{order:4!important;margin-top:18px!important}
.single-product-page .elementor-element-1ead6a5b .woocommerce-review-link{font-size:0!important;white-space:nowrap}
.single-product-page .elementor-element-1ead6a5b .woocommerce-review-link .count,
.single-product-page .elementor-element-1ead6a5b .woocommerce-review-link::before,
.single-product-page .elementor-element-1ead6a5b .woocommerce-review-link::after{font-size:16px}
.single-product-page .elementor-element-1ead6a5b .woocommerce-review-link::before{content:"("}
.single-product-page .elementor-element-1ead6a5b .woocommerce-review-link::after{content:")"}
.single-product-page .elementor-element-1ead6a5b>.elementor-element-4a10b1bc .price{white-space:nowrap}
@media (min-width:1025px){
.single-product-page .elementor-element-1ead6a5b>.elementor-element-021c159{order:0!important;margin-top:0!important}
.single-product-page .elementor-element-1ead6a5b>.elementor-element-cf71038{order:1!important;margin-top:16px!important}
.single-product-page .elementor-element-1ead6a5b>.elementor-element-14e85bea{order:3!important;margin-top:16px!important}
.single-product-page .elementor-element-1ead6a5b>.elementor-element-412c24e5{order:4!important}
.single-product-page .elementor-element-1ead6a5b>:not(.elementor-element-cf71038):not(.elementor-element-4a10b1bc):not(.elementor-element-4c99a678):not(.elementor-element-14e85bea):not(.elementor-element-412c24e5):not(.elementor-element-021c159){order:5!important}
}
.single-product-page .wd-single-add-cart form.variations_form table.variations th.label{margin-bottom:6px!important}
.single-product-page .wd-single-add-cart form.variations_form table.variations tr{margin-bottom:14px!important;position:relative}
.single-product-page .wd-single-add-cart form.variations_form table.variations{margin-bottom:16px!important}
.single-product-page .wd-single-add-cart form.variations_form .ttsc-wrap{position:absolute!important;top:0!important;right:0!important;margin:0!important;height:26px;display:flex;align-items:center}
/* <<< thema-productpagina */