/* ===========================================================================
   BBB — headeropmaak, topbar, menu/submenu, knoppen, wishlist + de
   homepage-fonts site-breed. Overgenomen van de staging-werkkopie
   (inline <style> uit de <head>), met koppen op Cormorant en body op Jost.
   =========================================================================== */

/* ===========================================================================
   The Seasons: het koplettertype uit het brandbook. Er is een gewicht
   beschikbaar (Bold). Door dat gewicht voor het hele bereik te declareren
   maakt de browser geen kunstmatig vet, wat de letter zou vervormen.
   =========================================================================== */
@font-face{
  font-family:'The Seasons';
  src:url('../fonts/the-seasons.woff2') format('woff2'),
      url('../fonts/the-seasons.woff') format('woff'),
      url('../fonts/the-seasons.ttf') format('truetype');
  font-weight:400 700;
  font-style:normal;
  font-display:swap;
}

:root{
  /* Lettertypes: twee, zoals afgesproken. Koppen serif, tekst schreefloos. */
  --bbb-font-heading: 'The Seasons', 'Cormorant Garamond', Georgia, serif;
  --bbb-font-body: 'Jost', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Kleuren: de vijf uit het brandbook, en niets daarbuiten.
     Wijzig een merkkleur hier en de hele site volgt. */
  --bbb-white:    #FFFFFF;
  --bbb-linen:    #F5F1EA;
  --bbb-khaki:    #D7C9B8;
  --bbb-taupe:    #857060;
  --bbb-espresso: #68594C;

  /* Functionele kleuren, bewust buiten het merkpalet: deze maken iets
     duidelijk aan de klant en dragen geen merkuitstraling. */
  --bbb-voorraad: #4C7A5B;
  --bbb-hartje:   #E7A7B4;

  /* Afronding: een maat voor knoppen, velden en blokken. */
  --bbb-radius: 4px;
}

/* Homepage-fonts overal: body in Jost (koppen zet het staging-blok hieronder). */
body, button, input, select, textarea, optgroup,
p, li, blockquote, label, td, th,
.menu a, .menu_box a, #header a, #menu a,
.woocommerce, .price, .amount, .product-card{
  font-family: var(--bbb-font-body);
}

/* Het oude thema zet op losse tekstelementen nog een derde lettertype
   (Old Standard). Alles wat geen kop en geen icoon is, gaat naar Jost.
   De selector staat volledig in :where zodat hij geen gewicht heeft en de
   kopregel eronder altijd wint. Iconen en de WebwinkelKeur-widget zijn
   uitgezonderd; hun tekens zijn lettertype-afhankelijk. */
:where(p, span, div, a, li, dt, dd, td, th, label, strong, em, b, small, blockquote, figcaption, cite, address, button, input, select, textarea, optgroup, legend):where(:not([class*="fa-"]):not(.fa):not([class*="tinvwl-icon"]):not([class*="wwk"]):not([class*="swiper-"])){
  font-family: var(--bbb-font-body) !important;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,
h1 span, h2 span, h3 span, h1 em, h2 em, h1 strong, h2 strong{
  font-family: var(--bbb-font-heading) !important;
}

/* Topbar: drie verzendteksten over de volle breedte, subtiel formaat */
	/* Beige, zoals de klant in haar feedback vroeg ("de bovenste balk wel
	   beige houden"). Donkere tekst voor de leesbaarheid. */
	.bbb-topbar{ background:var(--bbb-khaki); color:var(--bbb-espresso); font-size:.66rem; }
	.bbb-topbar-inner svg{ stroke:var(--bbb-espresso); }
	.bbb-topbar-inner{ max-width:1280px; margin:0 auto; padding:.5em 1.5rem; display:flex; justify-content:space-between; align-items:center; gap:1rem; }
	.bbb-topbar-inner span{ display:flex; align-items:center; gap:.45em; opacity:.95; white-space:nowrap; }
	.bbb-topbar-inner svg{ width:12px; height:12px; flex:none; }
	.usp_slider{ display:none !important; }
	@media (max-width:780px){ .bbb-topbar{ font-size:9px; } .bbb-topbar-inner{ padding:.45em 1rem; } }
	@media (max-width:560px){ .bbb-topbar-inner span:nth-child(2), .bbb-topbar-inner span:nth-child(3){ display:none; } .bbb-topbar-inner{ justify-content:center; } .bbb-topbar-inner span{ white-space:normal; text-align:center; } }

	/* Koppen: brandbook-serif in plaats van het oude handschrift-font */
	h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{ font-family:var(--bbb-font-heading); font-weight:400; }

	/* Footerkoppen compact */
	footer h3, footer .h3, footer h4{ font-size:19px !important; margin-bottom:.8rem; }

	/* Submenu-items in dropdowns altijd onder elkaar */
	.sub-menu{ display:block !important; }
	.sub-menu li{ display:block !important; width:100%; margin:0 !important; }
	.sub-menu li a{ display:block; padding:.45em 0; }

	/* Knopstijl van de homepage, sitebreed */
	.button, button[type=submit], input[type=submit], .single_add_to_cart_button,
	.checkout-button, #place_order, .btn-primary, .wc-forward,
	.woocommerce a.button, .woocommerce button.button{
		background:var(--bbb-espresso) !important; color:#fff !important; border:none !important;
		border-radius:var(--bbb-radius) !important; text-transform:uppercase; letter-spacing:.1em;
		font-size:.78rem !important; font-weight:500; padding:.9em 1.8em;
		transition:background .2s ease;
	}
	.button:hover, button[type=submit]:hover, input[type=submit]:hover,
	.single_add_to_cart_button:hover, .checkout-button:hover, #place_order:hover,
	.btn-primary:hover, .woocommerce a.button:hover, .woocommerce button.button:hover{
		background:var(--bbb-taupe) !important; color:#fff !important;
	}

	/* Logo-formaat */
	.logo_box img#logo, img.logo-nieuw{ height:92px; width:auto; display:block; }
	@media (max-width:780px){ .logo_box img#logo, img.logo-nieuw{ height:60px; } }

@media (min-width:992px){
		.bbb-header-eenrij #header .first_row{ display:flex !important; flex-wrap:nowrap; align-items:center; gap:1.4rem; max-width:100%; }

		/* Logo groot en links, zoals in het ontwerp */
		.bbb-header-eenrij #header .logo_box{ flex:0 0 auto; width:auto !important; max-width:none !important; margin:0 !important; text-align:left; }
		.bbb-header-eenrij #header .logo_box img#logo,
		.bbb-header-eenrij #header .logo_box img.logo-nieuw{ height:112px !important; width:auto; }

		/* Menu subtiel en klein, op dezelfde rij */
		.bbb-header-eenrij #header #menu{ flex:1 1 auto; min-width:0; display:block !important; padding:0 !important; background:none !important; border:none !important; }
		.bbb-header-eenrij #header #menu .container,
		.bbb-header-eenrij #header #menu .row,
		.bbb-header-eenrij #header #menu .col-12{ padding:0 !important; margin:0 !important; max-width:none !important; width:auto !important; }
		.bbb-header-eenrij #header #menu .menu_box{ justify-content:flex-start !important; }
		.bbb-header-eenrij #header #menu ul{ justify-content:flex-start !important; gap:1.15rem !important; flex-wrap:nowrap; }
		.bbb-header-eenrij #header #menu ul > li > a{ white-space:nowrap; font-size:12px !important; letter-spacing:.09em; font-weight:500; }
		.bbb-header-eenrij #header #menu ul .sub-menu a{ font-size:12px !important; letter-spacing:.04em; }

		/* Zoeken als icoon in plaats van een brede balk */
		.bbb-header-eenrij #header .search_box{ flex:0 0 auto; width:auto !important; max-width:none !important; margin:0 !important; background:none !important; border:none !important; }
		.bbb-header-eenrij #header .search_box input{ display:none !important; }
		.bbb-header-eenrij #header .search_box button{ background:none !important; color:var(--bbb-espresso) !important; padding:0 !important; border:none !important; font-size:17px; }

		.bbb-header-eenrij #header .icon_col.icons{ flex:0 0 auto; width:auto !important; margin:0 !important; display:flex; align-items:center; gap:.85rem; }
	}
	@media (min-width:992px) and (max-width:1200px){
		.bbb-header-eenrij #header .logo_box img#logo,
		.bbb-header-eenrij #header .logo_box img.logo-nieuw{ height:86px !important; }
		.bbb-header-eenrij #header #menu ul{ gap:.85rem !important; }
		.bbb-header-eenrij #header #menu ul > li > a{ font-size:11px !important; letter-spacing:.06em; }
	}

footer .footer_logo, footer .logo_box, footer .footer-logo{ text-align:left !important; justify-content:flex-start !important; }
	footer .footer_logo img, footer .logo_box img, footer img.logo-nieuw, footer img[src*="logo"]{ margin-left:0 !important; margin-right:auto !important; display:block; height:104px; width:auto; }
	@media (max-width:780px){ footer .footer_logo img, footer .logo_box img, footer img[src*="logo"]{ height:68px; } }

.tinv-wishlist .tinv-modal .tinv-modal-inner{ background:var(--bbb-linen); border-radius:var(--bbb-radius); padding:1.6rem 1.5rem; max-width:380px; box-shadow:0 18px 50px rgba(60,46,36,.25); }
	.tinv-wishlist .tinv-modal, .tinv-wishlist .tinv-modal *{ font-family:var(--bbb-font-body); color:var(--bbb-espresso); }
	.tinv-wishlist .tinv-modal .tinv-txt{ font-size:.95rem; margin:0 0 1em; }
	.tinv-wishlist .tinv-modal button, .tinv-wishlist .tinv-modal .button{ background:var(--bbb-espresso) !important; color:#fff !important; border:none !important; border-radius:var(--bbb-radius) !important; text-transform:uppercase; letter-spacing:.08em; font-size:.72rem !important; padding:.9em 1.5em !important; }
	.tinv-wishlist .tinv-modal button:hover, .tinv-wishlist .tinv-modal .button:hover{ background:var(--bbb-taupe) !important; }
	.tinv-wishlist .tinv-overlay{ background:rgba(24,18,13,.5); }
	.tinv-wishlist table.tinvwl-table-manage-list{ border:none; }
	.tinv-wishlist table.tinvwl-table-manage-list td, .tinv-wishlist table.tinvwl-table-manage-list th{ border-color:var(--bbb-khaki); }
	.tinv-wishlist td.product-name a{ color:var(--bbb-espresso) !important; font-weight:500; text-decoration:none; }
	.tinv-wishlist .product-cb, .tinv-wishlist .tinvwl-input-group.tinvwl-to-left, .tinv-wishlist .social-buttons, .tinv-wishlist .tinv-lists-nav{ display:none !important; }
	.tinv-wishlist .product-stock .tinvwl-txt{ color:var(--bbb-voorraad); }
	.tinv-wishlist button.button, .tinv-wishlist .button{ background:var(--bbb-espresso) !important; color:#fff !important; border:none !important; border-radius:var(--bbb-radius) !important; text-transform:uppercase; letter-spacing:.06em; font-size:.72rem !important; }
	.tinv-wishlist button.button:hover, .tinv-wishlist .button:hover{ background:var(--bbb-taupe) !important; }
	.tinv-wishlist td.product-action .tinvwl-txt{ display:inline !important; font-size:.7rem !important; color:#fff !important; } .tinv-wishlist button.button i::before{ color:#fff !important; } .tinv-wishlist td.product-action button i.fa-bag-shopping::before{ content:"In winkelwagen"; font-family:var(--bbb-font-body); font-style:normal; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:#fff; } .tinv-wishlist td.product-action .button i.fa-bag-shopping::before{ content:"In winkelwagen"; font-family:var(--bbb-font-body); font-style:normal; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:#fff; } .tinv-wishlist td.product-action .button{ min-width:150px; } .tinv-wishlist td.product-action .button i{ display:inline-block !important; font-style:normal !important; } .tinv-wraper.tinvwl-after-add-to-cart, .tinv-wraper.tinvwl-before-add-to-cart{ display:block; margin:1em 0 0; clear:both; } .single-product .tinvwl_add_to_wishlist_button{ display:inline-flex !important; align-items:center; background:transparent !important; color:var(--bbb-espresso) !important; border:1px solid var(--bbb-khaki) !important; border-radius:var(--bbb-radius) !important; padding:.7em 1.2em !important; text-transform:uppercase; font-size:.72rem !important; letter-spacing:.08em; line-height:1 !important; } .single-product .tinvwl_add_to_wishlist_button::before{ font-size:14px; margin-right:.5em; } .single-product .tinvwl_add_to_wishlist_button:hover{ border-color:var(--bbb-taupe) !important; color:var(--bbb-taupe) !important; } .product_box{ position:relative; } .bbb-card-wishlist{ position:absolute; top:.7rem; right:.7rem; z-index:5; } .bbb-card-wishlist .tinv-wishlist{ margin:0; } .bbb-card-wishlist .tinvwl_add_to_wishlist_button{ width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center; color:var(--bbb-espresso); font-size:0 !important; box-shadow:0 6px 24px rgba(60,46,36,.12); margin:0; } .bbb-card-wishlist .tinvwl_add_to_wishlist_button *{ font-size:0 !important; line-height:0 !important; } .bbb-card-wishlist .tinvwl_add_to_wishlist_button::before{ font-size:15px !important; line-height:1 !important; margin:0 !important; } .bbb-card-wishlist .tinvwl_add_to_wishlist_button.tinvwl-product-in-list{ color:var(--bbb-hartje); } .bbb-card-wishlist .tinv-wishlist-clear{ display:none; } .tinvwl-loop-button-wrapper:not(.tinvwl-shortcode-add-to-cart){ display:none !important; } .product_box .tinv-wraper, ul.products .tinv-wraper, .product-card .tinv-wraper, .products .tinv-wraper{ display:none !important; } .bbb-card-wishlist .tinv-wraper, .wishlist-ti .tinv-wraper{ display:block !important; } .single-product .tinv-wraper{ display:block !important; } .product_box .tinvwl-loop-button-wrapper, ul.products .tinvwl-loop-button-wrapper{ display:none !important; } .bbb-card-wishlist .tinvwl-loop-button-wrapper, .wishlist-ti .tinvwl-loop-button-wrapper{ display:block !important; }

#menu .sub-menu, .menu_box .sub-menu, header .sub-menu{
		background:#fff !important; border:1px solid var(--bbb-khaki) !important; border-top:2px solid var(--bbb-taupe) !important;
		box-shadow:0 12px 30px rgba(60,46,36,.14) !important; border-radius:var(--bbb-radius);
		padding:.5rem 0 !important; min-width:230px;
	}
	#menu .sub-menu li, header .sub-menu li{ background:none !important; border:none !important; }
	#menu .sub-menu li a, header .sub-menu li a{
		color:var(--bbb-espresso) !important; background:none !important; text-transform:none !important;
		padding:.55em 1.2em !important; display:block; font-weight:400;
	}
	#menu .sub-menu li a:hover, header .sub-menu li a:hover{ background:var(--bbb-linen) !important; color:var(--bbb-taupe) !important; }

/* Footerlogo links, op formaat */
	.bbb-footer-logo{ display:block; margin:0 0 1.2rem; }
	.bbb-footer-logo img{ height:96px; width:auto; display:block; margin:0; }
	@media (max-width:780px){ .bbb-footer-logo img{ height:72px; } }

	/* Verzendbalk: op de homepage overbodig (de USP-strip staat onder de hero) */
	body.home .bbb-topbar{ display:none !important; }

	/* Mobiel logo groter */
	@media (max-width:780px){
		#header .logo_box img#logo, #header .logo_box img.logo-nieuw{ height:76px !important; width:auto; }
	}
	@media (max-width:420px){
		#header .logo_box img#logo, #header .logo_box img.logo-nieuw{ height:64px !important; }
	}

	/* USP-strip onder de hero: klein en rustig op mobiel */
	@media (max-width:780px){
		.bbb-home .usp-strip ul{ padding:.7rem 0 !important; gap:.45rem .7rem !important; }
		.bbb-home .usp-strip li{ font-size:10px !important; line-height:1.3 !important; gap:.4em !important; }
		.bbb-home .usp-strip svg{ width:13px !important; height:13px !important; }
	}
	@media (max-width:780px){ .bbb-home .usp-strip li span, .bbb-home .usp-strip li br + span{ font-size:10px !important; line-height:1.3 !important; } .bbb-home .trust-strip li strong{ font-size:11px !important; } .bbb-home .trust-strip li span{ font-size:10px !important; } }

/* Pagina mag nooit breder zijn dan het scherm. De hoogte laten we aan
	   het thema (vaste bloktegels met object-fit), anders vallen tegels
	   deels leeg en lijnen kaarten niet meer uit. */
	/* Zijwaarts afknippen zonder van de body een schuifvlak te maken.
	   Met overflow-x:hidden op de body verhuist het verticaal scrollen
	   daarheen, en werken vastgezette balken en scroll-effecten niet meer
	   zoals bedoeld. */
	html{ overflow-x: clip; }
	body{ overflow-x: clip; max-width: 100%; }
	@supports not (overflow-x: clip){
		html, body{ overflow-x: hidden; }
	}
	img.wp-post-image, .product_box img, .product-card img{ max-width:100%; height:auto; }

	#menu li.menu-item-has-children, .menu_box li.menu-item-has-children{ position:relative; }
	@media (min-width:992px){
		#menu .sub-menu, .menu_box .sub-menu{ top:100%; left:0; border:1px solid var(--bbb-khaki); border-top:2px solid var(--bbb-taupe); box-shadow:0 12px 30px rgba(60,46,36,.14); border-radius:var(--bbb-radius); padding:.5rem 0; min-width:230px; }
	}
	#menu .sub-menu a:hover, .menu_box .sub-menu a:hover{ background:var(--bbb-linen) !important; color:var(--bbb-taupe) !important; }

	/* Topbar mobiel: minder teksten naarmate het scherm smaller wordt.
	   De flexrij is .bbb-topbar-inner, niet .bbb-topbar zelf. */
	@media (max-width:991px){
		.bbb-topbar .bbb-topbar-inner{ padding:0 14px; gap:1rem; }
		.bbb-topbar .bbb-topbar-inner > span:nth-child(2){ display:none !important; }
	}
	@media (max-width:560px){
		.bbb-topbar .bbb-topbar-inner > span:nth-child(3){ display:none !important; }
		.bbb-topbar .bbb-topbar-inner{ justify-content:center !important; }
		.bbb-topbar .bbb-topbar-inner > span{ white-space:nowrap; }
	}

.bbb-spaar{ background:var(--bbb-linen); border:1px solid var(--bbb-khaki); border-top:2px solid var(--bbb-taupe); padding:1.6rem 1.8rem; margin:0 0 2rem; }
	.bbb-spaar__saldo{ display:flex; align-items:baseline; gap:.45rem; margin-bottom:1rem; }
	.bbb-spaar__getal{ font-family:var(--bbb-font-heading); font-size:2.6rem; line-height:1; color:var(--bbb-espresso); }
	.bbb-spaar__label{ font-size:.95rem; letter-spacing:.08em; text-transform:uppercase; color:var(--bbb-taupe); }
	.bbb-spaar__balk{ height:8px; background:var(--bbb-khaki); border-radius:99px; overflow:hidden; }
	.bbb-spaar__vulling{ display:block; height:100%; background:var(--bbb-taupe); border-radius:99px; transition:width .5s ease; }
	.bbb-spaar__tekst{ margin:.9rem 0 0; color:var(--bbb-espresso); font-size:.95rem; line-height:1.6; }
	.bbb-spaar__tekst strong{ color:var(--bbb-taupe); font-weight:600; }
	@media (max-width:780px){
		.bbb-spaar{ padding:1.2rem 1.1rem; }
		.bbb-spaar__getal{ font-size:2.1rem; }
		.bbb-spaar__tekst{ font-size:.88rem; }
	}

/* --------------------------------------------------------------------------
   Betrouwbare sluitknop voor het mobiele menu (het thema had er geen).
   -------------------------------------------------------------------------- */
.bbb-mobile-close{
  position:fixed; top:.8rem; right:1rem; z-index:100000;
  width:40px; height:40px; line-height:38px; text-align:center;
  font-size:2rem; cursor:pointer; color:var(--bbb-espresso); border-radius:50%;
  background:rgba(255,255,255,.9);
}
.bbb-mobile-close:hover{ background:rgba(0,0,0,.06); }

/* --------------------------------------------------------------------------
   Nieuwsbrief in de footer: 10% korting-kop + voordelen met vinkjes.
   -------------------------------------------------------------------------- */
.site-footer .newsletter .newsletter-sub{
  margin:-.4rem 0 1rem; font-style:italic; opacity:.85; font-size:inherit;
}
.site-footer .newsletter .newsletter-usps{
  list-style:none; margin:1.1rem 0 0; padding:0;
}
.site-footer .newsletter .newsletter-usps li{
  position:relative; padding:.28em 0 .28em 1.6em; font-size:inherit; line-height:1.4;
}
/* Mobiel: geen brede desktop-zoekbalk in de header (die hoort in het
   uitklapmenu). Zonder deze regel lekt hij via de cache naar de mobiele
   weergave en duwt hij de iconen naar beneden. */
@media (max-width: 991px){
  #header .first_row .search_box{ display:none !important; }
}

/* Mobiel: de verzendstrip (USP's) netjes gecentreerd in elk vak. */
@media (max-width: 991px){
  .bbb-home .usp-strip li{ justify-content:center !important; text-align:center; }
  .bbb-home .usp-strip li span{ text-align:center; }
}

/* Loze plus/min-knoppen verbergen bij producten met maar 1 op voorraad
   (WooCommerce maakt het aantalveld dan 'hidden'; de knoppen doen niets). */
.quantity:has(input.qty[type="hidden"]) .plus,
.quantity:has(input.qty[type="hidden"]) .minus{ display:none !important; }

.site-footer .newsletter .newsletter-usps li::before{
  content:""; position:absolute; left:0; top:.55em;
  width:.62em; height:.34em; border-left:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(-45deg); opacity:.75;
}
