/*
Theme Name: WP Strippenkaart
Theme URI: https://wpstrippenkaart.nl
Author: Bas Martens
Description: Custom WordPress theme voor WPstrippenkaart.nl
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
Text Domain: wpstrippenkaart
*/
/* ============================================================
   WPstrippenkaart.nl — style.css
   ============================================================ */

/* ── Tokens ── */
:root {
  --accent:       var(--mapb-primary,      #2271b1);
  --accent-dark:  #135e96;
  --accent-text:  #0a3a6e;
  --accent-light: #eef4fb;
  --bg:           var(--mapb-bg,           #f8fafc);
  --card:         var(--mapb-card-bg,      #ffffff);
  --text:         var(--mapb-text,         #1e293b);
  --muted:        #6b7280;
  --border:       var(--mapb-border,       rgba(220, 228, 238, 0.9));
  --dark:         var(--mapb-bg-dark,      #0f172a);
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
[id] { scroll-margin-top: 89px; }
body    { font-family: var(--mapb-font-body, 'Outfit', sans-serif); background: var(--bg); color: var(--text); line-height: 1.5; }
img     { display: block; max-width: 100%; }
ul, ol  { list-style: none; }
a       { color: inherit; text-decoration: none; }
button  { font-family: inherit; }

/* ── Wrap ── */
.wrap { max-width: var(--mapb-container, 1200px); margin: 0 auto; padding: 0 1.25rem; }

/* ── Verticale ruimte ── */
.blog-wrap { padding-top: 4rem; padding-bottom: 6rem; }
body.single-post main > .wrap { padding-top: 1.5rem; padding-bottom: 1.5rem; }
body.single-post main > .wrap:has(.article-layout) { padding-top: 0; padding-bottom: 0; }
body.single-post .mapb-page-header { max-width: 1000px; margin-inline: auto; }

/* ── Typografie ── */
h1 { font-size: var(--mapb-h1-desktop, 3rem);    font-weight: 800; letter-spacing: -0.025em; line-height: var(--mapb-line-height-heading, 1.2); color: var(--mapb-heading, var(--text)); }
h2 { font-size: var(--mapb-h2-desktop, 2.25rem); font-weight: 800; letter-spacing: -0.02em;  line-height: var(--mapb-line-height-heading, 1.2); color: var(--mapb-heading, var(--text)); }
h3 { font-size: var(--mapb-h3-desktop, 1.75rem); font-weight: 700; letter-spacing: -0.015em; line-height: var(--mapb-line-height-heading, 1.2); color: var(--mapb-heading, var(--text)); }
h4 { font-size: var(--mapb-h4-desktop, 1.25rem); font-weight: 700; letter-spacing: -0.01em;  color: var(--mapb-heading, var(--text)); }

@media (max-width: 768px) {
  h1 { font-size: var(--mapb-h1-mobile, 2rem); }
  h2 { font-size: var(--mapb-h2-mobile, 1.75rem); }
  h3 { font-size: var(--mapb-h3-mobile, 1.375rem); }
}
p  { font-size: 0.975rem; line-height: 1.75; color: var(--muted); }
strong { font-weight: 800; }

/* ── Knoppen ── */
.btn {
  border-radius: var(--mapb-btn-radius, 999px);
  font-family: var(--mapb-font-body, 'Outfit', sans-serif);
  font-weight: 700;
  font-size: var(--mapb-btn-font-size, 0.875rem);
  padding: var(--mapb-btn-padding, 0.75rem 1.5rem);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  transition: opacity 0.2s;
  white-space: nowrap;
}
.btn:hover  { opacity: 0.88; }
.btn:active { opacity: 0.75; }
.btn.primary   { background: var(--mapb-btn-primary-bg, var(--accent)); color: var(--mapb-btn-primary-text, #fff); }
.btn.secondary { background: var(--mapb-btn-secondary-bg, transparent); color: var(--mapb-btn-secondary-text, var(--text)); border: 1px solid var(--border); font-weight: 500; }
.btn.ghost    { background: transparent; color: var(--muted); border: 1px solid var(--border); font-weight: 500; padding: 0.5rem 0.875rem; }
/* Header account-icon knop */
.btn-header-cta { background: var(--mapb-btn-secondary-bg, #e8722a); color: #fff; padding: 0 1rem; height: 34px; font-size: 0.8rem; }
.btn-header-cta:hover { background: var(--mapb-btn-secondary-bg, #e8722a); opacity: 0.85; }
.edd-checkout .btn-header-cta { display: none !important; }
.btn-account-icon { width: 34px; height: 34px; padding: 0; border-radius: 0; flex-shrink: 0; }
/* Winkelmand: lichtgroen bolletje met aantal, pulseert zolang er iets in het mandje zit */
.wpsk-cart-btn { position: relative; overflow: visible; }
.wpsk-cart-badge {
  position: absolute; top: -6px; right: -6px;
  width: 15px; height: 15px;
  display: flex; align-items: center; justify-content: center;
  background: #4ade80; color: #fff;
  font: 700 9.5px/1 var(--mapb-font-body, Roboto, sans-serif);
  border-radius: 50%;
  pointer-events: none;
  animation: wpsk-cart-pulse 1.6s ease-in-out infinite;
}
@keyframes wpsk-cart-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.2); } }
@media (prefers-reduced-motion: reduce) { .wpsk-cart-badge { animation: none; } }

/* Draaiend loadertje zolang een afbeelding laadt: LiteSpeed lazy load (i.p.v. grijs vlak) en lazy afbeeldingen via footer.php */
img[data-lazyloaded]:not(.litespeed-loaded):not(.error),
img.wpsk-img-loading {
  object-position: -99999px 0;
  background: var(--accent-light) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 50 50'%3E%3Ccircle cx='25' cy='25' r='20' fill='none' stroke='%23c9dcef' stroke-width='5'/%3E%3Cpath d='M25 5a20 20 0 0 1 20 20' fill='none' stroke='%232271b1' stroke-width='5' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 25 25' to='360 25 25' dur='0.8s' repeatCount='indefinite'/%3E%3C/path%3E%3C/svg%3E") center / 28px 28px no-repeat;
}
.logo img[data-lazyloaded], .logo img.wpsk-img-loading { background: none; }
.btn.large    { font-size: 1rem; padding: 0.875rem 1.75rem; }
.btn.full     { width: 100%; }

/* ── Badge ── */
.badge {
  background: var(--accent-light);
  color: var(--accent-text);
  border-radius: 999px;
  padding: 0.3rem 0.875rem;
  font-size: 0.825rem;
  font-weight: 600;
  display: inline-block;
}

/* ── Tags ── */
.tag {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 0;
  padding: 0.25rem 0.75rem;
  font-size: 0.8rem;
  color: var(--muted);
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.tag:hover, .tag.active { background: var(--accent); color: #fff; border-color: var(--accent); }

/* ── Card ── */
.card {
  background: var(--card);
  border-radius: 1rem;
  border: 1px solid var(--border);
}
.card.dark     { background: var(--dark); border-color: var(--dark); color: #fff; }
.card.dark p   { color: rgba(255,255,255,0.6); }
.card.featured { border: 2px solid var(--accent); position: relative; }
.card.light    { background: var(--accent-light); border-color: rgba(34,113,177,0.2); }

/* ── Strip ── */
.strip { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: #fff; }

/* ══════════════════════════════════
   NAVIGATIE & HEADER
══════════════════════════════════ */

body > header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(241, 245, 249, 0.92);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
}
body > header > .wrap {
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
body > header > .wrap > div { display: flex; gap: 0.625rem; align-items: center; }

.logo img { height: 44px; width: auto; }
body > header .btn.ghost { display: none; }

@media (max-width: 1023px) {
  body > header .btn.primary { display: none; }
}

body > header nav {
  display: none;
  align-items: center;
}
body > header nav > ul {
  display: flex;
  align-items: center;
  gap: 2rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
body > header nav > ul > li { position: relative; }
body > header nav > ul > li > a {
  color: var(--mapb-heading, var(--text));
  font-weight: 600;
  font-size: 0.9rem;
  padding: 0.25rem 0;
  position: relative;
  transition: color 0.2s;
  display: block;
}
body > header nav > ul > li > a::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0; right: 0;
  height: 1.5px;
  background: var(--accent);
  transform: scaleX(0);
  transition: transform 0.2s ease;
  transform-origin: center;
}
body > header nav > ul > li > a:hover,
body > header nav > ul > li:hover > a { color: var(--text); }
body > header nav > ul > li > a:hover::after,
body > header nav > ul > li:hover > a::after { transform: scaleX(1); }
body > header nav > ul > li > a.active,
body > header nav > ul > li.current-menu-item > a,
body > header nav > ul > li.current_page_item > a { color: var(--mapb-primary, var(--accent)); }
body > header nav > ul > li > a:focus:not(:focus-visible) { outline: none; background: none; }
body > header nav > ul > li > a.active::after,
body > header nav > ul > li.current-menu-item > a::after,
body > header nav > ul > li.current_page_item > a::after { transform: scaleX(1); }

@media (min-width: 1024px) {
  body > header nav { display: flex; }
}

/* ── Hamburger ── */
.hamburger {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.25rem;
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 28px;
}
.hamburger span {
  display: block;
  height: 2px;
  background: var(--text);
  border-radius: 2px;
  transition: all 0.3s;
  width: 100%;
}
@media (min-width: 1024px) { .hamburger { display: none; } }

/* ── Offcanvas ── */
/* Gedeelde overlay voor mobiel menu en cookie-instellingen */
:root { --wps-overlay-bg: rgba(0,0,0,.5); --wps-overlay-blur: 1px; }
.offcanvas-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: var(--wps-overlay-bg);
  backdrop-filter: blur(var(--wps-overlay-blur));
  -webkit-backdrop-filter: blur(var(--wps-overlay-blur));
  z-index: 99;
}
.offcanvas-overlay.open { display: block; }
body.menu-open { overflow: hidden; }
body.menu-open > header { transform: translateX(calc(-1 * min(320px, 85vw))); }
body.menu-open #site-wrap { transform: translateX(calc(-1 * min(320px, 85vw))); pointer-events: none; }

.offcanvas {
  position: fixed;
  top: 0; right: 0;
  width: min(320px, 85vw);
  height: 100%;
  background: #fff;
  z-index: 100;
  transform: translateX(100%);
  transition: transform 0.3s ease;
  display: flex;
  flex-direction: column;
  box-shadow: -4px 0 24px rgba(0,0,0,0.12);
}
.offcanvas.is-open { transform: translateX(0); }
.offcanvas.is-closing { animation: slideOut 0.3s ease forwards; }
@keyframes slideOut { to { transform: translateX(100%); } }
.offcanvas-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border);
}
.offcanvas-close {
  background: none; border: none; cursor: pointer;
  color: var(--muted); padding: 0.25rem;
  border-radius: 0.5rem;
  transition: background 0.15s;
}
.offcanvas-close:hover { background: var(--bg); }
.offcanvas-body {
  flex: 1; overflow-y: auto;
  padding: 1rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.offcanvas-body ul { list-style: none; margin: 0; padding: 0; }
.offcanvas-body ul li a {
  display: block;
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--border);
  color: var(--text);
  font-weight: 500;
  font-size: 0.95rem;
}
.offcanvas-body ul li a:hover { color: var(--accent); }
.offcanvas-cta { padding-top: 1.25rem; display: flex; gap: 0.5rem; align-items: center; }

#site-wrap { display: flex; flex-direction: column; min-height: calc(100vh - 75px); transition: transform 0.3s ease, filter 0.3s ease; }
body > header { transition: transform 0.3s ease; }
main { flex: 1; }

/* ══════════════════════════════════
   FOOTER
══════════════════════════════════ */
.wps-footer {
  background: var(--dark, #0f172a);
  color: rgba(255,255,255,0.65);
  margin-top: auto;
}

.wps-footer__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem 5rem;
  padding-top: 4rem;
  padding-bottom: 3rem;
  align-items: start;
}

.wps-footer__brand {
  max-width: 100%;
}

.wps-footer__logo-link { display: inline-block; }

.wps-footer__social {
  display: flex;
  gap: 0.5rem;
  margin-top: 1.25rem;
}

.wps-footer__social-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  background: var(--mapb-primary, #3858e9);
  color: #fff;
  font-size: 1.1rem;
  text-decoration: none;
  transition: opacity 0.2s;
}

.wps-footer__social-btn svg { width: auto; height: 1em; display: block; }

/* Inline iconen (vervangen Font Awesome) */
.wps-icon { display: inline-block; height: 1em; width: auto; vertical-align: -0.125em; }

.wps-footer__social-btn:hover { opacity: 0.8; color: #fff; }

.wps-footer__logo {
  height: 44px;
  max-height: 44px;
  width: auto;
  display: block;
  margin-bottom: 1.25rem;
}

.wps-footer__desc {
  font-size: 0.9rem;
  line-height: 1.7;
  color: rgba(255,255,255,0.55);
  margin: 0;
}

.wps-footer__nav {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

.wps-footer__heading {
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--accent, #2271b1);
  margin: 0 0 1rem;
}

.wps-footer__col ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.wps-footer__col ul a {
  color: rgba(255,255,255,0.6);
  font-size: 0.9rem;
  text-decoration: none;
  transition: color 0.2s;
}

.wps-footer__col ul a:hover { color: #fff; }

.wps-footer__bottom {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding: 1.25rem 0;
}

.wps-footer__bottom p a { color: inherit; }
.wps-footer__bottom p a:hover { color: #fff; }

.wps-footer__bottom p {
  font-size: 0.825rem;
  color: rgba(255,255,255,0.35);
  margin: 0;
  text-align: center;
}

@media (max-width: 900px) {
  .wps-footer__inner {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .wps-footer__brand { max-width: 100%; }
  .wps-footer__nav { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 500px) {
  .wps-footer__nav { grid-template-columns: 1fr 1fr; }
}

/* ── Scroll-to-top ── */
#scroll-top {
  position: fixed;
  bottom: calc(1.5rem + 42px + 8px); /* boven de chatknop (BM Tools Chatbot) */
  right: 1.5rem;
  width: 42px; height: 42px;
  border-radius: 0;
  border: 1px solid #e5e7eb;
  background: #fff;
  box-shadow: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.25s, transform 0.25s;
  z-index: 40;
  pointer-events: none;
}
#scroll-top svg { width: 18px; height: 18px; color: var(--muted); }

/* Met zichtbare sticky balk: chatknop op de plek van de terug-naar-boven-knop, die erboven */
html body:has(#wps-sticky-bar.is-visible) #scroll-top { bottom: calc(0.875rem + 42px + 8px) !important; }
body:has(#wps-sticky-bar.is-visible) .bmtc-root:not(.is-open) { bottom: 0.875rem; }
.bmtc-root { transition: bottom 0.35s cubic-bezier(0.4,0,0.2,1); }
#scroll-top.visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
#scroll-top:hover { background: var(--bg); }

/* ══════════════════════════════════
   BLOG HERO
══════════════════════════════════ */
.blog-hero-wrap {
  background: var(--dark);
  color: #fff;
  padding: 3rem 0 2.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.blog-hero-wrap h1 { color: #fff; margin-bottom: 0.75rem; }
.blog-hero-wrap p  { color: rgba(255,255,255,0.7); max-width: 640px; }
.blog-hero-wrap .breadcrumb { color: rgba(255,255,255,0.5); font-size: 0.825rem; margin-bottom: 1rem; display: flex; align-items: center; gap: 0.4rem; }
.blog-hero-wrap .breadcrumb a { color: rgba(255,255,255,0.6); }
.blog-hero-wrap .breadcrumb a:hover { color: #fff; }

/* Blog archief + single hero — lichte variant */
.blog-hero-wrap--light {
  background: var(--mapb-bg-light, #f9fafb);
  border-bottom: 1px solid var(--border);
  text-align: center;
  padding: 4rem 0 3.5rem;
}
.blog-hero-wrap--light h1 {
  color: var(--heading, #111827);
  margin-bottom: 0.5rem;
}
.blog-hero-wrap--light p:not(.blog-hero-eyebrow) {
  color: #6b7280;
  max-width: 520px;
  margin-inline: auto;
}
.blog-hero-eyebrow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mapb-primary, #1a56db);
  margin-bottom: 0.75rem;
}
.blog-hero-eyebrow,
.blog-hero-wrap--light .blog-hero-eyebrow { color: var(--mapb-primary, #1a56db); }
.blog-hero-eyebrow a { color: inherit; text-decoration: none; }
.blog-hero-eyebrow a:hover { text-decoration: none; }
.blog-hero-eyebrow span[aria-hidden] { opacity: 0.5; }

/* Breadcrumb huidige pagina afkappen met ellipsis */
.mapb-breadcrumb__current {
  display: inline-block;
  max-width: 24ch;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
  color: #111827;
}

@media (max-width: 768px) {
  .mapb-breadcrumb__list,
  .mapb-breadcrumb__link,
  .mapb-breadcrumb__sep,
  .mapb-breadcrumb__current { font-size: 0.7rem !important; }
  .mapb-breadcrumb__current { max-width: 16ch; }
}

/* Lichte hero: breadcrumb en meta kleuren aanpassen */
.blog-hero-wrap--light .breadcrumb {
  color: #6b7280;
}
.blog-hero-wrap--light .breadcrumb a {
  color: var(--mapb-primary, #1a56db);
}
.blog-hero-wrap--light .breadcrumb b {
  color: #374151;
}
.blog-hero-wrap--light .tag {
  background: rgba(0,0,0,0.05);
  border-color: rgba(0,0,0,0.1);
  color: #374151;
}
.blog-hero-wrap--light .tag:hover {
  background: var(--mapb-primary, #1a56db);
  border-color: var(--mapb-primary, #1a56db);
  color: #fff;
}

/* Artikel hero meta */
.article-hero-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
}
.article-date-pill {
  background: rgba(255,255,255,0.12);
  border-radius: 999px;
  padding: 0.2rem 0.75rem;
  font-size: 0.8rem;
  color: rgba(255,255,255,0.75);
}
.blog-hero-wrap--light .article-date-pill {
  background: rgba(0,0,0,0.06);
  color: #6b7280;
}
.blog-hero-wrap--light .article-hero-meta {
  justify-content: center;
}
.blog-hero-wrap .tag {
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.2);
  color: rgba(255,255,255,0.85);
}
.blog-hero-wrap .tag:hover { background: var(--accent); border-color: var(--accent); color: #fff; }

/* Leesvorderingsbalk */
.reading-bar {
  position: fixed; top: 0; left: 0; right: 0;
  height: 3px;
  background: rgba(0,0,0,0.08);
  z-index: 100;
}
#reading-progress {
  display: block;
  height: 100%;
  background: var(--accent);
  width: 0;
  transition: width 0.1s linear;
}

/* ══════════════════════════════════
   BLOG LISTING
══════════════════════════════════ */
.blog-listing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.5rem;
  margin-top: 1.5rem;
}

.blog-card { overflow: hidden; display: flex; flex-direction: column; }
.blog-card-img { display: block; aspect-ratio: 3/2; overflow: hidden; background: var(--bg); }
.blog-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; }
.blog-card:hover .blog-card-img img { transform: scale(1.03); }
.blog-card-body { padding: 1.25rem; display: flex; flex-direction: column; gap: 0.5rem; flex: 1; }
.blog-card-tags { display: flex; gap: 0.375rem; flex-wrap: wrap; }
.blog-card-body h3 { font-size: 1.05rem; line-height: 1.4; }
.blog-card-body h3 a { color: var(--text); }
.blog-card-body h3 a:hover { color: var(--accent); }
.blog-card-meta { display: flex; align-items: center; gap: 0.375rem; font-size: 0.8rem; color: var(--muted); }
.blog-card-footer { display: flex; align-items: center; justify-content: space-between; margin-top: auto; }
.blog-card-footer time { font-size: 0.8rem; color: var(--muted); }
a.read { font-size: 0.85rem; font-weight: 600; color: var(--accent); }
a.read:hover { color: var(--accent-dark); }

/* Categorie filters: één regel, horizontaal te swipen als het niet past */
.filters {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.5rem;
  padding-top: 1.5rem;
  padding-bottom: 2px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.filters::-webkit-scrollbar { display: none; }
.filters .tag { flex-shrink: 0; }
/* Gecentreerd als alles past, links beginnend als er geswipet moet worden */
.filters .tag:first-child { margin-left: auto; }
.filters .tag:last-child  { margin-right: auto; }

/* Laad meer */
.blog-load-more { display: flex; justify-content: center; padding-top: 2.5rem; }
.blog-load-more .btn { font-size: 0.85rem; padding: 0.5rem 1.25rem; background: var(--dark); border-color: var(--dark); color: #fff; }
.blog-load-more .btn[aria-busy="true"] { opacity: 0.6; pointer-events: none; }

/* Blogkaarten infaden (klasse wordt door wps-blog.js gezet) */
.blog-card.wps-fade {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.blog-card.wps-fade.is-visible { opacity: 1; transform: none; }
/* Afbeelding pas tonen als ze geladen is (klasse via wps-blog.js) */
.blog-card-img img.wps-img-fade { opacity: 0; transition: opacity 0.6s ease, transform 0.3s ease; }
.blog-card-img img.wps-img-fade.is-loaded { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .blog-card.wps-fade { opacity: 1; transform: none; transition: none; }
  .blog-card-img img.wps-img-fade { transition: none; }
}

/* Paginering */
.pagination {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  align-items: center;
  padding-top: 2rem;
  flex-wrap: wrap;
}
.pagination a {
  min-width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: 0.5rem;
  font-size: 0.875rem;
  color: var(--muted);
  background: #fff;
  transition: all 0.15s;
}
.pagination a:hover, .pagination a.active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

/* Nieuwsbrief / CTA strip */
.newsletter {
  max-width: 560px;
  margin: 0 auto;
  padding: 2.5rem 1.25rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  align-items: center;
}
.newsletter h2 { font-size: clamp(1.3rem, 3vw, 1.8rem); }
.newsletter form {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
  max-width: 420px;
}
.newsletter input[type="email"] {
  flex: 1;
  min-width: 0;
  padding: 0.7rem 1rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  font-family: inherit;
  font-size: 0.9rem;
  color: var(--text);
  background: #fff;
}
.newsletter input[type="email"]:focus { outline: 2px solid var(--accent); outline-offset: 2px; border-color: transparent; }
.newsletter small { color: var(--muted); font-size: 0.8rem; }

/* ══════════════════════════════════
   SINGLE ARTIKEL
══════════════════════════════════ */

/* Hero: extra ruimte onderaan zodat afbeelding overlapt */
.article-hero--img-overlap { padding-bottom: 7rem !important; }

.article-layout {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 680px;
  margin-inline: auto;
  margin-top: -5rem;
  padding: 0 0 3rem;
  position: relative;
  z-index: 1;
}

/* Featured image met meta-overlay */
.article-image--hero {
  position: relative;
  border-radius: 0.75rem;
  overflow: hidden;
  margin: 0;
}
.article-image--hero img { display: block; width: 100%; height: auto; }
/* Visual pas tonen als hij geladen is (klasse via inline script in single.php) */
.article-image--hero { background: var(--bg); }
.article-image--hero img.wps-img-fade { opacity: 0; transition: opacity 0.6s ease; }
.article-image--hero img.wps-img-fade.is-loaded { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .article-image--hero img.wps-img-fade { transition: none; }
}

.article-image-meta {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 2rem 1.5rem 1.25rem;
  background: linear-gradient(transparent, rgba(0,0,0,0.6));
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.article-image-meta .article-date-pill {
  background: rgba(255,255,255,0.18);
  color: #fff;
  backdrop-filter: blur(4px);
}
.article-image-meta .tag {
  background: rgba(255,255,255,0.15);
  border-color: rgba(255,255,255,0.3);
  color: #fff;
}
.article-image-meta .tag:hover {
  background: rgba(255,255,255,0.3);
  color: #fff;
}

/* TOC boven artikel */
.toc-above { padding: 0 !important; background: none !important; border: none !important; margin-bottom: 1.25rem !important; }
.article-image--hero + .toc-above { margin-top: -1.5rem; }
.toc-above nav { flex-direction: column; max-height: none; gap: 0.25rem; }
.toc-above nav a:nth-child(n+6) { display: none; }
.toc-above.toc-expanded nav a:nth-child(n+6) { display: block; }

/* Prose */
.prose { font-size: 1rem; line-height: 1.8; color: var(--text); }
.prose h2 { font-size: clamp(1.05rem, 2.5vw, 1.35rem); margin-top: 2.25rem; margin-bottom: 0.75rem; }
.prose h3 { font-size: 1rem; margin-top: 1.75rem; margin-bottom: 0.5rem; }
.prose p  { margin-bottom: 1.1rem; color: var(--text); }
.prose ul, .prose ol { padding-left: 1.5rem; margin-bottom: 1.1rem; }
.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }
.prose li { margin-bottom: 0.4rem; line-height: 1.7; }
.prose a  { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.prose a:hover { color: var(--accent-dark); text-decoration: none; }
.prose strong { font-weight: 700; }
.prose blockquote { border-left: 3px solid var(--accent); padding-left: 1rem; color: var(--muted); font-style: italic; margin: 1.5rem 0; }
.prose img { border-radius: 0.75rem; margin: 1.5rem 0; }
.prose figure { margin: 1.5rem 0; }
.prose figure figcaption { font-size: 0.825rem; color: var(--muted); text-align: center; margin-top: 0.5rem; }
.article-image { border-radius: 0.75rem; overflow: hidden; margin-bottom: 1.75rem; }
.article-image img { width: 100%; height: auto; }

/* Tabel */
.data-table { width: 100%; border-collapse: collapse; font-size: 0.9rem; }
.data-table th { background: var(--bg); font-weight: 700; text-align: left; padding: 0.6rem 0.875rem; border-bottom: 2px solid var(--border); }
.data-table td { padding: 0.55rem 0.875rem; border-bottom: 1px solid var(--border); color: var(--text); }
.data-table tr:last-child td { border-bottom: none; padding-bottom: 0; }
.data-table tr:hover td { background: var(--bg); }
.data-table-wrap { overflow-x: auto; border-radius: 0.75rem; border: 1px solid var(--border); margin: 1.25rem 0; }
.swipe-hint { font-size: 0.78rem; color: var(--muted); display: flex; align-items: center; gap: 0.375rem; margin-top: 0.375rem; }
@media (min-width: 1024px) { .swipe-hint { display: none; } }
.swipe-hint svg { width: 18px; height: 18px; flex-shrink: 0; }

/* Callout */
.callout { border-left: 3px solid var(--accent); background: var(--accent-light); border-radius: 0.5rem; padding: 1.25rem 1.5rem; margin: 1.25rem 0; }
.callout p { color: var(--accent-text); margin: 0; }
.alert { border-left: 3px solid #f59e0b; background: #fffbeb; border-radius: 0.5rem; padding: 1.25rem 1.5rem; margin: 1.25rem 0; }
.alert p { color: #92400e; margin: 0; }
.alert.danger { border-color: #ef4444; background: #fef2f2; }
.alert.danger p { color: #991b1b; }
.cta-block { background: var(--dark); border-radius: 1rem; padding: 1.75rem; margin: 1.75rem 0; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 0.875rem; }
.cta-block p { color: rgba(255,255,255,0.75); margin: 0; }

/* Sidebar */
.sidebar {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  position: sticky;
  top: 90px;
}

/* TOC */
.toc { padding: 1.25rem 1.5rem; }
.toc h4 { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--accent); margin-bottom: 0.75rem; }
.toc nav { display: flex; flex-direction: column; gap: 0.375rem; max-height: 320px; overflow: hidden; }
.toc.toc-expanded nav { max-height: none; }
.toc nav a { font-size: 1rem; color: var(--muted); padding: 0.2rem 0; border-left: 2px solid rgba(220,228,238,0.8); padding-left: 0.625rem; transition: color 0.15s, border-color 0.15s; }
.toc nav a:hover { color: var(--text); border-left-color: var(--accent); }
.toc-toggle { margin-top: 0.75rem; background: none; border: 1px solid currentColor; border-radius: 0; cursor: pointer; font-size: 0.78rem; font-weight: 600; color: var(--accent); padding: 0.3rem 0.75rem; font-family: inherit; transition: background 0.15s, color 0.15s; }
.toc-toggle:hover { background: var(--accent); color: #fff; }
body.single-post .toc-toggle:hover { background: var(--mapb-btn-secondary-bg, #e8722a) !important; color: #fff !important; }
/* "Toon alles" in de inhoudsopgave: witte knop met grijze rand, zoals "Wijzig" in de checkout */
body.single-post .btn.toc-toggle { background: #fff !important; border: 1px solid var(--mapb-border, #e5e7eb) !important; color: #374151 !important; font-weight: 600; }
body.single-post .btn.toc-toggle:hover { background: #f9fafb !important; color: #374151 !important; }
body.single-post header .btn.primary { background: var(--mapb-btn-primary-bg, var(--accent)) !important; border-radius: var(--mapb-btn-radius, 999px) !important; }
body.single-post header .btn.primary:hover { background: var(--accent-dark, #1a56db) !important; }
.toc-mobile-strip { display: block; margin: 1.25rem 0; }
@media (min-width: 900px) { .toc-mobile-strip { display: none; } }

/* Sidebar CTA */
.cta-aside { padding: 1.25rem; display: flex; flex-direction: column; gap: 0.75rem; }
.cta-aside small { font-size: 0.78rem; color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; }
.cta-aside p { margin: 0; color: var(--text); font-size: 0.9rem; line-height: 1.6; }

/* Gerelateerde artikelen */
.related {
  padding-top: 4rem;
  padding-bottom: 5rem;
  border-top: none;
}
.related-strip { border-top: 1px solid #e2e8f0; background: #fff; }
.related header { margin-bottom: 1rem; max-width: 920px; margin-inline: auto; }
.related header h2 { font-size: 1.75rem; }
.related .blog-listing-grid { max-width: 920px; margin-inline: auto; }

/* FAQ */
.faq-item { border-bottom: 1px solid var(--border); }
.faq-q { width: 100%; background: none; border: none; cursor: pointer; text-align: left; padding: 1rem 0; display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-size: 0.95rem; font-weight: 700; color: var(--text); }
.faq-q::after { content: '+'; font-size: 1.25rem; color: var(--muted); flex-shrink: 0; transition: transform 0.2s; }
.faq-item.open .faq-q::after { transform: rotate(45deg); }
.faq-a { display: none; padding-bottom: 1rem; }
.faq-a p { font-size: 0.9rem; margin: 0; }
.faq-item.open .faq-a { display: block; }

/* ── WordPress-inhoud basisstijlen ── */
.page-content { max-width: 760px; margin: 3rem auto; padding: 0 1.25rem; }
.page-content h1 { margin-bottom: 1rem; }
.page-content h2 { margin-top: 2rem; margin-bottom: 0.75rem; }
.page-content p  { margin-bottom: 1rem; }
.page-content a  { color: var(--accent); text-decoration: underline; }
.page-content a:hover { text-decoration: none; }

/* ── 404 ── */
.error-404-wrap { text-align: center; padding: 5rem 1.25rem; }
.error-404-wrap h1 { font-size: 6rem; color: var(--accent); margin-bottom: 0.25rem; }

/* ── WooCommerce basis ── */
.woocommerce { max-width: 900px; margin: 2rem auto; padding: 0 1.25rem; }


/* ══════════════════════════════════
   ACCOUNT PAGINA
══════════════════════════════════ */
.wps-account-wrap {
  width: 100%;
  max-width: var(--mapb-container, 1200px);
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 2rem);
  padding-top: 3rem;
  padding-bottom: 5rem;
}

/* Login pagina */
.wps-login-wrap {
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem 1.25rem;
}
.wps-login-card {
  width: 100%;
  max-width: 400px;
  background: #fff;
  border: 1px solid var(--border);
  padding: 2.5rem 2rem;
  text-align: center;
}
.wps-login-icon {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  background: #eff2fe;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.25rem;
  color: var(--accent);
}
.wps-login-card h1 { font-size: 1.5rem; margin-bottom: 0.375rem; }
.wps-login-card > p { color: var(--muted); font-size: 0.875rem; margin-bottom: 1.75rem; }
.wps-login-error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #dc2626;
  font-size: 0.825rem;
  padding: 0.625rem 0.875rem;
  margin-bottom: 1.25rem;
  text-align: left;
}
.wps-login-field {
  text-align: left;
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.wps-login-field label { font-size: 0.825rem; font-weight: 600; color: var(--text); }
.wps-login-field input[type="text"],
.wps-login-field input[type="password"] {
  padding: 0.65rem 0.875rem;
  border: 1px solid var(--border);
  font-size: 0.9rem;
  font-family: inherit;
  color: var(--text);
  width: 100%;
  transition: border-color 0.15s;
  background: #fff;
}
.wps-login-field input:focus { outline: none; border-color: var(--accent); }
.wps-login-remember {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
  text-align: left;
}
.wps-login-remember label { font-size: 0.825rem; color: var(--muted); cursor: pointer; }
.wps-login-remember input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  accent-color: var(--accent);
  cursor: pointer;
  flex-shrink: 0;
}
.wps-login-btn {
  width: 100%;
  background: var(--accent);
  color: #fff;
  border: none;
  padding: 0.8rem 1.5rem;
  font-size: 1rem;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  transition: opacity 0.15s;
  margin-bottom: 1.25rem;
}
.wps-login-btn:hover { opacity: 0.88; }
.wps-login-forgot { font-size: 0.825rem; color: var(--accent); text-decoration: none; }
.wps-login-forgot:hover { text-decoration: none; }

/* Wachtwoord vergeten pagina */
.wps-lostpw-wrap {
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem 1.25rem;
}
.wps-lostpw-card {
  width: 100%;
  max-width: 400px;
  background: #fff;
  border: 1px solid var(--border);
  padding: 2.5rem 2rem;
  text-align: center;
}
.wps-lostpw-icon {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  background: #eff2fe;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.25rem;
  color: var(--accent);
}
.wps-lostpw-card h1 { font-size: 1.5rem; margin-bottom: 0.375rem; }
.wps-lostpw-card > p { color: var(--muted); font-size: 0.875rem; margin-bottom: 1.75rem; }
.wps-lostpw-success {
  background: #f0fdf4;
  border: 1px solid #86efac;
  color: #15803d;
  font-size: 0.85rem;
  padding: 0.875rem 1rem;
  margin-bottom: 1.5rem;
  text-align: left;
  line-height: 1.5;
}
.wps-lostpw-field {
  text-align: left;
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}
.wps-lostpw-field label { font-size: 0.825rem; font-weight: 600; color: var(--text); }
.wps-lostpw-field input[type="email"],
.wps-lostpw-field input[type="text"],
.wps-lostpw-field input[type="password"] {
  padding: 0.65rem 0.875rem;
  border: 1px solid var(--border);
  font-size: 0.9rem;
  font-family: inherit;
  color: var(--text);
  width: 100%;
  transition: border-color 0.15s;
  background: #fff;
}
.wps-lostpw-field input:focus { outline: none; border-color: var(--accent); }
.wps-lostpw-btn {
  width: 100%;
  background: var(--accent);
  color: #fff;
  border: none;
  padding: 0.8rem 1.5rem;
  font-size: 1rem;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  transition: opacity 0.15s;
  margin-bottom: 1.25rem;
}
.wps-lostpw-btn:hover { opacity: 0.88; }
.wps-lostpw-back { font-size: 0.825rem; color: var(--accent); text-decoration: none; }
.wps-lostpw-back:hover { text-decoration: none; }

/* Account hero */
.wps-account-hero {
  background: var(--mapb-bg-light, #f9fafb);
  text-align: center;
  padding: 96px 1.25rem 48px;
}
.wps-account-hero .wps-account-wrap {
  padding-top: 0;
  padding-bottom: 0;
}
.wps-account-eyebrow {
  display: inline-block;
  font-size: var(--mapb-font-size-small, 0.875rem);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mapb-primary, var(--accent));
  margin: 0;
}
.wps-account-hero h1 {
  font-size: var(--mapb-h1-desktop, 3rem);
  font-weight: 700;
  line-height: var(--mapb-line-height-heading, 1.2);
  margin: 0;
  color: var(--text);
}
.wps-account-hero h1 span { color: var(--mapb-primary, var(--accent)); }
@media (max-width: 640px) {
  .wps-account-hero { padding: 48px 1.25rem; }
  .wps-account-hero h1 { font-size: var(--mapb-h1-mobile, 2rem); }
}

/* Tabs */
.wps-account-tabs {
  display: flex;
  overflow-x: auto;
  gap: 0;
  margin-bottom: 2rem;
  background: #f1f5f9;
}
.wps-tab {
  padding: 0.625rem 1.125rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--mapb-heading, var(--text));
  white-space: nowrap;
  transition: background 0.15s, color 0.15s;
  text-decoration: none;
  display: block;
}
.wps-tab:hover { background: #e2e8f0; color: var(--mapb-heading, var(--text)); }
.wps-tab--active { background: var(--mapb-primary, var(--accent)); color: #fff; }
.wps-tab--active:hover { background: var(--mapb-primary, var(--accent)); color: #fff; opacity: 0.9; }
.wps-tab--logout { margin-left: auto; color: var(--mapb-heading, var(--text)); }
.wps-tab--logout:hover { background: transparent; color: #ef4444; }

/* Content gebied */
.wps-account-content {
  min-height: 300px;
}

/* Licentiekaart */
.wps-license-card {
  border: 1px solid var(--border);
  border-radius: 0;
  overflow: hidden;
  margin-bottom: 1.5rem;
}
.wps-license-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}
.wps-license-card__type { font-size: 0.8rem; color: var(--muted); display: block; margin-bottom: 0.2rem; }
.wps-license-card__name { font-size: 1.1rem; font-weight: 700; color: var(--text); }

/* Download button */
.wps-btn--download {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
  background: var(--mapb-btn-primary-bg, var(--accent));
  color: var(--mapb-btn-primary-text, #fff);
  border-radius: var(--mapb-btn-radius, 6px);
  padding: 0.45rem 0.875rem;
  font-weight: 700;
  font-size: 0.825rem;
  text-decoration: none;
  transition: opacity 0.15s;
  white-space: nowrap;
}
.wps-btn--download:hover { opacity: 0.88; color: #fff; }
.wps-download-wrap { display: flex; flex-direction: column; align-items: flex-end; gap: 0.35rem; }
.wps-download-meta { font-size: 0.78rem; color: var(--muted); margin: 0; text-align: right; }
.wps-download-changelog { color: var(--mapb-primary, var(--accent)); font-weight: 500; }
.wps-download-changelog:hover { text-decoration: none; }

/* Meta rij */
.wps-license-card__meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  divide-x: 1px solid var(--border);
}
.wps-meta-item {
  padding: 1.1rem 1.5rem;
  border-right: 1px solid var(--border);
}
.wps-meta-item:last-child { border-right: none; }
@media (max-width: 600px) {
  .wps-license-card__meta { grid-template-columns: 1fr; }
  .wps-meta-item { border-right: none; border-bottom: 1px solid var(--border); }
  .wps-meta-item:last-child { border-bottom: none; }
}
.wps-meta-item__label { font-size: 0.78rem; color: var(--muted); display: block; margin-bottom: 0.4rem; }
.wps-meta-item__key { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.wps-meta-item__key code {
  font-family: 'Courier New', monospace;
  font-size: 0.82rem;
  background: var(--bg);
  padding: 0.2rem 0.5rem;
  border-radius: 0.25rem;
  border: 1px solid var(--border);
  word-break: break-all;
}

/* Badges */
.wps-badge {
  display: inline-block;
  padding: 0.15rem 0.6rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  margin-left: 0.375rem;
}
.wps-badge--active   { background: #dcfce7; color: #166534; }
.wps-badge--expired  { background: #fee2e2; color: #991b1b; }

/* Kopieer knop */
.wps-copy-btn {
  background: none;
  border: 1px solid var(--border);
  border-radius: 0.375rem;
  padding: 0.25rem 0.5rem;
  cursor: pointer;
  color: var(--muted);
  font-size: 0.85rem;
  transition: color 0.15s, border-color 0.15s;
  flex-shrink: 0;
}
.wps-copy-btn:hover { color: var(--accent); border-color: var(--accent); }

/* Link */
.wps-link { font-size: 0.82rem; color: var(--accent); margin-left: 0.5rem; }
.wps-link:hover { text-decoration: none; }

/* Leeg state */
.wps-account-empty { padding: 2rem; text-align: center; color: var(--muted); }

/* Profiel tab */
.wps-profile h2 { display: none; }

#edd_profile_editor_form {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 0 3rem;
}
#edd_profile_personal_fieldset  { grid-column: 1; grid-row: 1; }
#edd_profile_address_fieldset   { grid-column: 2; grid-row: 1; }
#edd_profile_password_fieldset  { grid-column: 3; grid-row: 1; }
#edd_profile_submit_fieldset    { grid-column: 1 / -1; grid-row: 2; padding-top: 0.5rem; display: flex; justify-content: flex-start; }

#edd_profile_editor_form fieldset {
  border: none;
  padding: 0;
  margin: 0 0 2rem;
}
#edd_profile_editor_form fieldset legend {
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  padding: 0;
  margin-bottom: 1rem;
  display: block;
  width: 100%;
}
#edd_profile_editor_form p {
  margin: 0 0 0.875rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
#edd_profile_editor_form p label {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--text);
}
#edd_profile_editor_form input.edd-input,
#edd_profile_editor_form input.text,
#edd_profile_editor_form select.edd-select,
#edd_profile_editor_form select.select {
  width: 100%;
  padding: 0.6rem 0.875rem;
  border: 1px solid var(--border);
  border-radius: 0;
  font-size: 0.9rem;
  font-family: inherit;
  color: var(--text);
  background: #fff;
  transition: border-color 0.15s;
  box-sizing: border-box;
}
#edd_profile_editor_form input.edd-input:focus,
#edd_profile_editor_form select.edd-select:focus,
#edd_profile_editor_form select.select:focus {
  outline: none;
  border-color: var(--mapb-primary, var(--accent));
}
#edd_profile_editor_form .edd_submit {
  background: var(--mapb-btn-primary-bg, var(--accent));
  color: var(--mapb-btn-primary-text, #fff);
  border: none;
  border-radius: var(--mapb-btn-radius, 6px);
  padding: 0.65rem 2rem;
  font-size: 0.9rem;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  transition: opacity 0.15s;
  width: auto;
}
#edd_profile_editor_form .edd_submit:hover { opacity: 0.88; }
@media (max-width: 860px) {
  #edd_profile_editor_form { grid-template-columns: 1fr 1fr; }
  #edd_profile_password_fieldset { grid-column: 1; grid-row: 2; }
  #edd_profile_submit_fieldset   { grid-column: 1 / -1; grid-row: 3; }
}
@media (max-width: 560px) {
  #edd_profile_editor_form { grid-template-columns: 1fr; }
  #edd_profile_personal_fieldset,
  #edd_profile_address_fieldset,
  #edd_profile_password_fieldset,
  #edd_profile_submit_fieldset { grid-column: 1; grid-row: auto; }
}

/* Overzicht tab */
.wps-overview { display: flex; flex-direction: column; gap: 0; }
.wps-overview__cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  gap: 0;
  border: 1px solid var(--border);
  border-top: none;
}
.wps-overview__cols .wps-overview__section {
  padding: 1.25rem 1rem;
  border-bottom: none;
  border-right: 1px solid var(--border);
}
.wps-overview__cols .wps-overview__section:last-child { border-right: none; }
@media (max-width: 600px) {
  .wps-overview__cols { grid-template-columns: 1fr; }
  .wps-overview__cols .wps-overview__section { border-right: none; border-bottom: 1px solid var(--border); }
  .wps-overview__cols .wps-overview__section:last-child { border-bottom: none; }
}
.wps-overview__section {
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--border);
}
.wps-overview__section:first-child { padding-top: 0; }
.wps-overview__cols .wps-overview__section:first-child { padding-top: 1.25rem; }
.wps-overview__label {
  display: block;
  font-size: 0.8rem;
  color: var(--muted);
  margin-bottom: 0.25rem;
}
.wps-overview__name {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--text);
}
.wps-overview__contact {
  margin: 0;
  font-size: 0.95rem;
  color: var(--text);
}
.wps-overview__licenses { padding-top: 30px; }
.wps-ov-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
  border: 1px solid var(--border);
}
.wps-ov-table th {
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  color: var(--mapb-primary, var(--accent));
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--border);
  border-right: 1px solid var(--border);
  background: var(--mapb-bg-light, #f9fafb);
}
.wps-ov-table th:last-child { border-right: none; }
.wps-ov-table td {
  padding: 1rem;
  border-bottom: 1px solid var(--border);
  border-right: 1px solid var(--border);
  vertical-align: middle;
  color: var(--text);
}
.wps-ov-table td:last-child { border-right: none; text-align: right; }
.wps-ov-table tr:last-child td { border-bottom: none; }
.wps-ov-table tbody tr:nth-child(even) td { background: var(--mapb-bg-light, #f9fafb); }

/* Facturering tab */
.wps-billing__heading {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text);
  margin: 0 0 0.875rem;
}
.wps-billing__heading + .wps-billing__heading,
.wps-billing__table-wrap + .wps-billing__heading { margin-top: 2.5rem; }
.wps-billing__empty { color: var(--muted); font-size: 0.9rem; margin-bottom: 1rem; }
.wps-billing__table-wrap {
  border: 1px solid var(--border);
  border-radius: 0;
  overflow: hidden;
}
.wps-billing-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}
.wps-billing-table thead {
  background: var(--mapb-bg-light, #f9fafb);
}
.wps-billing-table th {
  text-align: left;
  font-size: 11px;
  font-weight: 700;
  color: var(--mapb-primary, var(--accent));
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--border);
  border-right: 1px solid var(--border);
  background: var(--mapb-bg-light, #f9fafb);
}
.wps-billing-table th:last-child { border-right: none; }
.wps-billing-table td {
  padding: 1rem;
  border-bottom: 1px solid var(--border);
  border-right: 1px solid var(--border);
  vertical-align: middle;
  color: var(--text);
}
.wps-billing-table td:last-child { border-right: none; }
.wps-billing-table tbody tr:last-child td { border-bottom: none; }
.wps-billing-table tbody tr:nth-child(even) td { background: var(--mapb-bg-light, #f9fafb); }
.wps-billing__renews {
  font-size: 0.8rem;
  color: var(--muted);
  margin-left: 0.75rem;
}
.wps-billing__actions { text-align: right; white-space: nowrap; }
.wps-text-link {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1;
  padding: 0.375rem 0.75rem;
  border-radius: 0;
  text-decoration: none;
  white-space: nowrap;
  border: 1px solid var(--mapb-primary, var(--accent));
  color: var(--mapb-primary, var(--accent));
  background: transparent;
  transition: background 0.15s, color 0.15s;
}
.wps-text-link:hover {
  background: var(--mapb-primary, var(--accent));
  color: #fff;
  opacity: 1;
}
.wps-text-link--danger {
  border-color: #dc2626;
  color: #dc2626;
  background: transparent;
}
.wps-text-link--danger:hover {
  background: #dc2626;
  color: #fff;
  opacity: 1;
}
.wps-overview__more { margin: 30px 0 0; font-size: 0.875rem; text-align: left; }
.wps-btn--sm { font-size: 0.8rem !important; padding: 0.45rem 0.875rem !important; }
.wps-overview__more a { color: var(--mapb-primary, var(--accent)); text-decoration: none; }
.wps-overview__more a:hover { text-decoration: none; }
.wps-overview__more .mapb-btn { color: #fff !important; text-decoration: none !important; }

/* ═══════════════════════════════════════════════════════════════════════
   EDD Checkout pagina — Template: EDD Checkout
   ═══════════════════════════════════════════════════════════════════════ */

.wps-co-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* ─── Progress-stappen balk ───────────────────────────────────────────── */
.wps-csteps-bar {
  background: var(--mapb-bg-light, #f1f5f9);
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
  padding: 1.125rem 0;
}
.wps-csteps-bar .wps-co-inner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.wps-cstep {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #94a3b8;
  font-size: 0.875rem;
}
.wps-cstep--done  { color: #22c55e; }
.wps-cstep--active { color: var(--mapb-primary, #3858e9); font-weight: 600; }
.wps-cstep__dot {
  width: 1.875rem;
  height: 1.875rem;
  border-radius: 50%;
  border: 2px solid currentColor;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 700;
  flex-shrink: 0;
}
.wps-cstep--done   .wps-cstep__dot { background: #22c55e; border-color: #22c55e; color: #fff; }
.wps-cstep--active .wps-cstep__dot { background: var(--mapb-primary,#3858e9); border-color: var(--mapb-primary,#3858e9); color: #fff; }
.wps-cstep__line {
  width: 3.5rem;
  height: 1px;
  background: #e2e8f0;
  flex-shrink: 0;
  margin: 0 0.625rem;
}
@media (max-width: 580px) {
  .wps-cstep__label { display: none; }
  .wps-cstep__line  { width: 1.5rem; }
}

/* ─── Hoofd checkout-gebied ───────────────────────────────────────────── */
.wps-co-main { padding: 2.5rem 0 6rem; }

/* Checkout: geen extra max-width of padding op inner — wps-account-wrap regelt dit al */
.wps-edd-checkout .wps-co-inner {
  max-width: none;
  padding: 0;
}

/* EDD plakt soms extra margin/float op edd_checkout_wrap — override */
.wps-edd-checkout #edd_checkout_wrap {
  display: grid;
  grid-template-columns: 1fr 420px;
  grid-template-areas: "form cart";
  gap: 2rem;
  align-items: start;
  max-width: none;
  padding: 0;
  margin: 0;
  float: none;
}
.wps-edd-checkout #edd_checkout_cart      { grid-area: cart; }
.wps-edd-checkout #edd_checkout_form_wrap  { grid-area: form; }

/* ─── Rechterkolom: bestellingsoverzicht ──────────────────────────────── */
.wps-edd-checkout #edd_checkout_cart {
  display: block;
  width: 100%;
  border-spacing: 0;
  border-collapse: collapse;
  background: #fff;
  border: 1px solid var(--mapb-border, #e5e7eb);
  font-size: 0.925rem;
  position: sticky;
  top: 5.5rem;
}
.wps-edd-checkout #edd_checkout_cart::before {
  content: 'Jouw bestelling';
  display: block;
  font-family: var(--mapb-font-heading,'Poppins',sans-serif);
  font-weight: 700;
  font-size: 1rem;
  color: var(--mapb-color-heading, #0f172a);
  padding: 1.125rem 1.375rem 0.875rem;
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
}
/* Checkout cart tabel — thead verwijderd via edd_templates/checkout_cart.php */
.wps-edd-checkout #edd_checkout_cart tbody,
.wps-edd-checkout #edd_checkout_cart tfoot { display: block; }
/* Cart items: naam (flex:1) | prijs | x verwijderknop */
.wps-edd-checkout #edd_checkout_cart tr.edd_cart_item {
  display: flex;
  align-items: center;
  padding: 0.875rem 1.375rem;
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
  gap: 0.625rem;
}
.wps-edd-checkout #edd_checkout_cart td {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
}
.wps-edd-checkout #edd_checkout_cart .edd_cart_item_name { flex: 1; min-width: 0; }
.wps-edd-checkout #edd_checkout_cart .edd_cart_item_name .edd_checkout_cart_item_title {
  display: block;
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--mapb-color-heading, #0f172a);
  line-height: 1.3;
}
.wps-edd-checkout #edd_checkout_cart .edd_cart_item_name > *:not(.edd_checkout_cart_item_title):not(.edd_cart_item_image) {
  display: block;
  font-size: 0.75rem;
  color: #94a3b8;
  font-weight: 400;
  margin-top: 0.125rem;
}
.wps-edd-checkout #edd_checkout_cart .edd_cart_item_price {
  font-weight: 700;
  color: var(--mapb-primary, #3858e9);
  white-space: nowrap;
  font-size: 0.9rem;
  flex-shrink: 0;
}
.wps-edd-checkout #edd_checkout_cart .edd_cart_actions { flex-shrink: 0; }
.wps-edd-checkout #edd_checkout_cart .edd_cart_remove_item_btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.375rem;
  height: 1.375rem;
  border-radius: 50%;
  background: #f1f5f9;
  font-size: 0;
  text-decoration: none;
  transition: background 0.15s;
  flex-shrink: 0;
}
.wps-edd-checkout #edd_checkout_cart .edd_cart_remove_item_btn::after {
  content: "\00D7";
  font-size: 1.1rem;
  color: #94a3b8;
  font-weight: 400;
  line-height: 1;
}
.wps-edd-checkout #edd_checkout_cart .edd_cart_remove_item_btn:hover { background: #fee2e2; }
.wps-edd-checkout #edd_checkout_cart .edd_cart_remove_item_btn:hover::after { color: #ef4444; }
/* Footer rijen: subtotaal, btw, totaal */
.wps-edd-checkout #edd_checkout_cart tfoot tr { display: block; padding: 0; border: 0; }
.wps-edd-checkout #edd_checkout_cart tfoot th {
  display: block;
  padding: 0.625rem 1.375rem;
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
  font-size: 0.825rem;
  font-weight: 400;
  color: #4b5563;
  background: transparent;
}
.wps-edd-checkout #edd_checkout_cart .edd_cart_discount_row .edd_cart_fee_amount { color: #22c55e; font-weight: 700; }
.wps-edd-checkout #edd_checkout_cart .edd_cart_total .edd_cart_amount {
  font-weight: 700;
  color: var(--mapb-color-heading, #0f172a);
}
.wps-edd-checkout #edd_checkout_cart tfoot tr:last-child th {
  background: var(--mapb-bg-light, #f1f5f9);
  font-weight: 700;
  font-size: 0.925rem;
  border-bottom: 0;
}

/* ─── Linkerkolom: aankoopformulier ──────────────────────────────────── */
.wps-edd-checkout #edd_checkout_form_wrap {
  background: transparent;
  border: none;
  padding: 0;
}
.wps-edd-checkout #edd_purchase_form fieldset {
  border: none;
  padding: 0;
  margin: 0 0 2rem;
}
/* Originele legend verborgen — vervangen door .wps-co-section-header via PHP */
.wps-edd-checkout #edd_purchase_form legend { display: none !important; }

/* Section header: identiek aan cart-header rechts */
.wps-edd-checkout .wps-co-section-header {
  display: flex;
  align-items: center;
  grid-column: 1 / -1;
  font-family: var(--mapb-font-heading,'Poppins',sans-serif);
  font-weight: 700;
  font-size: 1rem;
  color: var(--mapb-color-heading, #0f172a);
  padding: 1.125rem 1.375rem 0.875rem;
  margin: 0 -1.375rem 0;
  width: calc(100% + 2 * 1.375rem);
  box-sizing: border-box;
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
}
.wps-edd-checkout .wps-co-section-header--first {
  margin-top: 0;
}
.wps-edd-checkout .edd-label {
  display: block;
  font-weight: 600;
  font-size: 0.875rem;
  color: var(--mapb-color-heading, #0f172a);
  margin-bottom: 0.3rem;
}
.wps-edd-checkout .edd-description { display: none; }
.wps-edd-checkout .edd-required-indicator { color: #ef4444; }
.wps-edd-checkout #edd_purchase_form p,
.wps-edd-checkout #edd_purchase_form .edd-form-group,
.wps-edd-checkout #edd_login_fields > div:not(.wps-co-section-header),
.wps-edd-checkout #edd_login_fields p { margin: 0; }

/* Kaart per sectie — !important nodig omdat #edd_purchase_form fieldset { border:none } hogere specificiteit heeft */
.wps-edd-checkout #edd_checkout_user_info,
.wps-edd-checkout #edd_cc_address,
.wps-edd-checkout #edd_login_fields {
  background: #fff;
  border: 1px solid var(--mapb-border, #e5e7eb) !important;
  overflow: hidden;
  padding: 0 1.375rem 1.5rem !important;
  margin: 0 0 1.25rem !important;
}

/* Login-wrapper: verborgen by default, toggle via JS */
.wps-edd-checkout #edd_checkout_login_register { display: none; }

/* Login-kaart grid (base styling zit in de gecombineerde regel hierboven) */
.wps-edd-checkout #edd_login_fields {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}
.wps-edd-checkout #edd_login_fields legend { display: none !important; }
.wps-edd-checkout #edd_login_fields .edd-form-group { margin: 0; }
.wps-edd-checkout #edd_login_fields label,
.wps-edd-checkout #edd_login_fields .edd-form-group__label {
  display: block;
  font-weight: 600;
  font-size: 0.875rem;
  color: var(--mapb-color-heading, #0f172a);
  margin-bottom: 0.3rem;
}
.wps-edd-checkout #edd_login_fields input[type="text"],
.wps-edd-checkout #edd_login_fields input[type="password"] {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 0.6rem 0.875rem;
  border: 1px solid var(--mapb-border, #e5e7eb);
  background: #fff;
  font-family: var(--mapb-font-body,'Roboto',sans-serif);
  font-size: 0.95rem;
  color: var(--mapb-color-text, #0f172a);
  border-radius: 0;
  outline: none;
}
.wps-edd-checkout #edd_login_fields input[type="text"]:focus,
.wps-edd-checkout #edd_login_fields input[type="password"]:focus {
  border-color: var(--mapb-primary, #3858e9);
  box-shadow: 0 0 0 3px rgba(56,88,233,0.1);
}
.wps-edd-checkout #edd_login_fields input[type="submit"],
.wps-edd-checkout #edd_login_fields .edd-submit {
  display: inline-block;
  padding: 0.6rem 1.5rem;
  background: var(--mapb-btn-primary-bg, #1a56db);
  color: #fff;
  border: none;
  font-family: var(--mapb-font-body,'Roboto',sans-serif);
  font-size: 0.875rem;
  font-weight: 700;
  cursor: pointer;
  border-radius: 0;
}
.wps-edd-checkout #edd_login_fields input[type="submit"]:hover { opacity: 0.88; }
#edd-new-account-wrap,
#edd-login-account-wrap { display: none; }

/* Stap-2 kaart: gecreëerd door JS als #wps-co-step2 */
.wps-edd-checkout #wps-co-step2 {
  background: #fff;
  border: 1px solid var(--mapb-border, #e5e7eb);
  overflow: hidden;
  padding: 0 1.375rem 1.5rem;
  margin: 0 0 1.25rem;
}

/* Voornaam + achternaam naast elkaar via CSS grid op de fieldset */
.wps-edd-checkout #edd_checkout_user_info {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem 1rem;
}
.wps-edd-checkout #edd-email-wrap { grid-column: 1 / -1; }
@media (max-width: 480px) {
  .wps-edd-checkout #edd_checkout_user_info { grid-template-columns: 1fr; }
  .wps-edd-checkout #edd-email-wrap { grid-column: auto; }
}

/* Invoervelden */
.wps-edd-checkout .edd-input,
.wps-edd-checkout .edd_form input[type="text"],
.wps-edd-checkout .edd_form input[type="email"],
.wps-edd-checkout .edd_form input[type="tel"],
.wps-edd-checkout .edd_form select {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 0.6rem 0.875rem;
  border: 1px solid var(--mapb-border, #e5e7eb);
  background: #fff;
  font-family: var(--mapb-font-body,'Roboto',sans-serif);
  font-size: 0.95rem;
  color: #6b7280;
  outline: none;
  -webkit-appearance: none;
  border-radius: 0;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.wps-edd-checkout .edd-input:focus,
.wps-edd-checkout .edd_form input:focus,
.wps-edd-checkout .edd_form select:focus {
  border-color: var(--mapb-primary, #3858e9);
  box-shadow: 0 0 0 3px rgba(56,88,233,0.1);
}
.wps-edd-checkout #edd_purchase_form input.edd-input:focus::placeholder { color: transparent; }

/* ─── Betaalmethode tabs ──────────────────────────────────────────────── */
.wps-edd-checkout #edd_payment_mode_select { margin-bottom: 2rem; }
.wps-edd-checkout #edd_payment_mode_select ul,
.wps-edd-checkout #edd_payment_mode_select .edd-payment-icons {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.wps-edd-checkout #edd_payment_mode_select li { margin: 0; }
.wps-edd-checkout #edd_payment_mode_select label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.6rem 1.25rem;
  border: 2px solid var(--mapb-border, #e5e7eb);
  cursor: pointer;
  font-weight: 500;
  font-size: 0.9rem;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
  background: #fff;
}
.wps-edd-checkout #edd_payment_mode_select label:hover { border-color: var(--mapb-primary,#3858e9); }
.wps-edd-checkout #edd_payment_mode_select input[type="radio"] { display: none; }
.wps-edd-checkout #edd_payment_mode_select label:has(input:checked) {
  border-color: var(--mapb-primary, #3858e9);
  color: var(--mapb-primary, #3858e9);
  background: var(--mapb-bg-light, #f1f5f9);
}

/* ─── Kortingscodeveld ────────────────────────────────────────────────── */
.wps-edd-checkout #edd_discount_code { display: flex; gap: 0.5rem; margin-bottom: 1.5rem; align-items: flex-end; }
.wps-edd-checkout #edd_discount_code label { display: none; }
.wps-edd-checkout #edd-discount-code { flex: 1; }
.wps-edd-checkout #edd-apply-discount {
  padding: 0.6rem 1.125rem;
  background: var(--mapb-bg-light, #f1f5f9);
  border: 1px solid var(--mapb-border, #e5e7eb);
  font-weight: 600;
  font-size: 0.875rem;
  cursor: pointer;
  font-family: var(--mapb-font-body,'Roboto',sans-serif);
  white-space: nowrap;
  border-radius: 0;
}
.wps-edd-checkout #edd-apply-discount:hover { background: #e2e8f0; }

/* ─── Afrekenknop ─────────────────────────────────────────────────────── */
.wps-edd-checkout #edd_purchase_submit { margin-top: 0.5rem; }
.wps-edd-checkout #edd_purchase_submit .edd-submit,
.wps-edd-checkout #edd_purchase_submit input[type="submit"] {
  display: block;
  width: 100%;
  padding: 1rem 2rem;
  background: var(--mapb-btn-primary-bg, #1a56db);
  color: var(--mapb-btn-primary-text, #fff);
  border: none;
  font-family: var(--mapb-font-heading,'Poppins',sans-serif);
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.025em;
  cursor: pointer;
  text-align: center;
  transition: background 0.2s;
  border-radius: 0;
  -webkit-appearance: none;
}
.wps-edd-checkout #edd_purchase_submit .edd-submit:hover,
.wps-edd-checkout #edd_purchase_submit input[type="submit"]:hover { background: var(--mapb-primary,#3858e9); }
.wps-edd-checkout #edd_purchase_submit .edd-submit:disabled { opacity: 0.6; cursor: wait; }
.wps-edd-checkout #edd_purchase_submit p {
  font-size: 0.775rem;
  color: #94a3b8;
  margin: 0.75rem 0 0;
  line-height: 1.5;
}

/* ─── Fout- en succesmeldingen ────────────────────────────────────────── */
.wps-edd-checkout .edd_errors,
.wps-edd-checkout .edd-alert-error {
  background: #fef2f2;
  border-left: 3px solid #ef4444;
  padding: 0.875rem 1rem;
  margin-bottom: 1.25rem;
  font-size: 0.9rem;
  color: #7f1d1d;
  list-style: none;
}
.wps-edd-checkout .edd-alert-success {
  background: #f0fdf4;
  border-left: 3px solid #22c55e;
  padding: 0.875rem 1rem;
  color: #14532d;
}

/* ─── Trust-balk onderaan ─────────────────────────────────────────────── */
.wps-co-trust-bar {
  background: var(--mapb-bg-light, #f1f5f9);
  border-top: 1px solid var(--mapb-border, #e5e7eb);
  padding: 1.5rem 0;
}
.wps-co-trust {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.25rem 2.5rem;
}
.wps-co-trust li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #4b5563;
}
.wps-co-trust li i { color: var(--mapb-primary, #3858e9); }

/* ─── Responsief: stack op tablet/mobiel ──────────────────────────────── */
@media (max-width: 860px) {
  .wps-edd-checkout #edd_checkout_wrap {
    grid-template-columns: 1fr;
    grid-template-areas: "cart" "form";
  }
  .wps-edd-checkout #edd_checkout_cart { position: static; }
  .wps-edd-checkout #edd_checkout_form_wrap { padding: 0; }
}
@media (max-width: 580px) {
  .wps-co-main { padding: 1.5rem 0 2rem; }
}

/* ─── EDD Checkout stappen — override met hogere specificiteit ─────────── */
.wps-edd-checkout .wps-cstep { display: flex; align-items: center; gap: 0.5rem; }
.wps-edd-checkout .wps-cstep__dot {
  width: 1.875rem; height: 1.875rem;
  border-radius: 50% !important;
  border: 2px solid #cbd5e1;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.8rem; font-weight: 700; flex-shrink: 0;
  background-color: transparent;
  color: #94a3b8;
  line-height: 1;
}
.wps-edd-checkout .wps-cstep--done .wps-cstep__dot {
  background-color: #22c55e !important;
  border-color: #22c55e !important;
  color: #fff !important;
}
.wps-edd-checkout .wps-cstep--active .wps-cstep__dot {
  background-color: var(--mapb-primary, #3858e9) !important;
  border-color: var(--mapb-primary, #3858e9) !important;
  color: #fff !important;
}
.wps-edd-checkout .wps-cstep--done  { color: #22c55e; }
.wps-edd-checkout .wps-cstep--active { color: var(--mapb-primary, #3858e9); font-weight: 600; }

/* ─── EDD Checkout: witte achtergrond voor hero + steps, minder ruimte ── */
/* checkout hero gebruikt standaard .wps-account-hero padding */
.wps-edd-checkout .wps-account-tabs {
  margin-bottom: 1.5rem;
}
.wps-edd-checkout .wps-ctab { cursor: default; pointer-events: none; }
.wps-edd-checkout .wps-ctab.wps-tab--active { pointer-events: none; }
.wps-edd-checkout .wps-co-wrap { padding-bottom: 0; }

/* EDD cart: force flex op item-rijen (ook na AJAX, als JS niet snel genoeg is) */
.wps-edd-checkout #edd_checkout_cart tr.edd_cart_item { display: flex !important; align-items: center !important; }
.wps-edd-checkout #edd_checkout_cart tr.edd_cart_item td.edd_cart_item_name  { flex: 1 !important; min-width: 0 !important; }
.wps-edd-checkout #edd_checkout_cart tr.edd_cart_item td.edd_cart_item_price { flex-shrink: 0 !important; }
.wps-edd-checkout #edd_checkout_cart tr.edd_cart_item td.edd_cart_actions    { flex-shrink: 0 !important; }

/* =========================================================
   EDD Bevestiging & Ontvangstbewijs
   ========================================================= */
.wps-edd-receipt-wrap {
  max-width: 640px;
  margin: 0 auto;
}

/* Bedankt-tekst boven de bevestiging */
.wps-edd-receipt-wrap > p:first-child {
  font-size: 1rem;
  color: #22c55e;
  font-weight: 600;
  margin-bottom: 1.25rem;
}

/* Hoofd receipt container */
.wps-edd-receipt-wrap .edd_receipt,
.wps-edd-receipt-wrap .wp-block-edd-confirmation,
.wps-edd-receipt-wrap .wp-block-edd-receipt {
  background: #fff;
  border: 1px solid var(--mapb-border, #e5e7eb);
  border-radius: 0;
  padding: 0;
  margin-bottom: 1.5rem;
}

/* Receipt tabel — detail-rijen (Bestelnummer, Status, etc.) */
.wps-edd-receipt-wrap table.edd_purchase_receipt_products,
.wps-edd-receipt-wrap .edd_receipt table,
.wps-edd-receipt-wrap .edd-table {
  width: 100%;
  border-collapse: collapse;
}

/* Rijen in het receipt */
.wps-edd-receipt-wrap .edd_receipt tr,
.wps-edd-receipt-wrap .edd-table tr {
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
}
.wps-edd-receipt-wrap .edd_receipt tr:last-child,
.wps-edd-receipt-wrap .edd-table tr:last-child {
  border-bottom: 0;
}
.wps-edd-receipt-wrap .edd_receipt td,
.wps-edd-receipt-wrap .edd_receipt th,
.wps-edd-receipt-wrap .edd-table td,
.wps-edd-receipt-wrap .edd-table th {
  padding: 0.75rem 1.375rem;
  font-size: 0.875rem;
  text-align: left;
  background: transparent;
  border: 0;
  vertical-align: middle;
}
.wps-edd-receipt-wrap .edd_receipt td:first-child,
.wps-edd-receipt-wrap .edd_receipt th:first-child,
.wps-edd-receipt-wrap .edd-table td:first-child,
.wps-edd-receipt-wrap .edd-table th:first-child {
  font-weight: 600;
  color: var(--mapb-color-heading, #0f172a);
  width: 40%;
}
.wps-edd-receipt-wrap .edd_receipt td:last-child,
.wps-edd-receipt-wrap .edd_receipt th:last-child,
.wps-edd-receipt-wrap .edd-table td:last-child,
.wps-edd-receipt-wrap .edd-table th:last-child {
  text-align: right;
  color: #374151;
}

/* Producten tabel */
.wps-edd-receipt-wrap table.edd_purchase_receipt_products th {
  background: var(--mapb-bg-light, #f1f5f9);
  font-weight: 700;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #6b7280;
}
.wps-edd-receipt-wrap table.edd_purchase_receipt_products td {
  font-size: 0.875rem;
}

/* Producten sectie h3 */
.wps-edd-receipt-wrap h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--mapb-color-heading, #0f172a);
  margin: 1.5rem 0 0.75rem;
}

/* License Keys label */
.wps-edd-receipt-wrap .edd_license_key {
  font-family: monospace;
  font-size: 0.8rem;
  background: var(--mapb-bg-light, #f1f5f9);
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  word-break: break-all;
}

/* View Invoice link */
.wps-edd-receipt-wrap a[href*="invoice"],
.wps-edd-receipt-wrap .edd-invoice-link {
  color: var(--mapb-primary, #3858e9);
  font-weight: 600;
  text-decoration: none;
}
.wps-edd-receipt-wrap a[href*="invoice"]:hover,
.wps-edd-receipt-wrap .edd-invoice-link:hover {
  text-decoration: underline;
}

/* ═══════════════════════════════════════════
   Cookie consent banner + instellingenpaneel
═══════════════════════════════════════════ */
#wps-cookie-banner {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 99999;
  background: #fff; border-top: 1.5px solid var(--border);
  box-shadow: 0 -4px 24px rgba(0,0,0,.08);
  padding: 1.25rem 1.5rem;
  transition: transform .3s ease, opacity .3s ease;
}
#wps-cookie-banner[aria-hidden="true"]  { transform: translateY(110%); opacity: 0; pointer-events: none; }
#wps-cookie-banner[aria-hidden="false"] { transform: translateY(0);    opacity: 1; }

.wps-cookie-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; gap: 2rem; flex-wrap: wrap;
}
.wps-cookie-text { flex: 1; min-width: 240px; }
.wps-cookie-text strong { display: block; font-weight: 700; margin-bottom: .3rem; color: var(--text); }
.wps-cookie-text p  { font-size: .875rem; color: var(--muted); margin: 0; line-height: 1.5; }
.wps-cookie-text a  { color: var(--accent); text-decoration: underline; }
.wps-cookie-actions { display: flex; gap: .625rem; flex-wrap: wrap; align-items: center; }

.wps-cookie-btn-primary {
  background: var(--accent); color: #fff;
  border: none;
  padding: .6rem 1.25rem; font-size: .875rem; font-weight: 700;
  cursor: pointer; white-space: nowrap; transition: opacity .15s;
  font-family: inherit;
}
.wps-cookie-btn-primary:hover { opacity: .88; }
.wps-cookie-btn-ghost {
  background: transparent; color: var(--text);
  border: 1.5px solid var(--border);
  padding: .575rem 1.125rem; font-size: .875rem; font-weight: 600;
  cursor: pointer; white-space: nowrap; transition: border-color .15s;
  font-family: inherit;
}
.wps-cookie-btn-ghost:hover { border-color: var(--text); }

#wps-cookie-settings {
  position: fixed; inset: 0; z-index: 100000;
  background: var(--wps-overlay-bg);
  backdrop-filter: blur(var(--wps-overlay-blur));
  -webkit-backdrop-filter: blur(var(--wps-overlay-blur));
  display: flex; align-items: center; justify-content: center;
  padding: 1rem;
  transition: opacity .25s ease;
}
#wps-cookie-settings[aria-hidden="true"]  { opacity: 0; pointer-events: none; }
#wps-cookie-settings[aria-hidden="false"] { opacity: 1; }

.wps-settings-box {
  background: #fff;
  width: 100%; max-width: 520px;
  padding: 2rem; box-shadow: 0 8px 40px rgba(0,0,0,.16);
  max-height: 90vh; overflow-y: auto;
}
.wps-settings-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: .75rem;
}
.wps-settings-head h2 { font-size: 1.25rem; font-weight: 800; margin: 0; }
.wps-settings-close {
  background: none; border: none; cursor: pointer; padding: .25rem;
  color: var(--muted); line-height: 1;
}
.wps-settings-close svg { width: 20px; height: 20px; display: block; }
.wps-settings-close:hover { color: var(--text); }
.wps-settings-intro { font-size: .875rem; color: var(--muted); margin: 0 0 1.5rem; line-height: 1.6; }

.wps-cookie-cats { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
.wps-cookie-cat {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1rem 0; border-bottom: 1px solid var(--border);
}
.wps-cookie-cat:last-child { border-bottom: none; }
.wps-cat-info { flex: 1; }
.wps-cat-info strong { display: block; font-size: .9rem; font-weight: 700; margin-bottom: .2rem; color: var(--text); }
.wps-cat-info span   { font-size: .8rem; color: var(--muted); line-height: 1.5; }

.wps-toggle.always-on { font-size: .75rem; color: var(--accent); font-weight: 600; white-space: nowrap; }
.wps-toggle-wrap input:disabled ~ .wps-toggle-track { background: var(--accent); opacity: 0.6; }
.wps-toggle-wrap input:disabled ~ .wps-toggle-track .wps-toggle-thumb { transform: translateX(20px); }
.wps-toggle-wrap:has(input:disabled) { cursor: not-allowed; }

.wps-toggle-wrap { display: flex; align-items: center; cursor: pointer; flex-shrink: 0; }
.wps-toggle-wrap input { position: absolute; opacity: 0; width: 0; height: 0; }
.wps-toggle-track {
  width: 44px; height: 24px; border-radius: 999px;
  background: var(--border); transition: background .2s;
  position: relative; display: block;
}
.wps-toggle-thumb {
  position: absolute; top: 3px; left: 3px;
  width: 15px; height: 15px; border-radius: 50%;
  background: #fff; transition: transform .2s;
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.wps-toggle-wrap input:checked ~ .wps-toggle-track { background: var(--accent); }
.wps-toggle-wrap input:checked ~ .wps-toggle-track .wps-toggle-thumb { transform: translateX(20px); }

.wps-settings-footer {
  display: flex; gap: .625rem; justify-content: flex-end;
  margin-top: 1.5rem; padding-top: 1.25rem;
  border-top: 1px solid var(--border);
}


.wps-footer__bottom .wrap { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; }
.wps-footer__bottom .wrap p { margin: 0; }
@media (max-width: 768px) {
  .wps-footer__bottom .wrap { flex-direction: column; justify-content: center; text-align: center; }
}

@media (max-width: 600px) {
  .wps-cookie-inner   { gap: 1rem; }
  .wps-cookie-actions { width: 100%; justify-content: flex-end; }
  .wps-settings-box   { padding: 1.5rem; }
}

/* ─── Checkout: betaalmethode sectie header ───────────────────────────── */
.wps-payment-section-header {
  border-top: 1px solid var(--mapb-border, #e5e7eb);
  margin-top: 1.5rem;
  padding-top: 1.5rem;
}
.wps-payment-section-header h2 {
  font-family: var(--mapb-font-heading,'Poppins',sans-serif);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--mapb-color-heading, #0f172a);
  margin: 0 0 1.25rem;
}

/* Factuurgegevens sectie compacter maken */
.wps-edd-checkout #edd_checkout_address fieldset legend {
  font-size: 1rem;
  font-weight: 700;
  color: var(--mapb-color-heading, #0f172a);
  margin-bottom: 0.75rem;
}

/* ─── Ontvangstbewijs: Mijn account knop ─────────────────────────────────── */
.wps-receipt-account-btn {
  margin-top: 1.5rem;
  text-align: center;
}

/* ─── MAPB table scroll wrapper ────────────────────────────────────────────── */
.mapb-table-scroll { border-radius: 0 !important; }

/* ─── MAPB wysiwyg tabel (homepage vergelijking) ─────────────────────────── */
.mapb-wysiwyg table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
  border: 1px solid var(--border);
  border-radius: 0 !important;
  overflow: visible;
}
.mapb-wysiwyg table thead th {
  font-size: 12px !important;
  font-weight: 700;
  color: var(--mapb-primary, var(--accent));
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 0.75rem 1rem;
  background: var(--mapb-bg-light, #f9fafb) !important;
  color: var(--mapb-primary, var(--accent)) !important;
  border-bottom: 1px solid var(--border);
  border-right: 1px solid var(--border);
  text-align: center;
  border-radius: 0 !important;
}
.mapb-wysiwyg table thead th:first-child { text-align: left; }
.mapb-wysiwyg table thead th:nth-child(2) { background: var(--mapb-primary, var(--accent)) !important; color: #fff !important; border-top: 2px solid var(--mapb-primary, var(--accent)) !important; border-left: 2px solid var(--mapb-primary, var(--accent)) !important; border-right: 2px solid var(--mapb-primary, var(--accent)) !important; }
.mapb-wysiwyg table thead th:last-child { border-right: none; }
.mapb-wysiwyg table tbody td {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--border);
  border-right: 1px solid var(--border);
  text-align: center;
  color: var(--text);
  vertical-align: middle;
  border-radius: 0 !important;
}
.mapb-wysiwyg table tbody td:first-child { text-align: left; }
.mapb-wysiwyg table tbody td:last-child { border-right: none; }
.mapb-wysiwyg table tbody tr:last-child td { border-bottom: none; }
.mapb-wysiwyg table tbody tr:nth-child(even) td { background: var(--mapb-bg-light, #f9fafb) !important; }
/* Override MAPB plugin: geen vaste bg/border op featured kolom */
.mapb-block table:not(.mapb-compare-table) tbody td:nth-child(2) {
  background: transparent !important;
  border-left: 2px solid var(--mapb-primary, var(--accent)) !important;
  border-right: 2px solid var(--mapb-primary, var(--accent)) !important;
  font-weight: 400;
}
.mapb-block table:not(.mapb-compare-table) tbody tr:last-child td:nth-child(2) {
  border-bottom: 2px solid var(--mapb-primary, var(--accent)) !important;
}
.mapb-block table:not(.mapb-compare-table) tbody td:nth-child(2):last-child {
  border-right: none !important;
}
.mapb-block table:not(.mapb-compare-table) tbody tr:nth-child(even) td:nth-child(2) {
  background: var(--mapb-bg-light, #f9fafb) !important;
}
@media (max-width: 680px) {
  .mapb-wysiwyg { overflow-x: auto; }
  .mapb-wysiwyg table { min-width: 540px; }
}

/* Vergelijkingstabel icons */
.wps-cmp-yes,
.wps-cmp-no,
.wps-cmp-unk {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* Groen cirkel-vinkje (WP Strippenkaart, kolom 2) via SVG data URI */
.wps-cmp-yes::before {
  content: '';
  display: inline-block;
  width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10' cy='10' r='10' fill='%23dcfce7'/%3E%3Cpolyline points='5,10 8.5,13.5 15,6.5' fill='none' stroke='%2315803d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
}

/* Grijs cirkel-vinkje voor concurrentkolommen */
.mapb-wysiwyg table tbody td:not(:nth-child(2)) .wps-cmp-yes::before {
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='10' cy='10' r='10' fill='%23f3f4f6'/%3E%3Cpolyline points='5,10 8.5,13.5 15,6.5' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Blauwe dash voor "niet beschikbaar" */
.wps-cmp-no::before {
  content: '\2014';
  color: var(--mapb-primary, #1a56db);
  font-size: 1.1rem;
  font-weight: 700;
}

/* Vraagteken onbekend */
.wps-cmp-unk {
  color: #9ca3af;
  font-size: 1rem;
}

/* ── Gutenberg tabellen: zelfde opmaak als vergelijkingstabel ── */
.prose .wp-block-table { margin: 1.5rem 0; }
.prose .wp-block-table figure { margin: 0; overflow-x: auto; border: 1px solid var(--border); border-radius: 0.5rem; }
.prose .wp-block-table table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
  min-width: 480px;
}
.prose .wp-block-table table,
.prose .wp-block-table thead,
.prose .wp-block-table tbody,
.prose .wp-block-table tfoot,
.prose .wp-block-table tr,
.prose .wp-block-table th,
.prose .wp-block-table td { border: none !important; }
.prose .wp-block-table thead th {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: var(--mapb-primary, var(--accent)) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  padding: 0.75rem 1rem !important;
  background: var(--mapb-bg-light, #f9fafb) !important;
  border-bottom: 1px solid var(--border) !important;
  border-right: 1px solid rgba(220,228,238,0.35) !important;
  text-align: left !important;
  vertical-align: top !important;
}
.prose .wp-block-table thead th:last-child { border-right: none !important; }
.prose .wp-block-table tbody td {
  padding: 0.75rem 1rem !important;
  border-bottom: 1px solid var(--border) !important;
  border-right: 1px solid rgba(220,228,238,0.35) !important;
  text-align: left !important;
  color: var(--text) !important;
  vertical-align: top !important;
}
.prose .wp-block-table tbody td:first-child { font-weight: 600 !important; }
.prose .wp-block-table tbody td:last-child { border-right: none; }
.prose .wp-block-table tbody tr:last-child td { border-bottom: none !important; }
.prose .wp-block-table tbody tr:nth-child(even) td { background: var(--mapb-bg-light, #f9fafb); }

/* ── Gutenberg callout/alert groepen: padding voor bestaande artikelen ── */
.prose .wp-block-group[style*="background-color"] {
  padding: 1.25rem 1.5rem;
  border-radius: 0.5rem;
}
.prose .wp-block-group[style*="background-color"] p { margin-bottom: 0; }

/* ── Gutenberg buttons: zelfde stijl als .btn.primary ── */
.wp-block-button__link {
  border-radius: 0 !important;
  font-family: var(--mapb-font-body, 'Outfit', sans-serif) !important;
  font-weight: 700 !important;
  font-size: 0.8rem !important;
  padding: 0.5rem 1.125rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: opacity 0.2s !important;
  text-decoration: none !important;
  background: var(--mapb-btn-primary-bg, var(--accent)) !important;
  color: #fff !important;
}
.wp-block-button__link:hover { opacity: 0.88 !important; }
/* Knop in blogartikelen: oranje, zoals "Direct starten" in de header */
body.single-post .wp-block-button__link { background: var(--mapb-btn-secondary-bg, #e8722a) !important; }

/* ── FAQ in gegenereerde artikelen (wp:html blokken) ── */
.faq-section { margin: 1.5rem 0; }
.faq-section .faq-item { border-bottom: 1px solid var(--border); }
.faq-section .faq-q { width: 100%; background: none; border: none; cursor: pointer; text-align: left; padding: 1rem 0; display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-size: 0.95rem; font-weight: 700; color: var(--text); }
.faq-section .faq-q::after { content: '+'; font-size: 1.25rem; color: var(--muted); flex-shrink: 0; transition: transform 0.2s; }
.faq-section .faq-item.open .faq-q::after { transform: rotate(45deg); }
.faq-section .faq-a { display: none; padding-bottom: 1rem; }
.faq-section .faq-a p { font-size: 0.9rem; margin: 0; }
.faq-section .faq-item.open .faq-a { display: block; }

/* ── FAQ card-stijl op single posts ── */
body.single-post .prose .faq-list,
body.single-post .prose .wp-block-html:has(.faq-item) {
  background: var(--bg-alt, #f1f5f9);
  padding: 1rem;
}
body.single-post .prose .faq-item,
body.single-post .prose .faq-list .faq-item {
  border-bottom: none;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 0;
  margin-bottom: 6px;
}
body.single-post .prose .faq-list .faq-item:last-child { margin-bottom: 0; }
body.single-post .prose .faq-q { padding: 1.1rem 1.25rem; }
body.single-post .prose .faq-a { padding: 0 1.25rem 1.1rem; }

/* ── TOC tekst kleiner op mobile ── */
@media (max-width: 768px) {
  .toc nav a { font-size: 0.9rem; }
}

/* ── CTA sectie: button altijd oranje ── */
.mapb-bg--primary .btn.primary { background: #e8722a !important; border-color: #e8722a !important; color: #fff !important; }
.mapb-bg--primary .btn.primary:hover { background: #d4651e !important; border-color: #d4651e !important; }

/* ── Lees meer: pijl schuift op bij hover ── */
a.read span,
.mapb-blog-card__readmore span { display: inline-block; transition: transform 0.2s ease; }
.blog-card:hover a.read span,
a.read:hover span,
.mapb-blog-card:hover .mapb-blog-card__readmore span,
.mapb-blog-card__readmore:hover span { transform: translateX(4px); }
@media (prefers-reduced-motion: reduce) {
  a.read span, .mapb-blog-card__readmore span { transition: none; }
}

/* ── CTA sectie op blog en single: ruimte tussen tekst en knop ── */
.wps-blog-cta .mapb-cta__inner { gap: 1.5rem; }
.wps-blog-cta .mapb-cta__text { margin-bottom: 0 !important; }

/* Kleinere headings in wysiwyg tekst-blokken */
.mapb-wysiwyg h2 { font-size: clamp(1.05rem, 2.5vw, 1.35rem); font-weight: 700; letter-spacing: -0.01em; margin-top: 2rem; margin-bottom: 0.6rem; }
.mapb-wysiwyg h3 { font-size: 1rem; font-weight: 700; margin-top: 1.5rem; margin-bottom: 0.5rem; }


/* ─── Multi-stap checkout ─────────────────────────────────────────────── */
#wps-co-next {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background: var(--mapb-primary, #3858e9);
  color: #fff;
  font-size: 0.9375rem;
  font-weight: 600;
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: background 0.15s;
  margin-top: 1.5rem;
}
#wps-co-next:hover { background: #2d47c7; }
#wps-co-next svg { flex-shrink: 0; }
.wps-co-next-row { text-align: right; }


/* ==========================================================================
   Bas Martens — 6 oktober 2026
   Checkout visual redesign: kaarten, abonnementsinformatie, groene block
   ========================================================================== */

/* ── 1. Formulier-kaart: border-radius ─────────────────────────────────── */
.wps-edd-checkout #edd_checkout_form_wrap {
}

/* ── 2. Cart-kaart: verplaats van table naar #edd_checkout_cart_wrap ─────── */
/* Override: wis card-stijling van de TABLE zelf */
.wps-edd-checkout #edd_checkout_cart {
  background: transparent !important;
  border: none !important;
  position: static !important;
}
.wps-edd-checkout #edd_checkout_cart::before {
  content: none !important;
}

/* Nieuw: card op de wrap-container (bevat table + extra blokken) */
.wps-edd-checkout #edd_checkout_cart_wrap {
  background: #fff;
  border: 1px solid var(--mapb-border, #e5e7eb);
  overflow: hidden;
  position: sticky;
  top: 5.5rem;
}

/* ── 3. Cart-header: Jouw bestelling + Wijzig link ──────────────────────── */
.wps-co-cart-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.125rem 1.375rem 0.875rem;
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
}
.wps-co-cart-header strong {
  font-family: var(--mapb-font-heading, 'Poppins', sans-serif);
  font-weight: 700;
  font-size: 1rem;
  color: var(--mapb-color-heading, #0f172a);
}
.wps-co-cart-header a.wps-co-wijzig {
  font-size: 0.8125rem;
  color: var(--mapb-primary, #3858e9);
  text-decoration: none;
  font-weight: 500;
}
.wps-co-cart-header a.wps-co-wijzig:hover {
  text-decoration: underline;
}

/* ── 4. Blauw abonnementsinformatieblok ─────────────────────────────────── */
.wps-co-recurring-info {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  background: var(--mapb-bg-light, #f1f5f9);
  border-top: 1px solid var(--mapb-border, #e5e7eb);
  padding: 0.875rem 1.375rem;
}
.wps-co-recurring-info strong {
  display: block;
  font-size: 0.8125rem;
  font-weight: 700;
  color: #1e40af;
  margin-bottom: 0.25rem;
}
.wps-co-recurring-info p {
  font-size: 0.7875rem;
  color: #1e40af;
  margin: 0;
  line-height: 1.5;
}
.wps-co-recurring-icon {
  font-size: 1.125rem;
  color: #2563eb;
  flex-shrink: 0;
  line-height: 1.2;
}

/* ── 5. Volgende verlenging rij ─────────────────────────────────────────── */
.wps-co-renewal-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.6875rem 1.375rem;
  border-top: 1px solid var(--mapb-border, #e5e7eb);
  font-size: 0.8125rem;
  color: #374151;
}
.wps-co-renewal-row span:last-child {
  font-weight: 600;
  color: var(--mapb-color-heading, #0f172a);
}

/* ── 6. Groen bevestigingsblok ──────────────────────────────────────────── */
.wps-co-confirm-block {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  background: #f0fdf4;
  border-top: 1px solid var(--mapb-border, #e5e7eb);
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
  padding: 0.875rem 1.375rem;
}
.wps-co-confirm-block strong {
  display: block;
  font-size: 0.8125rem;
  font-weight: 700;
  color: #15803d;
  margin-bottom: 0.25rem;
}
.wps-co-confirm-block p {
  font-size: 0.7875rem;
  color: #166534;
  margin: 0;
  line-height: 1.5;
}
.wps-co-confirm-icon {
  color: #16a34a;
  font-size: 1rem;
  flex-shrink: 0;
  line-height: 1.3;
}

/* ── 7. Veilige betaling tekst ──────────────────────────────────────────── */
.wps-co-secure-note {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  justify-content: center;
  padding: 0.75rem 1.375rem;
  font-size: 0.78rem;
  color: #6b7280;
  border-top: 1px solid var(--mapb-border, #e5e7eb);
}
.wps-co-secure-note svg {
  flex-shrink: 0;
  color: #9ca3af;
}

/* ── Cart submit button boven secure note ───────────────────────────────── */
.wps-co-cart-submit-wrap {
  display: flex;
  justify-content: center;
  padding: 1.125rem 1.375rem;
}
.wps-co-cart-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: auto;
  margin: 0;
  padding: 0.875rem 2rem;
  background: var(--mapb-btn-secondary-bg, #e8722a);
  color: #fff;
  font-family: var(--mapb-font-body, 'Outfit', sans-serif);
  font-size: 0.9rem;
  font-weight: 700;
  text-align: center;
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: opacity 0.15s;
}
.wps-co-cart-submit:hover { opacity: 0.88; }

/* ── 8. Login-link naast Accountgegevens ────────────────────────────────── */
/* Login-link in sectieheader — rechts uitgelijnd zoals Wijzig-knop */
.wps-co-login-link {
  margin-left: auto;
  background: none;
  border: 1px solid var(--mapb-border, #e5e7eb);
  padding: 0.25rem 0.75rem;
  font-size: 0.8125rem;
  color: #374151;
  text-decoration: none;
  font-weight: 400;
  line-height: 1.5;
  white-space: nowrap;
  cursor: pointer;
}
.wps-co-login-link:hover { background: #f9fafb; }

/* BTW-knop: opvallende stijl */
.wps-co-btw-btn {
  background: var(--mapb-primary, #3858e9) !important;
  border-color: var(--mapb-primary, #3858e9) !important;
  color: #fff !important;
  font-weight: 500;
}
.wps-co-btw-btn:hover {
  background: #2d47c7 !important;
  border-color: #2d47c7 !important;
  color: #fff !important;
}

/* Verberg login-link via CSS als loginpaneel open staat (fallback naast JS) */
.wps-edd-checkout #edd_checkout_login_register[style*="display: block"] ~ #edd_checkout_user_info .wps-co-login-link,
.wps-edd-checkout #edd_checkout_login_register[style*="display:block"] ~ #edd_checkout_user_info .wps-co-login-link { display: none !important; }

.wps-co-cancel-link {
  display: inline-block;
  margin-left: 1rem;
  padding: 0.6rem 1.25rem;
  background: none;
  border: 1px solid var(--mapb-border, #e5e7eb);
  font-size: 0.875rem;
  font-weight: 400;
  color: #374151;
  text-decoration: none;
  line-height: 1.5;
  vertical-align: middle;
  cursor: pointer;
}
.wps-co-cancel-link:hover { background: #f9fafb; }

/* ── 9. Responsief: kaartbreedte op tablet ──────────────────────────────── */
@media (max-width: 860px) {
  .wps-edd-checkout #edd_checkout_cart_wrap {
    position: static;
  }
}

/* ── Cart: periode als subtitel onder productnaam (via JS gesplitst) ─── */
.wps-cart-item-period {
  display: block;
  font-size: 0.8rem;
  font-weight: 500;
  color: #6b7280;
  margin-top: 0.125rem;
}

/* ── 10. Verberg verwijder-knop in checkout cart ─────────────────────── */
.wps-edd-checkout .edd_cart_remove_item_btn { display: none !important; }

/* ── 11. Verberg originele EDD subtotaal/BTW/totaal tabelrijen ────────── */
/* (worden opnieuw getoond als netjes uitgelijnd blok via PHP hook) */
.wps-edd-checkout .edd_cart_footer_row { display: none !important; }

/* ── 12. Subtotaal / BTW / Totaal als links-rechts blok ─────────────── */
.wps-co-price-rows {
  border-top: 1px solid var(--mapb-border, #e5e7eb);
  padding: 0.5rem 1.375rem;
}
.wps-co-price-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.3rem 0;
  font-size: 0.875rem;
  color: #374151;
}
.wps-co-price-row--total {
  font-weight: 700;
  font-size: 0.9375rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--mapb-border, #e5e7eb);
  margin-top: 0.2rem;
}

/* ── 13. Bedragen bold in blauwe en groene blokken ──────────────────── */
.wps-co-recurring-info p strong,
.wps-co-confirm-block p strong {
  font-weight: 700;
}

/* ── 14. Bedragen in p-tags inline houden (overschrijft display:block van heading-strong) */
.wps-co-recurring-info p strong,
.wps-co-confirm-block p strong {
  display: inline;
  font-weight: 700;
}

/* ── 15. Totaal-bedrag boven de cart dezelfde blauwe kleur als productprijs */
.wps-edd-checkout #edd_checkout_cart .edd_cart_total .edd_cart_amount {
  color: var(--mapb-primary, #3858e9);
  font-weight: 700;
}

/* ── 16. Totaal-bedrag in wps-co-price-rows blauw ──────────────────── */
.wps-co-price-row--total span:last-child {
  color: var(--mapb-primary, #3858e9);
}

/* ── 17. Product thumbnail in checkout cart ─────────────────────────── */
.wps-cart-thumb {
  width: 44px;
  height: 44px;
  object-fit: cover;
  border-radius: 4px;
  flex-shrink: 0;
  display: block;
  margin-bottom: 0.5rem;
}
.wps-edd-checkout #edd_checkout_cart td.edd_checkout_cart_item_name {
  display: flex;
  flex-direction: column;
}


/* ═══════════════════════════════════════════════════════════════════════
   CHECKOUT CART — cart item opmaak (enige definitieve versie)
════════════════════════════════════════════════════════════════════════ */

/* Wijzig-knop in cart header */
.wps-co-cart-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.wps-co-wijzig {
    background: none;
    border: 1px solid var(--mapb-border, #e5e7eb);
    border-radius: 0;
    padding: 0.25rem 0.75rem;
    font-size: 0.8125rem;
    color: #374151;
    cursor: pointer;
    line-height: 1.5;
}
.wps-co-wijzig:hover { background: #f9fafb; }

/* Verwijder-knop: standaard verborgen, zichtbaar bij Wijzig-mode */
.wps-edd-checkout .edd_cart_remove_item_btn { display: none !important; }
#edd_checkout_cart_wrap.wps-co--wijzig-active .edd_cart_remove_item_btn {
    display: inline-flex !important;
}

/* Verwijder-knop styling */
.wps-edd-checkout #edd_checkout_cart .edd_cart_remove_item_btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.375rem;
    height: 1.375rem;
    border-radius: 50%;
    background: #ef4444;
    font-size: 0;
    text-decoration: none;
    transition: background 0.15s;
    flex-shrink: 0;
}
.wps-edd-checkout #edd_checkout_cart .edd_cart_remove_item_btn::after {
    content: "\00D7";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.875rem;
    color: #fff;
    line-height: 1;
    display: block;
}
.wps-edd-checkout #edd_checkout_cart .edd_cart_remove_item_btn:hover { background: #ef4444; opacity: 0.8; }
.wps-edd-checkout #edd_checkout_cart .edd_cart_remove_item_btn:hover::after { color: #fff; }

/* EDD footer-rijen verbergen (eigen rijen via PHP) */
.wps-edd-checkout .edd_cart_footer_row { display: none !important; }

/* Cart item: table-row, één td colspan 3 */
.wps-edd-checkout #edd_checkout_cart tr.edd_cart_item {
    display: table-row;
    padding: 0;
    border-bottom: none !important;
}
.wps-edd-checkout #edd_checkout_cart td.edd_cart_item_name {
    display: table-cell;
    padding: 0.75rem 1.375rem;
    border-bottom: none;
    vertical-align: middle;
    width: 100%;
}

/* Buitenste rij: afbeelding links, content rechts en verticaal gecentreerd */
.wps-edd-checkout #edd_checkout_cart .wps-ci-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

/* Afbeelding: vaste 56×56, vult container */
.wps-edd-checkout #edd_checkout_cart .wps-ci-row .edd_cart_item_image {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    overflow: hidden;
    border-radius: 0;
    display: block;
}
.wps-edd-checkout #edd_checkout_cart .wps-ci-row .edd_cart_item_image img {
    width: 56px !important;
    height: 56px !important;
    max-width: none !important;
    object-fit: cover;
    display: block;
}

/* Content: vult rest van de breedte */
.wps-edd-checkout #edd_checkout_cart .wps-ci-content {
    flex: 1;
    min-width: 0;
}

/* Top-rij: titel links (flex:1), prijs + × rechts */
.wps-edd-checkout #edd_checkout_cart .wps-ci-top {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}
.wps-edd-checkout #edd_checkout_cart .wps-ci-top .edd_checkout_cart_item_title {
    flex: 1;
    min-width: 0;
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--mapb-color-heading, #0f172a);
    line-height: 1.3;
}
.wps-edd-checkout #edd_checkout_cart .wps-ci-right {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-shrink: 0;
    margin-left: auto;
}
.wps-edd-checkout #edd_checkout_cart .wps-ci-price {
    font-weight: 700;
    color: var(--mapb-primary, #3858e9);
    white-space: nowrap;
    font-size: 0.9rem;
}

/* Periode-label onder de top-rij */
.wps-edd-checkout #edd_checkout_cart .wps-cart-item-period {
    display: block;
    font-size: 0.8rem;
    color: #94a3b8;
    margin-top: 0.1rem;
}

/* Adresvelden: 2-koloms grid */
.wps-edd-checkout #edd_cc_address {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem 1rem;
}
.wps-edd-checkout #edd_cc_address .wps-co-section-header { order: -10; }
.wps-edd-checkout #edd_cc_address #edd-card-country-wrap {
    grid-column: 1 / -1;
    order: -5;
}
/* Select: gestylede pijl */
.wps-edd-checkout #edd_purchase_form select,
.wps-edd-checkout .edd_form select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.875rem center;
    background-size: 1rem;
    padding-right: 2.75rem;
    cursor: pointer;
}
/* Checkbox-labels grijs */
.wps-edd-checkout #edd_purchase_form input[type="checkbox"] ~ label,
.wps-edd-checkout #edd_purchase_form .edd-label { color: #6b7280; }

/* EDD's originele VAT-elementen verbergen */
.wps-edd-checkout #edd-card-vat-wrap { display: none !important; }
.wps-edd-checkout #edd-vat-check-result { display: none !important; }
.wps-edd-checkout #wps-btw-panel #edd-vat-check-result { display: block !important; grid-column: 1 / -1; font-size: 0.8125rem; }

/* BTW-paneel velden */
.wps-edd-checkout .wps-btw-field label {
  display: block;
  font-weight: 600;
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.3rem;
}
.wps-edd-checkout .wps-btw-field .edd-input {
  display: block;
  width: 100%;
  box-sizing: border-box;
}

/* ═══════════════════════════════════════════════════════════════════════
   Stap 2 "Betaalgegevens" (9 oktober 2026)
   Keuze betaalmethode, USP's, rode afrekenknop, akkoordregel
═══════════════════════════════════════════════════════════════════════ */

/* Kop: tekst "Veilig en versleuteld afrekenen via Stripe" rechts */
.wps-edd-checkout #wps-co-step2 .wps-co-section-header { gap: 1rem; flex-wrap: wrap; }
.wps-edd-checkout .wps-co-header-note {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--mapb-font-body,'Roboto',sans-serif);
  font-size: 0.875rem;
  font-weight: 400;
  color: #6b7280;
}
.wps-edd-checkout .wps-co-header-note svg { color: #9ca3af; flex-shrink: 0; width: 14px; height: 14px; }

/* Oude SSL-regel van EDD is vervangen door de tekst in de kop */
.wps-edd-checkout #edd_secure_site_wrapper { display: none !important; }

/* Lijst met betaalmethodes */
.wps-edd-checkout #edd_cc_fields.wps-pm-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin: 1.5rem 0 0;
  padding: 0;
  border: 0;
}
.wps-edd-checkout .wps-pm-option {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  border: 1px solid var(--mapb-border, #e5e7eb);
  background: #fff;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.wps-edd-checkout .wps-pm-option:not(.wps-pm-option--active):hover { border-color: #a5b4fc; }
/* Uitgeklapt: witte kop met omlijnd pijltje naar het blok eronder */
.wps-edd-checkout .wps-pm-option--active {
  position: relative;
  z-index: 1;
  cursor: default;
  border-color: var(--mapb-border, #e5e7eb);
  background: #fff;
}
.wps-edd-checkout .wps-pm-option--active::after {
  content: '';
  position: absolute;
  left: calc(1.25rem + 3px);
  bottom: -8px;
  width: 14px;
  height: 14px;
  background: #fff;
  border-right: 1px solid var(--mapb-border, #e5e7eb);
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
  transform: rotate(45deg);
}
.wps-edd-checkout .wps-pm-option input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
.wps-edd-checkout .wps-pm-radio {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border: 2px solid #cbd5e1;
  border-radius: 50%;
  background: #fff;
  box-sizing: border-box;
  transition: border-color 0.15s;
}
.wps-edd-checkout .wps-pm-option--active .wps-pm-radio {
  border: 6px solid var(--mapb-primary, #3858e9);
}
.wps-edd-checkout .wps-pm-option input:focus-visible + .wps-pm-radio {
  outline: 2px solid var(--mapb-primary, #3858e9);
  outline-offset: 2px;
}
.wps-edd-checkout .wps-pm-icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  height: 36px;
}
.wps-edd-checkout .wps-pm-icon svg { width: auto; height: 36px; }
.wps-edd-checkout .wps-pm-cards { display: inline-flex; align-items: center; gap: 0.4rem; }
.wps-edd-checkout .wps-pm-cards svg { height: auto; }
.wps-edd-checkout .wps-pm-text { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }
.wps-edd-checkout .wps-pm-text strong {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--mapb-color-heading, #0f172a);
}
.wps-edd-checkout .wps-pm-text span { font-size: 0.85rem; color: #6b7280; }

/* Stripe-blok sluit aan onder de gekozen optie */
.wps-edd-checkout .wps-pm-list .edd-stripe-new-card {
  margin-top: -0.75rem;
  padding: 1rem 1.25rem 1.25rem;
  border: 1px solid var(--mapb-border, #e5e7eb);
  border-top: 0;
  background: var(--mapb-bg-light, #f1f5f9);
}
.wps-edd-checkout .wps-pm-list .edds-field-spacer-shim { display: none; }

/* USP's */
.wps-edd-checkout .wps-co-usps { margin: 1.75rem 0 1.5rem; }
.wps-edd-checkout .wps-co-usps__title {
  display: block;
  margin-bottom: 0.75rem;
  font-family: var(--mapb-font-heading,'Poppins',sans-serif);
  font-size: 1rem;
  font-weight: 700;
  color: var(--mapb-color-heading, #0f172a);
}
.wps-edd-checkout .wps-co-usps ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; }
.wps-edd-checkout .wps-co-usps li {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin: 0;
  font-size: 0.875rem;
  color: #374151;
}
.wps-edd-checkout .wps-co-usps__check {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #dcfce7;
}

/* Totaalbedrag onder de knop staat al in "Jouw bestelling" */
.wps-edd-checkout #edd_final_total_wrap { display: none; }

/* Oranje knoppen (afrekenen in stap 2, Volgende in stap 1): stijl van de vroegere knop in "Jouw bestelling" */
.wps-edd-checkout #edd_purchase_submit .wps-pay-btn,
.wps-edd-checkout #wps-co-next {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: auto;
  margin: 0;
  padding: 0.875rem 2rem;
  background: var(--mapb-btn-secondary-bg, #e8722a);
  color: #fff;
  font-family: var(--mapb-font-body, 'Outfit', sans-serif);
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: normal;
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: opacity 0.15s;
}
.wps-edd-checkout #edd_purchase_submit .wps-pay-btn:hover,
.wps-edd-checkout #wps-co-next:hover { background: var(--mapb-btn-secondary-bg, #e8722a); opacity: 0.88; }
.wps-edd-checkout #edd_purchase_submit .wps-pay-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.wps-edd-checkout #edd_purchase_submit .wps-pay-btn svg { flex-shrink: 0; }
.wps-edd-checkout #edd_purchase_submit:has(.wps-pay-btn) { text-align: left; }
.wps-edd-checkout .wps-co-next-row { text-align: center; margin-top: 1.5rem; }

/* Akkoordregel */
.wps-edd-checkout #edd_purchase_submit p.wps-co-legal {
  margin: 0.875rem 0 0;
  text-align: left;
  font-size: 0.8rem;
  color: #6b7280;
}
.wps-edd-checkout .wps-co-legal a { color: var(--mapb-primary, #3858e9); text-decoration: underline; }

@media (max-width: 480px) {
  .wps-edd-checkout .wps-co-header-note { margin-left: 0; width: 100%; }
  .wps-edd-checkout .wps-pm-option { gap: 0.75rem; padding: 0.875rem 1rem; }
  .wps-edd-checkout .wps-pm-icon { min-width: 40px; }
}

/* Drie vertrouwensiconen onderaan "Jouw bestelling" */
.wps-co-trust {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 1.25rem 0;
  border-top: 0;
  gap: 0; /* oude .wps-co-trust-regel (regel ~1896) zette gap 1.25rem 2.5rem */
  justify-content: normal;
}
.wps-co-trust__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  padding: 0 0.5rem;
  text-align: center;
  font-size: 0.8rem;
  line-height: 1.4;
  color: #6b7280;
}
.wps-co-trust__item + .wps-co-trust__item { border-left: 1px solid var(--mapb-border, #e5e7eb); }
.wps-co-trust__item svg { color: var(--mapb-primary, #3858e9); flex-shrink: 0; }

/* Zijkolom per stap: stap 1 knop + "Veilige betaling", stap 2 alleen de iconen */
body.wps-co-step-2 .wps-co-cart-submit-wrap,
body.wps-co-step-2 .wps-co-secure-note { display: none; }
body:not(.wps-co-step-2) .wps-co-trust { display: none; }
/* "Volgende" in stap 1 verborgen: de oranje knop in de zijkolom doet dit */
.wps-edd-checkout .wps-co-next-row { display: none !important; }

/* Koppen links (Accountgegevens, Factuurgegevens, Betaalgegevens) even hoog als "Jouw bestelling" */
.wps-edd-checkout .wps-co-section-header,
.wps-edd-checkout .wps-co-cart-header {
  box-sizing: border-box;
  min-height: 3.875rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  align-items: center;
}

/* Eigen machtigingstekst iDEAL/Bancontact (zelfde stijl als USP-tekst) */
.wps-edd-checkout .wps-pm-mandate { margin-top: 1rem; }
.wps-edd-checkout #edd_purchase_form .wps-pm-mandate p {
  margin: 0 0 1.4rem;
  font-size: 0.875rem;
  line-height: 1.6;
  color: #374151;
}
.wps-edd-checkout #edd_purchase_form .wps-pm-mandate p:last-child { margin-bottom: 0; }
.wps-edd-checkout .wps-pm-mandate strong { font-weight: 700; color: #374151; }

/* ═══════════════════════════════════════════════════════════════════════
   Bevestigingspagina: kaarten in dezelfde stijl als de afrekenstappen
═══════════════════════════════════════════════════════════════════════ */
.wps-edd-bevestiging .wps-edd-receipt-wrap { max-width: 760px; margin: 0 auto; }
.wps-edd-bevestiging .wps-edd-receipt-wrap > p:first-child { color: #15803d; margin: 0 0 1.25rem; }

/* Buitenste EDD-container geen kaart meer; elke sectie wordt een eigen kaart */
.wps-edd-bevestiging .wps-edd-receipt-wrap .wp-block-edd-receipt {
  background: transparent;
  border: 0;
  margin: 0;
}

/* Sectiekop (Bestelgegevens, Producten, Abonnement) */
.wps-edd-bevestiging .wps-edd-receipt-wrap h3 {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 3.875rem;
  margin: 1.25rem 0 0;
  padding: 0.5rem 1.375rem;
  background: #fff;
  border: 1px solid var(--mapb-border, #e5e7eb);
  font-family: var(--mapb-font-heading,'Poppins',sans-serif);
  font-size: 1rem;
  font-weight: 700;
  color: var(--mapb-color-heading, #0f172a);
}
.wps-edd-bevestiging .wps-edd-receipt-wrap .wp-block-edd-receipt > h3:first-child { margin-top: 0; }

/* Inhoud van de kaart direct onder de kop */
.wps-edd-bevestiging .edd-blocks-receipt__totals,
.wps-edd-bevestiging .edd-blocks-receipt__items,
.wps-edd-bevestiging #edd_subscription_receipt {
  background: #fff;
  border: 1px solid var(--mapb-border, #e5e7eb);
  border-top: 0;
  margin: 0;
}

/* Rijen: label links, waarde rechts */
.wps-edd-bevestiging .edd-blocks-receipt__totals .edd-blocks__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 0.75rem 1.375rem;
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
  font-size: 0.9rem;
  color: #374151;
}
.wps-edd-bevestiging .edd-blocks-receipt__totals .edd-blocks__row:last-child { border-bottom: 0; }
.wps-edd-bevestiging .edd-blocks-receipt__totals .edd-blocks__row-label { font-weight: 400; color: #6b7280; }
.wps-edd-bevestiging .edd-blocks-receipt__totals .edd-blocks__row-value { font-weight: 600; color: var(--mapb-color-heading, #0f172a); text-align: right; }
.wps-edd-bevestiging .edd-blocks-receipt__totals .edd-blocks__row-header .edd-blocks__row-value { color: var(--mapb-primary, #3858e9); }
.wps-edd-bevestiging .edd_receipt_payment_status.complete { color: #15803d !important; }

/* Licentiesleutel: label-rij zonder lijn, sleutel eronder */
.wps-edd-bevestiging .edd-blocks__row:has(+ .edd-blocks-receipt__row-item--license-key) { border-bottom: 0; padding-bottom: 0.25rem; }
.wps-edd-bevestiging .edd-blocks-receipt__row-item--license-key { flex-wrap: wrap; padding-top: 0.25rem; }
.wps-edd-bevestiging .edd-blocks-receipt__row-item--license-key .edd-blocks__row-sublabel { font-size: 0.85rem; color: #6b7280; }
.wps-edd-bevestiging .edd_sl_license_key {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.8rem;
  font-weight: 500;
  background: var(--mapb-bg-light, #f1f5f9);
  padding: 0.3rem 0.55rem;
  word-break: break-all;
}

/* Producten */
.wps-edd-bevestiging .edd-blocks-receipt__item {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  padding: 1rem 1.375rem;
}
.wps-edd-bevestiging .edd-blocks-receipt__item + .edd-blocks-receipt__item { border-top: 1px solid var(--mapb-border, #e5e7eb); }
.wps-edd-bevestiging .edd-blocks-receipt__item-details .edd-blocks__row-label {
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--mapb-color-heading, #0f172a);
}
.wps-edd-bevestiging .edd_purchase_receipt_files { list-style: none; margin: 0.35rem 0 0; padding: 0; }
.wps-edd-bevestiging .edd_purchase_receipt_files li { margin: 0; font-size: 0.875rem; }
.wps-edd-bevestiging .edd_purchase_receipt_files a { color: var(--mapb-primary, #3858e9); font-weight: 500; }
.wps-edd-bevestiging .edd-blocks-receipt__item-sku { display: none; }
.wps-edd-bevestiging .edd-blocks-receipt__item-price { font-weight: 700; color: var(--mapb-primary, #3858e9); white-space: nowrap; }

/* Abonnement-tabel */
.wps-edd-bevestiging #edd_subscription_receipt { width: 100%; border-collapse: collapse; }
.wps-edd-bevestiging #edd_subscription_receipt th,
.wps-edd-bevestiging #edd_subscription_receipt td {
  padding: 0.75rem 1.375rem;
  text-align: left;
  vertical-align: top;
  border: 0;
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
  background: transparent;
  font-size: 0.875rem;
  color: #374151;
}
.wps-edd-bevestiging #edd_subscription_receipt th {
  background: var(--mapb-bg-light, #f1f5f9);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #6b7280;
}
.wps-edd-bevestiging #edd_subscription_receipt tr:last-child td { border-bottom: 0; }
.wps-edd-bevestiging .edd_subscription_name { font-weight: 600; color: var(--mapb-color-heading, #0f172a); }
.wps-edd-bevestiging .edd_subscription_billing_cycle { color: #6b7280; }

/* Mijn account-knop: oranje, zoals de afrekenknop */
.wps-edd-bevestiging .wps-receipt-account-btn { margin-top: 1.5rem; text-align: left; }
.wps-edd-bevestiging .wps-rc-account-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.875rem 2rem;
  background: var(--mapb-btn-secondary-bg, #e8722a);
  color: #fff;
  font-family: var(--mapb-font-body, 'Outfit', sans-serif);
  font-size: 0.9rem;
  font-weight: 700;
  text-decoration: none;
  transition: opacity 0.15s;
}
.wps-edd-bevestiging .wps-rc-account-btn:hover { opacity: 0.88; color: #fff; }

@media (max-width: 640px) {
  .wps-edd-bevestiging #edd_subscription_receipt thead { display: none; }
  .wps-edd-bevestiging #edd_subscription_receipt tr { display: block; border-bottom: 1px solid var(--mapb-border, #e5e7eb); }
  .wps-edd-bevestiging #edd_subscription_receipt td { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 0; padding: 0.35rem 1.375rem; }
  .wps-edd-bevestiging #edd_subscription_receipt td:first-child { display: block; padding-top: 0.875rem; }
  .wps-edd-bevestiging #edd_subscription_receipt td:last-child { padding-bottom: 0.875rem; }
  .wps-edd-bevestiging #edd_subscription_receipt td:nth-child(2)::before { content: "Volgende verlenging"; color: #6b7280; }
  .wps-edd-bevestiging #edd_subscription_receipt td:nth-child(3)::before { content: "Eerste betaling"; color: #6b7280; }
  .wps-edd-bevestiging #edd_subscription_receipt td:nth-child(4)::before { content: "Keren gefactureerd"; color: #6b7280; }
  .wps-edd-bevestiging #edd_subscription_receipt td:nth-child(5)::before { content: "Status"; color: #6b7280; }
}

/* Bevestiging direct na betaling (EDD confirmation-blok): geen rand om het geheel */
.wps-edd-receipt-wrap .wp-block-edd-confirmation,
.wps-edd-receipt-wrap .edd-blocks__confirmation {
  border: 0;
  background: transparent;
}

/* EDD geeft totals/items zelf padding 1rem: weg, zodat lijnen tot de zijkanten lopen */
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__totals,
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__items {
  display: block;
  padding: 0;
  margin: 0 0 1.25rem;
}
.wps-edd-bevestiging .wps-edd-receipt-wrap h3 + .edd-blocks-receipt__totals,
.wps-edd-bevestiging .wps-edd-receipt-wrap h3 + .edd-blocks-receipt__items { margin-top: 0; }
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__items .edd-blocks__row { border-bottom: 0; }

/* Bestelgegevens: labels vet, waarden normaal; bestelnummer en status blijven vet */
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__totals .edd-blocks__row-label {
  font-weight: 600;
  color: var(--mapb-color-heading, #0f172a);
}
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__totals .edd-blocks__row-value {
  font-weight: 400;
  color: #374151;
}
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__totals .edd-blocks__row-header .edd-blocks__row-value {
  font-weight: 700;
  color: var(--mapb-primary, #3858e9);
}
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__totals .edd_receipt_payment_status {
  font-weight: 700;
  color: #15803d;
}
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__totals .edd-blocks__row-value a { font-weight: 600; }
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__row-item--license-key .edd-blocks__row-sublabel { font-weight: 400; }

/* Licentie met kopieerknop */
.wps-edd-bevestiging .wps-rc-key { display: inline-flex; align-items: center; gap: 0.4rem; }
.wps-edd-bevestiging .wps-rc-copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  background: #fff;
  border: 1px solid var(--mapb-border, #e5e7eb);
  color: #6b7280;
  cursor: pointer;
  transition: color 0.15s, border-color 0.15s;
}
.wps-edd-bevestiging .wps-rc-copy:hover { color: var(--mapb-primary, #3858e9); border-color: var(--mapb-primary, #3858e9); }
.wps-edd-bevestiging .wps-rc-copy.is-copied { color: #15803d; border-color: #15803d; }

/* Knoppen onderaan: Details bestelling (oranje) + Mijn account */
.wps-edd-bevestiging .wps-receipt-account-btn { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.wps-edd-bevestiging .wps-rc-account-btn--secondary {
  background: #fff;
  color: var(--mapb-color-heading, #0f172a);
  border: 1px solid var(--mapb-border, #e5e7eb);
}
.wps-edd-bevestiging .wps-rc-account-btn--secondary:hover { color: var(--mapb-color-heading, #0f172a); opacity: 1; border-color: #9ca3af; }
.wps-edd-bevestiging .wps-rc-account-btn:not(.wps-rc-account-btn--secondary) { border: 1px solid var(--mapb-btn-secondary-bg, #e8722a); } /* gelijke hoogte met de omlijnde knop */

/* Licentiesleutel even hoog als de kopieerknop, meer ruimte links/rechts */
.wps-edd-bevestiging .wps-rc-key .edd_sl_license_key {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  height: 32px;
  padding: 0 0.875rem;
}

/* Producten: abonnementstype en kleine downloadknop */
.wps-edd-bevestiging .wps-rc-plan { margin-top: 0.15rem; font-size: 0.875rem; color: #6b7280; }
.wps-edd-bevestiging .edd_purchase_receipt_files { margin-top: 0.75rem; }
.wps-edd-bevestiging .edd_purchase_receipt_files a.edd_download_file_link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0.875rem;
  background: #fff;
  border: 1px solid var(--mapb-primary, #3858e9);
  color: var(--mapb-primary, #3858e9);
  font-size: 0.8rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}
.wps-edd-bevestiging .edd_purchase_receipt_files a.edd_download_file_link:hover {
  background: var(--mapb-primary, #3858e9);
  color: #fff;
}

/* Knoppen onderaan bevestiging: zelfde maat als "Start met WP Strippenkaart" (sticky bar) */
.wps-edd-bevestiging .wps-rc-account-btn {
  padding: calc(0.625rem - 1px) 1.75rem; /* -1px compenseert de rand */
  font-size: 0.9375rem;
}
.wps-edd-bevestiging .wps-receipt-account-btn { flex-wrap: wrap; }

/* Knoppenrij in het productblok */
.wps-edd-bevestiging .edd-blocks-receipt__item-details { flex: 1; min-width: 0; }
.wps-edd-bevestiging .edd-blocks-receipt__item-details .wps-receipt-account-btn { margin-top: 1rem; }

/* Kleinere knoppen in het productblok */
.wps-edd-bevestiging .edd-blocks-receipt__item-details .wps-receipt-account-btn { gap: 0.5rem; }
.wps-edd-bevestiging .edd-blocks-receipt__item-details .wps-rc-account-btn {
  padding: calc(0.4rem - 1px) 0.875rem;
  font-size: 0.8rem;
}

/* Knoppen: downloads links, account + details rechts */
.wps-edd-bevestiging .wps-receipt-account-btn .wps-rc-btn--right { margin-left: auto; }

/* Productblok als raster: knoppenrij over de volle breedte, rechts gelijk met de prijs */
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__item {
  display: grid;
  grid-template-columns: 1fr auto;
  column-gap: 1rem;
  align-items: start;
}
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__item-details { display: contents; }
.wps-edd-bevestiging .edd-blocks-receipt__item-details > .edd-blocks__row-label { grid-column: 1; grid-row: 1; }
.wps-edd-bevestiging .edd-blocks-receipt__item-details > .wps-rc-plan { grid-column: 1; grid-row: 2; }
.wps-edd-bevestiging .edd-blocks-receipt__item-details > .wps-receipt-account-btn { grid-column: 1 / -1; grid-row: 3; }
.wps-edd-bevestiging .edd-blocks-receipt__item-price { grid-column: 2; grid-row: 1; }

/* Blauwe downloadknoppen met icoon */
.wps-edd-bevestiging .wps-rc-account-btn.wps-rc-btn--blue {
  gap: 0.4rem;
  background: #fff;
  color: var(--mapb-primary, #3858e9) !important;
  border: 1px solid var(--mapb-primary, #3858e9);
  transition: background 0.15s, color 0.15s;
}
.wps-edd-bevestiging .wps-rc-account-btn.wps-rc-btn--blue:hover {
  background: var(--mapb-primary, #3858e9);
  color: #fff !important;
  opacity: 1;
}

.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__totals .edd-blocks__row-value.wps-rc-bold { font-weight: 700; color: var(--mapb-color-heading, #0f172a); }

/* Productblok: EDD-rij heeft gap 1rem; rijruimte zelf bepalen */
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__item { row-gap: 0; }
.wps-edd-bevestiging .edd-blocks-receipt__item-details > .wps-rc-plan { margin-top: 0.15rem; }
.wps-edd-bevestiging .edd-blocks-receipt__item-details > .wps-receipt-account-btn { margin-top: 0.875rem; }

.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__totals .edd-blocks__row-value.wps-rc-total { font-weight: 700; color: var(--mapb-primary, #3858e9); }

/* Geen onderstreping op knoppen (oude regel voor factuurlinks onderstreepte bij hover) */
.wps-edd-bevestiging .wps-rc-account-btn,
.wps-edd-bevestiging .wps-rc-account-btn:hover { text-decoration: none !important; }

/* Licentie: minder ruimte tussen titel en sleutel */
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__totals .edd-blocks__row:has(+ .edd-blocks-receipt__row-item--license-key) { padding-bottom: 0; }
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__totals .edd-blocks-receipt__row-item--license-key { padding-top: 0.375rem; }

/* Ontvangstbewijs: EDD-receipt-CSS zet padding .5rem 0 op de productrij; eigen ruimte terug */
.wps-edd-bevestiging .wps-edd-receipt-wrap .edd-blocks-receipt__items .edd-blocks-receipt__item {
  padding: 1rem 1.375rem;
  border-bottom: 0;
}

/* Abonnementsstatus als label; groen bij "Actief" */
.wps-edd-bevestiging .edd_subscription_status {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  border-radius: 999px;
  background: var(--mapb-bg-light, #f1f5f9);
  color: #374151;
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}
.wps-edd-bevestiging .edd_subscription_status.wps-rc-status--active { background: #dcfce7; color: #15803d; }

/* Abonnement-tabel: alles op één regel (desktop) */
@media (min-width: 641px) {
  .wps-edd-bevestiging #edd_subscription_receipt th,
  .wps-edd-bevestiging #edd_subscription_receipt td {
    white-space: nowrap;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
  .wps-edd-bevestiging #edd_subscription_receipt th:first-child,
  .wps-edd-bevestiging #edd_subscription_receipt td:first-child { padding-left: 1.375rem; }
  .wps-edd-bevestiging #edd_subscription_receipt th:last-child,
  .wps-edd-bevestiging #edd_subscription_receipt td:last-child { padding-right: 1.375rem; text-align: right; }
  .wps-edd-bevestiging #edd_subscription_receipt th { font-size: 0.7rem; letter-spacing: 0.02em; }
}

/* Abonnement-tabel: verticale lijnen, blauwe koppen, eerste betaling vet en blauw */
@media (min-width: 641px) {
  .wps-edd-bevestiging #edd_subscription_receipt th + th,
  .wps-edd-bevestiging #edd_subscription_receipt td + td { border-left: 1px solid var(--mapb-border, #e5e7eb); }
}
.wps-edd-bevestiging #edd_subscription_receipt th { color: var(--mapb-primary, #3858e9); }
.wps-edd-bevestiging .edd_subscription_initial_amount { font-weight: 700; color: var(--mapb-primary, #3858e9); }

/* Accountpagina: rij met blauwe omlijnde knoppen (zelfde als bevestigingspagina) */
.wps-btn-row { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 1.25rem 0 0; }
.wps-btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: calc(0.4rem - 1px) 0.875rem;
  background: #fff;
  border: 1px solid var(--mapb-primary, #3858e9);
  color: var(--mapb-primary, #3858e9) !important;
  font-family: var(--mapb-font-body, 'Outfit', sans-serif);
  font-size: 0.8rem;
  font-weight: 700;
  text-decoration: none !important;
  transition: background 0.15s, color 0.15s;
}
.wps-btn-outline:hover { background: var(--mapb-primary, #3858e9); color: #fff !important; }
.wps-btn-outline svg { flex-shrink: 0; }

/* ─── Knoppen op tablet en mobiel: zelfde maat als de headerknop ──────────── */
@media (max-width: 1024px) {
  .mapb-btn:not(.mapb-btn--ghost),
  .btn:not(.btn-account-icon),
  .wps-btn,
  .wps-btn-outline {
    height: 34px;
    min-height: 34px;
    padding: 0 1rem;
    font-size: 0.8rem;
    line-height: 1;
    box-sizing: border-box;
  }

  /* Socialknoppen in de footer */
  .wps-footer__social-btn { width: 34px; height: 34px; font-size: 0.95rem; }

  /* Sticky balk: knop en terug-naar-boven even hoog en op één lijn */
  #wps-sticky-bar { padding-top: 0.875rem; padding-bottom: 0.875rem; }
  .wps-sticky-bar__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 34px;
    padding: 0 1rem;
    font-size: 0.8rem;
    line-height: 1;
    box-sizing: border-box;
  }
  #scroll-top { width: 34px; height: 34px; bottom: calc(1.5rem + 34px + 8px); }
  html body:has(#wps-sticky-bar.is-visible) #scroll-top { bottom: calc(0.875rem + 34px + 8px) !important; }
  #scroll-top svg { width: 15px; height: 15px; }

  /* Chatknop (BM Tools Chatbot) even groot als de andere knoppen */
  .bmtc-root .bmtc-launcher--icon { width: 34px; height: 34px; }
  .bmtc-root .bmtc-launcher--icon svg { width: 21px; height: 21px; }
}
@media (max-width: 480px) {
  /* Ruimte rechts voor de terug-naar-boven-knop, zodat die niet over de knop valt */
  #wps-sticky-bar { padding-right: calc(1.5rem + 34px + 0.5rem); }
}

/* ── Deelknoppen in de artikelkop (19-10-2026) ── */
.article-share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 1.5rem;
}
.article-share__label {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  margin-right: 0.25rem;
}
.article-share__btn {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 0;
  color: var(--text);
  cursor: pointer;
  padding: 0;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.article-share__btn .wps-icon { width: 14px; height: 14px; }
.article-share__btn:hover,
.article-share__btn:focus-visible { background: var(--accent); border-color: var(--accent); color: #fff; }
.article-share__icon-check { display: none; }
.article-share__copy.is-copied { background: #16a34a; border-color: #16a34a; color: #fff; }
.article-share__copy.is-copied .article-share__icon-copy { display: none; }
.article-share__copy.is-copied .article-share__icon-check { display: inline-flex; }
.article-share__icon-copy, .article-share__icon-check { align-items: center; justify-content: center; }
.article-share__icon-copy { display: inline-flex; }
.article-share { position: relative; }
/* Melding los onder de rij, zodat de knoppen niet verschuiven */
.article-share__status {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin-top: 0.375rem;
  font-size: 0.8rem;
  color: #16a34a;
  white-space: nowrap;
}
.article-share__status:empty { display: none; }
/* Onder de visual: links uitgelijnd met de artikelkolom */
.article-layout > .article-share { justify-content: flex-start; }
.article-layout > .article-share--top { margin-top: -2rem; } /* visual heeft zelf 1,75rem ondermarge */
.article-layout > .article-share--bottom { margin-top: 0.5rem; }
.article-share + .toc-above { margin-top: 0; }
@media (max-width: 480px) {
  .article-layout > .article-share .article-share__label { flex-basis: 100%; margin: 0 0 0.125rem; }
}

/* Introregel op blog- en categoriepagina's: smaller en gelijk verdeeld over de regels (19-10-2026) */
body.blog .mapb-page-header__subtitle,
body.category .mapb-page-header__subtitle {
  max-width: 46rem;
  margin-inline: auto;
  text-wrap: balance;
}

/* ── Prijskaart (productpagina en /downloads/), verplaatst uit single-download.php (19-10-2026) ── */
/* Prijskaart */
.wps-product-card {
  background: #fff;
  border: 1px solid var(--mapb-border, #e5e7eb);
  padding: 1rem 1.5rem .75rem;
}
.wps-product-card__plan {
  font-size: .8125rem;
  font-weight: 400;
  letter-spacing: .02em;
  color: var(--mapb-text-muted, #9ca3af);
  margin-bottom: .875rem;
}
.wps-product-card__pricing {
  display: flex;
  align-items: flex-end;
  gap: .25rem;
  margin-bottom: 1rem;
}
.wps-product-card__currency {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  padding-bottom: .4rem;
  color: #1d4ed8;
}
.wps-product-card__amount {
  font-size: 3rem;
  font-weight: 800;
  line-height: 1;
  color: #1d4ed8;
}
.wps-product-card__period {
  font-size: .8125rem;
  color: var(--mapb-text-muted, #6b7280);
  padding-bottom: .1rem;
}
.wps-product-card__note {
  font-size: .8125rem;
  color: var(--mapb-text-muted, #6b7280);
  margin: 0 0 1.5rem;
  line-height: 1.5;
}
/* Betaalfrequentie */
.wps-product-term {
  border-top: 1px solid var(--mapb-border, #e5e7eb);
  margin: 0 -1.5rem;
  padding: 1rem 1.5rem;
}
.wps-product-term label {
  display: block;
  font-size: .8125rem;
  font-weight: 600;
  color: var(--mapb-text, #374151);
  margin-bottom: .375rem;
}
.wps-product-term select {
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right .875rem center;
  border: 1px solid var(--mapb-border, #e5e7eb);
  border-radius: 0;
  padding: .65rem 2.25rem .65rem .875rem;
  font-family: inherit;
  font-size: .9rem;
  color: var(--mapb-text, #374151);
  cursor: pointer;
}
.wps-product-term select:focus { outline: none; border-color: #1d4ed8; }

/* Groene bevestigingsblock */
.wps-product-confirm {
  display: flex;
  gap: .625rem;
  background: #f0fdf4;
  border-top: 1px solid var(--mapb-border, #e5e7eb);
  border-bottom: 1px solid var(--mapb-border, #e5e7eb);
  padding: .875rem 1.5rem;
  margin: 0 -1.5rem;
  font-size: .875rem;
  color: #166534;
  line-height: 1.5;
}
.wps-product-confirm svg {
  flex-shrink: 0;
  margin-top: .15rem;
  color: #16a34a;
}
.wps-product-confirm > div > strong { display: block; font-weight: 700; margin-bottom: .25rem; }
.wps-product-confirm p { margin: 0; color: #166534; font-size: .8125rem; }
.wps-product-confirm p strong { display: inline; font-weight: 700; }
.wps-product-card__cta { margin-top: 1rem; margin-bottom: 1rem; }
/* EDD koopknop oranje maken */
.wps-product-card .edd-submit,
.wps-product-card a.edd-submit,
.wps-product-buy-btn {
  display: block;
  width: 100%;
  text-align: center;
  justify-content: center;
  background: var(--mapb-btn-secondary-bg, #e8722a) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 0 !important;
  font-weight: 700;
  font-size: .9rem;
  padding: .875rem 1.5rem;
  cursor: pointer;
  text-decoration: none;
}
.wps-product-card .edd-submit:hover,
.wps-product-card a.edd-submit:hover {
  background: #d4621f !important;
}
/* EDD Recurring tekst onder button verbergen */
.wps-product-card .edd_recurring_checkout_signup,
.wps-product-card p.edd_recurring_signup_description,
.wps-product-card__cta em,
.wps-product-card__cta p,
.wps-product-card__cta small {
  display: none !important;
}
.wps-product-card__secure {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .375rem;
  font-size: .8rem;
  color: var(--mapb-text-muted, #6b7280);
  margin: 0;
  padding-bottom: .125rem;
}
.wps-product-card__trust {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--mapb-border, #e5e7eb);
  padding-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.wps-product-card__trust li {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .8125rem;
  color: var(--mapb-text, #374151);
}
.wps-product-card__trust li svg { color: #16a34a; flex-shrink: 0; }
.wps-product-saving {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  text-align: center;
  font-size: .875rem;
  color: #6b7280;
  margin-top: .875rem;
}

/* ── Overzicht /downloads/ (archive-download.php, 19-10-2026) ── */
.wps-downloads-wrap { padding-top: 4rem; padding-bottom: 5rem; }
.wps-downloads-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 370px));
  justify-content: center;
  gap: 1.5rem;
  align-items: start;
}
.wps-downloads-plan__title {
  font-size: 1.125rem;
  font-weight: 700;
  margin: 0.75rem 0 0.5rem;
}
@media (max-width: 1100px) {
  .wps-downloads-grid { grid-template-columns: repeat(2, minmax(0, 370px)); }
}
@media (max-width: 760px) {
  .wps-downloads-grid { grid-template-columns: minmax(0, 360px); }
}

/* Kortingsballon naast de prijs bij een jaarabonnement (19-10-2026) */
.wps-product-card__badge {
  position: relative;
  align-self: center;
  margin-left: 0.625rem;
  background: #dcfce7;
  color: #166534;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  padding: 0.4rem 0.6rem;
  white-space: nowrap;
}
.wps-product-card__badge::before {
  content: "";
  position: absolute;
  left: -6px;
  top: 50%;
  transform: translateY(-50%);
  border: 6px solid transparent;
  border-left: 0;
  border-right-color: #dcfce7;
}
.wps-product-card__pricing { flex-wrap: wrap; }
.wps-product-card__period { white-space: nowrap; }
.wps-downloads-plan__title a { color: inherit; text-decoration: none; }
.wps-downloads-plan__title a:hover { color: var(--accent); }
/* Koopknoppen in de prijskaarten op /downloads/ iets kleiner (19-10-2026) */
.wps-downloads-plan .wps-product-card .edd-submit,
.wps-downloads-plan .wps-product-card a.edd-submit,
.wps-downloads-plan .wps-product-card .wps-product-buy-btn {
  font-size: .85rem !important;
  padding: .65rem 1.25rem !important;
  line-height: 1.3;
}
/* Koopknoppen op /downloads/ niet over de volle breedte, maar gecentreerd (19-10-2026).
   :not(.edd-no-js): de reserveknop van EDD voor browsers zonder JavaScript blijft verborgen */
.wps-downloads-plan .wps-product-card__cta { text-align: center; }
.wps-downloads-plan .wps-product-card .edd-submit:not(.edd-no-js),
.wps-downloads-plan .wps-product-card a.edd-submit,
.wps-downloads-plan .wps-product-card .wps-product-buy-btn:not(.edd-no-js) {
  display: inline-block;
  width: auto;
}
/* /downloads/: knop links, tekstje (Stripe / WordPress.org) rechts op dezelfde regel (19-10-2026) */
.wps-downloads-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .5rem .75rem;
  margin: 1rem 0 .875rem;
}
.wps-downloads-actions .wps-product-card__cta { margin: 0; text-align: left; }
.wps-downloads-actions .wps-product-card__secure { margin: 0; padding: 0; font-size: .75rem; white-space: nowrap; }
/* Vergelijkingstabel /tarieven/: prijzen in de witte kolommen in de hoofdkleur (19-10-2026) */
.mapb-compare-th:not(.mapb-compare-th--featured) .mapb-compare-price__amount,
.mapb-compare-mobile__plan:not(.mapb-compare-mobile__plan--featured) .mapb-compare-price__amount {
  color: var(--mapb-primary, #3858e9);
}
/* Vergelijkingstabel: kopjes (Start/Pro/Premium) als link, zelfde kleur */
.mapb-compare-plan__link { color: inherit; text-decoration: none; }
.mapb-compare-plan__link:hover { text-decoration: underline; text-underline-offset: 3px; }
/* Vergelijkingstabel: EDD Recurring-tekst onder de koopknop verbergen, net als in de prijskaarten */
.mapb-compare-buy .edd_recurring_checkout_signup,
.mapb-compare-buy p.edd_recurring_signup_description,
.mapb-compare-buy em,
.mapb-compare-buy p,
.mapb-compare-buy small {
  display: none !important;
}
/* Kortingsregel in het besteloverzicht (afrekenen) */
.wps-co-saving { margin: .875rem 0 0; padding: 0; }
/* Kader + kortingsregel schuiven samen mee (omhulsel via script); het kader zelf niet meer los sticky */
.wps-edd-checkout .wps-co-cart-sticky { position: sticky; top: 5.5rem; }
.wps-edd-checkout .wps-co-cart-sticky #edd_checkout_cart_wrap { position: static; }
/* Bestelkolom over de volle hoogte van de afrekenpagina, zodat het omhulsel echt kan meeschuiven */
.wps-edd-checkout #edd_checkout_wrap > #edd_checkout_cart_form { align-self: stretch; }
@media (max-width: 860px) {
  .wps-edd-checkout .wps-co-cart-sticky { position: static; }
}

/* ── Footer: aanmeldformulier ───────────────────────────────────────── */
.wps-footer__subscribe-wrap {
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 60px 0;
}
.wps-subscribe-form {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}
.wps-subscribe-form__tagline {
  color: #fff;
  font-size: .95rem;
  margin: 0;
  opacity: .85;
}
.wps-subscribe-form__row {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  justify-content: center;
  width: 100%;
  max-width: 680px;
}
.wps-subscribe-form__input {
  flex: 1 1 180px;
  min-width: 0;
  padding: 10px 14px;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 0;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: .95rem;
  line-height: 1.4;
}
.wps-subscribe-form__input::placeholder { color: rgba(255,255,255,.45); }
.wps-subscribe-form__input:focus {
  outline: none;
  border-color: rgba(255,255,255,.6);
  background: rgba(255,255,255,.13);
}
.wps-subscribe-form__btn {
  flex-shrink: 0;
  white-space: nowrap;
}
.wps-subscribe-form__input {
  box-sizing: border-box;
  height: 43px;
}
@media (max-width: 1024px) {
  .wps-subscribe-form__input { height: 34px; padding-top: 0; padding-bottom: 0; }
}
.wps-subscribe-form__btn {
  border-radius: 0 !important;
  background: var(--clr-primary, #2563eb) !important;
  color: #fff !important;
  border-color: var(--clr-primary, #2563eb) !important;
}
.wps-subscribe-form__btn:hover {
  background: var(--clr-primary-dark, #1d4ed8) !important;
  border-color: var(--clr-primary-dark, #1d4ed8) !important;
}
.wps-subscribe-form__msg {
  font-size: .9rem;
  margin: 0;
  padding: 8px 14px;
  border-radius: 0;
  width: 100%;
  max-width: 680px;
  text-align: left;
}
.wps-subscribe-form__consent {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  width: 100%;
  max-width: 680px;
  text-align: left;
  font-size: .8rem;
  color: rgba(255,255,255,.7);
  cursor: pointer;
}
.wps-subscribe-form__consent input {
  width: 16px;
  height: 16px;
  margin: 0;
  flex-shrink: 0;
  accent-color: var(--clr-primary, #2563eb);
  cursor: pointer;
}
.wps-subscribe-form__consent a { color: rgba(255,255,255,.85); text-decoration: underline; }
.wps-subscribe-form__msg--ok  { background: rgba(0,200,100,.15); color: #6effa9; }
.wps-subscribe-form__msg--err { background: rgba(255,80,80,.15);  color: #ffaaaa; }
@media (max-width: 740px) {
  .wps-subscribe-form__row { flex-direction: column; align-items: stretch; max-width: none; }
  .wps-subscribe-form__input { flex: none; width: 100%; }
  .wps-subscribe-form__btn  { flex: none; align-self: flex-start; }
}

/* ── Zoekveld op blog- en categoriepagina's, realtime via wps-blog.js (22-10-2026) ── */
.wps-blog-search {
  position: relative;
  max-width: 32rem;
  margin: 1.75rem auto 0;
}
.wps-blog-search .screen-reader-text {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}
.wps-blog-search__icon {
  position: absolute; left: 1rem; top: 50%;
  width: 15px; height: 15px; transform: translateY(-50%);
  color: var(--muted); pointer-events: none;
}
.wps-blog-search input[type="search"] {
  width: 100%;
  padding: 0.85rem 1rem 0.85rem 2.75rem;
  font: inherit; font-size: 0.95rem; color: var(--text);
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 0;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.wps-blog-search input[type="search"]:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-light);
}
.wps-blog-search[aria-busy="true"] .wps-blog-search__icon { animation: wps-search-pulse 0.8s ease-in-out infinite alternate; }
@keyframes wps-search-pulse { to { opacity: 0.3; } }
.wps-blog-search { z-index: 20; text-align: left; }
.wps-blog-search__results {
  position: absolute; top: 100%; left: 0; right: 0;
  margin: 0; padding: 0; list-style: none;
  background: #fff;
  border: 1px solid var(--border); border-top: none;
  border-radius: 0;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12);
  max-height: 22rem; overflow-y: auto;
}
.wps-blog-search__results[hidden] { display: none; }
.wps-blog-search__results a {
  display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 1rem;
  font-size: 0.9rem; line-height: 1.4; color: var(--text);
  text-decoration: none;
}
.wps-blog-search__results a:hover,
.wps-blog-search__results .is-active a { background: var(--accent-light); color: var(--accent); }
.wps-blog-search__results img {
  flex-shrink: 0; width: 48px; height: 48px; object-fit: cover;
  border-radius: 0; background: var(--bg);
}
/* Grijs kopvlak mag de zoekresultatenlijst niet afsnijden */
body.blog .mapb-block--page-header,
body.category .mapb-block--page-header,
body.search .mapb-block--page-header { overflow: visible; z-index: 5; }
.wps-blog-search__none { padding: 0.6rem 1rem; font-size: 0.875rem; color: var(--muted); }

/* ── Blog Grid (page builder): even breed als de bloglisting, donkere knop (22-10-2026) ── */
.mapb-block--blog_grid .wps-blog-grid-inner { max-width: 920px; margin-inline: auto; }
.mapb-block--blog_grid .mapb-section-header { margin-bottom: 2.5rem; }
.mapb-block--blog_grid .blog-listing-grid { margin-top: 0; }
.mapb-block--blog_grid .blog-card { border-radius: 0; }
.mapb-block--blog_grid .wps-btn-dark,
.mapb-block--blog_grid .wps-btn-dark:hover { background: var(--dark); border-color: var(--dark); color: #fff; }

/* Upgradeblok onderaan de licentiekaart op /account/downloads/ (22-10-2026) */
.wps-license-card__upgrade { padding: 1.1rem 1.5rem; border-top: 1px solid var(--border); }
.wps-upgrade-options { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; }
.wps-upgrade-option { display: flex; flex-direction: column; align-items: flex-start; gap: 0.35rem; }
.wps-upgrade-option .wps-download-meta { text-align: left; }

/* Premium support: formulier, 28-10-2026 (tab gebruikt de gewone tabstijl) */
.wps-support h2 { font-size: 1.25rem; margin: 0 0 0.5rem; }
.wps-support__intro { color: var(--muted); max-width: 640px; margin: 0 0 1.5rem; }
.wps-support__form { max-width: 640px; }
.wps-support__field { display: flex; flex-direction: column; gap: 0.3rem; margin: 0 0 1.25rem; }
.wps-support__field label { font-size: 0.875rem; font-weight: 600; color: var(--text); }
.wps-support__field label span { font-weight: 400; color: var(--muted); }
.wps-support__field small { font-size: 0.8rem; color: var(--muted); }
.wps-support__field textarea,
.wps-support__field input[type="file"] {
  width: 100%;
  box-sizing: border-box;
  padding: 0.6rem 0.875rem;
  border: 1px solid var(--border);
  border-radius: 0;
  font: inherit;
  font-size: 0.9rem;
  color: var(--text);
  background: #fff;
}
.wps-support__field textarea { resize: vertical; min-height: 160px; }
.wps-support__field textarea:focus { outline: none; border-color: var(--mapb-primary, var(--accent)); }
.wps-support__submit {
  background: var(--mapb-btn-primary-bg, var(--accent));
  color: var(--mapb-btn-primary-text, #fff);
  border: none;
  border-radius: 0;
  padding: 0.65rem 2rem;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
}
.wps-support__submit:hover { opacity: 0.88; }
.wps-support__msg { padding: 0.75rem 1rem; margin: 0 0 1.25rem; max-width: 640px; font-size: 0.9rem; }
.wps-support__msg--ok { background: #dcfce7; color: #14532d; }
.wps-support__msg--fout { background: #fee2e2; color: #7f1d1d; }