/*
 * De keuzelijst Gewicht op de productpagina. Live sinds 5 oktober 2026, na
 * een ronde achter ?staging=true.
 *
 * De Customizer-CSS (Extra CSS) zet de keuzelijsten bij de variaties op
 * width: 50% en max-width: 80%. Blocksy zet elke keuzelijst in een
 * div.ct-variation-swatches, en die is een flex-item in de cel (td is daar
 * display: flex) en wordt dus zo breed als de keuzelijst zelf: 132px. De
 * helft daarvan is 66px. Op 5 oktober 2026 stond er zo "Kies ε" bij Time
 * To Relax en een afgekapt "1000 gram" bij de andere producten.
 *
 * Twee regels die niet met de Customizer vechten, want die zet geen van
 * beide eigenschappen:
 *
 *   1. De div vult de rij, zodat 50% de helft van de rij wordt (206px op
 *      desktop).
 *   2. Nooit smaller dan 9,5em (152px). "Kies een optie" is 106px breed, met
 *      12px padding links, en het pijltje (8px) staat 10px van de rechterrand.
 *      Op 390px breed is de helft van de rij 151px, en daar valt het anders
 *      net tegen het pijltje.
 *
 * Alleen keuzelijsten (data-swatches-type="select"), niet de knoppen bij
 * Branding en Maling.
 */

.ct-variation-swatches[data-swatches-type="select"] {
	flex-grow: 1;
}

.ct-variation-swatches[data-swatches-type="select"] select {
	min-width: 9.5em;
}

/*
 * Geen gekozen waarde achter het label (live sinds 7 oktober
 * 2026). Bij knoppen (Maling, Branding) zet Blocksy Companion Pro de keuze in
 * een span in het label: "Maling: Hele boon (ongemalen)". In PHP via
 * woocommerce_attribute_label, en bij elke klik opnieuw in JavaScript
 * (swatches/common.js). Het label wordt dan bij elke keuze langer of korter
 * en de regel verspringt. Aart wil alleen "Maling". Omdat het script de span
 * steeds terugzet, verbergt CSS hem in plaats van PHP.
 */
table.variations th.label label > span {
	display: none;
}