:root {
	--wd-text-font: "Open Sans", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: rgb(31,32,65);
	--wd-text-font-size: 14px;
	--wd-title-font: var(--wd-text-font);
	--wd-title-font-weight: 400;
	--wd-title-color: #242424;
	--wd-entities-title-font: "Marcellus SC", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 400;
	--wd-entities-title-color: #333333;
	--wd-entities-title-color-hover: rgb(51 51 51 / 65%);
	--wd-alternative-font: "Lora", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Marcellus SC", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 400;
	--wd-widget-title-transform: uppercase;
	--wd-widget-title-color: #333;
	--wd-widget-title-font-size: 18px;
	--wd-header-el-font: "Marcellus SC", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 400;
	--wd-header-el-transform: uppercase;
	--wd-header-el-font-size: 14px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(31,32,65);
	--wd-alternative-color: rgb(223,186,105);
	--btn-default-font-family: "Open Sans", Arial, Helvetica, sans-serif;
	--btn-default-font-weight: 400;
	--btn-default-bgcolor: rgb(31,32,65);
	--btn-default-bgcolor-hover: rgb(105,106,128);
	--btn-accented-bgcolor: rgb(223,186,105);
	--btn-accented-bgcolor-hover: rgb(223,186,105);
	--wd-form-brd-width: 1px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-link-color: rgb(31,32,65);
	--wd-link-color-hover: rgb(223,186,105);
	--wd-link-decor-style: solid;
	--wd-link-decor-color: rgb(223,186,105);
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: #111111;
	background-image: url();
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 800px;
	--wd-popup-padding: 15px;
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 223px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center center;
}
.wd-footer {
	background-color: rgb(31,32,65);
	background-image: none;
}
:is(.page, .search-no-results, .error404) :is(.wd-page-content, .whb-header) {
	background-color: rgb(244,244,244);
	background-image: none;
}
.woodmart-archive-shop:not(.single-product) :is(.wd-page-content, .whb-header) {
	background-color: rgb(244,244,244);
	background-image: none;
}
.single-product :is(.wd-page-content, .whb-header) {
	background-color: rgb(244,244,244);
	background-image: none;
}
.woodmart-archive-blog :is(.wd-page-content, .whb-header) {
	background-color: rgb(244,244,244);
	background-image: none;
}
.single-post :is(.wd-page-content, .whb-header) {
	background-color: rgb(244,244,244);
	background-image: none;
}
.woodmart-archive-portfolio :is(.wd-page-content, .whb-header) {
	background-color: rgb(244,244,244);
	background-image: none;
}
.single-portfolio :is(.wd-page-content, .whb-header) {
	background-color: rgb(244,244,244);
	background-image: none;
}
html .btn.wd-buy-now-btn {
	font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;	font-weight: 500;
	font-size: 12px;
	color: rgb(223,186,105);
	background: rgb(31,32,65);
}
html .btn.wd-buy-now-btn:hover {
	color: rgb(31,32,65);
}
.wd .product-label.new {
	background-color: rgb(31,32,65);
	color: rgb(255,255,255);
}
.wd .product-label.out-of-stock {
	background-color: rgb(223,186,105);
	color: rgb(31,32,65);
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}
:root{
--wd-container-w: 1222px;
--wd-form-brd-radius: 0px;
--btn-default-color: #333;
--btn-default-color-hover: #333;
--btn-accented-color: #333;
--btn-accented-color-hover: #333;
--btn-default-brd-radius: 0px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-default-box-shadow-active: none;
--btn-default-bottom: 0px;
--btn-accented-bottom-active: -1px;
--btn-accented-brd-radius: 0px;
--btn-accented-box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .15);
--btn-accented-box-shadow-hover: inset 0 -2px 0 rgba(0, 0, 0, .15);
--wd-brd-radius: 0px;
}

@media (min-width: 1222px) {
section.elementor-section.wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}


.wd-page-title {
background-color: rgb(31,32,65);
}

/* JvK - Mobiele responsiviteit: voorkom dat koppen buiten beeld vallen/afgesneden worden */

/* Veiligheidsnet: laat lange woorden altijd binnen hun vak blijven i.p.v. over de rand heen lopen */
h1, h2, h3, h4, h5, h6,
.elementor-heading-title,
.page-title,
.entry-title {
    overflow-wrap: break-word;
    word-break: break-word;
}

/* Kleinere lettergrootte op mobiel voor "kale" koppen (juridische pagina's, afrekenpagina, e.d.)
   die geen eigen Elementor-instelling hebben en anders de te grote desktop-grootte tonen */
@media (max-width: 768px) {
    h1:not(.elementor-heading-title) { font-size: 34px !important; line-height: 1.2 !important; }
    h2:not(.elementor-heading-title) { font-size: 28px !important; line-height: 1.25 !important; }
    h3:not(.elementor-heading-title) { font-size: 22px !important; line-height: 1.3 !important; }
}

/* JvK - Mobiele leesbaarheid lichaamstekst (10 sept 2026)
   Root cause: Elementor's globale "Primary" lettertype-instelling (Site Settings > Global Fonts)
   had per ongeluk een GROTERE lettergrootte op mobiel (24px) staan dan op desktop (14px) -
   precies andersom dan de bedoeling. Hierdoor was alle normale bodytekst (paragrafen, productbeschrijvingen,
   juridische teksten, etc.) op mobiel onnodig groot en minder prettig leesbaar.
   Deze override herstelt een normale, leesbare progressie: 14px desktop -> 15px tablet -> 16px mobiel
   (16px is de algemeen aanbevolen minimale lettergrootte voor bodytekst op mobiel voor optimale leesbaarheid). */
@media (max-width: 1024px) and (min-width: 769px) {
    .elementor-kit-7 { --e-global-typography-primary-font-size: 15px; }
}
@media (max-width: 768px) {
    .elementor-kit-7 { --e-global-typography-primary-font-size: 16px; }
}

/* JvK - Toegankelijkheid: contrast op primaire call-to-action knoppen (10 sept 2026)
   Root cause: WoodMart's globale "accentknoppen"-instelling (achtergrond goud #DFBA69) stond op
   witte tekst, wat een contrastverhouding van slechts 1.85:1 gaf (WCAG AA vereist minimaal 4.5:1).
   Dit is al hersteld via Thema-instellingen > Stijlen en kleuren > Knoppen > Accentknoppen (naar "Donker"),
   maar Elementor's globale knop-stijl (Site instellingen > Thema stijl > Knoppen, witte tekst) overschrijft
   dit nog specifiek voor "Toevoegen aan winkelwagen" en de zoekknop, omdat die binnen de Elementor-kit
   wrapper vallen. Deze override herstelt daar hetzelfde donkere tekstkleur (#333), consistent met de
   rest van de site (o.a. de "Bestelling afronden"-knop op de afrekenpagina, die al goed staat). */
.single_add_to_cart_button,
.searchsubmit {
    color: #333 !important;
}

/* JvK - Lettergrootte en tap-target van knoppen (10 sept 2026)
   Root cause: WoodMart's standaard knopstijl gebruikt een vaste lettergrootte van 13px en een
   knophoogte van 42px voor alle knoppen (--btn-font-size / --btn-height, en de "accent"-variant
   --btn-accented-font-size / --btn-accented-height voor CTA's zoals "Toevoegen aan winkelwagen" en
   "Doorgaan naar afrekenen"). 13px is aan de kleine kant voor prettig leesbare knoptekst, en 42px
   zit net onder de algemeen aanbevolen minimale tap-target van 44px voor comfortabel tikken op mobiel.
   Deze override verhoogt beide knoptypes naar 14px lettergrootte en 44px hoogte, zonder de rest van
   de knopstijl (kleur, vorm, hover-gedrag) te wijzigen. */
:root {
    --btn-font-size: 14px;
    --btn-height: 44px;
    --btn-accented-font-size: 14px;
    --btn-accented-height: 44px;
}

/* JvK - Dropdown-menu (Onze collectie) uitlijnen met onderkant hoofdnavigatie (10 sept 2026, definitief)
   Root cause: WoodMart's standaard dropdown-stijl (.wd-dropdown) heeft een vaste margin-top van 15px,
   maar het dropdown-element heeft ook een eigen open/dicht-animatie via CSS transform (translateY),
   waarbij de "dichte" stand 15px lager staat dan de uiteindelijke "open" stand. Mijn eerdere twee
   metingen (0px en 6px) waren per ongeluk gebaseerd op de gesloten/animatie-uitgangspositie in plaats
   van de werkelijke geopende positie, waardoor het menu er in de praktijk steeds ~15px te hoog uitzag
   (overlappend met de onderkant van de header) zodra het menu daadwerkelijk open stond op hover.
   Gemeten aan de daadwerkelijk GEOPENDE staat (transform: none, opacity: 1) in de normale (niet-
   vastgeplakte) stand bovenaan de pagina: 21px marge zorgt ervoor dat de bovenkant van het dropdown-
   menu precies gelijk komt te liggen met de onderkant van de volledige header (incl. het logo-blok
   "VAN KONINGSBRUGGEN / SINCE 1977"). */
.wd-dropdown {
    margin-top: 21px !important;
}

/* JvK - Dropdown-menu uitlijning in de "sticky" (vastgeplakte) header bij scrollen (10 sept 2026)
   De regel hierboven werkte ook door in de sticky/vastgeplakte staat van de header (die lager is
   dan de normale header bovenaan de pagina), waardoor daar juist een gat ontstond: de marge van 21px
   was te veel voor de kleinere sticky header. WoodMart heeft voor die sticky staat zelf al een kleinere
   marge gedefinieerd (9px, via de eigen selector hieronder). Door deze selector opnieuw met !important
   te zetten, krijgt de sticky staat zijn eigen (kleinere, door WoodMart zelf bepaalde) marge terug in
   plaats van de 21px die bedoeld is voor de normale, hogere header. */
.whb-sticked .whb-general-header .wd-dropdown:not(.sub-sub-menu) {
    margin-top: 9px !important;
}

/* JvK - Logowissel sticky header (Sharpwaves, 7 okt 2026, v4): geen fade, geen schuiven, geen overlap. De header krimpt vloeiend (120 naar 60 px); het logo wisselt in één frame van woordlogo naar beeldmerk. Logoruimte blijft gelijk zodat het menu niet verspringt. */
.whb-general-header .whb-flex-row { transition: height .35s cubic-bezier(.4,0,.2,1), max-height .35s cubic-bezier(.4,0,.2,1) !important; }
.whb-general-header .wd-switch-logo { position: relative; }
.whb-general-header .wd-switch-logo .wd-main-logo,
.whb-general-header .wd-switch-logo .wd-sticky-logo { display: block !important; animation: none !important; transition: none !important; opacity: 1 !important; }
.whb-general-header .wd-switch-logo .wd-main-logo { visibility: visible; transform: none !important; }
.whb-general-header .wd-switch-logo .wd-sticky-logo { position: absolute; left: 10px; top: 50%; transform: translateY(-50%) !important; visibility: hidden; pointer-events: none; }
.whb-sticked .whb-general-header .wd-switch-logo .wd-main-logo { visibility: hidden; pointer-events: none; }
.whb-sticked .whb-general-header .wd-switch-logo .wd-sticky-logo { visibility: visible; pointer-events: auto; }



/* JvK - Productfilters (Merk, Voorraadstatus e.d.): dropdown direct onder de titel + onzichtbare brug, zodat het menu bij hover open blijft (7 okt 2026) */
.wd-product-filters .wd-pf-checkboxes.wd-event-hover { position: relative; }
.wd-product-filters .wd-pf-checkboxes.wd-event-hover .wd-pf-dropdown { top: 100% !important; margin-top: 6px !important; }
.wd-product-filters .wd-pf-checkboxes.wd-event-hover::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 30px; }


/* JvK - Homepage mobiel/tablet: Elementor pagina-instelling gaf de body 18px zijpadding, waardoor header en secties niet schermbreed waren (7 okt 2026) */
@media (max-width: 768px) { body.elementor-page-2830 { padding: 0 !important; } }


/* JvK - Leesbaarheid hero titels op foto/video (Contact, Over ons, Locatie), 7 okt 2026 */
.elementor-4439 .elementor-element-c6cb0b6 .elementor-heading-title, .elementor-4400 .elementor-element-cec9a19 .elementor-heading-title, .elementor-29872 .elementor-element-1393f0c ~ .e-con .elementor-heading-title { text-shadow: 0 2px 24px rgba(10, 14, 30, .65), 0 1px 3px rgba(10, 14, 30, .45); }

/* JvK - Afrekenen: postcode vóór plaats (Nederlandse volgorde), 7 okt 2026 */
.woocommerce-billing-fields__field-wrapper, .woocommerce-shipping-fields__field-wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; }
.woocommerce-billing-fields__field-wrapper > .form-row, .woocommerce-shipping-fields__field-wrapper > .form-row { order: 50; float: none; width: 100%; }
#billing_first_name_field, #shipping_first_name_field { order: 1; }
#billing_last_name_field, #shipping_last_name_field { order: 2; }
#billing_company_field, #shipping_company_field { order: 3; }
#billing_country_field, #shipping_country_field { order: 4; }
#billing_address_1_field, #shipping_address_1_field { order: 5; }
#billing_address_2_field, #shipping_address_2_field { order: 6; }
#billing_postcode_field, #shipping_postcode_field { order: 7; }
#billing_city_field, #shipping_city_field { order: 8; }
#billing_state_field, #shipping_state_field { order: 9; }
#billing_phone_field, #shipping_phone_field { order: 10; }
#billing_email_field, #shipping_email_field { order: 11; }

/* JvK - Zijpaneel winkelwagen: aantal en prijs per regel beter leesbaar (was lichtgrijs), 7 okt 2026 */
.cart-widget-side .woocommerce-mini-cart-item .quantity, .cart-widget-side .woocommerce-mini-cart-item .quantity .amount { color: var(--jvk-navy, #1c1f3c) !important; font-size: 14px !important; }

/* JvK - Titelblok merkpagina's (zelfde stijl als categoriepagina's), 7 okt 2026 */
.jvk-brand-head { background: #fff; padding: 40px 40px 32px; margin-bottom: 24px; }
.jvk-brand-head .jvk-brand-kicker { display: block; font-family: Charm, cursive; font-style: italic; font-size: 24px; line-height: 1.2; color: #dfba69; margin-bottom: 6px; }
.jvk-brand-head .jvk-brand-title { font-family: Lora, serif; font-weight: 400; font-size: 72px; line-height: 1.05; color: #1f2041; margin: 0 0 16px; }
.jvk-brand-head .term-description { margin: 0; }
.jvk-brand-head .term-description p:last-child { margin-bottom: 0; }
@media (max-width: 768px) { .jvk-brand-head { padding: 28px 24px 22px; } .jvk-brand-head .jvk-brand-title { font-size: 46px !important; } }


/* Productpagina: referentienummer onder de titel (snippet 25) */
.jvk-product-ref{margin-top:2px;font-size:13px;line-height:1.4;letter-spacing:.08em;text-transform:uppercase;color:#6b6e85}
.jvk-product-ref span{color:var(--jvk-navy,#1c1f3c);font-weight:500;text-transform:none;letter-spacing:.04em}
.elementor-widget.jvk-product-ref-widget{margin-top:-12px}

/* Footer: betaallogo's */
.jvk-footer-payments{margin-top:4px;display:flex;flex-direction:column;gap:8px}
.jvk-footer-payments__label{font-family:Lora,serif;font-size:13px;color:#f8f7f4;opacity:.8}
.jvk-footer-payments__icons{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.jvk-footer-payments__icons svg{height:28px;width:auto;display:block;border-radius:4px}

/* Productpagina: fotoblok niet uitrekken tot de hoogte van de rechterkolom, witruimte onder gelijk aan boven (6%), blijft meescrollen (desktop) */
@media (min-width:1025px){.elementor-29648 .elementor-element-2da6118b{align-self:flex-start;position:sticky;top:90px;padding-bottom:6%!important}}

/* JvK bedankpagina: bevestigingsblok (12 okt 2026) */
.woocommerce-order .woocommerce-thankyou-order-received {
  border: 0 !important;
  border-top: 2px solid #DFBA69 !important;
  background: #fff !important;
  color: #1F2041 !important;
  font-family: "Lora", serif;
  font-size: 30px;
  line-height: 1.3;
  text-align: center;
  padding: 44px 24px 36px !important;
  margin-bottom: 32px !important;
}
.woocommerce-order .woocommerce-thankyou-order-received::before {
  content: "";
  display: block;
  width: 56px;
  height: 56px;
  margin: 0 auto 18px;
  border: 1.5px solid #DFBA69;
  border-radius: 50%;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23DFBA69' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 24px no-repeat;
}
.woocommerce-order .woocommerce-thankyou-order-received::after {
  content: "Je ontvangt binnen enkele minuten een bevestiging per e-mail.";
  display: block;
  margin-top: 10px;
  font-family: var(--wd-text-font, sans-serif);
  font-size: 15px;
  color: #6b6b7b;
}
@media (max-width: 767px) {
  .woocommerce-order .woocommerce-thankyou-order-received { font-size: 22px; padding: 32px 16px 28px !important; }
}

/* JvK bedankpagina: Mollie betaalmelding rustiger (12 okt 2026) */
.woocommerce-order .mollie-instructions,
.woocommerce-order > .woocommerce-info {
  background: #fff !important;
  color: #1F2041 !important;
  border: 0 !important;
  border-left: 2px solid #DFBA69 !important;
  border-radius: 0 !important;
  font-size: 14px;
  line-height: 1.6;
  padding: 16px 20px !important;
  margin-bottom: 32px !important;
}
.woocommerce-order .mollie-instructions::before,
.woocommerce-order > .woocommerce-info::before {
  color: #DFBA69 !important;
}
.woocommerce-order .mollie-instructions strong,
.woocommerce-order > .woocommerce-info strong {
  font-weight: 600;
  color: #1F2041;
}

/* JvK: hover brug hoofdmenu (Onze collectie) in de grote header, 13 okt 2026. De dropdown staat 21px onder het menu (uitlijning met de header), maar de standaard WoodMart brug was 15px, waardoor het menu dichtklapte bij het naar beneden bewegen. Brug nu even hoog als het gat. Sticky header (9px gat) blijft ongewijzigd. */
.whb-header:not(.whb-sticked) .wd-nav-main .item-level-0.menu-item-has-children > .wd-dropdown::after,
.whb-header:not(.whb-sticked) .item-level-0.menu-item-has-children > .wd-dropdown::after {
  top: -22px;
  height: 22px;
}@media (max-width: 576px) {
	/* JvK - Productkaarten op mobiel, 2 per rij (Gassan stijl), 7 okt 2026 */
html body .wd-products.wd-grid-g .wd-product.product-grid-item { margin-bottom: 0 !important; min-height: 0 !important; }
html body .wd-products.wd-grid-g { --wd-row-gap: 12px !important; --wd-col-gap: 10px !important; row-gap: 12px !important; }
html body .wd-products.wd-grid-g .wd-product.product-grid-item .product-wrapper { padding: 0 0 12px !important; height: 100% !important; }
html body .wd-products.wd-grid-g .wd-product.product-grid-item .product-element-top { height: auto !important; min-height: 0 !important; aspect-ratio: 1 / 1; overflow: hidden !important; }
html body .wd-products.wd-grid-g .wd-product.product-grid-item .product-element-top .product-image-link { width: 100% !important; height: 100% !important; display: block !important; }
html body .wd-products.wd-grid-g .wd-product.product-grid-item .product-element-top img { width: 100% !important; height: 100% !important; max-width: 100% !important; max-height: none !important; object-fit: cover !important; margin: 0 !important; padding: 10px !important; box-sizing: border-box !important; }
html body .wd-products.wd-grid-g .wd-product.product-grid-item .product-labels { top: 8px !important; right: 8px !important; }
html body .wd-products.wd-grid-g .wd-product.product-grid-item .product-label { font-size: 9px !important; min-height: 20px !important; padding: 3px 8px !important; }
html body .wd-products.wd-grid-g .wd-product.product-grid-item .wrapp-buttons { bottom: 6px !important; }
html body .wd-products.wd-grid-g .wd-product.product-grid-item .product-element-bottom { padding: 0 8px !important; }
html body .wd-products.wd-grid-g .wd-product.product-grid-item .wd-entities-title, html body .wd-products.wd-grid-g .wd-product.product-grid-item .wd-entities-title a { font-size: 15px !important; line-height: 1.3 !important; margin: 8px 0 2px !important; min-height: 0 !important; }
html body .wd-products.wd-grid-g .wd-product.product-grid-item .jvk-product-card-brand { font-size: 10px !important; margin: 0 0 4px !important; min-height: 0 !important; }
html body .wd-products.wd-grid-g .wd-product.product-grid-item .price, html body .wd-products.wd-grid-g .wd-product.product-grid-item .price .amount { font-size: 15px !important; min-height: 0 !important; margin: 0 !important; }
}

