/* Mozaïek Eindejaarsactie 2026 - frontend */
.mzea-campaign {
  --mzea-green: #738f3d;
  --mzea-green-dark: #4f6c24;
  --mzea-soft: #f2f6ea;
  --mzea-border: #dfe4d6;
  --mzea-text: #2f381f;
  clear: both;
  color: #333;
  font-size: 1.125rem;
  line-height: 1.6;
  width: 100%;
}
.mzea-campaign *, .mzea-campaign *::before, .mzea-campaign *::after { box-sizing: border-box; }
/* Het thema geeft koppen een negatieve letterafstand; binnen de actiepagina zetten we die recht. */
.mzea-campaign h1, .mzea-campaign h2, .mzea-campaign h3, .mzea-campaign h4,
.mzea-campaign .mzea-product__title, .mzea-campaign .mzea-package h4 { letter-spacing: .01em; word-spacing: normal; text-transform: none; }
.mzea-campaign .mzea-product__title { line-height: 1.3; }
.mzea-campaign .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal; }

/* Banner en compacte projectverwijzing */
.mzea-banner { background: #f2f6ea; border-radius: 18px; margin: 0 0 1.1rem; overflow: hidden; width: 100%; }
.mzea-banner img { display: block; height: auto; max-height: 460px; object-fit: contain; width: 100%; }
.mzea-cause-link { background: #f2f6ea; border-left: 5px solid #738f3d; border-radius: 0 10px 10px 0; color: #3d472d; font-size: 1.05rem; margin: 0 0 1.5rem; padding: .8rem 1rem; }
.mzea-campaign .mzea-cause-link a { color: #4f6c24; font-weight: 800; text-decoration: underline; }
.mzea-intro {
  --mzea-green: #738f3d;
  --mzea-green-dark: #4f6c24;
  --mzea-soft: #f2f6ea;
  background: #fff;
  border: 1px solid #e2e5dc;
  border-radius: 18px;
  clear: both;
  color: #333;
  margin: 0 0 2.75rem;
  overflow: hidden;
  padding: clamp(1.25rem, 3vw, 2.75rem);
  width: 100%;
}
.mzea-preview { background: #fff4ce; border: 1px solid #e6c95d; border-radius: 8px; color: #5f4b00; font-size: 1rem; font-weight: 700; margin-bottom: 1.5rem; padding: .85rem 1.1rem; }
.mzea-story { align-items: center; display: grid; gap: clamp(1.25rem, 3vw, 2.75rem); grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr); }
.mzea-campaign .mzea-story h2 { color: var(--mzea-green-dark); font-size: clamp(2rem, 3.6vw, 3.2rem); line-height: 1.08; margin: 0 0 1.25rem; }
.mzea-campaign .mzea-story p, .mzea-campaign .mzea-copy p, .mzea-campaign .mzea-practical p { font-size: clamp(1.1rem, 1.3vw, 1.25rem); line-height: 1.7; }
.mzea-story__image { margin: 0; }
.mzea-story__image img { aspect-ratio: 4 / 3; border-radius: 14px; display: block; height: auto; object-fit: cover; width: 100%; }
.mzea-story__image figcaption { color: #666; font-size: .95rem; margin-top: .5rem; }
.mzea-copy { margin-top: 1.5rem; }
.mzea-practical { background: var(--mzea-soft); border-left: 5px solid var(--mzea-green); border-radius: 0 12px 12px 0; margin-top: 1.75rem; padding: 1.25rem 1.5rem; }
.mzea-campaign .mzea-practical h3 { color: var(--mzea-green-dark); font-size: 1.5rem; margin: 0 0 .7rem; }
.mzea-practical p:last-child { margin-bottom: 0; }

/* Catalogus */
.mzea-shop-intro { clear: both; margin-top: 1.5rem; }
.mzea-catalog { min-width: 0; }
.mzea-campaign .mzea-shop-intro > h2 { color: var(--mzea-green-dark); font-size: clamp(1.9rem, 3.2vw, 2.7rem); line-height: 1.15; margin: 0 0 .6rem; }
.mzea-campaign .mzea-catalog__instruction { font-size: 1.15rem; margin: 0 0 1.25rem; }
.mzea-pickup-info { background: #eef5e1; border-radius: 10px; color: #4f5f35; font-size: 1.05rem; margin: -.35rem 0 1.25rem; padding: .7rem 1rem; }

/* Niet-seizoensgebonden promotiebalk op de homepage */
.mzea-home-cta { background: linear-gradient(135deg, #4f6c24 0%, #738f3d 100%); box-sizing: border-box; margin: 0; padding: .8rem clamp(1rem, 4vw, 3rem); width: 100%; }
.mzea-home-cta a { align-items: center; color: #fff; display: flex; font-size: clamp(1.05rem, 2vw, 1.3rem); font-weight: 700; gap: 1rem; justify-content: center; letter-spacing: .01em; margin: 0 auto; max-width: 1240px; text-decoration: none; }
.mzea-home-cta strong { background: #f3c34a; border-radius: 999px; color: #3f360d; flex: 0 0 auto; font-size: .95rem; padding: .45rem .9rem; }
.mzea-home-cta a:hover strong, .mzea-home-cta a:focus strong { background: #fff; }

/* Filterbalk */
.mzea-toolbar {
  align-items: center;
  background: rgba(255, 255, 255, .96);
  border: 1px solid var(--mzea-border);
  border-radius: 16px;
  box-shadow: 0 6px 24px rgba(31, 45, 13, .08);
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1rem;
  justify-content: space-between;
  margin: 0 0 .75rem;
  padding: .85rem;
  scroll-margin-top: calc(var(--mzea-top, 16px) + 8px);
}
.mzea-filters { display: flex; flex-wrap: wrap; gap: .5rem; }
.mzea-campaign .mzea-filter {
  align-items: center;
  appearance: none;
  background: var(--mzea-soft);
  border: 2px solid transparent;
  border-radius: 999px;
  box-shadow: none;
  color: var(--mzea-green-dark);
  cursor: pointer;
  display: inline-flex;
  font-family: inherit;
  font-size: 1.05rem;
  font-weight: 700;
  gap: .5rem;
  letter-spacing: 0;
  line-height: 1.2;
  margin: 0;
  min-height: 46px;
  padding: .55rem 1.1rem;
  text-transform: none;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
@media (hover: hover) { .mzea-campaign .mzea-filter:hover { border-color: var(--mzea-green); } }
.mzea-campaign .mzea-filter:focus-visible { outline: 3px solid var(--mzea-green-dark); outline-offset: 2px; }
.mzea-campaign .mzea-filter.is-active { background: var(--mzea-green-dark); border-color: var(--mzea-green-dark); color: #fff; }
.mzea-filter__count { background: rgba(79, 108, 36, .14); border-radius: 999px; font-size: .85rem; min-width: 1.8em; padding: .1rem .5rem; text-align: center; }
.mzea-filter.is-active .mzea-filter__count { background: rgba(255, 255, 255, .22); }

.mzea-search { flex: 1 1 260px; max-width: 380px; position: relative; }
.mzea-search__icon { color: #7a8468; height: 20px; left: 14px; pointer-events: none; position: absolute; top: 50%; transform: translateY(-50%); width: 20px; }
.mzea-campaign .mzea-search__input {
  background: #fff;
  border: 2px solid #c9d1bb;
  border-radius: 999px;
  box-shadow: none;
  color: var(--mzea-text);
  font-family: inherit;
  font-size: 1.05rem;
  height: auto;
  margin: 0;
  min-height: 46px;
  padding: .55rem 1rem .55rem 2.6rem;
  width: 100%;
}
.mzea-campaign .mzea-search__input:focus { border-color: var(--mzea-green); outline: none; box-shadow: 0 0 0 3px rgba(115, 143, 61, .2); }
.mzea-campaign .mzea-result-count { color: #5b6450; font-size: 1rem; margin: 0 0 1.1rem; min-height: 1.5em; }

/* Productkaarten */
.mzea-products { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); }
.mzea-product { background: #fff; border: 1px solid var(--mzea-border); border-radius: 16px; display: flex; flex-direction: column; min-width: 0; overflow: hidden; transition: border-color .2s ease, box-shadow .2s ease; }
.mzea-product[hidden] { display: none; }
.mzea-product.has-selection { border-color: var(--mzea-green); box-shadow: 0 0 0 3px rgba(115, 143, 61, .2); }
.mzea-product__image { align-items: center; aspect-ratio: 1 / 1; background: #f7f7f5; display: flex; justify-content: center; overflow: hidden; position: relative; }
.mzea-product__image img { display: block; height: 100%; object-fit: contain; transition: transform .25s ease; width: 100%; }
@media (hover: hover) { .mzea-product:hover .mzea-product__image img { transform: scale(1.03); } }
.mzea-number { background: var(--mzea-green-dark); border-radius: 999px; box-shadow: 0 2px 8px rgba(0, 0, 0, .15); color: #fff; font-size: .95rem; font-weight: 800; left: 12px; line-height: 1; min-width: 2.2em; padding: .45rem .7rem; position: absolute; text-align: center; top: 12px; }
.mzea-product__body { display: flex; flex: 1; flex-direction: column; padding: 1.15rem 1.2rem 1.25rem; }
.mzea-campaign .mzea-product__title { color: var(--mzea-text); font-size: clamp(1.2rem, 1.4vw, 1.35rem); font-weight: 700; line-height: 1.3; margin: .3rem 0 .45rem; }
.mzea-campaign .mzea-product__price { color: var(--mzea-green-dark); font-size: 1.45rem; font-weight: 800; line-height: 1.2; margin-bottom: .25rem; }
.mzea-product-details { border-top: 1px solid #e5e5e5; font-size: 1rem; margin: .85rem 0 .25rem; padding-top: .65rem; text-align: left; }
.mzea-product-details summary { color: var(--mzea-green-dark); cursor: pointer; font-size: 1.02rem; font-weight: 800; }
.mzea-product-details > div { color: #4a4a4a; line-height: 1.6; padding-top: .55rem; }
.mzea-product-details > div p { margin: 0 0 .5rem; }
.mzea-deadline { color: var(--mzea-green-dark); margin: .6rem 0 0; }
.mzea-single-note { background: #f2f6ea; border-left: 4px solid #738f3d; font-size: 1.05rem; margin: 1rem 0; padding: .9rem 1.1rem; }
.mzea-status-message { background: #f2f6ea; border-left: 5px solid #738f3d; font-size: 1.15rem; padding: 1.1rem 1.35rem; }

/* Aantal met min/plus */
.mzea-quantity { align-items: center; display: flex; gap: .75rem; justify-content: space-between; margin-top: auto; padding-top: 1.1rem; }
.mzea-campaign .mzea-quantity label { font-size: 1.05rem; font-weight: 800; margin: 0; }
.mzea-stepper { align-items: stretch; border: 2px solid #c9d1bb; border-radius: 999px; display: inline-flex; overflow: hidden; }
.mzea-product.has-selection .mzea-stepper { border-color: var(--mzea-green); }
.mzea-campaign .mzea-step {
  align-items: center;
  appearance: none;
  background: var(--mzea-soft);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: var(--mzea-green-dark);
  cursor: pointer;
  display: inline-flex;
  font-family: inherit;
  font-size: 1.5rem;
  font-weight: 700;
  height: 48px;
  justify-content: center;
  line-height: 1;
  margin: 0;
  min-width: 0;
  padding: 0;
  transition: background-color .15s ease, color .15s ease;
  width: 48px;
}
@media (hover: hover) { .mzea-campaign .mzea-step:hover:not([aria-disabled="true"]) { background: var(--mzea-green); color: #fff; } }
.mzea-campaign .mzea-step:focus-visible { outline: 3px solid var(--mzea-green-dark); outline-offset: -3px; }
.mzea-campaign .mzea-stepper .mzea-step[aria-disabled="true"] { background: var(--mzea-soft); background-image: none; border: 0; box-shadow: none; color: #c3c9b8; cursor: default; opacity: 1; }
.mzea-campaign .mzea-qty {
  -moz-appearance: textfield;
  appearance: textfield;
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: var(--mzea-text);
  font-family: inherit;
  font-size: 1.3rem;
  font-weight: 800;
  height: 48px;
  margin: 0;
  min-height: 0;
  padding: 0;
  text-align: center;
  width: 3.2rem;
}
.mzea-campaign .mzea-qty:focus { outline: none; background: #fbfcf8; }
.mzea-campaign .mzea-qty::-webkit-outer-spin-button,
.mzea-campaign .mzea-qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.mzea-unavailable { background: #fce8e6; border-radius: 10px; color: #b42318; font-weight: 800; margin-top: auto; padding: .8rem; text-align: center; }
.mzea-product.is-unavailable { opacity: .75; }

/* Selectie hervat */
.mzea-resume { background: #eef5e1; border: 1px solid #cfe0ae; border-radius: 12px; font-size: 1.08rem; margin: 0 0 1.1rem; padding: .85rem 1.1rem; }

/* Teller Groene Kamer */
.mzea-progress { background: linear-gradient(135deg, #4f6c24 0%, #738f3d 100%); border-radius: 18px; color: #fff; margin: 0 0 2.5rem; padding: clamp(1.1rem, 2.5vw, 1.75rem) clamp(1.2rem, 3vw, 2.25rem); }
.mzea-progress__admin { background: rgba(255, 255, 255, .16); border-radius: 8px; font-size: .95rem; margin: 0 0 1rem; padding: .5rem .8rem; }
.mzea-progress__main { align-items: center; display: flex; gap: 1rem; }
.mzea-progress__icon { font-size: 2.4rem; line-height: 1; }
.mzea-campaign .mzea-progress__amount { color: #fff; font-size: clamp(1.25rem, 2.2vw, 1.6rem); font-weight: 600; line-height: 1.3; margin: 0; }
.mzea-progress__amount strong { font-size: 1.2em; font-weight: 800; }
.mzea-progress__amount .woocommerce-Price-amount { color: inherit; }
.mzea-campaign .mzea-progress__meta { color: rgba(255, 255, 255, .88); font-size: 1rem; margin: .25rem 0 0; }
.mzea-progress__meta .woocommerce-Price-amount { color: inherit; }
.mzea-progress__bar { background: rgba(255, 255, 255, .25); border-radius: 999px; height: 14px; margin-top: 1.1rem; overflow: hidden; }
.mzea-progress__bar span { background: #fff; border-radius: 999px; display: block; height: 100%; transition: width 1s ease; }
.mzea-campaign .mzea-progress__percent { color: rgba(255, 255, 255, .9); font-size: .95rem; font-weight: 700; margin: .45rem 0 0; text-align: right; }

/* Aftelling bloembollen */
.mzea-countdown { align-items: center; background: #fff7e0; border: 1px solid #f0d58a; border-radius: 12px; color: #6a4e00; display: flex; font-size: 1.08rem; gap: .7rem; margin: 0 0 1.1rem; padding: .8rem 1.1rem; }
.mzea-countdown__icon { font-size: 1.5rem; line-height: 1; }
.mzea-countdown.is-urgent { background: #fdeceb; border-color: #f1b2ac; color: #8a1c12; }
.mzea-countdown[hidden] { display: none; }
.mzea-campaign .mzea-theme__deadline { background: none; border: 0; display: block; font-size: 1.05rem; margin: .6rem 0 0; padding: 0; }

/* Pakketten */
.mzea-packages { margin: 1.5rem 0 3rem; }
.mzea-packages[hidden] { display: none; }
.mzea-campaign .mzea-packages__header h3 { color: var(--mzea-green-dark); font-size: clamp(1.5rem, 2.4vw, 2rem); margin: 0 0 .3rem; }
.mzea-campaign .mzea-packages__header p { font-size: 1.1rem; margin: 0 0 1.2rem; }
.mzea-packages__grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); }
.mzea-package { background: var(--mzea-soft); border: 2px solid #dbe5c8; border-radius: 18px; display: flex; flex-direction: column; overflow: hidden; transition: border-color .2s ease, box-shadow .2s ease; }
.mzea-package.is-added { border-color: var(--mzea-green); box-shadow: 0 0 0 3px rgba(115, 143, 61, .2); }
.mzea-package__visual { background: #fff; display: grid; gap: 2px; grid-template-columns: repeat(2, 1fr); height: 190px; }
.mzea-package__visual.count-1, .mzea-package__visual.count-0 { grid-template-columns: 1fr; }
.mzea-package__visual.count-3 img:first-child { grid-row: span 2; }
.mzea-package__visual img { background: #f7f7f5; display: block; height: 100%; min-height: 0; object-fit: cover; width: 100%; }
.mzea-package__visual.count-2 img { grid-row: span 2; }
.mzea-package__body { display: flex; flex: 1; flex-direction: column; padding: 1.15rem 1.25rem 1.3rem; }
.mzea-campaign .mzea-package h4 { color: var(--mzea-text); font-size: 1.35rem; line-height: 1.25; margin: 0 0 .35rem; }
.mzea-campaign .mzea-package__text { font-size: 1.02rem; line-height: 1.5; margin: 0 0 .7rem; }
.mzea-campaign .mzea-package__list { font-size: 1rem; line-height: 1.5; list-style: none; margin: 0 0 1rem; padding: 0; }
.mzea-package__list li { padding-left: 1.3rem; position: relative; }
.mzea-package__list li::before { color: var(--mzea-green); content: "\2713"; font-weight: 800; left: 0; position: absolute; }
.mzea-package__footer { align-items: center; display: flex; flex-wrap: wrap; gap: .75rem; justify-content: space-between; margin-top: auto; }
.mzea-package__price { color: var(--mzea-green-dark); font-size: 1.45rem; font-weight: 800; }
.mzea-campaign .mzea-package__add { background: var(--mzea-green-dark); border: 0; border-radius: 999px; box-shadow: none; color: #fff; cursor: pointer; font-family: inherit; font-size: 1.05rem; font-weight: 700; line-height: 1.2; margin: 0; min-height: 46px; padding: .6rem 1.25rem; text-transform: none; }
.mzea-campaign .mzea-package__add.is-done { background: var(--mzea-green); }
.mzea-campaign .mzea-package__add:focus-visible { outline: 3px solid var(--mzea-green-dark); outline-offset: 2px; }
@media (hover: hover) { .mzea-campaign .mzea-package__add:hover { background: var(--mzea-green); } }

/* Themasecties */
.mzea-theme { margin: 0 0 3.25rem; }
.mzea-theme[hidden] { display: none; }
.mzea-theme__header { align-items: stretch; background: var(--mzea-soft); border-radius: 18px; display: grid; gap: 0; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); margin: 0 0 1.5rem; overflow: hidden; }
.mzea-theme__text { align-self: center; padding: clamp(1.25rem, 3vw, 2.25rem); }
.mzea-theme__logo { margin: 0 0 1rem; }
.mzea-theme__logo img { display: block; height: auto; max-height: 86px; max-width: min(260px, 82%); object-fit: contain; object-position: left center; width: auto; }
.mzea-theme__kicker { color: var(--mzea-green); display: block; font-size: .9rem; font-weight: 800; letter-spacing: .07em; margin-bottom: .35rem; text-transform: uppercase; }
.mzea-campaign .mzea-theme__header h3 { color: var(--mzea-green-dark); font-size: clamp(1.8rem, 3vw, 2.5rem); line-height: 1.1; margin: 0 0 .6rem; }
.mzea-campaign .mzea-theme__text > p { font-size: 1.12rem; line-height: 1.6; margin: 0; }
.mzea-theme__visual { height: clamp(220px, 24vw, 300px); overflow: hidden; position: relative; }
.mzea-theme__visual > img { display: block; height: 100%; inset: 0; object-fit: cover; position: absolute; width: 100%; }
.mzea-theme__visual.is-collage { display: grid; gap: 3px; grid-template-columns: 1.4fr 1fr; grid-template-rows: 1fr 1fr; }
.mzea-theme__visual.is-collage > img { background: #fff; height: 100%; min-height: 0; object-fit: cover; position: static; width: 100%; }
.mzea-theme__visual.is-collage > img:first-child { grid-row: span 2; }
.mzea-theme__visual.is-collage > img:only-child { grid-column: span 2; }

/* Badge populair */
.mzea-popular { background: #f3c34a; border-radius: 999px; box-shadow: 0 2px 10px rgba(0, 0, 0, .14); color: #4a3700; font-size: .88rem; font-weight: 800; line-height: 1.2; padding: .4rem .75rem; position: absolute; right: 12px; top: 12px; }
.mzea-popular::before { content: "\2605"; margin-right: .3rem; }

/* Badge cliëntenwerk */
.mzea-badge { background: #fff; border-radius: 999px; bottom: 12px; box-shadow: 0 2px 10px rgba(0, 0, 0, .14); color: var(--mzea-green-dark); font-size: .88rem; font-weight: 800; left: 12px; line-height: 1.2; padding: .4rem .75rem; position: absolute; }
.mzea-badge::before { content: "\2665"; color: #c0504d; margin-right: .35rem; }
.mzea-product.is-by-clients { border-color: #c9d9a8; }

/* Bloeikalender (bloembollen) */
.mzea-bloom { align-items: center; display: flex; gap: .6rem; margin: .35rem 0 .1rem; }
.mzea-bloom__label { color: #6b7160; font-size: .82rem; font-weight: 700; }
.mzea-bloom__months { display: grid; flex: 1; gap: 3px; grid-template-columns: repeat(7, 1fr); max-width: 190px; }
.mzea-bloom__month { color: #a3a99a; display: flex; flex-direction: column; font-size: .72rem; gap: 2px; line-height: 1; text-align: center; }
.mzea-bloom__month i { background: #e6e9df; border-radius: 3px; display: block; height: 6px; }
.mzea-bloom__month.is-on { color: var(--mzea-green-dark); font-weight: 800; }
.mzea-bloom__month.is-on i { background: var(--mzea-green); }

/* Geen resultaten */
.mzea-no-results { background: var(--mzea-soft); border-radius: 14px; font-size: 1.1rem; padding: 1.5rem; text-align: center; }
.mzea-no-results[hidden] { display: none; }
.mzea-campaign .mzea-reset { background: none; border: 0; color: var(--mzea-green-dark); cursor: pointer; font: inherit; font-weight: 800; padding: 0; text-decoration: underline; }

/* Vaste bestelbalk onderaan het scherm */
.mzea-order-bar {
  background: #fff;
  border-top: 1px solid var(--mzea-border);
  bottom: 0;
  box-shadow: 0 -6px 24px rgba(31, 45, 13, .12);
  left: 0;
  padding: .75rem clamp(1rem, 3vw, 2rem) calc(.75rem + env(safe-area-inset-bottom, 0px));
  position: fixed;
  right: 0;
  z-index: 9990;
}
.mzea-order-bar__inner { align-items: center; display: flex; gap: .75rem 1.5rem; margin: 0 auto; max-width: 1240px; }
.mzea-order-summary { align-items: baseline; display: flex; flex: 1; flex-wrap: wrap; font-size: 1.1rem; gap: .2rem 1.4rem; min-width: 0; }
.mzea-total-price { color: var(--mzea-green-dark); font-size: 1.4rem; }
.mzea-campaign .mzea-to-filter {
  align-items: center; background: var(--mzea-soft); border: 2px solid transparent; border-radius: 999px; box-shadow: none;
  color: var(--mzea-green-dark); cursor: pointer; display: inline-flex; flex: 0 0 auto; font-family: inherit; font-size: 1rem;
  font-weight: 700; gap: .45rem; letter-spacing: .01em; line-height: 1.2; margin: 0; min-height: 46px; padding: .5rem 1rem; text-transform: none;
}
.mzea-to-filter svg { height: 20px; width: 20px; }
.mzea-campaign .mzea-to-filter:focus-visible { outline: 3px solid var(--mzea-green-dark); outline-offset: 2px; }
@media (hover: hover) { .mzea-campaign .mzea-to-filter:hover { border-color: var(--mzea-green); } }
.mzea-campaign .mzea-checkout-button { background: var(--mzea-green-dark); border: 0; border-radius: 999px; color: #fff; cursor: pointer; flex: 0 0 auto; font-family: inherit; font-size: 1.1rem; font-weight: 700; min-height: 52px; padding: .75rem 1.6rem; white-space: normal; }
.mzea-campaign .mzea-checkout-button:hover:not([aria-disabled="true"]) { background: var(--mzea-green); color: #fff; }
.mzea-campaign .mzea-checkout-button[aria-disabled="true"] { cursor: not-allowed; opacity: .5; }

/* Winkelwagen-icoon met selectie */
.mzea-cart { flex: 0 0 auto; position: relative; }
.mzea-campaign .mzea-cart__toggle {
  align-items: center; background: var(--mzea-soft); border: 2px solid transparent; border-radius: 999px; box-shadow: none;
  color: var(--mzea-green-dark); cursor: pointer; display: inline-flex; height: 52px; justify-content: center; margin: 0;
  padding: 0; position: relative; width: 52px;
}
.mzea-cart__toggle svg { height: 26px; width: 26px; }
.mzea-campaign .mzea-cart__toggle[aria-expanded="true"] { background: var(--mzea-green-dark); color: #fff; }
.mzea-campaign .mzea-cart__toggle:focus-visible { outline: 3px solid var(--mzea-green-dark); outline-offset: 2px; }
@media (hover: hover) { .mzea-campaign .mzea-cart__toggle:hover { border-color: var(--mzea-green); } }
.mzea-cart__badge { align-items: center; background: #c9303a; border: 2px solid #fff; border-radius: 999px; color: #fff; display: flex; font-size: .78rem; font-weight: 800; height: 24px; justify-content: center; min-width: 24px; padding: 0 .3rem; position: absolute; right: -6px; top: -6px; }
.mzea-cart__badge.is-empty { display: none; }
.mzea-cart__badge.is-bump { animation: mzea-bump .35s ease; }
@keyframes mzea-bump { 50% { transform: scale(1.35); } }

.mzea-cart__pop {
  background: #fff; border: 1px solid var(--mzea-border); border-radius: 16px; bottom: calc(100% + 16px);
  box-shadow: 0 12px 40px rgba(31, 45, 13, .22); max-height: calc(100vh - var(--mzea-top, 16px) - var(--mzea-bar-h, 90px) - 32px);
  overflow-y: auto; padding: 1rem 1.1rem; position: absolute; right: 0; scrollbar-width: thin; width: min(420px, calc(100vw - 2rem));
}
.mzea-cart__pop[hidden] { display: none; }
.mzea-cart__pop::after { background: #fff; border-bottom: 1px solid var(--mzea-border); border-right: 1px solid var(--mzea-border); bottom: -8px; content: ""; height: 14px; position: absolute; right: 19px; transform: rotate(45deg); width: 14px; }
.mzea-cart__head { align-items: center; display: flex; justify-content: space-between; margin-bottom: .35rem; }
.mzea-cart__head strong { color: var(--mzea-green-dark); font-size: 1.15rem; }
.mzea-campaign .mzea-cart__close { background: none; border: 0; box-shadow: none; color: #7a8070; cursor: pointer; font-size: 1.6rem; line-height: 1; margin: 0; padding: .1rem .35rem; }
.mzea-cart__foot { align-items: baseline; border-top: 2px solid var(--mzea-soft); display: flex; font-size: 1.05rem; justify-content: space-between; margin-top: .5rem; padding-top: .6rem; }
.mzea-cart__total { color: var(--mzea-green-dark); font-size: 1.3rem; }

.mzea-selection__list { list-style: none; margin: 0; padding: 0; }
.mzea-selection__item { align-items: center; border-bottom: 1px solid #eef0ea; display: grid; font-size: 1rem; gap: .55rem; grid-template-columns: auto minmax(0, 1fr) auto auto; padding: .5rem 0; }
.mzea-selection__item:last-child { border-bottom: 0; }
.mzea-sel-stepper { align-items: center; background: var(--mzea-soft); border-radius: 999px; display: inline-flex; }
.mzea-campaign .mzea-sel-step { align-items: center; background: none; border: 0; border-radius: 999px; box-shadow: none; color: var(--mzea-green-dark); cursor: pointer; display: inline-flex; font-size: 1.1rem; font-weight: 700; height: 30px; justify-content: center; line-height: 1; margin: 0; padding: 0; width: 30px; }
.mzea-campaign .mzea-sel-step[aria-disabled="true"] { background: none; color: #c3c9b8; cursor: default; opacity: 1; }
@media (hover: hover) { .mzea-campaign .mzea-sel-step:hover:not([aria-disabled="true"]) { background: var(--mzea-green); color: #fff; } }
.mzea-selection__qty { color: var(--mzea-green-dark); font-size: .95rem; font-weight: 800; min-width: 1.4rem; text-align: center; }
.mzea-campaign .mzea-selection__name { background: none; border: 0; box-shadow: none; color: var(--mzea-text); cursor: pointer; font: inherit; line-height: 1.3; margin: 0; overflow: hidden; padding: 0; text-align: left; text-overflow: ellipsis; text-transform: none; white-space: nowrap; }
.mzea-campaign .mzea-selection__name:hover, .mzea-campaign .mzea-selection__name:focus-visible { color: var(--mzea-green-dark); text-decoration: underline; }
.mzea-selection__price { color: var(--mzea-green-dark); font-weight: 700; white-space: nowrap; }
.mzea-campaign .mzea-selection__remove { align-items: center; background: none; border: 0; border-radius: 999px; box-shadow: none; color: #9a9f92; cursor: pointer; display: inline-flex; font-size: 1.3rem; height: 30px; justify-content: center; line-height: 1; margin: 0; padding: 0; width: 30px; }
.mzea-campaign .mzea-selection__remove:hover { background: #fce8e6; color: #b42318; }
.mzea-campaign .mzea-selection__empty { color: #6b7160; font-size: 1rem; margin: .4rem 0 0; }
.mzea-product.is-flash { animation: mzea-flash 1.2s ease; }
@keyframes mzea-flash { 0%, 100% { box-shadow: 0 0 0 0 rgba(115, 143, 61, 0); } 30% { box-shadow: 0 0 0 6px rgba(115, 143, 61, .45); } }

@media (max-width: 760px) {
  .mzea-theme__header { grid-template-columns: 1fr; }
  .mzea-theme__visual { height: 180px; order: -1; }
  .mzea-story { grid-template-columns: 1fr; }
  .mzea-story__image { order: -1; }
  .mzea-intro { border-radius: 12px; }
  .mzea-toolbar { position: static; }
  .mzea-search { max-width: none; }
  .mzea-filters { flex-wrap: nowrap; margin: 0 -.85rem; overflow-x: auto; padding: 0 .85rem 2px; scrollbar-width: none; width: calc(100% + 1.7rem); }
  .mzea-filters::-webkit-scrollbar { display: none; }
  .mzea-campaign .mzea-filter { flex: 0 0 auto; }
}

@media (max-width: 560px) {
	.mzea-home-cta a { align-items: flex-start; flex-direction: column; gap: .45rem; }
  .mzea-campaign { font-size: 1.0625rem; }
  .mzea-products { gap: 1rem; grid-template-columns: 1fr; }
  /* Liggende kaart: foto links, tekst en aantal rechts */
  .mzea-product { display: grid; grid-template-columns: 112px minmax(0, 1fr); }
  .mzea-product__image { aspect-ratio: auto; align-self: stretch; min-height: 100%; }
  .mzea-product__image img { position: absolute; inset: 0; }
  .mzea-number { font-size: .85rem; left: 8px; padding: .35rem .55rem; top: 8px; }
  .mzea-product__body { padding: .9rem 1rem 1rem; }
  .mzea-campaign .mzea-product__title { font-size: 1.15rem; }
  .mzea-campaign .mzea-product__price { font-size: 1.3rem; }
  .mzea-quantity { padding-top: .8rem; }
  .mzea-campaign .mzea-quantity label { font-size: .95rem; }
  .mzea-campaign .mzea-step { height: 44px; width: 44px; }
  .mzea-campaign .mzea-qty { height: 44px; width: 2.6rem; }
  .mzea-order-bar { padding: .6rem .8rem calc(.6rem + env(safe-area-inset-bottom, 0px)); }
  .mzea-order-bar__inner { flex-wrap: wrap; gap: .5rem .75rem; }
  .mzea-order-summary { flex-direction: column; font-size: .98rem; gap: 0; }
  .mzea-campaign .mzea-to-filter { min-height: 44px; padding: .45rem .75rem; }
  .mzea-to-filter span { display: none; }
  .mzea-cart { position: static; }
  .mzea-campaign .mzea-cart__toggle { height: 44px; width: 44px; }
  .mzea-cart__pop { bottom: calc(var(--mzea-bar-h, 120px) + 8px); left: 8px; position: fixed; right: 8px; width: auto; }
  .mzea-cart__pop::after { display: none; }
  .mzea-badge { bottom: 6px; font-size: .72rem; left: 6px; padding: .3rem .5rem; }
  .mzea-badge::before { display: none; }
  .mzea-popular { font-size: .7rem; padding: .28rem .45rem; right: auto; left: 6px; top: auto; bottom: 30px; }
  .mzea-popular::before { margin-right: .15rem; }
  .mzea-packages__grid { display: flex; gap: .9rem; margin: 0 -1rem; overflow-x: auto; padding: 0 1rem .5rem; scroll-snap-type: x mandatory; }
  .mzea-package { flex: 0 0 85%; scroll-snap-align: start; }
  .mzea-package__visual { height: 150px; }
  .mzea-hide-mobile { display: none; }
  .mzea-progress__icon { display: none; }
  .mzea-total-price { font-size: 1.15rem; }
  .mzea-campaign .mzea-checkout-button { flex: 1 0 100%; font-size: 1.02rem; min-height: 46px; padding: .6rem 1rem; }
}