/* 20260902142247 - v2 */
.gui,
.gui-block-linklist li a {
  color: #666666;
}

.gui-page-title,
.gui a.gui-bold,
.gui-block-subtitle,
.gui-table thead tr th,
.gui ul.gui-products li .gui-products-title a,
.gui-form label,
.gui-block-title.gui-dark strong,
.gui-block-title.gui-dark strong a,
.gui-content-subtitle {
  color: #000000;
}

.gui-block-inner strong {
  color: #666666;
}

.gui a {
  color: #0a8de9;
}

.gui-input.gui-focus,
.gui-text.gui-focus,
.gui-select.gui-focus {
  border-color: #0a8de9;
  box-shadow: 0 0 2px #0a8de9;
}

.gui-select.gui-focus .gui-handle {
  border-color: #0a8de9;
}

.gui-block,
.gui-block-title,
.gui-buttons.gui-border,
.gui-block-inner,
.gui-image {
  border-color: #8d8d8d;
}

.gui-block-title {
  color: #000000;
  background-color: #ffffff;
}

.gui-content-title {
  color: #000000;
}

.gui-form .gui-field .gui-description span {
  color: #666666;
}

.gui-block-inner {
  background-color: #f4f4f4;
}

.gui-block-option {
  border-color: #ededed;
  background-color: #f9f9f9;
}

.gui-block-option-block {
  border-color: #ededed;
}

.gui-block-title strong {
  color: #000000;
}

.gui-line,
.gui-cart-sum .gui-line {
  background-color: #cbcbcb;
}

.gui ul.gui-products li {
  border-color: #dcdcdc;
}

.gui-block-subcontent,
.gui-content-subtitle {
  border-color: #dcdcdc;
}

.gui-faq,
.gui-login,
.gui-password,
.gui-register,
.gui-review,
.gui-sitemap,
.gui-block-linklist li,
.gui-table {
  border-color: #dcdcdc;
}

.gui-block-content .gui-table {
  border-color: #ededed;
}

.gui-table thead tr th {
  border-color: #cbcbcb;
  background-color: #f9f9f9;
}

.gui-table tbody tr td {
  border-color: #ededed;
}

.gui a.gui-button-large,
.gui a.gui-button-small {
  border-color: #8d8d8d;
  color: #000000;
  background-color: #ffffff;
}

.gui a.gui-button-large.gui-button-action,
.gui a.gui-button-small.gui-button-action {
  border-color: #8d8d8d;
  color: #ffffff;
  background-color: #93bd10;
}

.gui a.gui-button-large:active,
.gui a.gui-button-small:active {
  background-color: #cccccc;
  border-color: #707070;
}

.gui a.gui-button-large.gui-button-action:active,
.gui a.gui-button-small.gui-button-action:active {
  background-color: #75970c;
  border-color: #707070;
}

.gui-input,
.gui-text,
.gui-select,
.gui-number {
  border-color: #8d8d8d;
  background-color: #ffffff;
}

.gui-select .gui-handle,
.gui-number .gui-handle {
  border-color: #8d8d8d;
}

.gui-number .gui-handle a {
  background-color: #ffffff;
}

.gui-input input,
.gui-number input,
.gui-text textarea,
.gui-select .gui-value {
  color: #000000;
}

.gui-progressbar {
  background-color: #93bd10;
}

/* custom */
/* Claude (Cowork), 13-08-2026: Verberg dropdown van "Olijfolie" in hoofdmenu, gedraagt zich nu als gewone link (zoals "Thee & Matcha") BEGIN */
.menu.list-inline > li.item.sub:nth-child(3) .dropdown-menu {
      display: none !important;
}
.menu.list-inline > li.item.sub:nth-child(3) > a > i.icon-small-down {
      visibility: hidden !important;
      opacity: 0 !important;
      width: 0 !important;
      margin: 0 !important;
      padding: 0 !important;
}
/* Claude (Cowork), 13-08-2026: Verberg dropdown van "Olijfolie" in hoofdmenu END */

/* Claude (Cowork), 13-08-2026: Prullenbak-knop in mini-winkelmandje exact gelijk maken aan winkelwagen-pagina (kleuren + hover) BEGIN */
html body .tool.mini-cart .dropdown-menu.keep-open .delete-item.dks-cart-trash {
      background: #fff !important;
      border: 1px solid #d9dfd5 !important;
      border-radius: 9px !important;
      color: #17211a !important;
      width: 44px !important;
      height: 44px !important;
      box-shadow: none !important;
  
      right: -20px !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .delete-item.dks-cart-trash:hover,
html body .tool.mini-cart .dropdown-menu.keep-open .delete-item.dks-cart-trash:focus {
      background: #f5f9ee !important;
      border-color: #0b7a2a !important;
      color: #0b7a2a !important;
      box-shadow: none !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .delete-item.dks-cart-trash::before {
      content: none !important;
      display: none !important;
      width: 0 !important;
      height: 0 !important;
}
/* Claude (Cowork), 13-08-2026: Prullenbak-knop in mini-winkelmandje exact gelijk maken aan winkelwagen-pagina END */

/*Roger, Lightspeed, 04-11-2025:, [move loyalty points in order summary down a few spaces] BEGIN*/

.gui-points-to-be-earned {
	margin-top: 10px;
}

/*Roger, Lightspeed, 04-11-2025:, [move loyalty points in order summary down a few spaces] END*/

/*Joram, Lightspeed, 15-09-2020:, [bigger logo + hide category page image] BEGIN*/
.vertical.logo a img {
    max-width: 200px;
    width: auto;
    max-height: 75px;
    height: auto;
}

.category-content img {
    float: left;
    margin-right: 15px;
    display: none;
}
/*Joram. Binsbergen, Lightspeed, 15-09-2020:, [igger logo + hide category page image] END*/

/* Danny.Spaan- 16 Sept 2020 - Hide Compare - START */
a[title="Vergelijk producten"] {
    display: none!important;
}
/* Danny.Spaan- 16 Sept 2020 - 09 Apr-2020 - END */

/*T. Donckerwolcke, Lightspeed, 16-09-2020:, [ZD# 1415808] BEGIN*/

.products .center-column .tot-compare>div {
    display: none;
}

.center-column .product-options-mode #filter_sort_form>div>span {
    display: none;
}

/*T. Donckerwolcke, Lightspeed, 16-09-2020:, [ZD# 1415808] EIND*/

/* Maud LightspeedHQ - 24 09 2020 - vierkantjes en shop now button weg bij afbeelding ttcmparallex homepage - START */
.ttcmsparallex .ttcmsparallex-content .ttcmsparallex-inner #ttcmsparallex-carousel li .cmsparallex-content .cmsparallex-btn a {
    display: none;
}
.ttcmsparallex .ttcmsparallex-content .ttcmsparallex-inner #ttcmsparallex-carousel .owl-dots {
    display: none;
}
/* Maud LightspeedHQ  - END */
/* LS Suraja Kok: Verbergen keer terug naar de backoffice*/
.wsa-demobar a, .wsa-demobar a.close { display: none !important; } 
.wsa-demobar{ position: absolute !important; } 
@media screen and (max-width: 767px){ .wsa-demobar{ display: none !important; } body { 
margin-top: 0px!important; } }
.page-container.page-checkouts.onestep {background: transparent;}




/* 3) ‘Recent bekeken’ uitsluiten (brede dekking) */
:is(
  #recently-viewed, #recent, #recent-items, #recent-products,
  .recently-viewed, .recently-viewed-products, .recent-products, .recent-items,
  .recentlyViewed, .recently_viewed, .recent-products-wrapper, .recently-viewed-wrapper,
  [data-recently-viewed], [data-widget*="recent"], [data-section*="recent"],
  [id*="recent"], [class*="recent"], [class*="recently"], [class*="recent-view"], [class*="viewed"]
) a:has(img, picture, figure)::before{
  content:none !important;
}

/* 4) Mobiel compacter */
@media (max-width:480px){
  a:has(img, picture, figure)::before{
    font-size:11px; padding:5px 8px; top:8px; left:8px;
  }
}
@media (max-width: 1023px) {
  #headlines {
    display: none !important;
  }
}
.label.flex {
  position: relative;
}
/* ===========================================================
   DE KRUIDENSHOP – 100% NATUURLIJK LABEL
   NIEUWE VEILIGE VERSIE (GEEN FOTO-BUGS, GEEN HOVER-CONFLICTEN)
   =========================================================== */

/* Maak de producttegel-container positioneerbaar */
.item-image-container {
  position: relative !important;
}

/* Het groene 100% natuurlijk label */
.item-image-container::after {
  content: "";
  position: absolute;
  top: 10px;
  right: -2px;
  width: 62px;
  height: 62px;
  background-image: url("https://cdn.webshopapp.com/shops/307242/files/487681665/100-natuurlijk.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 20; /* boven hover */
  pointer-events: none;
  opacity: 1; /* zichtbaar */
}


/* ===========================================================
   UITZONDERINGEN — LABEL VERBERGEN, MAAR FOTO LATEN STAAN
   (UITSLUITING VIA :has() → 100% nauwkeurig per product)
   =========================================================== */

/* Citruspers */
.item-image-container:has(a[href*="citruspers"])::after {
  opacity: 0 !important;
}

/* Keramische knoflookrasp — ALLE varianten */
.item-image-container:has(a[href*="keramische"])::after,
.item-image-container:has(a[href*="knoflookrasp"])::after {
  opacity: 0 !important;
}

/* Pepermolen */
.item-image-container:has(a[href*="pepermolen"])::after {
  opacity: 0 !important;
}

/* Zoutmolen */
.item-image-container:has(a[href*="zoutmolen"])::after {
  opacity: 0 !important;
}


/* ===========================================================
   VEILIGHEID — NOOIT LABEL IN HEADER / NAV (foto's daar blijven proper)
   =========================================================== */

header .item-image-container::after,
nav .item-image-container::after,
#header .item-image-container::after,
.site-header .item-image-container::after {
  content: none !important;
}
/* ===========================================
   DKS – Promo label hoger + groter + marge rechts
   =========================================== */

/* 1) Promo label zelf: hoger + groter */
.label.flex .discount,
.label.flex span.discount,
.label.flex [class*="discount"],
.label.flex .badge-sale,
.label.flex span.badge-sale {
    position: relative !important;
    top: -28px !important;        /* ↑ Hoger zetten (pas gerust aan) */
    transform: scale(1.35);       /* label groter maken */
    transform-origin: top right;  /* zorgt dat hij mooi op zijn plek blijft */
    z-index: 50 !important;
    pointer-events: none;
}

/* 2) Extra marge rechts zodat het label niet tegen de tegel kleeft */
.label.flex {
    padding-right: 12px !important;   /* ← zelf aanpassen: 8px – 20px werkt mooi */
}

/* 3) Optioneel: kleine correctie op mobile */
@media (max-width: 480px) {
    .label.flex .discount,
    .label.flex span.discount,
    .label.flex [class*="discount"],
    .label.flex .badge-sale,
    .label.flex span.badge-sale {
        transform: scale(1.22);
        top: -22px !important;
    }

    .label.flex {
        padding-right: 10px !important;
    }
}
/* DKS – Zet 'korting' achter het kortingspercentage op het label */
.label.flex .discount::after,
.label.flex span.discount::after,
.label.flex [class*="discount"]::after,
.label.flex .badge-sale::after,
.label.flex span.badge-sale::after {
    content: " korting";
    margin-left: 2px;       /* klein beetje ruimte na het % */
    font-size: 0.85em;      /* ietsje kleiner dan het cijfer */
    font-weight: 600;
    color: inherit;         /* zelfde kleur als het label */
}
/* Fix voor BIO-logo dat door theme absoluut gepositioneerd wordt */
#footer .bio-footer-final img {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    margin: 0 20px !important;
    height: 55px !important;
    width: auto !important;
}
#footer .bio-footer-final {
    position: static !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
/* laat het Trusted‑Shops-badge zweven zodat het de layout niet meer duwt */
[data-testid="minimized-trustbadge-floating"] {
  position: fixed;
  left: 12px;
  top: 120px;       /* pas de afstand tot de bovenkant aan naar smaak */
  z-index: 10000;   /* zorg dat hij boven andere elementen blijft */
  margin: 0 !important; /* verwijdert eventuele marges die ruimte innemen */
}

/* eventueel de container waar hij in staat uitsluiten uit de flow */
#trustbadge,
#trustbadge-floating {
  position: fixed !important;
  left: 12px;
  top: 120px;
  z-index: 10000;
}
/* DKS – gerelateerde producten wit */
#related,
#related.home-products,
.page-container #related.home-products {
  background-color: #fff !important;
  background: #fff !important;
}

/* DKS – gerelateerde producten foto achtergrond lichtbeige */
#related .item-image-container,
#related .item .item-image-container,
#related .item .item-image-container img {
  background: #F7F6F2 !important;
}

/* DKS – betaalicons in footer terug in kleur */
#footer .payments img {
  filter: none !important;
  -webkit-filter: none !important;
}

/* Claude (Cowork), 13-08-2026: Voorkom donkere overlay bij hoveren over "Olijfolie" in hoofdmenu (dropdown is verborgen, overlay is niet meer nodig) BEGIN */
body:has(.menu.list-inline > li.item.sub:nth-child(3):hover) .menu--overlay {
      background: transparent !important;
}
/* Claude (Cowork), 13-08-2026: Voorkom donkere overlay bij hoveren over "Olijfolie" in hoofdmenu END */

/* Claude (Cowork), 13-08-2026: Toon in de "Algemene voorwaarden" popup enkel de tekst (geen header/menu/footer), ook bij rechtstreeks bezoek aan deze pagina BEGIN */
html:has(link[rel="canonical"][href="https://www.dekruidenshop.be/service/general-terms-conditions/"]) header#header,
html:has(link[rel="canonical"][href="https://www.dekruidenshop.be/service/general-terms-conditions/"]) #top,
html:has(link[rel="canonical"][href="https://www.dekruidenshop.be/service/general-terms-conditions/"]) .dks-notice-bar,
html:has(link[rel="canonical"][href="https://www.dekruidenshop.be/service/general-terms-conditions/"]) .mobile-add-msg,
html:has(link[rel="canonical"][href="https://www.dekruidenshop.be/service/general-terms-conditions/"]) footer#footer,
html:has(link[rel="canonical"][href="https://www.dekruidenshop.be/service/general-terms-conditions/"]) .menu--overlay,
html:has(link[rel="canonical"][href="https://www.dekruidenshop.be/service/general-terms-conditions/"]) [id^="trustbadge-container-"],
html:has(link[rel="canonical"][href="https://www.dekruidenshop.be/service/general-terms-conditions/"]) .collection-title {
      display: none !important;
}
/* Claude (Cowork), 13-08-2026: Toon in de "Algemene voorwaarden" popup enkel de tekst END */

/* Claude (Cowork), 13-08-2026: Verberg het Trusted Shops-badgetje wanneer de "Algemene voorwaarden" popup open staat BEGIN */
body:has(.dks-terms-modal:not(.hidden)) [id^="trustbadge-container-"] {
      display: none !important;
}
/* Claude (Cowork), 13-08-2026: Verberg het Trusted Shops-badgetje in de voorwaarden-popup END */

/* Claude (Cowork), 14-08-2026: schuifbalk altijd reserveren zodat de pagina niet meer horizontaal verspringt bij het wisselen van pagina BEGIN */
html {
      overflow-y: scroll !important;
}
/* Claude (Cowork), 14-08-2026: schuifbalk altijd reserveren END */

/* Claude (Cowork), 14-08-2026: hoofdmenu extra ruimte geven zodat er rechts niets meer wegvalt BEGIN */
@media (min-width: 992px) {
      #menu > .container {
                padding-left: 12px !important;
                padding-right: 12px !important;
  }
}
/* Claude (Cowork), 14-08-2026: hoofdmenu extra ruimte geven END */

/* Claude (Cowork), 14-08-2026: hoofdmenu overal exact hetzelfde lettertype en dezelfde uitlijning als de productegels BEGIN */
/* 1. Zelfde lettergrootte op ALLE pagina's (stond enkel op home/categorie/product, elders 16px) */
@media (min-width: 992px) {
      #header .menu.list-inline > li.item > a,
      #header .menu.list-inline > li.item > span {
                font-size: 14px !important;
  }
}
/* 2. Menubalk uitlijnen met de inhoud (zelfde 60px als de productegels) */
@media (min-width: 1400px) {
      #menu > .container {
                padding-left: 60px !important;
                padding-right: 60px !important;
  }
}
/* 3. Op smallere schermen minder marge zodat er nooit iets wegvalt */
@media (min-width: 992px) and (max-width: 1399px) {
      #menu > .container {
                padding-left: 30px !important;
                padding-right: 30px !important;
  }
}
/* Claude (Cowork), 14-08-2026: hoofdmenu overal gelijk END */
/* Claude (Cowork), 14-08-2026: uitschuifwinkelmand vereenvoudigd.
   Verder winkelen = hoofdknop, Naar winkelmand = tweede knop,
   afrekenen = bescheiden link. Plus een balkje voor gratis verzending. BEGIN */
.tool.mini-cart .total { display: flex; flex-direction: column; }
.tool.mini-cart .total .dks-verzendbalk { order: 1; margin-bottom: 12px; }
.tool.mini-cart .total .shipc { order: 2; }
.tool.mini-cart .total .dks-shipc-vz { display: none !important; }
.tool.mini-cart .total a.btn2 { order: 3; }
.tool.mini-cart .total a.view-cart { order: 4; }
.tool.mini-cart .total a.btn1 { order: 5; }

html body .tool.mini-cart .dropdown-menu.keep-open .total a.btn2 {
  background: #0B7A2A !important;
  border-color: #0F6F23 !important;
  color: #ffffff !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .total a.view-cart {
  background: transparent !important;
  border-color: #0B7A2A !important;
  color: #0B7A2A !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .total a.btn1 {
  background: transparent !important;
  border: 0 !important;
  color: #6B7280 !important;
  text-decoration: underline;
  font-weight: 500 !important;
  font-size: 13px !important;
  padding: 8px 0 2px !important;
  box-shadow: none !important;
  min-height: 0 !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .total a.btn1:hover { color: #0B7A2A !important; }

.tool.mini-cart .dks-verzendbalk .dks-vz-txt {
  font-size: 12.5px; color: #3F6B2A; margin-bottom: 6px;
}
.tool.mini-cart .dks-verzendbalk .dks-vz-txt.klaar { color: #0B7A2A; font-weight: 600; }
.tool.mini-cart .dks-vz-baan {
  height: 6px; background: #D8E5CC; border-radius: 99px; overflow: hidden;
}
.tool.mini-cart .dks-vz-baan i {
  display: block; height: 100%; background: #0B7A2A;
  border-radius: 99px; transition: width .3s ease;
}
/* Claude (Cowork), 14-08-2026: uitschuifwinkelmand EINDE */
/* Claude (Cowork), 14-08-2026: uitschuifwinkelmand als zwevende kaart,
   zelfde marge, hoeken en kruisje als de Kruidenwijzer. BEGIN */
html body .tool.mini-cart .dropdown-menu.keep-open {
  right: 22px !important;
  bottom: auto !important;
  height: auto !important;
  min-height: min(520px, calc(100vh - 250px)) !important;
  max-height: calc(100vh - 250px) !important;
  width: 360px !important;
  max-width: calc(100vw - 44px) !important;
  margin-top: 14px !important;
  border: 0 !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  box-shadow: -18px 14px 46px rgba(7, 15, 10, 0.24) !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .title {
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  padding: 16px 74px 16px 20px !important;
  text-align: left !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .close-cart {
  display: inline-grid !important;
  place-items: center !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  right: 18px !important;
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  border-radius: 50% !important;
  color: #ffffff !important;
  box-shadow: none !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .close-cart:hover,
html body .tool.mini-cart .dropdown-menu.keep-open .close-cart:focus { background: rgba(255, 255, 255, 0.12) !important; }
html body .tool.mini-cart .dropdown-menu.keep-open .widget_content { padding: 18px 16px 8px !important; }
html body .tool.mini-cart .dropdown-menu.keep-open .delete-item.dks-cart-trash {
  right: -47px !important;
  width: 38px !important;
  height: 38px !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .cart-info { padding: 14px 16px 16px !important; }
html body .tool.mini-cart .dropdown-menu.keep-open .total .shipc { display: none !important; }
html body .tool.mini-cart .dropdown-menu.keep-open .total a.btn {
  padding: 11px 12px !important;
  font-size: 13.5px !important;
  border-radius: 10px !important;
  margin-bottom: 8px !important;
  min-height: 0 !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .total a.btn1 {
  padding: 2px 0 0 !important;
  margin: 3px 0 0 !important;
  font-size: 12.5px !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .dks-verzendbalk { margin: 2px 0 15px !important; }
html body .tool.mini-cart .dropdown-menu.keep-open .dks-verzendbalk .dks-vz-txt {
  font-size: 13px !important;
  color: #3F6B2A !important;
  text-align: center !important;
  margin-bottom: 8px !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .dks-verzendbalk .dks-vz-txt b { color: #0B7A2A !important; font-weight: 700 !important; }
html body .tool.mini-cart .dropdown-menu.keep-open .dks-vz-baan { height: 8px !important; background: #DCE7D0 !important; border-radius: 99px !important; }
@media (max-width: 991px) {
  html body .tool.mini-cart .dropdown-menu.keep-open { right: 12px !important; max-width: calc(100vw - 24px) !important; min-height: 0 !important; max-height: calc(100vh - 170px) !important; }
}

/* kruisje: het witte vierkantje binnenin weghalen zodat enkel de ring van de Kruidenwijzer overblijft */
html body .tool.mini-cart .dropdown-menu.keep-open .close-cart .icon-remove,
html body .tool.mini-cart .dropdown-menu.keep-open .close-cart i {
  background: transparent !important;
  background-color: transparent !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #ffffff !important;
  font-size: 17px !important;
  line-height: 1 !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .close-cart .icon-remove::before,
html body .tool.mini-cart .dropdown-menu.keep-open .close-cart i::before {
  color: #ffffff !important;
}

/* rijlijnen recht: geen afgeronde hoeken meer die de scheidingslijn omhoog trekken */
html body .tool.mini-cart .dropdown-menu.keep-open .widget_content > .item {
  border-radius: 0 !important;
  overflow: visible !important;
  margin: 0 !important;
  padding: 12px 48px 12px 0 !important;
  border-bottom: 1px solid #EDF0EA !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .widget_content > .item:last-child {
  border-bottom: 0 !important;
}

/* vuilbakje niet meer afgekapt en netjes in het midden van de regel */
html body .tool.mini-cart .dropdown-menu.keep-open .delete-item.dks-cart-trash {
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
}

/* tekst netjes verticaal in het midden van de knoppen */
html body .tool.mini-cart .dropdown-menu.keep-open .total a.btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.2 !important;
}
html body .tool.mini-cart .dropdown-menu.keep-open .total a.btn1 {
  display: block !important;
}
/* Claude (Cowork), 14-08-2026: zwevende kaart EINDE */

/* Claude (Cowork), 01-09-2026: Blogtegels + paprikarode "Lees meer" links + cat-description/short-desc boxen exact gelijk aan BE shop (dks-palette-experiment) BEGIN */
.home-block.block_7{background:#FFFFFF!important;}
#blog .blog-article{background:#FFFFFF!important;border:1px solid rgba(15,23,42,.08)!important;border-radius:12px!important;overflow:hidden!important;}
#blog .blog-article .meta{padding:20px!important;}
#blog .header-title .subtitle{color:#BD542F!important;}
#blog .banner-btn.trans{color:#BD542F!important;border-color:#BD542F!important;}
#blog .banner-btn.trans:hover{background:#BD542F!important;color:#FFFFFF!important;}
.collection .cat-description:not(:empty){background:#E7EED8!important;border:1px solid rgba(15,23,42,.08)!important;border-radius:var(--radius,5px)!important;padding:24px!important;}
#description .short-desc{background:#E7EED8!important;border-left:4px solid #BD542F!important;border-radius:var(--radius,5px)!important;padding:16px 18px!important;margin-bottom:24px!important;}
@media(max-width:767px){
  #blog .blog-article .meta{padding:16px!important;}
  .collection .cat-description:not(:empty){padding:18px!important;}
  #description .short-desc{padding:14px 16px!important;}
}
/* Claude (Cowork), 01-09-2026: dks-palette-experiment END */

/* 01-09-2026: Blog-gap fix + finale border/box-shadow, identiek aan BE (ontbrekende regels) BEGIN */
#blog .wrap.flex{gap:24px!important;align-items:stretch!important;}
#blog .blog-article{min-width:0!important;padding:0!important;background:#FFFFFF!important;border:1px solid #E1E1E1!important;border-radius:var(--radius,5px)!important;box-shadow:0 8px 26px rgba(15,23,42,.07)!important;overflow:hidden!important;}
#blog .blog-grid-image{display:block!important;width:100%!important;max-width:none!important;margin:0!important;border-radius:var(--radius,5px) var(--radius,5px) 0 0!important;}
#blog .blog-article .meta{padding:24px!important;}
@media(max-width:767px){#blog .wrap.flex{gap:16px!important;}#blog .blog-article .meta{padding:20px!important;}}
#blog .blog-article{border-radius:12px!important;}
#blog .blog-grid-image,#blog .blog-grid-image .img-wrap{border-radius:12px 12px 0 0!important;}
/* 01-09-2026: Blog-gap fix END */