/* Stitchwise child · brug tussen tokens.css (merk "Rode draad") en Hello Elementor + WooCommerce + EPO.
   Dun gehouden: de Elementor-kit (globale kleuren, typografie, knoppen, velden) doet het meeste.
   Hier enkel wat de kit niet bereikt: WooCommerce-knoppen en -meldingen, paginabreedte buiten Elementor,
   de rijgsteek onder links in lopende tekst en de bewezen EPO-fix tegen de lay-outsprong (qa/epo7-test.md §3.2). */

/* Basis: Hello's reset zet links op #c36; tokens.css staat in :where() en verliest daarvan. */
body{background-color:var(--sw-linnen);color:var(--sw-inkt)}
h1,h2,h3,h4,h5,h6{font-family:var(--sw-font-kop);font-optical-sizing:auto;color:inherit}
a{color:var(--sw-link)}
a:hover,a:focus{color:var(--sw-link-hover)}
::selection{background:var(--sw-poeder);color:var(--sw-inkt)}

/* Rijgsteek-onderlijn voor links in lopende tekst (niet op knoppen, menu's of kaarten). */
.elementor-widget-text-editor a:not(.button):not(.elementor-button),
.woocommerce-product-details__short-description a,
.woocommerce-Tabs-panel a,
.page-content :is(p,li) > a:not(.button),
.woocommerce-privacy-policy-text a,
.woocommerce-terms-and-conditions-checkbox-text a{
  text-decoration:underline dashed var(--sw-draad);
  text-decoration-thickness:2px;
  text-underline-offset:.28em;
}

/* Paginabreedte voor pagina's zonder Elementor (WooCommerce-archief, winkelmand, afrekenen, Mijn account). */
body:not([class*="elementor-page-"]) .site-main{max-width:var(--sw-container);padding-inline:var(--sw-gutter);margin-inline:auto}
body:not([class*="elementor-page-"]) .site-main .page-header h1,
.woocommerce-products-header__title{font-size:var(--sw-fs-h1);line-height:var(--sw-lh-h1);letter-spacing:var(--sw-ls-h1)}

/* WooCommerce-knoppen (specificiteit gelijk aan woocommerce.css, staat erna). */
/* Geen ID's binnen :is(): die zouden de specificiteit van ALLE knoppen naar (2,1,1) tillen en elke componentstijl verdringen. */
.woocommerce :is(a.button,button.button,input.button),
.woocommerce #respond input#submit,
.woocommerce :is(a.button.alt,button.button.alt,input.button.alt),
.woocommerce #respond input#submit.alt,
.woocommerce-page :is(a.button,button.button,input.button){
  background-color:var(--sw-knop-bg);color:var(--sw-knop-tekst);
  border:0;border-radius:var(--sw-radius-knop);
  font-family:var(--sw-font-tekst);font-weight:var(--sw-fw-knop);font-size:var(--sw-fs-knop);line-height:var(--sw-lh-knop);
  padding:13px 26px;min-height:var(--sw-doel-min);
  transition:background-color var(--sw-duur-snel) var(--sw-ease);
}
.woocommerce :is(a.button,button.button,input.button):hover,
.woocommerce #respond input#submit:hover,
.woocommerce :is(a.button.alt,button.button.alt,input.button.alt):hover,
.woocommerce-page :is(a.button,button.button,input.button):hover{background-color:var(--sw-knop-bg-hover);color:var(--sw-knop-tekst)}
.woocommerce :is(a.button,button.button,input.button):disabled,
.woocommerce :is(a.button,button.button,input.button).disabled{opacity:.5}

/* Meldingen: rand in merkkleur, tekst blijft inkt (kleur nooit alleen, het icoon blijft). */
.woocommerce-message,.woocommerce-info{border-top-color:var(--sw-draadrood);background:var(--sw-papier);color:var(--sw-inkt)}
.woocommerce-message::before,.woocommerce-info::before{color:var(--sw-draadrood)}
.woocommerce-error{border-top-color:var(--sw-fout);background:var(--sw-papier);color:var(--sw-inkt)}
.woocommerce-error::before{color:var(--sw-fout)}

/* Prijzen: tabelcijfers. */
.price,.amount,.woocommerce-Price-amount{font-variant-numeric:tabular-nums}
.woocommerce div.product p.price,.woocommerce div.product span.price,.woocommerce ul.products li.product .price{color:var(--sw-inkt)}

/* Velden die de kit niet raakt (select, WooCommerce select2). */
.woocommerce form .form-row select,
.select2-container--default .select2-selection--single{
  border:1px solid var(--sw-rand-veld);border-radius:var(--sw-radius-veld);background-color:var(--sw-papier);min-height:var(--sw-doel-min)
}
.select2-container--default .select2-selection--single .select2-selection__rendered{line-height:42px}
.select2-container--default .select2-selection--single .select2-selection__arrow{height:42px}
.woocommerce form .form-row label{font-weight:600}

/* EPO 7: bij het verlaten van het naamveld wordt de variatieprijs even leeg en schuift de lettertypelijst 28 px op.
   Met deze minimumhoogte is de sprong 1 px en opent de lijst bij de eerste klik (getest, qa/epo7-test.md §3.2 en §5.4). */
.woocommerce-variation-price{min-height:1.6em}