.elementor-9878 .elementor-element.elementor-element-af6f4f1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9878 .elementor-element.elementor-element-c700efd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-9878 .elementor-element.elementor-element-ad8aa16{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for html, class: .elementor-element-a42e2b4 *//* ---------- Base styling (unchanged) ---------- */
.semko-toprow{
  max-width:1200px;
  margin:0 auto;
  padding:12px 0 6px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  font-family:sans-serif;
  border-bottom:1px solid #f3f5f6;
}
.semko-toplinks{
  display:flex; align-items:center; gap:28px; font-size:13px;
}
.semko-toplinks a{
  color:#265945; text-decoration:none; font-weight:600; transition:color .2s;
  white-space:nowrap;                 /* "Over Semko" niet afbreken */
}
.semko-toplinks a:hover{ color:#2e7d32; }

.header-winkelwagen{ display:flex; align-items:center; min-width:64px; }
.header-winkelwagen a{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  font-size:20px; line-height:1; color:#2e7d32; text-decoration:none; transition:color .2s;
}
.header-winkelwagen a:hover{ color:#1d5424; }

/* Mobiele bar standaard uit (alleen mobiel tonen als niet-home) */
.semko-mobile-bar{ display:none; }

/* ------- Mobile rules (≤ 992px) ------- */
@media (max-width:992px){
  /* Compactere top-links */
  .semko-toprow{ padding:8px 12px 4px; gap:10px; }
  .semko-toplinks{ gap:10px; }
  .semko-toplinks a{ font-size:14px; padding:0 4px; }

  /* HOMEPAGE (mobile): toon links-rij, verberg Home+Cart bar */
  body.home .semko-toprow{ display:flex; }
  body.home .semko-mobile-bar{ display:none; }

  /* ALLE ANDERE PAGINA'S (mobile): verberg links-rij, toon Home+Cart bar */
  body:not(.home) .semko-toprow{ display:none; }
  body:not(.home) .semko-mobile-bar{
    display:flex;
    align-items:center; justify-content:space-between;
    gap:12px; padding:10px 12px;
    background:#fff; border-bottom:1px solid #f0f3f4;
  }

  /* Home-knop in mobiele bar */
  .mobile-home-link{
    display:flex; align-items:center; justify-content:center;
    width:38px; height:38px; border-radius:8px;
    background:#2e7d32; color:#fff; text-decoration:none;
    box-shadow:0 2px 6px rgba(0,0,0,.08);
  }
  .mobile-home-link:hover{ filter:brightness(.95); }

  /* Cart in mobiele bar (Elementor mini-cart) */
  .header-winkelwagen--mobile{ display:flex; align-items:center; }
  .header-winkelwagen--mobile .elementor-menu-cart__toggle .elementor-button{
    background:transparent; box-shadow:none; padding:0; min-width:auto;
  }
  .header-winkelwagen--mobile .elementor-menu-cart__toggle .elementor-button-icon,
  .header-winkelwagen--mobile .elementor-menu-cart__toggle .eicon,
  .header-winkelwagen--mobile .elementor-menu-cart__toggle svg{
    font-size:22px; color:#2e7d32; line-height:1;
  }
  .header-winkelwagen--mobile .elementor-menu-cart__counter{
    background:#2e7d32; color:#fff; font-weight:700;
    font-size:11px; line-height:1; padding:2px 5px; border-radius:999px;
    min-width:16px; text-align:center;
    position:absolute; top:-6px; right:-8px; box-shadow:0 2px 4px rgba(0,0,0,.15);
  }
}

/* Mega Menu hamburger netjes verticaal */
.mega-menu-toggle{ display:flex !important; align-items:center; height:100%; }

/* Cart drawer altijd bovenaan */
.elementor-menu-cart__container{ z-index:99999 !important; }

/* Promo bar stack op smalle schermen */
@media (max-width:700px){
  .semko-bar{
    flex-direction:column !important; gap:6px !important;
    font-size:14px !important; padding:8px 0 !important;
  }
}
/* --- DESKTOP fixes --- */
@media (min-width: 992px){

  /* 1) Hamburger (Max Mega Menu) verbergen op desktop */
  .mega-menu-toggle{
    display: none !important;
  }

  /* 2) Toprow rechts uitlijnen: links + cart als één cluster rechts */
  .semko-toprow{
    justify-content: flex-end;   /* geen space-between meer */
    gap: 14px;
  }
  .semko-toplinks{
    margin-left: 0;              /* niet meer wegduwen */
    gap: 20px;
  }

  /* nette scheiding vlak vóór het cart-icoon */
  .header-winkelwagen{
    margin-left: 12px;
    position: relative;
  }
  .header-winkelwagen::before{
    content:"";
    display:inline-block;
    width:1px; height:18px;
    background:#e5e7eb;
    margin-right:12px;
  }
}/* End custom CSS */
/* Start custom CSS for maxmegamenu, class: .elementor-element-2987807 */#mega-menu-primary > li.mega-menu-item a.mega-menu-link[href*="/nieuw/"]{
  position:relative; padding-right:26px;
}
#mega-menu-primary > li.mega-menu-item a.mega-menu-link[href*="/nieuw/"]::after{
  content:"nieuw"; position:absolute; right:4px; top:50%; transform:translateY(-50%);
  font-size:10px; font-weight:700; text-transform:uppercase;
  background:#e6faed; color:#2e7d32; border:1px solid #cde8d1;
  padding:2px 5px; border-radius:999px;
}
/* === Mobiel: tekstlabel naast de MMM hamburger === */
@media (max-width: 992px){
  /* zorg dat de toggle en tekst netjes uitlijnen */
  .mega-menu-toggle,
  .mega-toggle-animated{
    display:flex !important;
    align-items:center;
  }

  /* het label zelf (wit op je groene balk) */
  .mega-menu-toggl::after,
  .mega-toggle-animated::after{
    content: " Semko maakt leren leuk";         /* ← tekst kun je hier wijzigen */
    margin-left: 10px;
    color: #fff;               /* wit past bij je groene balk */
    font-weight: 700;
    font-size: 19px;
    line-height: 1;
  }
}/* End custom CSS */
/* Start custom CSS for fibosearch, class: .elementor-element-14b5b22 *//* Placeholder iets subtieler */
.dgwt-wcas-search-wrapp input::placeholder {
  opacity: .8;
  font-size: 15px;
}

/* Zoekbalk styling mobiel */
@media (max-width: 768px){
  .elementor-search-form {
    width: 94%;
    margin: 8px auto;
  }
  
  /* Zoombalk afronding en schaduw */
  .elementor-search-form input {
    border-radius: 30px;
    border: 1px solid #cce5d6;
    padding-left: 38px; /* ruimte voor icoon */
  }
  
  /* Vergrootglas kleur */
  .elementor-search-form .elementor-search-form__icon {
    color: #2e7d32; /* Semko groen */
  }
}

/* Hamburger menu naar links */
@media (max-width: 1024px){
  .elementor-menu-toggle {
    order: -1;
  }
}

/* Hamburger kleur */
.elementor-menu-toggle svg {
  fill: #2e7d32;
}

/* Achtergrond dropdown mobiel menu */
.elementor-nav-menu--dropdown {
  background-color: #e6faed;
}/* End custom CSS */