/* ---- shared.css ---- */
/* ==========================================================================
   Merkmatrassen – winkelwagen, afrekenen en mijn account
   Zelfde tokens en componenten als P350 / afspraak-maken (.em-pdp),
   hier afgeschermd onder .mms zodat het in een WooCommerce-sjabloon past.
   ========================================================================== */
.mms,.mms-co-head,.mms-co-foot,.mms-toast{
  --container:1400px; --gutter:40px; --section:120px;
  --font:'Open Sans',system-ui,-apple-system,"Segoe UI",sans-serif;
  --white:#FFFFFF; --cream:#F6F5F2; --cream-2:#EFECE6; --line:#E4DFD8;
  --ink:#2A2523; --ink-2:#5C5552; --ink-3:#8A827E;
  --purple:#612953; --purple-2:#4A1F40; --purple-deep:#2E1A2B; --purple-tint:#F1E9EF; --purple-line:#D9C6D3;
  --green:#96C15D; --green-deep:#3F6417; --green-ink:#4F7A1E; --green-tint:#EEF4E3; --green-dot:#4F8A3C;
  --red:#A3341F; --red-tint:#FBEFEC;
  --r-btn:0 16px 0 0; --r-card:24px; --r-media:32px;
  --ease:cubic-bezier(.4,0,.2,1); --t:.3s;
  --header-h:122px;
  color-scheme:light;
}

.mms *{box-sizing:border-box}
.mms [hidden]{display:none!important}
.mms{margin:0;background:var(--white);color:var(--ink);font-family:var(--font);font-size:17px;line-height:1.6;font-weight:500;-webkit-font-smoothing:antialiased;overflow-x:clip}
.mms img{max-width:100%;height:auto;display:block}
.mms a{color:inherit;text-decoration:none}
.mms button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0}
.mms p{margin:0}
.mms ul,.mms ol{margin:0;padding:0;list-style:none}
.mms h1,.mms h2,.mms h3,.mms h4{margin:0;font-weight:700;line-height:1.08;letter-spacing:-.02em;text-wrap:balance;color:inherit;font-family:var(--font)}
.mms h1{font-size:clamp(34px,4.2vw,56px)}
.mms h2{font-size:clamp(28px,3vw,40px)}
.mms h3{font-size:21px;letter-spacing:-.01em;line-height:1.25}
.mms .wrap{max-width:var(--container);margin:0 auto;padding-left:max(var(--gutter),env(safe-area-inset-left,0px));padding-right:max(var(--gutter),env(safe-area-inset-right,0px))}
.mms .kicker{display:block;color:var(--purple);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin:0 0 12px}
.mms .lead{font-size:19px;color:var(--ink-2);max-width:58ch;margin:14px 0 0}
.mms .muted{color:var(--ink-3)}
.mms .tnum{font-variant-numeric:tabular-nums}
.mms .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* knoppen (gelijk aan .em-pdp .btn) */
.mms .btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 28px;border:0;border-radius:var(--r-btn);background:var(--purple);color:var(--white);font-size:16px;font-weight:600;line-height:1.2;text-decoration:none;overflow:hidden;white-space:nowrap;transition:background var(--t) var(--ease),transform var(--t) var(--ease),box-shadow var(--t) var(--ease)}
.mms .btn::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.18) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s var(--ease)}
.mms .btn:hover{background:var(--purple-2);box-shadow:0 14px 30px rgba(97,41,83,.22)}
.mms .btn:hover::after{transform:translateX(120%)}
.mms .btn:active{transform:translateY(1px)}
.mms .btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--t) var(--ease);flex:none}
.mms .btn:hover svg.go{transform:translateX(3px)}
.mms .btn-lg{padding:19px 30px;font-size:17px}
.mms .btn-block{width:100%}
.mms .btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
.mms .btn-ghost:hover{background:var(--cream);box-shadow:none;border-color:var(--ink-3)}
.mms .btn-light{background:var(--white);color:var(--purple)}
.mms .btn-light:hover{background:var(--cream);box-shadow:0 14px 30px rgba(0,0,0,.2)}
.mms .btn-ghost-light{background:transparent;color:var(--white);border:1.5px solid rgba(255,255,255,.35)}
.mms .btn-ghost-light:hover{background:rgba(255,255,255,.08);box-shadow:none}
.mms .btn:disabled,.mms .btn.is-busy{opacity:.55;cursor:not-allowed}
.mms .btn .spin{display:none;width:18px;height:18px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:mms-spin .8s linear infinite}
.mms .btn.is-busy .spin{display:block}
.mms .btn.is-busy .lbl-go{display:none}
@keyframes mms-spin{to{transform:rotate(360deg)}}
.mms .tlink{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--purple);font-size:15px}
.mms .tlink svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--t) var(--ease)}
.mms .tlink:hover svg{transform:translateX(3px)}
.mms .tlink.back:hover svg{transform:translateX(-3px)}
.mms :is(a,button,input,select,textarea,summary,label):focus-visible{outline:3px solid var(--green);outline-offset:2px}

/* chips, status, pillen */
.mms .chip{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border:1px solid var(--line);border-radius:999px;font-size:14px;font-weight:600;color:var(--ink);background:var(--white);white-space:nowrap}
.mms .chip i{width:8px;height:8px;border-radius:50%;background:var(--green-dot);flex:none}
.mms .chip i.p{background:var(--purple)}
.mms .chip svg{width:16px;height:16px;stroke:var(--purple);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mms .pill{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border-radius:999px;font-size:13px;font-weight:700;white-space:nowrap;background:var(--cream);color:var(--ink-2)}
.mms .pill i{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.mms .pill.is-green{background:var(--green-tint);color:#2F5D22}
.mms .pill.is-purple{background:var(--purple-tint);color:var(--purple)}
.mms .pill.is-live i{animation:mms-pulse 2.4s infinite}
@keyframes mms-pulse{0%{box-shadow:0 0 0 0 rgba(79,138,60,.35)}70%{box-shadow:0 0 0 7px rgba(79,138,60,0)}100%{box-shadow:0 0 0 0 rgba(79,138,60,0)}}

/* formulieren (gelijk aan het afspraakformulier) */
.mms .form{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.mms .field{display:grid;gap:6px;position:relative;align-content:start}
.mms .form .field{grid-column:span 6}
.mms .form .field.half{grid-column:span 3}
.mms .form .field.third{grid-column:span 2}
.mms .form .field.two-third{grid-column:span 4}
.mms label,.mms .lbl{font-size:14px;font-weight:700;color:var(--ink)}
.mms label .opt,.mms .lbl .opt{font-weight:500;color:var(--ink-3)}
.mms input,.mms select,.mms textarea{font:inherit;font-family:var(--font);font-size:16px;font-weight:500;color:var(--ink);background:var(--white);border:1.5px solid var(--line);border-radius:12px;padding:13px 14px;width:100%;min-width:0;transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),background var(--t) var(--ease)}
.mms input::placeholder,.mms textarea::placeholder{color:#B3ABA6}
.mms input:focus,.mms select:focus,.mms textarea:focus{border-color:var(--purple);box-shadow:0 0 0 4px var(--purple-tint);outline:none}
.mms textarea{min-height:96px;resize:vertical}
.mms select{appearance:none;-webkit-appearance:none;padding-right:42px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%235C5552' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:18px}
.mms .field .ok{position:absolute;right:13px;top:45px;width:22px;height:22px;border-radius:50%;background:var(--green-dot);display:grid;place-items:center;opacity:0;transform:scale(.4);transition:opacity .25s var(--ease),transform .35s cubic-bezier(.34,1.56,.64,1);pointer-events:none}
.mms .field .ok svg{width:13px;height:13px;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.mms .field.is-valid .ok{opacity:1;transform:scale(1)}
.mms .field.is-valid input{padding-right:44px}
.mms .field.is-error input,.mms .field.is-error select{border-color:#C9563F;background:#FFFBFA}
.mms .field .msg{font-size:13.5px;font-weight:600;color:var(--red);display:none}
.mms .field.is-error .msg{display:block}
.mms .field .hint{font-size:13.5px;color:var(--ink-3);font-weight:500}
.mms .pw{position:relative}
.mms .pw input{padding-right:52px}
.mms .pw button{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:10px;display:grid;place-items:center;color:var(--ink-3)}
.mms .pw button:hover{background:var(--cream);color:var(--ink)}
.mms .pw svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* eigen vinkje */
.mms .check{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;font-weight:500;color:var(--ink-2);cursor:pointer;user-select:none}
.mms .check input{position:absolute;opacity:0;width:1px;height:1px}
.mms .check .box{flex:0 0 22px;width:22px;height:22px;border:1.5px solid var(--ink-3);border-radius:7px;background:var(--white);display:grid;place-items:center;margin-top:1px;transition:background var(--t) var(--ease),border-color var(--t) var(--ease)}
.mms .check .box svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:20;stroke-dashoffset:20;transition:stroke-dashoffset .3s var(--ease)}
.mms .check input:checked + .box{background:var(--purple);border-color:var(--purple)}
.mms .check input:checked + .box svg{stroke-dashoffset:0}
.mms .check input:focus-visible + .box{outline:3px solid var(--green);outline-offset:2px}
.mms .check b{color:var(--ink);font-weight:700}

/* segmentknop (bijv. NL/BE) */
.mms .seg{display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;background:var(--cream);border-radius:14px;padding:4px;gap:4px;position:relative}
.mms .seg button{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:10px;font-weight:700;font-size:15px;color:var(--ink-2);transition:color var(--t) var(--ease)}
.mms .seg button[aria-pressed="true"]{color:var(--ink)}
.mms .seg .thumb{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;border-radius:10px;background:var(--white);box-shadow:0 4px 14px rgba(42,37,35,.1)}
.mms .seg .flag{width:20px;height:14px;border-radius:3px;overflow:hidden;display:grid;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.mms .flag-nl{grid-template-rows:1fr 1fr 1fr}
.mms .flag-nl i:nth-child(1){background:#AE1C28}.mms .flag-nl i:nth-child(2){background:#fff}.mms .flag-nl i:nth-child(3){background:#21468B}
.mms .flag-be{grid-template-columns:1fr 1fr 1fr}
.mms .flag-be i:nth-child(1){background:#000}.mms .flag-be i:nth-child(2){background:#FDDA24}.mms .flag-be i:nth-child(3){background:#EF3340}

/* kaarten */
.mms .card{background:var(--white);border-radius:var(--r-card);padding:32px;box-shadow:0 24px 60px rgba(97,41,83,.07)}
.mms .card-cream{background:var(--cream);border-radius:var(--r-card);padding:28px}

/* donkere samenvatting (gelijk aan .em-pdp .sum op afspraak-maken) */
.mms .sum{position:sticky;top:calc(var(--mms-hh,100px) + 24px);background:var(--purple-deep);color:var(--white);border-radius:var(--r-card);padding:32px;display:grid;gap:20px;overflow:hidden;isolation:isolate}
.mms .sum::before{content:"";position:absolute;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(150,193,93,.26),transparent 70%);right:-110px;top:-110px;pointer-events:none;z-index:-1}
.mms .sum h3{font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--green);font-weight:700}
.mms .sum .rows{display:grid;gap:12px;font-size:15.5px}
.mms .sum .r{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.mms .sum .r span{color:rgba(255,255,255,.7)}
.mms .sum .r b{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.mms .sum .r.save b{color:var(--green)}
.mms .sum .r.free b{color:var(--green)}
.mms .sum .total{border-top:1px solid rgba(255,255,255,.14);padding-top:18px;display:flex;justify-content:space-between;align-items:flex-end;gap:16px}
.mms .sum .total span{font-weight:700;font-size:17px}
.mms .sum .total span small{display:block;font-weight:500;font-size:13px;color:rgba(255,255,255,.55)}
.mms .sum .total b{font-size:34px;font-weight:700;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums}
.mms .sum .btn{justify-content:center}
.mms .sum ul.trust{display:grid;gap:10px;font-size:14.5px;color:rgba(255,255,255,.78);border-top:1px solid rgba(255,255,255,.12);padding-top:18px}
.mms .sum ul.trust li{display:flex;gap:10px;align-items:flex-start}
.mms .sum ul.trust li::before{content:"";flex:0 0 18px;height:18px;border-radius:50%;margin-top:2px;background:rgba(150,193,93,.2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M4.5 9.5l3 3 6-6.5' fill='none' stroke='%2396C15D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
.mms .sum ul.trust b{color:#fff;font-weight:700}
.mms .sum-help{border-top:1px solid rgba(255,255,255,.12);padding-top:18px;display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;font-size:14px;color:rgba(255,255,255,.65)}
.mms .sum-help .av{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.1);display:grid;place-items:center}
.mms .sum-help .av svg{width:22px;height:22px;stroke:var(--green);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .sum-help b{display:block;color:#fff;font-size:16px}
.mms .sum-help a:hover{text-decoration:underline;text-underline-offset:3px}

/* betaaliconen (zelfde sprite als de footer) */
.mms .payrow{display:flex;flex-wrap:wrap;gap:6px}
.mms .pay-i{display:block;width:40px;height:30px;border-radius:7px;background-image:url("https://merkmatrassen.com/wp-content/uploads/2026/02/payment_methods-26-feb.png");background-size:123.8px 124.3px;background-repeat:no-repeat;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.04)}
.mms .pay-i.p1{background-position:0 0}.mms .pay-i.p2{background-position:-41.9px 0}.mms .pay-i.p3{background-position:-83.8px 0}
.mms .pay-i.p4{background-position:0 -31.7px}.mms .pay-i.p5{background-position:-41.9px -31.7px}.mms .pay-i.p6{background-position:-83.8px -31.7px}
.mms .pay-i.p7{background-position:0 -63.7px}.mms .pay-i.p8{background-position:-41.9px -63.7px}.mms .pay-i.p9{background-position:-83.8px -63.7px}
.mms .pay-i.p10{background-position:0 -95.4px}

/* stappenbalk winkelwagen > gegevens > betalen */
.mms .flow{display:flex;align-items:center;gap:0;list-style:none;margin:0;padding:0;font-size:14px;font-weight:700;color:var(--ink-3)}
.mms .flow li{display:flex;align-items:center;gap:10px;white-space:nowrap}
.mms .flow li + li::before{content:"";width:clamp(24px,5vw,64px);height:2px;border-radius:2px;margin:0 12px;background:linear-gradient(90deg,var(--purple) var(--p,0%),var(--line) var(--p,0%))}
.mms .flow .n{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--cream);color:var(--ink-3);font-size:13px;transition:background var(--t) var(--ease),color var(--t) var(--ease)}
.mms .flow .n svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;display:none}
.mms .flow li.is-on{color:var(--ink)}
.mms .flow li.is-on .n{background:var(--purple);color:#fff}
.mms .flow li.is-done{color:var(--ink-2)}
.mms .flow li.is-done .n{background:var(--green-dot)}
.mms .flow li.is-done .n b{display:none}
.mms .flow li.is-done .n svg{display:block}
.mms .flow a:hover{color:var(--purple)}

/* melding onderin */
.mms-toast{position:fixed;left:50%;bottom:24px;z-index:1200;transform:translate(-50%,140%);background:var(--ink);color:#fff;border-radius:16px;padding:12px 12px 12px 18px;display:flex;align-items:center;gap:16px;font-family:var(--font);font-size:15px;font-weight:600;box-shadow:0 20px 50px rgba(42,37,35,.3);max-width:calc(100vw - 32px)}
.mms-toast button{font:inherit;font-weight:700;color:var(--green);background:rgba(255,255,255,.08);border:0;border-radius:10px;padding:8px 14px;cursor:pointer;white-space:nowrap}
.mms-toast button:hover{background:rgba(255,255,255,.14)}


@media (prefers-reduced-motion:reduce){.mms *,.mms *::before,.mms *::after{transition:none!important;animation:none!important}html{scroll-behavior:auto}}
@media (max-width:860px){
  .mms,.mms-co-head,.mms-co-foot,.mms-toast{--gutter:20px;--section:72px}
  .mms{font-size:16px}
  .mms .card{padding:22px 18px}
  .mms .form{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .mms .form .field,.mms .form .field.two-third{grid-column:span 2}
  .mms .form .field.half,.mms .form .field.third{grid-column:span 1}
  .mms .form .field.full-m{grid-column:span 2}
  .mms .sum{position:relative;top:auto;padding:26px 22px}
  .mms .flow{font-size:13px}
  .mms .flow .lbl-long{display:none}
  .mms .flow li + li::before{margin:0 8px}
}
@media (max-width:480px){
  .mms .flow{font-size:12.5px}
  .mms .flow li{gap:7px}
  .mms .flow .n{width:24px;height:24px;font-size:12px}
  .mms .flow li + li::before{width:14px;margin:0 6px}
}

/* ---- winkelwagen.css ---- */
/* ---------- winkelwagen ---------- */
.mms .cart-top{padding:44px 0 4px}
.mms .cart-top .flow{margin-bottom:30px}
.mms .ct-row{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 24px;flex-wrap:wrap}
.mms .ct-row h1{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.mms .ct-row h1 .n{font-size:17px;font-weight:600;letter-spacing:0;color:var(--ink-3)}
.mms .cart{padding:30px 0 var(--section)}
.mms .cart-grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:40px;align-items:start}

/* bezorgbalk */
.mms .shipbar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;background:var(--green-tint);border-radius:20px;padding:14px 20px 14px 14px;margin-bottom:18px;color:#2F5D22;font-size:15.5px;overflow:hidden;position:relative}
.mms .shipbar .ic{width:46px;height:46px;border-radius:14px;background:#fff;display:grid;place-items:center;overflow:hidden}
.mms .shipbar .ic svg{width:24px;height:24px;stroke:var(--green-dot);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .shipbar b{color:#244A19;font-weight:700}
.mms .shipbar small{display:block;color:#4F6B43;font-size:14px;font-weight:500}
.mms .shipbar .pill{background:#fff;color:#2F5D22}

/* artikelen */
.mms .items{display:grid;gap:16px}
.mms .item{display:grid;grid-template-columns:184px minmax(0,1fr);gap:28px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-card);padding:18px;transition:box-shadow .4s var(--ease),border-color .4s var(--ease);overflow:hidden}
.mms .item:hover{box-shadow:0 24px 60px rgba(97,41,83,.08);border-color:transparent}
.mms .it-media{background:var(--cream);border-radius:18px;aspect-ratio:1/1;display:grid;place-items:center;overflow:hidden}
.mms .it-media img{width:90%;height:auto;max-height:90%;object-fit:contain;mix-blend-mode:multiply;transition:transform .7s var(--ease)}
.mms .item:hover .it-media img{transform:scale(1.05)}
.mms .it-body{display:grid;gap:14px;align-content:start;padding:6px 8px 2px 0;min-width:0}
.mms .it-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
.mms .it-type{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.mms .it-title h3{font-size:21px;margin:4px 0 10px}
.mms .it-title h3 a{transition:color var(--t) var(--ease)}
.mms .it-title h3 a:hover{color:var(--purple)}
.mms .it-chips{display:flex;flex-wrap:wrap;gap:8px}
.mms .it-price{text-align:right;display:grid;gap:1px;justify-items:end;flex:none}
.mms .it-price s{color:var(--ink-3);font-size:15px;font-variant-numeric:tabular-nums}
.mms .it-price b{font-size:23px;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.mms .it-price .each{font-size:13px;color:var(--ink-3);font-weight:600}
.mms .it-save{font-size:11px;font-weight:700;color:#fff;background:#C20F15;padding:5px 10px;border-radius:999px;margin-top:6px;white-space:nowrap;line-height:1.2}
.mms .it-facts{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:14.5px;color:var(--ink-2)}
.mms .it-facts li{display:flex;gap:8px;align-items:center}
.mms .it-facts svg{width:18px;height:18px;stroke:var(--purple);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mms .it-foot{display:flex;align-items:center;gap:10px 20px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:14px;margin-top:2px}
.mms .qty{display:inline-flex;align-items:center;border:1.5px solid var(--line);border-radius:12px;height:46px;overflow:hidden;background:#fff}
.mms .qty button{width:44px;height:100%;display:grid;place-items:center;transition:background var(--t) var(--ease)}
.mms .qty button svg{width:16px;height:16px;stroke:var(--ink);fill:none;stroke-width:2.2;stroke-linecap:round}
.mms .qty button:hover:not(:disabled){background:var(--cream)}
.mms .qty button:disabled{opacity:.28;cursor:not-allowed}
.mms .qty .v{min-width:30px;height:24px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums;overflow:hidden;position:relative;line-height:24px}
.mms .it-link{font-size:15px;font-weight:600;color:var(--ink-2);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line);transition:color var(--t),text-decoration-color var(--t)}
.mms .it-link:hover{color:var(--purple);text-decoration-color:var(--purple-line)}
.mms .it-remove{margin-left:auto;display:inline-flex;gap:8px;align-items:center;font-size:15px;font-weight:600;color:var(--ink-3);padding:9px 12px;border-radius:10px;transition:color var(--t),background var(--t)}
.mms .it-remove svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .it-remove:hover{color:var(--red);background:var(--red-tint)}

/* kortingscode */
.mms .coupon{margin-top:18px;border-radius:18px;border:1.5px dashed var(--line);padding:4px 18px}
.mms .cp-toggle{display:flex;align-items:center;gap:10px;width:100%;padding:14px 0;font-weight:700;font-size:15.5px;color:var(--ink-2);text-align:left}
.mms .cp-toggle:hover{color:var(--purple)}
.mms .cp-toggle .pm{width:26px;height:26px;border-radius:50%;background:var(--cream);display:grid;place-items:center;transition:transform .4s var(--ease),background var(--t)}
.mms .cp-toggle .pm svg{width:14px;height:14px;stroke:var(--purple);fill:none;stroke-width:2.4;stroke-linecap:round}
.mms .cp-toggle[aria-expanded="true"] .pm{transform:rotate(45deg);background:var(--purple-tint)}
.mms .cp-body{overflow:hidden}
.mms .cp-form{display:flex;gap:10px;padding:2px 0 16px}
.mms .cp-form input{max-width:320px;text-transform:uppercase;letter-spacing:.06em}
.mms .cp-form .btn{padding:13px 22px}
.mms .cp-msg{font-size:14px;font-weight:600;color:var(--red);margin:-6px 0 14px}
.mms .cp-applied{display:flex;align-items:center;gap:10px;padding:14px 0;font-size:15px;color:var(--ink-2)}
.mms .cp-applied .chip{background:var(--green-tint);border-color:transparent;color:#2F5D22;padding-right:6px}
.mms .cp-applied .chip svg{stroke:#2F5D22}
.mms .cp-applied .chip button{width:22px;height:22px;border-radius:50%;display:grid;place-items:center}
.mms .cp-applied .chip button:hover{background:rgba(255,255,255,.7)}

/* hulp */
.mms .assist{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}
.mms .as-card{background:var(--cream);border-radius:var(--r-card);padding:26px;display:grid;grid-template-columns:52px 1fr;gap:18px;align-items:start;transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.mms .as-card:hover{transform:translateY(-3px);box-shadow:0 24px 60px rgba(97,41,83,.08)}
.mms .as-card .ic{width:52px;height:52px;border-radius:16px;background:#fff;display:grid;place-items:center}
.mms .as-card .ic svg{width:26px;height:26px;stroke:var(--purple);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .as-card b{display:block;font-size:17px;margin-bottom:4px}
.mms .as-card p{font-size:15px;color:var(--ink-2);margin-bottom:10px}

/* samenvatting */
.mms .cart-side .sum .btn-light svg:first-child{width:18px;height:18px}
.mms .sum-pay{justify-content:center;margin-top:-4px}
.mms .sum-pay .pay-i{width:36px;height:27px;background-size:111.4px 111.9px}
.mms .sum-pay .pay-i.p8{background-position:-37.7px -57.3px}
.mms .sum-pay .pay-i.p4{background-position:0 -28.5px}
.mms .sum-pay .pay-i.p3{background-position:-75.4px 0}
.mms .sum-pay .pay-i.p7{background-position:0 -57.3px}
.mms .sum-pay .pay-i.p1{background-position:0 0}
.mms .sum-pay .pay-i.p10{background-position:0 -85.9px}
.mms .sum-pay .pay-i.p5{background-position:-37.7px -28.5px}
.mms .sum .r.coupon-row b{color:var(--green)}
.mms .sum .r em{font-style:normal}

/* lege winkelwagen */
.mms .empty{padding:56px 0 var(--section)}
.mms .em-box{max-width:720px;margin:0 auto;text-align:center;display:grid;justify-items:center}
.mms .em-box .lead{margin-left:auto;margin-right:auto}
.mms .em-ill{width:180px;height:132px;margin-bottom:26px}
.mms .em-ill svg{width:100%;height:100%;overflow:visible}
.mms .em-ctas{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:28px}
.mms .em-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:64px}
.mms .pc{display:grid;background:var(--cream);border-radius:var(--r-card);padding:22px 22px 24px;gap:6px;position:relative;transition:transform .4s var(--ease),box-shadow .4s var(--ease),background .4s var(--ease)}
.mms .pc:hover{transform:translateY(-4px);box-shadow:0 24px 60px rgba(97,41,83,.1);background:var(--cream-2)}
.mms .pc img{width:84%;height:auto;object-fit:contain;margin:18px auto 14px;mix-blend-mode:multiply;transition:transform .7s var(--ease)}
.mms .pc:hover img{transform:scale(1.04)}
.mms .pc .flag{position:absolute;left:16px;top:16px;font-size:12px;font-weight:700;padding:5px 10px;border-radius:999px;background:var(--green-tint);color:var(--green-ink)}
.mms .pc .flag.p{background:var(--purple);color:#fff}
.mms .pc b{font-size:21px;letter-spacing:-.02em;line-height:1.2}
.mms .pc span{font-size:14.5px;color:var(--ink-2)}
.mms .pc em{font-style:normal;font-weight:700;margin-top:8px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.mms .pc em svg{width:20px;height:20px;stroke:var(--purple);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--t) var(--ease)}
.mms .pc:hover em svg{transform:translateX(4px)}

/* vaste balk onderin (mobiel) */
.mbar{display:none}
@media (max-width:1100px){
  .mms .cart-grid{grid-template-columns:minmax(0,1fr) 340px;gap:28px}
  .mms .item{grid-template-columns:140px minmax(0,1fr);gap:20px}
}
@media (max-width:960px){
  .mms .cart-grid{grid-template-columns:minmax(0,1fr)}
  .mms .cart-side{max-width:560px}
}
@media (max-width:860px){
  .mms .cart-top{padding:24px 0 0}
  .mms .cart-top .flow{margin-bottom:20px}
  .mms .ct-row .tlink{display:none}
  .mms .cart{padding:20px 0 64px}
  .mms .shipbar{grid-template-columns:auto 1fr;padding:12px 14px 12px 12px;font-size:14.5px}
  .mms .shipbar .pill{display:none}
  .mms .item{grid-template-columns:96px minmax(0,1fr);gap:14px;padding:14px}
  .mms .it-media{border-radius:14px}
  .mms .it-body{padding:0;gap:12px}
  .mms .it-head{flex-direction:column;gap:6px}
  .mms .it-title h3{font-size:17.5px;margin:2px 0 8px}
  .mms .it-price{display:flex;flex-wrap:wrap;align-items:center;text-align:left;gap:4px 10px}
  .mms .it-price b{font-size:19px;order:-1}
  .mms .it-price .it-save{margin-top:0}
  .mms .it-facts{display:grid;gap:6px;font-size:13.5px;grid-column:1/-1}
  .mms .it-foot{gap:10px;padding-top:12px}
  .mms .it-link{display:none}
  .mms .it-remove span{display:none}
  .mms .assist{grid-template-columns:1fr}
  .mms .as-card{padding:20px;grid-template-columns:44px 1fr;gap:14px}
  .mms .as-card .ic{width:44px;height:44px;border-radius:12px}
  .mms .em-grid{grid-template-columns:1fr;gap:14px;margin-top:44px}
  .mms .em-box h1{font-size:34px}
  .mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1100;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:12px max(16px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) 16px;align-items:center;gap:14px;font-family:var(--font);transform:translateY(110%);transition:transform .45s var(--ease);box-shadow:0 -12px 30px rgba(42,37,35,.08)}
  .mbar.is-on{transform:none}
  .mbar div{flex:1;min-width:0}
  .mbar small{display:block;font-size:12.5px;color:var(--ink-3);font-weight:600}
  .mbar b{font-size:21px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
  .mbar .btn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:var(--r-btn);background:var(--purple);color:#fff;font:600 16px/1.2 var(--font);text-decoration:none}
  .mbar .btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
}

/* ---- afrekenen.css ---- */
/* ---------- afrekenen ---------- */
.mms.mms--checkout{background:linear-gradient(180deg,var(--white) 0,var(--cream) 220px,var(--cream) 100%)}
.mms .co-top{padding:34px 0 0}
.mms .co-top .flow{justify-content:center}
.mms .co-main{padding:30px 0 96px}
.mms .co-grid{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:40px;align-items:start}

/* inloggen-balk */
.mms .co-login{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--white);border-radius:18px;padding:14px 18px;margin-bottom:16px;font-size:15.5px;color:var(--ink-2);box-shadow:0 10px 30px rgba(97,41,83,.05)}
.mms .co-login svg{width:22px;height:22px;stroke:var(--purple);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mms .co-login > span{flex:1;min-width:0}
.mms .co-login > span button{font-weight:700;color:var(--purple);text-decoration:underline;text-underline-offset:3px}
.mms .co-login-panel{overflow:hidden;flex:0 0 100%}
.mms .co-login-panel .inner{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end;padding:4px 0 2px;width:100%}
.mms .co-login-panel .inner .btn{padding:13px 22px}
.mms .co-login-panel small{grid-column:1/-1;font-size:13.5px;color:var(--ink-3)}
.mms .co-login-panel small a{color:var(--purple);font-weight:700}

/* stappen in het formulier (zelfde opbouw als het afspraakformulier) */
.mms .co-panel{background:var(--white);border-radius:var(--r-card);box-shadow:0 24px 60px rgba(97,41,83,.07);padding:12px 40px}
.mms .step{display:grid;grid-template-columns:44px minmax(0,1fr);gap:20px;padding:32px 0;border-top:1px solid var(--line);position:relative}
.mms .step:first-child{border-top:0}
.mms .step-n{width:44px;height:44px;border-radius:50%;background:var(--cream);color:var(--purple);display:grid;place-items:center;font-weight:700;transition:background var(--t) var(--ease),color var(--t) var(--ease),box-shadow var(--t) var(--ease)}
.mms .step-n svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;display:none}
.mms .step:focus-within .step-n{box-shadow:0 0 0 5px var(--purple-tint)}
.mms .step.done .step-n{background:var(--green-dot);color:var(--white)}
.mms .step.done .step-n svg{display:block}
.mms .step.done .step-n b{display:none}
.mms .step-h{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 14px;margin-bottom:20px}
.mms .step-h h2{font-size:23px;letter-spacing:-.015em}
.mms .step-h small{color:var(--ink-3);font-size:14.5px;font-weight:600}
.mms .step .form + .form,.mms .sub-block{margin-top:18px}

/* adres */
.mms .addr-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.mms .addr-top .lbl{font-size:14px}
.mms .found{grid-column:1/-1;display:none;align-items:center;gap:14px;background:var(--green-tint);border-radius:14px;padding:13px 16px;color:#2F5D22;font-size:15.5px}
.mms .found.is-on{display:flex}
.mms .found .ic{width:34px;height:34px;border-radius:50%;background:#fff;display:grid;place-items:center;flex:none}
.mms .found .ic svg{width:18px;height:18px;stroke:var(--green-dot);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mms .found b{color:#244A19;display:block}
.mms .found button{margin-left:auto;font-size:14px;font-weight:700;color:#2F5D22;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.mms .found.is-warn{background:#FFF6E6;color:#7A5410}
.mms .found.is-warn .ic svg{stroke:#C98A16}
.mms .found.is-warn b{color:#5E400A}
.mms .found.is-busy .ic svg{animation:mms-spin .9s linear infinite}
.mms .manual{grid-column:1/-1;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.mms .toggles{display:grid;gap:14px;margin-top:22px;padding-top:20px;border-top:1px dashed var(--line)}
.mms .reveal{overflow:hidden}
.mms .reveal > .form{padding-top:16px}
.mms .deliv{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;margin-top:22px;background:var(--cream);border-radius:18px;padding:16px 18px}
.mms .deliv .ic{width:46px;height:46px;border-radius:14px;background:#fff;display:grid;place-items:center;overflow:hidden}
.mms .deliv .ic svg{width:24px;height:24px;stroke:var(--purple);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .deliv b{display:block;font-size:16px}
.mms .deliv span{font-size:14.5px;color:var(--ink-2)}
.mms .deliv b span{font-size:inherit;color:inherit}
.mms .deliv b .free{color:var(--green-ink);font-weight:700}

/* e-mail suggestie */
.mms .sugg{font-size:14px;color:var(--ink-2)}
.mms .sugg button{font-weight:700;color:var(--purple);text-decoration:underline;text-underline-offset:3px}

/* betaalwijzen */
.mms .pays{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mms .pm-opt{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;background:var(--white);border:1.5px solid var(--line);border-radius:16px;padding:14px 16px;cursor:pointer;transition:border-color var(--t) var(--ease),background var(--t) var(--ease),box-shadow var(--t) var(--ease),transform var(--t) var(--ease)}
.mms .pm-opt:hover{border-color:var(--purple-line);transform:translateY(-1px)}
.mms .pm-opt input{position:absolute;opacity:0;pointer-events:none}
.mms .pm-opt .radio{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--ink-3);display:grid;place-items:center;transition:border-color var(--t)}
.mms .pm-opt .radio::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--purple);transform:scale(0);transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.mms .pm-opt b{display:block;font-size:16px;line-height:1.3}
.mms .pm-opt small{display:block;font-size:13.5px;color:var(--ink-3);font-weight:600;line-height:1.35}
.mms .pm-opt .logos{display:flex;gap:4px}
.mms .pm-opt:has(.tag){padding-top:22px}
.mms .pm-opt .tag{position:absolute;top:-10px;left:14px;font-size:11.5px;font-weight:700;letter-spacing:.04em;padding:3px 9px;border-radius:999px;background:var(--purple);color:#fff}
.mms .pm-opt:has(input:checked){border-color:var(--purple);background:var(--purple-tint);box-shadow:0 10px 26px rgba(97,41,83,.1)}
.mms .pm-opt:has(input:checked) .radio{border-color:var(--purple)}
.mms .pm-opt:has(input:checked) .radio::after{transform:scale(1)}
.mms .pm-opt:has(input:focus-visible){outline:3px solid var(--green);outline-offset:2px}
.mms .pm-opt.is-hidden{display:none}
.mms .pm-extra{grid-column:1/-1;overflow:hidden}
.mms .pm-extra .inner{display:grid;grid-template-columns:minmax(0,260px) 1fr;gap:16px;align-items:end;background:var(--cream);border-radius:16px;padding:16px 18px;margin-top:4px}
.mms .pm-extra .inner p{font-size:14px;color:var(--ink-2);padding-bottom:12px}
.mms .pays-err{grid-column:1/-1;font-size:14px;font-weight:600;color:var(--red);display:none}
.mms .pays.is-error .pays-err{display:block}
.mms .pays.is-error .pm-opt{border-color:#E7B3A8}

/* account */
.mms .acct-box{margin-top:22px;border-radius:18px;background:var(--cream);padding:18px 20px}
.mms .acct-box .reveal > .form{padding-top:14px}
.mms .meter{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:2px}
.mms .meter i{height:4px;border-radius:4px;background:var(--line);transition:background var(--t)}
.mms .meter[data-s="1"] i:nth-child(-n+1){background:#D9734E}
.mms .meter[data-s="2"] i:nth-child(-n+2){background:#E6A93A}
.mms .meter[data-s="3"] i:nth-child(-n+3){background:var(--green)}
.mms .meter[data-s="4"] i{background:var(--green-dot)}

/* afronden */
.mms .co-place{display:grid;gap:16px;padding:28px 0 32px 64px;border-top:1px solid var(--line)}
.mms .co-place .legal{font-size:14px;color:var(--ink-3)}
.mms .co-place .legal a{color:var(--ink-2);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.mms .co-place .btn{justify-content:space-between;width:100%;max-width:520px}
.mms .co-place .btn .amt{font-variant-numeric:tabular-nums;padding-left:16px;border-left:1px solid rgba(255,255,255,.25)}
.mms .co-place .goes{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-3)}
.mms .co-place .goes svg{width:16px;height:16px;stroke:var(--green-dot);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mms .co-err{background:var(--red-tint);color:var(--red);border-radius:14px;padding:12px 16px;font-size:14.5px;font-weight:600}

/* overzicht rechts */
.mms .co-side .sum{gap:18px}
.mms .co-lines{display:grid;gap:14px;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:18px}
.mms .co-line{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center}
.mms .co-line .th{position:relative;width:64px;height:64px;border-radius:14px;background:var(--cream);display:grid;place-items:center}
.mms .co-line .th img{width:86%;height:auto;max-height:86%;object-fit:contain;mix-blend-mode:multiply}
.mms .co-line .th em{position:absolute;top:-7px;right:-7px;min-width:22px;height:22px;border-radius:999px;background:var(--green);color:var(--purple-deep);font-style:normal;font-size:12px;font-weight:700;display:grid;place-items:center;padding:0 6px}
.mms .co-line b{display:block;font-size:15px;line-height:1.3}
.mms .co-line span{font-size:13.5px;color:rgba(255,255,255,.6)}
.mms .co-line .pr{font-weight:700;font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
.mms .co-edit{font-size:13.5px;font-weight:700;color:var(--green);text-decoration:underline;text-underline-offset:3px;justify-self:start}
.mms .co-eta{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;background:rgba(255,255,255,.07);border-radius:16px;padding:14px 16px;font-size:14px;color:rgba(255,255,255,.7)}
.mms .co-eta svg{width:22px;height:22px;stroke:var(--green);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .co-eta b{display:block;color:#fff;font-size:15.5px}

/* mobiel: overzicht inklapbaar bovenaan */


/* bedankt */
.mms .thanks{padding:48px 0 var(--section)}
.mms .done-head{text-align:center;display:grid;justify-items:center;max-width:720px;margin:0 auto}
.mms .done-head .ok{width:76px;height:76px;border-radius:50%;background:var(--green-dot);display:grid;place-items:center;margin-bottom:22px;box-shadow:0 0 0 10px var(--green-tint)}
.mms .done-head .ok svg{width:36px;height:36px;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.mms .done-head .ok path{stroke-dasharray:30;stroke-dashoffset:30;animation:mms-draw .6s .35s var(--ease) forwards}
@keyframes mms-draw{to{stroke-dashoffset:0}}
.mms .done-head h1{font-size:clamp(32px,4vw,52px)}
.mms .done-head .lead{margin-left:auto;margin-right:auto}
.mms .done-head .ordno{margin-top:18px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.mms .done-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;margin-top:48px;align-items:start}
.mms .track h2{font-size:22px;margin-bottom:6px}
.mms .track > p{color:var(--ink-2);font-size:15.5px;margin-bottom:24px}
.mms .tl{position:relative;display:grid;gap:0}
.mms .tl::before{content:"";position:absolute;left:21px;top:22px;bottom:22px;width:2px;background:var(--line);border-radius:2px}
.mms .tl .bar{position:absolute;left:21px;top:22px;width:2px;background:var(--green-dot);border-radius:2px;height:0}
.mms .tl li{position:relative;display:grid;grid-template-columns:44px 1fr auto;gap:16px;align-items:start;padding:10px 0}
.mms .tl .dot{width:44px;height:44px;border-radius:50%;background:var(--white);border:2px solid var(--line);display:grid;place-items:center;position:relative;z-index:1;transition:background .4s var(--ease),border-color .4s var(--ease)}
.mms .tl .dot svg{width:20px;height:20px;stroke:var(--ink-3);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:stroke .4s}
.mms .tl li.is-done .dot{background:var(--green-dot);border-color:var(--green-dot)}
.mms .tl li.is-done .dot svg{stroke:#fff}
.mms .tl li.is-now .dot{border-color:var(--purple);box-shadow:0 0 0 6px var(--purple-tint)}
.mms .tl li.is-now .dot svg{stroke:var(--purple)}
.mms .tl b{display:block;font-size:16.5px;padding-top:9px}
.mms .tl span{font-size:14.5px;color:var(--ink-2)}
.mms .tl time{font-size:14px;font-weight:700;color:var(--ink-3);padding-top:11px;white-space:nowrap;font-variant-numeric:tabular-nums}
.mms .tl li.is-done time{color:var(--green-ink)}
.mms .done-side{display:grid;gap:24px}
.mms .acct-cta{background:var(--purple-deep);color:#fff;border-radius:var(--r-card);padding:30px;display:grid;gap:12px;position:relative;overflow:hidden;isolation:isolate}
.mms .acct-cta::before{content:"";position:absolute;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(150,193,93,.25),transparent 70%);right:-90px;top:-90px;z-index:-1}
.mms .acct-cta .kicker{color:var(--green);margin:0}
.mms .acct-cta h3{font-size:22px}
.mms .acct-cta p{color:rgba(255,255,255,.75);font-size:15.5px}
.mms .acct-cta .btn{justify-self:start;margin-top:6px}
.mms .done-facts{display:grid;gap:14px;font-size:15px}
.mms .done-facts .r{display:grid;grid-template-columns:130px 1fr;gap:12px}
.mms .done-facts dt{color:var(--ink-3);font-weight:600}
.mms .done-facts dd{margin:0;font-weight:600}
.mms .done-facts{margin:0}
.mms .done-items{display:grid;gap:12px;margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.mms .done-items .co-line span{color:var(--ink-3)}
.mms .done-items .co-line .th{background:var(--cream)}

@media (max-width:1100px){.mms .co-grid{grid-template-columns:minmax(0,1fr) 360px;gap:28px}.mms .co-panel{padding:8px 28px}}
@media (max-width:960px){
  .mms .co-grid{grid-template-columns:minmax(0,1fr)}
  .mms .co-side{display:none}
  .mms .co-msum{display:block;margin-bottom:16px;background:var(--purple-deep);color:#fff;border-radius:18px;overflow:hidden}
  .mms .co-msum > button{width:100%;display:flex;align-items:center;gap:12px;padding:16px 18px;color:#fff;font-weight:700;font-size:15.5px;text-align:left}
  .mms .co-msum > button svg{width:18px;height:18px;stroke:var(--green);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease)}
  .mms .co-msum > button[aria-expanded="true"] svg.chev{transform:rotate(180deg)}
  .mms .co-msum > button .amt{margin-left:auto;font-size:19px;font-variant-numeric:tabular-nums}
  .mms .co-msum .body{overflow:hidden}
  .mms .co-msum .body .sum{border-radius:0;padding:4px 18px 22px;position:relative;top:auto}
  .mms .co-msum .body .sum::before{display:none}
  .mms .done-grid{grid-template-columns:1fr}
}
@media (max-width:860px){
  .mms .co-top{padding:18px 0 0}
  .mms .co-main{padding:18px 0 64px}
  .mms .co-panel{padding:4px 18px}
  .mms .step{grid-template-columns:1fr;gap:14px;padding:26px 0}
  .mms .step-n{position:absolute;top:24px;left:0;width:32px;height:32px;font-size:14px}
  .mms .step-n svg{width:16px;height:16px}
  .mms .step-h{padding-left:44px;min-height:32px;align-items:center;margin-bottom:14px}
  .mms .step-h h2{font-size:20px}
  .mms .step-h small{width:100%;font-size:13.5px}
  .mms .pays{grid-template-columns:1fr}
  .mms .pm-extra .inner{grid-template-columns:1fr;gap:6px}
  .mms .pm-extra .inner p{padding-bottom:0}
  .mms .co-place{padding:24px 0 28px}
  .mms .co-place .btn{max-width:none;padding:18px 20px;font-size:16px;gap:8px}
  .mms .co-place .btn .amt{padding-left:12px}
  .mms .co-login{align-items:flex-start;padding:14px 16px}
  .mms .co-login-panel .inner{grid-template-columns:1fr}
  .mms .manual{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .mms .thanks{padding:28px 0 64px}
  .mms .done-grid{margin-top:32px}
  .mms .done-facts .r{grid-template-columns:110px 1fr}
}

/* ---- mijn-account.css ---- */
/* ---------- mijn account ---------- */
.mms.mms--account{background:linear-gradient(180deg,var(--white) 0,var(--cream) 260px,var(--cream) 100%)}

/* ===== uitgelogd ===== */
.mms .auth{padding:56px 0 var(--section)}
.mms .auth-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:stretch;max-width:1160px;margin:0 auto}
.mms .auth-card{background:var(--white);border-radius:var(--r-card);box-shadow:0 24px 60px rgba(97,41,83,.08);padding:44px;display:grid;gap:24px;align-content:start}
.mms .auth-card h1{font-size:clamp(32px,3.4vw,44px)}
.mms .auth-card .lead{font-size:17px;margin-top:10px}
.mms .auth-card .seg{width:100%}
.mms .auth-pane{display:grid;gap:16px}
.mms .auth-row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.mms .auth-row a,.mms .auth-row button.link{font-size:15px;font-weight:700;color:var(--purple);text-decoration:underline;text-underline-offset:3px}
.mms .auth-pane .btn{width:100%}
.mms .auth-note{font-size:14px;color:var(--ink-3)}
.mms .auth-note a{color:var(--purple);font-weight:700}
.mms .auth-sent{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;background:var(--green-tint);color:#2F5D22;border-radius:16px;padding:16px 18px;font-size:15px}
.mms .auth-sent svg{width:22px;height:22px;stroke:var(--green-dot);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-top:1px}
.mms .auth-sent b{display:block;color:#244A19}

.mms .auth-side{position:relative;overflow:hidden;isolation:isolate;background:var(--purple-deep);color:#fff;border-radius:var(--r-card);padding:44px;display:grid;gap:26px;align-content:start}
.mms .auth-side::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(97,41,83,.95),transparent 70%);right:-220px;top:-240px;z-index:-1}
.mms .auth-side::after{content:"";position:absolute;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(150,193,93,.18),transparent 70%);left:-120px;bottom:-140px;z-index:-1}
.mms .auth-side .kicker{color:var(--green);margin:0}
.mms .auth-side h2{font-size:clamp(26px,2.6vw,34px)}
.mms .feat{display:grid;gap:16px}
.mms .feat li{display:grid;grid-template-columns:48px 1fr;gap:16px;align-items:start}
.mms .feat .ic{width:48px;height:48px;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);display:grid;place-items:center}
.mms .feat .ic svg{width:24px;height:24px;stroke:var(--green);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .feat b{display:block;font-size:17px}
.mms .feat span{font-size:15px;color:rgba(255,255,255,.7)}
.mms .track-box{border-top:1px solid rgba(255,255,255,.14);padding-top:24px;display:grid;gap:14px}
.mms .track-box b{font-size:17px}
.mms .track-box p{font-size:14.5px;color:rgba(255,255,255,.7)}
.mms .track-box label{color:#fff}
.mms .track-box input{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:#fff}
.mms .track-box input::placeholder{color:rgba(255,255,255,.4)}
.mms .track-box input:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(150,193,93,.18)}
.mms .track-box .btn{justify-self:start}

/* ===== ingelogd ===== */
.mms .dash-top{padding:44px 0 0}
.mms .dash-hello{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 24px;flex-wrap:wrap}
.mms .dash-hello h1{font-size:clamp(34px,4vw,52px)}
.mms .dash-hello .meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.mms .dash{padding:36px 0 var(--section)}
.mms .dash-grid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:40px;align-items:start}
.mms .side-nav{position:sticky;top:calc(var(--mms-hh,100px) + 24px);background:var(--white);border-radius:var(--r-card);padding:12px;box-shadow:0 24px 60px rgba(97,41,83,.06)}
.mms .side-nav ul{display:grid;gap:2px}
.mms .side-nav a{position:relative;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;font-weight:600;font-size:15.5px;color:var(--ink-2);transition:background var(--t) var(--ease),color var(--t) var(--ease);z-index:1}
.mms .side-nav a svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mms .side-nav a:hover{color:var(--ink);background:var(--cream)}
.mms .side-nav a[aria-current="page"]{color:var(--purple);font-weight:700}
.mms .side-nav .cnt{margin-left:auto;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--cream-2);color:var(--ink-2);font-size:12px;font-weight:700;display:grid;place-items:center}
.mms .side-nav .soon{margin-left:auto;font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px;background:var(--green-tint);color:var(--green-ink)}
.mms .side-nav .hl{position:absolute;left:12px;right:12px;top:12px;height:48px;border-radius:14px;background:var(--purple-tint);z-index:0;pointer-events:none}
.mms .side-nav hr{border:0;border-top:1px solid var(--line);margin:8px 6px}
.mms .side-nav .out{color:var(--ink-3)}

.mms .panel{display:grid;gap:24px}
.mms .panel[hidden]{display:none}
.mms .p-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.mms .p-head h2{font-size:clamp(26px,2.6vw,34px)}
.mms .p-head p{color:var(--ink-2);margin-top:6px}

/* actieve bestelling */
.mms .live{background:var(--white);border-radius:var(--r-card);box-shadow:0 24px 60px rgba(97,41,83,.08);overflow:hidden}
.mms .live-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;padding:30px 34px 0}
.mms .live-top .kicker{margin-bottom:6px}
.mms .live-top h3{font-size:24px}
.mms .live-top h3 small{font-size:15px;font-weight:600;color:var(--ink-3);letter-spacing:0;margin-left:6px}
.mms .stg{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:34px 34px 30px}
.mms .stg-line{position:absolute;left:calc(34px + 12.5% - 0px);right:calc(34px + 12.5%);top:56px;height:3px;border-radius:3px;background:var(--line)}
.mms .stg-line i{position:absolute;left:0;top:0;bottom:0;border-radius:3px;background:var(--green-dot);width:0}
.mms .stg-step{position:relative;display:grid;justify-items:center;text-align:center;gap:4px;padding:0 6px}
.mms .stg-step .dot{width:46px;height:46px;border-radius:50%;background:var(--white);border:2px solid var(--line);display:grid;place-items:center;margin-bottom:8px;position:relative;z-index:1}
.mms .stg-step .dot svg{width:20px;height:20px;stroke:var(--ink-3);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .stg-step b{font-size:15.5px;line-height:1.3}
.mms .stg-step span{font-size:13.5px;color:var(--ink-3);font-weight:600}
.mms .stg-step.is-done .dot{background:var(--green-dot);border-color:var(--green-dot)}
.mms .stg-step.is-done .dot svg{stroke:#fff}
.mms .stg-step.is-now .dot{border-color:var(--purple);background:var(--white);box-shadow:0 0 0 7px var(--purple-tint)}
.mms .stg-step.is-now .dot svg{stroke:var(--purple)}
.mms .stg-step.is-now .dot::after{content:"";position:absolute;inset:-9px;border-radius:50%;border:2px solid var(--purple-line);animation:acc-ring 2.4s var(--ease) infinite}
@keyframes acc-ring{0%{transform:scale(.85);opacity:1}100%{transform:scale(1.25);opacity:0}}
.mms .stg-step.is-now b{color:var(--purple)}
.mms .live-foot{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;background:var(--cream);padding:20px 34px}
.mms .live-thumbs{display:flex}
.mms .live-thumbs span{width:56px;height:56px;border-radius:14px;background:var(--white);display:grid;place-items:center;border:2px solid var(--cream);margin-left:-12px;box-shadow:0 4px 12px rgba(42,37,35,.08)}
.mms .live-thumbs span:first-child{margin-left:0}
.mms .live-thumbs img{width:86%;height:auto;max-height:86%;object-fit:contain;mix-blend-mode:multiply}
.mms .live-eta b{display:block;font-size:17px}
.mms .live-eta b span{font-size:inherit;color:inherit}
.mms .live-eta span{font-size:14.5px;color:var(--ink-2)}

/* kaarten in het overzicht */
.mms .duo{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.mms .tile{background:var(--white);border-radius:var(--r-card);padding:28px;box-shadow:0 24px 60px rgba(97,41,83,.06);display:grid;gap:14px;align-content:start}
.mms .tile h3{font-size:19px}
.mms .tile p{font-size:15px;color:var(--ink-2)}
.mms .tile .tlink{font-size:15px}
.mms .sleep{display:grid;grid-template-columns:128px 1fr;gap:24px;align-items:center}
.mms .ring{position:relative;width:128px;height:128px}
.mms .ring svg{width:128px;height:128px;transform:rotate(-90deg)}
.mms .ring circle{fill:none;stroke-width:10;stroke-linecap:round}
.mms .ring .bg{stroke:var(--cream-2)}
.mms .ring .fg{stroke:var(--purple)}
.mms .ring .num{position:absolute;inset:0;display:grid;place-items:center;align-content:center;text-align:center}
.mms .ring .num b{font-size:32px;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.mms .ring .num small{font-size:12.5px;color:var(--ink-3);font-weight:700;margin-top:4px}
.mms .warranty{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center}
.mms .shield{width:72px;height:72px;border-radius:20px;background:var(--green-tint);display:grid;place-items:center}
.mms .shield svg{width:36px;height:36px;stroke:var(--green-dot);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .warranty b{font-size:26px;letter-spacing:-.02em;line-height:1.1;display:block}
.mms .warranty span{font-size:14.5px;color:var(--ink-2)}
.mms .bar-w{height:8px;border-radius:8px;background:var(--cream-2);overflow:hidden}
.mms .bar-w i{display:block;height:100%;border-radius:8px;background:var(--green-dot);width:0}

.mms .quick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.mms .q{display:grid;gap:6px;background:var(--white);border-radius:20px;padding:22px;box-shadow:0 14px 40px rgba(97,41,83,.05);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.mms .q:hover{transform:translateY(-3px);box-shadow:0 24px 60px rgba(97,41,83,.1)}
.mms .q .ic{width:44px;height:44px;border-radius:12px;background:var(--cream);display:grid;place-items:center;margin-bottom:6px}
.mms .q .ic svg{width:22px;height:22px;stroke:var(--purple);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .q b{font-size:16.5px;display:flex;justify-content:space-between;align-items:center}
.mms .q b svg{width:18px;height:18px;stroke:var(--purple);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--t) var(--ease)}
.mms .q:hover b svg{transform:translateX(4px)}
.mms .q span{font-size:14px;color:var(--ink-2)}

.mms .helpbar{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;background:var(--purple-deep);color:#fff;border-radius:var(--r-card);padding:24px 28px}
.mms .helpbar .av{width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.1);display:grid;place-items:center}
.mms .helpbar .av svg{width:24px;height:24px;stroke:var(--green);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .helpbar b{display:block;font-size:17px}
.mms .helpbar span{font-size:14.5px;color:rgba(255,255,255,.7)}
.mms .helpbar .acts{display:flex;gap:10px;flex-wrap:wrap}
.mms .helpbar .btn{padding:12px 18px;font-size:15px}

/* bestellingen */
.mms .orders{display:grid;gap:14px}
.mms .ord{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:20px;align-items:center;background:var(--white);border-radius:20px;padding:18px 22px;box-shadow:0 14px 40px rgba(97,41,83,.05);transition:transform .4s var(--ease),box-shadow .4s var(--ease);cursor:pointer;text-align:left;width:100%}
.mms .ord:hover{transform:translateY(-2px);box-shadow:0 24px 60px rgba(97,41,83,.1)}
.mms .ord .live-thumbs span{width:60px;height:60px}
.mms .ord b{display:block;font-size:16.5px}
.mms .ord .sub{font-size:14px;color:var(--ink-3);font-weight:600}
.mms .ord .what{font-size:14.5px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mms .ord .amt{font-weight:700;font-variant-numeric:tabular-nums;text-align:right}
.mms .ord .amt .pill{margin-top:6px}
.mms .ord .go{width:40px;height:40px;border-radius:50%;background:var(--cream);display:grid;place-items:center;transition:background var(--t),transform var(--t) var(--ease)}
.mms .ord .go svg{width:18px;height:18px;stroke:var(--purple);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mms .ord:hover .go{background:var(--purple-tint);transform:translateX(3px)}

/* bestelling detail */
.mms .od-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;align-items:start}
.mms .od-col{display:grid;gap:20px}
.mms .tl{position:relative;display:grid;gap:0}
.mms .tl::before{content:"";position:absolute;left:21px;top:22px;bottom:22px;width:2px;background:var(--line);border-radius:2px}
.mms .tl .bar{position:absolute;left:21px;top:22px;width:2px;background:var(--green-dot);border-radius:2px;height:0}
.mms .tl li{position:relative;display:grid;grid-template-columns:44px 1fr auto;gap:16px;align-items:start;padding:10px 0}
.mms .tl .dot{width:44px;height:44px;border-radius:50%;background:var(--white);border:2px solid var(--line);display:grid;place-items:center;position:relative;z-index:1}
.mms .tl .dot svg{width:20px;height:20px;stroke:var(--ink-3);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .tl li.is-done .dot{background:var(--green-dot);border-color:var(--green-dot)}
.mms .tl li.is-done .dot svg{stroke:#fff}
.mms .tl li.is-now .dot{border-color:var(--purple);box-shadow:0 0 0 6px var(--purple-tint)}
.mms .tl li.is-now .dot svg{stroke:var(--purple)}
.mms .tl b{display:block;font-size:16.5px;padding-top:9px}
.mms .tl span{font-size:14.5px;color:var(--ink-2)}
.mms .tl span a{color:var(--purple);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.mms .tl time{font-size:14px;font-weight:700;color:var(--ink-3);padding-top:11px;white-space:nowrap;font-variant-numeric:tabular-nums}
.mms .tl li.is-done time{color:var(--green-ink)}
.mms .od-items{display:grid;gap:14px}
.mms .od-item{display:grid;grid-template-columns:72px 1fr auto;gap:16px;align-items:center}
.mms .od-item .th{width:72px;height:72px;border-radius:16px;background:var(--cream);display:grid;place-items:center}
.mms .od-item .th img{width:86%;height:auto;max-height:86%;object-fit:contain;mix-blend-mode:multiply}
.mms .od-item b{display:block;font-size:16px;line-height:1.3}
.mms .od-item span{font-size:14px;color:var(--ink-3)}
.mms .od-item .pr{font-weight:700;font-variant-numeric:tabular-nums}
.mms .od-sum{display:grid;gap:10px;border-top:1px solid var(--line);padding-top:16px;font-size:15px}
.mms .od-sum .r{display:flex;justify-content:space-between;gap:12px}
.mms .od-sum .r span{color:var(--ink-2)}
.mms .od-sum .r b{font-variant-numeric:tabular-nums}
.mms .od-sum .r.t{font-size:18px;border-top:1px solid var(--line);padding-top:12px;margin-top:4px}
.mms .od-sum .r.t span{color:var(--ink);font-weight:700}
.mms .od-facts{display:grid;gap:16px;margin:0}
.mms .od-facts div{display:grid;gap:2px}
.mms .od-facts dt{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.mms .od-facts dd{margin:0;font-size:15.5px}
.mms .od-acts{display:grid;gap:10px}
.mms .od-acts .btn{justify-content:center}
.mms .eta-big{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;background:var(--purple-tint);border-radius:18px;padding:18px 20px;margin-bottom:6px}
.mms .eta-big .ic{width:48px;height:48px;border-radius:14px;background:#fff;display:grid;place-items:center}
.mms .eta-big .ic svg{width:24px;height:24px;stroke:var(--purple);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .eta-big b{display:block;font-size:19px;color:var(--purple)}
.mms .eta-big span{font-size:14.5px;color:var(--ink-2)}
.mms .eta-big.is-green{background:var(--green-tint)}
.mms .eta-big.is-green b{color:#2F5D22}
.mms .eta-big.is-green .ic svg{stroke:var(--green-dot)}

/* adressen */
.mms .addr-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.mms .acard{background:var(--white);border-radius:var(--r-card);padding:28px;box-shadow:0 24px 60px rgba(97,41,83,.06);display:grid;gap:14px;align-content:start}
.mms .acard-h{display:flex;justify-content:space-between;align-items:center;gap:10px}
.mms .acard-h h3{font-size:19px;display:flex;align-items:center;gap:10px}
.mms .acard-h h3 svg{width:22px;height:22px;stroke:var(--purple);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .acard address{font-style:normal;font-size:16px;line-height:1.7;color:var(--ink-2)}
.mms .acard address b{color:var(--ink)}
.mms .acard .edit{font-size:15px;font-weight:700;color:var(--purple);display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:10px;transition:background var(--t)}
.mms .acard .edit:hover{background:var(--purple-tint)}
.mms .acard .edit svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mms .acard .reveal{overflow:hidden}
.mms .acard .form{padding-top:4px}
.mms .acard .acts{grid-column:1/-1;display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.mms .acard .acts .btn{padding:13px 22px}

/* gegevens */
.mms .set{background:var(--white);border-radius:var(--r-card);padding:32px;box-shadow:0 24px 60px rgba(97,41,83,.06)}
.mms .set h3{font-size:19px;margin-bottom:18px}
.mms .set + .set{margin-top:0}
.mms .set .acts{grid-column:1/-1;display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:6px}
.mms .set .acts small{font-size:13.5px;color:var(--ink-3)}

/* leeg (afspraken) */
.mms .blank{background:var(--white);border-radius:var(--r-card);padding:48px 32px;text-align:center;display:grid;justify-items:center;gap:12px;box-shadow:0 24px 60px rgba(97,41,83,.06)}
.mms .blank .ic{width:72px;height:72px;border-radius:22px;background:var(--purple-tint);display:grid;place-items:center;margin-bottom:6px}
.mms .blank .ic svg{width:34px;height:34px;stroke:var(--purple);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mms .blank h3{font-size:22px}
.mms .blank p{color:var(--ink-2);max-width:48ch}
.mms .blank .btn{margin-top:8px}

@media (max-width:1100px){
  .mms .dash-grid{grid-template-columns:220px minmax(0,1fr);gap:28px}
  .mms .quick{grid-template-columns:1fr 1fr}
  .mms .od-grid{grid-template-columns:1fr}
}
@media (max-width:960px){
  .mms .auth-grid{grid-template-columns:1fr}
  .mms .auth-side{order:2}
  .mms .dash-grid{grid-template-columns:minmax(0,1fr)}
  .mms .side-nav{position:sticky;top:calc(var(--mms-hh,100px) - 1px);z-index:20;border-radius:0;margin:0 calc(var(--gutter) * -1);padding:8px var(--gutter);box-shadow:0 1px 0 var(--line);background:rgba(246,245,242,.96);backdrop-filter:blur(10px);overflow-x:auto;scrollbar-width:none}
  .mms .side-nav::-webkit-scrollbar{display:none}
  .mms .side-nav ul{display:flex;gap:6px;width:max-content}
  .mms .side-nav hr,.mms .side-nav .hl{display:none}
  .mms .side-nav a{padding:9px 14px;border-radius:999px;background:var(--white);font-size:14.5px;white-space:nowrap;border:1px solid var(--line)}
  .mms .side-nav a[aria-current="page"]{background:var(--purple);color:#fff;border-color:var(--purple)}
  .mms .side-nav a[aria-current="page"] .cnt{background:rgba(255,255,255,.2);color:#fff}
  .mms .side-nav .cnt{min-width:20px;height:20px}
}
@media (max-width:860px){
  .mms .auth{padding:28px 0 64px}
  .mms .auth-card,.mms .auth-side{padding:26px 20px}
  .mms .track-box .form .field.half{grid-column:span 2}
  .mms .dash-top{padding:24px 0 0}
  .mms .dash-hello .btn{display:none}
  .mms .dash{padding:16px 0 64px}
  .mms .live-top{padding:22px 20px 0}
  .mms .live-top h3{font-size:20px}
  .mms .stg{padding:26px 8px 22px}
  .mms .stg-line{left:calc(8px + 12.5%);right:calc(8px + 12.5%);top:48px}
  .mms .stg-step .dot{width:38px;height:38px;margin-bottom:6px}
  .mms .stg-step .dot svg{width:17px;height:17px}
  .mms .stg-step b{font-size:13px}
  .mms .stg-step span{font-size:12px}
  .mms .live-foot{grid-template-columns:auto 1fr;padding:18px 20px}
  .mms .live-foot .btn{grid-column:1/-1;justify-content:center}
  .mms .duo,.mms .addr-cards{grid-template-columns:1fr}
  .mms .tile,.mms .acard,.mms .set{padding:22px 20px}
  .mms .sleep{grid-template-columns:104px 1fr;gap:18px}
  .mms .ring,.mms .ring svg{width:104px;height:104px}
  .mms .ring .num b{font-size:26px}
  .mms .ring .num small{font-size:11px}
  .mms .q{grid-template-columns:44px 1fr;column-gap:14px;row-gap:2px;padding:18px}
  .mms .q .ic{grid-row:span 2;margin:0}
  .mms .helpbar .av{display:none}
  .mms .helpbar{grid-template-columns:1fr}
  .mms .quick{grid-template-columns:1fr}
  .mms .helpbar{grid-template-columns:auto 1fr;padding:20px}
  .mms .helpbar .acts{grid-column:1/-1}
  .mms .ord{grid-template-columns:auto minmax(0,1fr) auto;gap:14px;padding:14px 16px}
  .mms .ord .go{display:none}
  .mms .ord .live-thumbs span{width:48px;height:48px}
  .mms .ord .live-thumbs span:nth-child(n+2){display:none}
  .mms .tl li{grid-template-columns:44px 1fr;gap:12px}
  .mms .tl time{grid-column:2;padding-top:0;margin-top:-4px}
}

/* ==========================================================================
   MM Shop – aanvullingen voor de echte WooCommerce-opmaak en Divi
   ========================================================================== */
body.mms-on #main-content{background:transparent}
body.mms-on #main-content .container{width:auto;max-width:none;padding:0}
body.mms-on #main-content .container::before{display:none}
.mms{position:relative;z-index:1}
.mms .woocommerce{width:100%;max-width:none;margin:0;padding:0}
.mms h1,.mms h2,.mms h3,.mms h4{padding:0;font-family:var(--font)}
.mms ul,.mms ol{line-height:inherit;list-style:none;margin:0;padding:0}
.mms li{padding:0}
.mms address{font-style:normal}
.mms .small{font-size:14px;color:var(--ink-3)}
.mms .small a{color:var(--purple);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.mms .g{color:var(--green-ink)}
.mms .pill.is-red{background:var(--red-tint);color:var(--red)}
.mms .em-ctas{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:20px}

/* meldingen van WooCommerce */
.mms .woocommerce-notices-wrapper:empty{display:none}
.mms .woocommerce-notices-wrapper,.mms .co-notices{max-width:var(--container);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.mms .co-notices:empty{display:none}
.mms .co-notices .woocommerce-notices-wrapper,.mms .panels .woocommerce-notices-wrapper,.mms .mms-notices .woocommerce-notices-wrapper{padding:0}
.mms .woocommerce-error,.mms .woocommerce-message,.mms .woocommerce-info,.mms .woocommerce-notice{list-style:none;margin:20px 0 0;padding:14px 18px 14px 18px;border-radius:16px;background:var(--cream);color:var(--ink);font-size:15.5px;font-weight:600;border:0;border-left:4px solid var(--purple);box-shadow:none;display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.mms .woocommerce-error{background:var(--red-tint);color:var(--red);border-left-color:#C9563F;display:block}
.mms .woocommerce-error li{margin:2px 0;padding:0}
.mms .woocommerce-error a{color:var(--red);text-decoration:underline}
.mms .woocommerce-message{background:var(--green-tint);color:#2F5D22;border-left-color:var(--green-dot)}
.mms .woocommerce-error::before,.mms .woocommerce-message::before,.mms .woocommerce-info::before{display:none!important}
.mms .woocommerce-message .button,.mms .woocommerce-info .button{margin-left:auto;order:2;float:none}
.mms .mms-co-form > .woocommerce-NoticeGroup,.mms form.checkout > .woocommerce-NoticeGroup{max-width:var(--container);margin:0 auto 18px;padding:0 var(--gutter)}

/* knoppen van WooCommerce en Divi gelijktrekken */
.mms .button,.mms button.button,.mms a.button{font-family:var(--font)!important;font-size:15.5px!important;font-weight:600!important;line-height:1.2!important;padding:13px 22px!important;border-radius:var(--r-btn)!important;border:1.5px solid var(--line)!important;background:#fff!important;color:var(--ink)!important;text-transform:none!important;letter-spacing:0!important;box-shadow:none!important}
.mms .button::after,.mms .button::before{display:none!important;content:none!important}
.mms .button:hover{background:var(--cream)!important;padding:13px 22px!important}
.mms .btn{font-family:var(--font)}
.mms .btn::before{display:none}

/* velden (WooCommerce .form-row) */
.mms .fields{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.mms .fields > *{grid-column:1/-1}
.mms .fields .form-row{grid-column:span 6;display:grid;gap:6px;margin:0!important;padding:0!important;width:auto!important;float:none!important;position:relative;align-content:start}
.mms .fields .form-row.form-row-first,.mms .fields .form-row.form-row-last{grid-column:span 3}
.mms .fields .form-row.mms-third{grid-column:span 2}
.mms .fields .form-row.mms-two-third{grid-column:span 4}
.mms .fields .form-row::before,.mms .fields .form-row::after{display:none!important}
.mms .fields .clear{display:none}
.mms .mms-nl{display:contents}
.mms .fields .form-row label,.mms .auth .form-row label{display:block;font-size:14px!important;font-weight:700!important;color:var(--ink)!important;line-height:1.4!important;margin:0!important;padding:0!important}
.mms .form-row label .required,.mms .form-row label abbr.required{display:none}
.mms .form-row label .optional{font-weight:500;color:var(--ink-3)}
.mms .form-row .woocommerce-input-wrapper{display:block;position:relative;width:100%}
.mms .fields .form-row .input-text,.mms .fields .form-row select,.mms .fields .form-row textarea,.mms .auth .form-row .input-text,.mms .track-box .input-text,.mms .payment_box input[type="text"],.mms .payment_box input[type="date"],.mms .payment_box input[type="tel"],.mms .payment_box select{font-family:var(--font)!important;font-size:16px!important;font-weight:500!important;color:var(--ink)!important;background:#fff!important;border:1.5px solid var(--line)!important;border-radius:12px!important;padding:13px 14px!important;width:100%!important;min-width:0;height:auto!important;line-height:1.4!important;box-shadow:none!important;transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease),background var(--t) var(--ease);-webkit-appearance:none;appearance:none}
.mms .fields .form-row textarea{min-height:96px;resize:vertical}
.mms .fields .form-row select{padding-right:42px!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%235C5552' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 14px center!important;background-size:18px!important}
.mms .form-row .input-text::placeholder,.mms .form-row textarea::placeholder{color:#B3ABA6!important;opacity:1}
.mms .fields .form-row .input-text:focus,.mms .fields .form-row select:focus,.mms .fields .form-row textarea:focus,.mms .auth .form-row .input-text:focus,.mms .track-box .input-text:focus,.mms .payment_box input:focus{border-color:var(--purple)!important;box-shadow:0 0 0 4px var(--purple-tint)!important;outline:none}
.mms .fields .form-row.woocommerce-validated .input-text:not(:placeholder-shown),.mms .fields .form-row.is-ok .input-text{padding-right:44px!important;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%234F8A3C'/%3E%3Cpath d='M7 12.5l3.2 3.2L17 9' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 13px center/22px!important}
.mms .fields .form-row.woocommerce-invalid .input-text,.mms .fields .form-row.woocommerce-invalid select{border-color:#C9563F!important;background-color:#FFFBFA!important}
.mms .fields .form-row.woocommerce-invalid label{color:var(--red)!important}
.mms .form-row .checkout-inline-error-message,.mms .form-row .mms-err{font-size:13.5px;font-weight:600;color:var(--red);margin:0}
.mms .form-row .description{font-size:13.5px;color:var(--ink-3);background:none;padding:0;margin:0;position:static;box-shadow:none}
.mms .form-row .description::before{display:none}
.mms .mms-hide,.mms .mms-auto-hide{display:none!important}
.mms .pw{position:relative;display:block}
.mms .pw .input-text{padding-right:52px!important}
.mms .pw button,.mms .pw .show-password-input{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:10px;display:grid;place-items:center;color:var(--ink-3);background:none;border:0;cursor:pointer}
.mms .pw button:hover{background:var(--cream);color:var(--ink)}
.mms .pw svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mms .pw .show-password-input{display:none}

/* select2 (land bij ander bezorgadres) */
.mms .select2-container .select2-selection--single{height:auto!important;border:1.5px solid var(--line)!important;border-radius:12px!important;padding:11px 14px!important}
.mms .select2-container .select2-selection--single .select2-selection__rendered{padding:0!important;line-height:1.5!important;color:var(--ink)!important;font-size:16px}
.mms .select2-container .select2-selection--single .select2-selection__arrow{top:50%!important;transform:translateY(-50%);right:10px!important}

/* eigen vinkje rond echte WooCommerce-checkboxen */
.mms .check{position:relative}
.mms .check .input-checkbox,.mms .check input[type="checkbox"]{position:absolute;opacity:0;width:1px;height:1px;margin:0}

/* afrekenen: stappen en adres */
.mms--checkout,.mms--thanks,.mms--pay{background:linear-gradient(180deg,var(--white) 0,var(--cream) 220px,var(--cream) 100%)}
.mms .seg-wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.mms .seg-wrap .lbl{font-size:14px;font-weight:700}
.mms .seg .flag{width:20px;height:14px;border-radius:3px;overflow:hidden;display:grid;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.mms .found{grid-column:1/-1}
.mms .found p{margin:0}
.mms .found span{display:block}
.mms .mms-addr.is-lookup #billing_address_1_field,.mms .mms-addr.is-lookup #billing_city_field{display:none!important}
.mms .mms-addr.is-intl .mms-nl,.mms .mms-addr.is-intl .found{display:none!important}
.mms .mms-addr.is-intl #billing_postcode_field{grid-column:span 2}
.mms .mms-addr.is-intl #billing_city_field{grid-column:span 4}
.mms .mms-addr .mms-company{order:20}
.mms .mms-addr .mms-company.is-off{display:none!important}
.mms .toggles .tg{display:grid;gap:0}
.mms .toggles .reveal,.mms .toggles .shipping_address,.mms .toggles .create-account{overflow:hidden}
.mms .toggles .reveal > .fields,.mms .toggles .shipping_address > .fields{padding-top:16px}
html.mms-js .mms .toggles .reveal:not(.is-open){display:none}
.mms .toggles .create-account .fields{padding-top:14px}
.mms .acct-box{margin-top:6px;border-radius:18px;background:var(--cream);padding:16px 18px}
.mms .acct-box .meter{margin-top:8px}
.mms #customer_details{display:block}
.mms .woocommerce-shipping-fields h3,.mms .woocommerce-additional-fields > h3,.mms .woocommerce-billing-fields > h3{display:none}

/* betaalwijzen (li.pm-opt met radio, label en payment_box) */
.mms .pays{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin:0;padding:0;list-style:none}
.mms .pays .pays-empty{grid-column:1/-1}
.mms .pm-opt{position:relative;display:block;background:#fff;border:1.5px solid var(--line);border-radius:16px;padding:0;margin:0!important;transition:border-color var(--t) var(--ease),background var(--t) var(--ease),box-shadow var(--t) var(--ease)}
.mms .pm-opt:hover{border-color:var(--purple-line)}
.mms .pm-opt > input.input-radio{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.mms .pm-opt > label{display:grid!important;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:16px!important;margin:0!important;cursor:pointer;font-size:inherit!important;line-height:1.3!important}
.mms .pm-opt > label img{display:none!important}
.mms .pm-opt .radio{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--ink-3);display:grid;place-items:center;transition:border-color var(--t)}
.mms .pm-opt .radio::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--purple);transform:scale(0);transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.mms .pm-opt .t b{display:block;font-size:16px;line-height:1.3}
.mms .pm-opt .t small{display:block;font-size:13.5px;color:var(--ink-3);font-weight:600;line-height:1.35}
.mms .pm-opt .logos{display:flex;gap:4px}
.mms .pm-opt .tag{position:absolute;top:-10px;left:14px;font-size:11.5px;font-weight:700;letter-spacing:.04em;padding:3px 9px;border-radius:999px;background:var(--purple);color:#fff;line-height:1.3}
.mms .pm-opt:has(.tag) > label{padding-top:22px!important}
.mms .pm-opt:has(> input:checked){border-color:var(--purple);background:var(--purple-tint);box-shadow:0 10px 26px rgba(97,41,83,.1)}
.mms .pm-opt:has(> input:checked) .radio{border-color:var(--purple)}
.mms .pm-opt:has(> input:checked) .radio::after{transform:scale(1)}
.mms .pm-opt:has(> input:focus-visible){outline:3px solid var(--green);outline-offset:2px}
.mms .pm-opt .payment_box{margin:0 16px 16px!important;padding:14px 16px!important;background:#fff!important;border-radius:12px;font-size:14px;color:var(--ink-2);line-height:1.5}
.mms .pm-opt .payment_box::before{display:none!important}
.mms .pm-opt .payment_box p{margin:0 0 8px;padding:0}
.mms .pm-opt .payment_box p:last-child{margin:0}
.mms .pm-opt .payment_box label{font-size:14px;font-weight:700;color:var(--ink);display:block;margin-bottom:6px}
.mms .pm-opt .payment_box.is-desc{background:transparent!important;padding:0 2px!important;margin-top:-6px!important}
.mms .pm-opt > label{padding:14px 16px!important}
.mms .pm-opt:has(.tag) > label{padding-top:20px!important}
/* PAY-plug-in: eigen nep-radio (label::before), clearfix (label::after) en lettertype uitschakelen */
.mms #payment .payment_methods li.pm-opt > label::before,.mms #payment .payment_methods li.pm-opt > label::after{content:none!important;display:none!important}
.mms #payment .payment_methods li.pm-opt *{font-family:inherit}
/* alleen een omschrijving zonder velden: niet tonen, de kaart zegt het al */
.mms .pm-opt .payment_box:not(:has(input,select,textarea,iframe)){display:none!important}
.mms li[class*="payment_method_pay_gateway"] .payment_box > p{display:none}
.mms #payment .payment_methods li.pm-opt .payment_box fieldset{border:0!important;padding:0!important;margin:0!important;min-width:0}
.mms #payment .payment_methods li.pm-opt .payment_box legend{float:none;font-size:14px!important;font-weight:700!important;color:var(--ink)!important;padding:0!important;margin:0 0 6px!important;font-family:inherit!important}
.mms #payment .payment_methods li.pm-opt .payment_box input:not([type=checkbox]):not([type=radio]),.mms #payment .payment_methods li.pm-opt .payment_box select{height:50px!important;border:1.5px solid var(--line)!important;border-radius:12px!important;padding:0 14px!important;font-size:16px!important;font-family:var(--font)!important;color:var(--ink)!important;background:#fff!important;box-shadow:none!important;width:100%!important;max-width:300px!important;box-sizing:border-box!important}
.mms #payment .payment_methods li.pm-opt .payment_box input:focus,.mms #payment .payment_methods li.pm-opt .payment_box select:focus{border-color:var(--purple)!important;outline:0!important;box-shadow:0 0 0 4px var(--purple-tint)!important}
.mms .co-sum .blockUI.blockOverlay{background:rgba(46,26,43,.55)!important}
/* eerste stap zonder lijn erboven (er staat een verborgen element voor) */
.mms #customer_details > .step:first-of-type{border-top:0}
/* kolom rechts even hoog als links, zodat het overzicht meeschuift */
.mms .co-grid > .co-side{align-self:stretch}

/* bestelknop met bedrag ernaast */
.mms .co-place{display:grid;gap:14px;padding:26px 0 0!important;margin:22px 0 0!important;border-top:1px solid var(--line)}
.mms .co-place .woocommerce-terms-and-conditions-wrapper{font-size:14px;color:var(--ink-3)}
.mms .co-place .woocommerce-privacy-policy-text p{font-size:14px;color:var(--ink-3);margin:0;padding:0}
.mms .co-place .woocommerce-privacy-policy-text a,.mms .co-place .legal a{color:var(--ink-2);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.mms .co-place .legal{font-size:14px;color:var(--ink-3);margin:0}
.mms .co-place .goes{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-3);margin:0}
.mms .co-place .goes svg{width:16px;height:16px;stroke:var(--green-dot);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mms .place-wrap{position:relative;width:100%;max-width:560px}
.mms #place_order{position:relative;display:flex!important;align-items:center;justify-content:flex-start;width:100%!important;max-width:none;float:none!important;padding:19px 140px 19px 56px!important;font-family:var(--font)!important;font-size:17px!important;font-weight:600!important;line-height:1.2!important;border:0!important;border-radius:var(--r-btn)!important;background:var(--purple) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='5' y='10.5' width='14' height='10' rx='2.5' fill='none' stroke='%23fff' stroke-width='2'/%3E%3Cpath d='M8.5 10.5V8a3.5 3.5 0 0 1 7 0v2.5' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") no-repeat 24px center/20px!important;color:#fff!important;text-transform:none!important;letter-spacing:0!important;text-align:left;box-shadow:none;transition:background-color var(--t) var(--ease),box-shadow var(--t) var(--ease)}
.mms #place_order:hover{background-color:var(--purple-2)!important;box-shadow:0 14px 30px rgba(97,41,83,.22)}
.mms #place_order::after,.mms #place_order::before{display:none!important;content:none!important}
.mms #place_order:disabled,.mms .processing #place_order{opacity:.6}
.mms .place-amt{position:absolute;right:24px;top:50%;transform:translateY(-50%);color:#fff;font-weight:600;font-size:17px;font-variant-numeric:tabular-nums;padding-left:16px;border-left:1px solid rgba(255,255,255,.28);pointer-events:none}
.mms .blockUI.blockOverlay{background:rgba(255,255,255,.6)!important;border-radius:var(--r-card)}

/* overzicht rechts, op mobiel inklapbaar bovenaan */
.mms .co-grid--pre{margin-bottom:0}
.mms .co-grid--pre .co-left{grid-column:1}
.mms .co-msum-btn{display:none}
.mms .co-sum .mms-review{display:grid;gap:18px}
.mms .co-sum .rows .r.mms-ship b.is-free{color:var(--green)}
.mms .co-sum .mms-ship-list{display:grid;gap:6px;margin:0;padding:0}
.mms .co-sum .mms-ship-list label{color:rgba(255,255,255,.85);font-size:14.5px}
.mms .co-sum .rows .r.mms-ship{flex-wrap:wrap}
.mms .co-line .th img{width:86%;height:auto;max-height:86%;object-fit:contain;mix-blend-mode:multiply}
.mms .co-login{flex-wrap:wrap}
.mms .co-login-panel{flex:0 0 100%;overflow:hidden}
.mms .mms-login-form .form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mms .mms-login-form .form-row{display:grid;gap:6px;margin:0}
.mms .mms-login-form .input-text{font:inherit;font-size:16px;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;width:100%}
.mms .mms-login-acts{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:12px;font-size:14px;color:var(--ink-3)}
.mms .mms-login-acts a{color:var(--purple);font-weight:700}
.mms .mms-login-acts .btn{padding:12px 22px}

/* winkelwagen: aantal als invoerveld */
.mms .qty input.v{width:36px;height:100%;border:0!important;background:transparent!important;text-align:center;font:700 16px/1 var(--font);color:var(--ink);padding:0!important;-moz-appearance:textfield;appearance:textfield;box-shadow:none!important}
.mms .qty input.v::-webkit-outer-spin-button,.mms .qty input.v::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.mms .it-media img{width:90%;height:auto;max-height:90%;object-fit:contain}
.mms .item.is-busy{opacity:.6;pointer-events:none}
.mms .mms-noscript{margin-top:12px}
.mms .coupon summary{list-style:none;cursor:pointer}
.mms .coupon summary::-webkit-details-marker{display:none}
.mms .coupon[open] .pm,.mms .coupon details[open] .pm{transform:rotate(45deg);background:var(--purple-tint)}
.mms .coupon .cp-form{display:flex;gap:10px;padding:2px 0 16px}
.mms .coupon .cp-form input{font:inherit;font-size:16px;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;max-width:320px;width:100%}

/* bedankt */
.mms .thanks .done-head .ok.is-fail{background:#C9563F;box-shadow:0 0 0 10px var(--red-tint)}
.mms .thanks-gw:empty{display:none}
.mms .thanks-gw{max-width:720px;margin:24px auto 0;font-size:15px;color:var(--ink-2);text-align:center}
.mms .thanks-gw p{margin:0}
.mms .done-facts dd{line-height:1.6}
.mms .done-facts .woocommerce-Price-amount{font-weight:700}
.mms .done-items .co-line .pr .woocommerce-Price-amount{font-weight:700}

/* mijn account */
.mms .panels{min-width:0}
.mms .panels .panel{display:grid;gap:24px}
.mms .side-nav li{margin:0}
.mms .side-nav li.sep hr{border:0;border-top:1px solid var(--line);margin:8px 6px}
@media (min-width:961px){.mms .side-nav a[aria-current="page"]{color:var(--purple);font-weight:700}}
@media (max-width:960px){.mms .side-nav a[aria-current="page"]{color:#fff!important}}
.mms .duo.duo--one{grid-template-columns:1fr}
.mms .sleep-t{display:grid;gap:8px}
.mms .sleep-t .kicker{margin:0}
.mms .warranty .kicker{margin:0 0 4px}
.mms .bar-w i{width:var(--w,100%)}
.mms .ord{color:inherit}
.mms .ord-t{min-width:0;display:grid}
.mms .ord .what{display:block}
.mms .mms-pager{display:flex;gap:12px;justify-content:space-between}
.mms .od-sum .r b.g{color:var(--green-ink)}
.mms .od-acts .btn{justify-content:flex-start}
.mms .od-acts .btn svg{width:18px;height:18px}
.mms .od-notes{display:grid;gap:12px}
.mms .od-notes li{background:var(--cream);border-radius:14px;padding:12px 14px;font-size:15px}
.mms .od-notes time{display:block;font-size:12.5px;font-weight:700;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.mms .od-notes p{margin:0}
.mms .od-facts dd .woocommerce-Price-amount{font-weight:600}
.mms .od-item .pr .woocommerce-Price-amount,.mms .od-item .pr{font-weight:700}
.mms .set{display:grid;gap:4px}
.mms .set h3{margin-bottom:14px}
.mms .mms-edit-account{display:grid;gap:20px}
.mms .mms-edit-account .acts,.mms .mms-addr-form .acts{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:18px}
.mms .acard .edit{text-decoration:none}
.mms .acard address{line-height:1.7}
.mms .blank .em-ctas{margin-top:8px}
.mms .auth-pane{display:grid;gap:16px}
.mms .auth-pane .form-row{display:grid;gap:6px;margin:0;padding:0}
.mms .auth-row a{font-size:15px;font-weight:700;color:var(--purple);text-decoration:underline;text-underline-offset:3px}
.mms .auth-pane .woocommerce-privacy-policy-text p{font-size:14px;color:var(--ink-3);margin:0}
.mms .auth-pane .woocommerce-privacy-policy-text a{color:var(--purple);font-weight:700}
.mms .auth--single .auth-card{max-width:560px;margin:0 auto}
.mms .auth-side .track-box form{display:grid;gap:14px}
.mms .track-box .form-row{display:grid;gap:6px;margin:0;padding:0}
.mms .track-box .form-row label{color:#fff!important;font-size:14px;font-weight:700}
.mms .track-box .input-text,.mms .track-box .fields .form-row .input-text{background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.18)!important;color:#fff!important}
.mms .track-box .fields .form-row .input-text:focus{border-color:var(--green)!important;box-shadow:0 0 0 4px rgba(150,193,93,.18)!important}
.mms .track-box .input-text::placeholder,.mms .track-box .fields .form-row .input-text::placeholder{color:rgba(255,255,255,.4)!important}
.mms .track-box .woocommerce-error{background:rgba(255,255,255,.08);color:#FFD9D0;border-left-color:#E07A63}
.mms .track-result{padding:40px 0 0}
.mms .track-result .tile{max-width:820px;margin:0 auto;display:grid;gap:18px}

/* rustige kop en footer op de afrekenpagina */
body.mms-checkout #mmhd,body.mms-checkout .mh-mobile,body.mms-checkout .mh-veil,body.mms-checkout #mmft,body.mms-checkout .et-l--header,body.mms-checkout .et-l--footer,body.mms-pay #mmhd,body.mms-pay .mh-mobile,body.mms-pay #mmft{display:none!important}
body.mms-checkout #ht-ctc-chat,body.mms-checkout .ht-ctc,body.mms-checkout #callnowbutton{display:none!important}
.mms-co-head{position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid var(--line);font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased}
body.admin-bar .mms-co-head{top:32px}
@media (max-width:782px){body.admin-bar .mms-co-head{top:46px}}
@media (max-width:600px){body.admin-bar .mms-co-head{top:0}}
.mms-co-head *{box-sizing:border-box}
.mms-co-head__in{max-width:var(--container);margin:0 auto;padding:0 max(var(--gutter),env(safe-area-inset-left,0px));display:flex;align-items:center;gap:20px;height:76px}
.mms-co-head .co-logo img{height:28px;width:auto;display:block}
.mms-co-head a{text-decoration:none}
.mms-co-head .co-back{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;color:var(--ink-2);padding:9px 14px;border-radius:999px;transition:background var(--t)}
.mms-co-head .co-back:hover{background:var(--cream);color:var(--ink)}
.mms-co-head svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}
.mms-co-head .co-r{margin-left:auto;display:flex;align-items:center;gap:18px;font-size:14.5px;color:var(--ink-2);font-weight:600}
.mms-co-head .co-safe{display:inline-flex;align-items:center;gap:8px;color:var(--green-ink);font-weight:700}
.mms-co-head .co-safe svg{width:18px;height:18px}
.mms-co-head .co-tel{display:inline-flex;align-items:center;gap:8px;color:var(--ink-2)}
.mms-co-head .co-tel b{color:var(--ink)}
.mms-co-head .co-tel:hover b{color:var(--purple)}
.mms-co-head .co-tel svg{width:18px;height:18px;stroke:var(--purple)}
.mms-co-foot{background:var(--cream);border-top:1px solid var(--line);font-family:var(--font);color:var(--ink-2);font-size:14px}
.mms-co-foot *{box-sizing:border-box}
.mms-co-foot__in{max-width:var(--container);margin:0 auto;padding:26px var(--gutter) 30px;display:flex;flex-wrap:wrap;gap:14px 32px;align-items:center;justify-content:space-between}
.mms-co-foot ul{display:flex;flex-wrap:wrap;gap:6px 22px;list-style:none;margin:0;padding:0}
.mms-co-foot li{padding:0}
.mms-co-foot a{color:var(--ink-2);text-decoration:none;font-weight:600}
.mms-co-foot a:hover{color:var(--purple)}
.mms-co-foot .payrow{display:flex;gap:6px}
.mms-co-foot .pay-i{display:block;width:40px;height:30px;border-radius:7px;background-image:url("https://merkmatrassen.com/wp-content/uploads/2026/02/payment_methods-26-feb.png");background-size:123.8px 124.3px;background-repeat:no-repeat}
.mms-co-foot .pay-i.p1{background-position:0 0}.mms-co-foot .pay-i.p3{background-position:-83.8px 0}.mms-co-foot .pay-i.p4{background-position:0 -31.7px}.mms-co-foot .pay-i.p5{background-position:-41.9px -31.7px}.mms-co-foot .pay-i.p7{background-position:0 -63.7px}.mms-co-foot .pay-i.p8{background-position:-41.9px -63.7px}.mms-co-foot .pay-i.p10{background-position:0 -95.4px}

@media (max-width:960px){
  .mms .co-grid{grid-template-columns:minmax(0,1fr)}
  .mms .co-side{order:-1;display:block}
  .mms .co-msum-btn{display:flex;width:100%;align-items:center;gap:12px;padding:16px 18px;background:var(--purple-deep);color:#fff;border-radius:18px;font:700 15.5px/1.3 var(--font);text-align:left;border:0;cursor:pointer}
  .mms .co-msum-btn svg{width:18px;height:18px;stroke:var(--green);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease);flex:none}
  .mms .co-msum-btn[aria-expanded="true"] svg.chev{transform:rotate(180deg)}
  .mms .co-msum-btn .amt{margin-left:auto;font-size:19px;font-variant-numeric:tabular-nums}
  .mms .co-side.is-open .co-msum-btn{border-radius:18px 18px 0 0}
  .mms .co-side:not(.is-open) .co-sum{display:none}
  .mms .co-side .co-sum{position:relative;top:auto;border-radius:0 0 18px 18px;padding:4px 18px 22px}
  .mms .co-side .co-sum > h3{display:none}
  .mms .co-side .co-sum::before{display:none}
}
@media (max-width:860px){
  .mms .fields{grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
  .mms .fields .form-row.form-row-first,.mms .fields .form-row.form-row-last{grid-column:span 6}
  .mms #billing_first_name_field,.mms #billing_last_name_field,.mms #shipping_first_name_field,.mms #shipping_last_name_field{grid-column:span 3}
  .mms .fields .form-row.mms-third{grid-column:span 2}
  .mms .mms-addr.is-intl #billing_postcode_field{grid-column:span 2}
  .mms .mms-addr.is-intl #billing_city_field{grid-column:span 4}
  .mms .fields .form-row.mms-two-third{grid-column:span 6}
  .mms .pays{grid-template-columns:1fr}
  .mms .place-wrap{max-width:none}
  .mms #place_order{padding:18px 120px 18px 50px!important;font-size:16px!important;background-position:20px center!important}
  .mms .place-amt{right:18px;font-size:16px;padding-left:12px}
  .mms .mms-login-form .form{grid-template-columns:1fr}
  .mms-co-head__in{height:62px;gap:12px;padding:0 16px}
  .mms-co-head .co-logo img{height:22px}
  .mms-co-head .co-back span,.mms-co-head .co-tel span,.mms-co-head .co-safe span{display:none}
  .mms-co-head .co-back{padding:9px}
  .mms-co-head .co-r{gap:6px}
  .mms-co-head .co-tel{width:40px;height:40px;border-radius:50%;background:var(--cream);justify-content:center}
  .mms .track-box .form-row.form-row-first,.mms .track-box .form-row.form-row-last{grid-column:span 6}
  .mms .od-acts .btn{white-space:normal}
}
@media (max-width:420px){
  .mms .fields .form-row.mms-third{grid-column:span 3}
  .mms #mms_suffix_field{grid-column:span 6}
}
/* invoervelden van betaalwijzen (bijv. geboortedatum) altijd zichtbaar */
.mms .pm-opt .payment_box input,.mms .pm-opt .payment_box select{position:static!important;opacity:1!important;pointer-events:auto!important;width:100%;max-width:280px}
.mms .pm-opt .payment_box input[type="checkbox"],.mms .pm-opt .payment_box input[type="radio"]{width:auto;max-width:none}

/* stappenbalk: de link om stap 1 moet zelf ook flex zijn, anders valt het label onder het bolletje */
.mms .flow li > a{display:flex;align-items:center;gap:inherit;color:inherit;text-decoration:none}

/* stappen van de lopende bestelling: labels bovenaan uitlijnen, ook als een stap geen datum heeft */
.mms .stg-step{align-content:start}
/* bestellingen: vaste kolom voor de fotootjes, dan staat de tekst altijd recht onder elkaar */
.mms .ord{grid-template-columns:108px minmax(0,1fr) auto auto}
.mms .ord .live-thumbs span:nth-child(n+3){display:none}
@media (max-width:600px){.mms .ord{grid-template-columns:48px minmax(0,1fr) auto}}
.mms .eta-big a{color:var(--purple);font-weight:600;text-decoration:underline;text-underline-offset:3px}
/* extra blok van andere plugins bij een bestelling (bv. soort levering) */
.mms .od-extra h2,.mms .od-extra h3{font-size:12px!important;line-height:1.4!important;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)!important;font-weight:700!important;margin:0 0 8px!important;padding:0!important}
.mms .od-extra table{width:100%;border-collapse:collapse;border:0;margin:0;font-size:15px}
.mms .od-extra td,.mms .od-extra th{padding:6px 0;border:0;text-align:left;vertical-align:top;background:none}
.mms .od-extra td:first-child{color:var(--ink-3);padding-right:12px}
.mms .od-extra p{margin:0 0 6px;padding:0;font-size:15px}
.mms .thanks-extra{padding:0 0 64px}
.mms .thanks-extra .od-extra{background:#fff;border-radius:var(--r-card);padding:24px 28px;box-shadow:0 14px 40px rgba(97,41,83,.05);max-width:640px}

/* zwevende knoppen (WhatsApp, bellen) op mobiel boven de vaste afrekenbalk van de winkelwagen houden */
@media (max-width:960px){
  body.mms-cart #ht-ctc-chat,body.mms-cart .ht-ctc-chat,body.mms-cart #callnowbutton{transition:transform .35s cubic-bezier(.2,.8,.2,1)!important}
  body.mms-cart:has(#mbar.is-on) #ht-ctc-chat,body.mms-cart:has(#mbar.is-on) #callnowbutton{transform:translateY(-84px)!important}
}

/* opties: chips nooit breder dan de kaart; lange vragenlijsten (bv. ErkendMatras-slaapprofiel) uitklapbaar */
.mms .chip{max-width:100%;white-space:normal;line-height:1.35}
.mms .it-title{min-width:0}
.mms .it-more{margin:14px 0 2px;border-radius:14px;background:var(--cream);overflow:hidden}
.mms .it-more summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;padding:11px 14px;font-size:14px;font-weight:700;color:var(--purple);user-select:none}
.mms .it-more summary::-webkit-details-marker{display:none}
.mms .it-more summary span{color:var(--ink-3);font-weight:600}
.mms .it-more summary svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-left:auto;transition:transform .3s var(--ease)}
.mms .it-more[open] summary svg{transform:rotate(180deg)}
.mms .it-more summary:hover{background:var(--cream-2)}
.mms .it-more dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 22px;margin:0;padding:6px 14px 16px}
.mms .it-more dl > div{min-width:0}
.mms .it-more dt{font-size:12.5px;color:var(--ink-3);font-weight:600;line-height:1.35;margin:0}
.mms .it-more dd{margin:2px 0 0;font-size:14px;color:var(--ink);font-weight:600;line-height:1.4;overflow-wrap:anywhere}
.mms .od-items .it-more,.mms .done-items .it-more{margin:0 0 12px}
@media (max-width:600px){.mms .it-more dl{grid-template-columns:minmax(0,1fr)}}

/* sterktemeter van WooCommerce (registreren, afrekenen, wachtwoord wijzigen) in onze stijl; oogje blijft op de invoer staan */
.mms .woocommerce-password-strength{margin-top:8px;padding:7px 12px;border-radius:10px;font-size:13px;font-weight:700;text-align:left;background:var(--cream);color:var(--ink-2);border:0}
.mms .woocommerce-password-strength.short,.mms .woocommerce-password-strength.bad{background:#FBE9E7;color:#B3261E}
.mms .woocommerce-password-strength.good{background:#FFF4D6;color:#7A5200}
.mms .woocommerce-password-strength.strong{background:var(--green-tint);color:var(--green-ink)}
.mms .woocommerce-password-hint{display:block;margin-top:6px;font-size:12.5px;line-height:1.45;color:var(--ink-3)}
.mms .pw > button[data-pw],.mms .password-input > .show-password-input{top:6px!important;transform:none!important}
.mms .meter[hidden]{display:none!important}
/* regel onder een artikel in het overzicht wat compacter */
.mms .co-line > div > span{line-height:1.5}

/* knop in meldingen (bv. "Bekijk winkelwagen" / "Verder winkelen"): groen met witte tekst */
.mms .woocommerce-message .button,.mms .woocommerce-info .button,.mms .woocommerce-error .button,.mms .woocommerce-message .button:hover,.mms .woocommerce-info .button:hover{display:inline-flex!important;align-items:center;gap:8px;background:var(--green-dot)!important;color:#fff!important;border:0!important;border-radius:var(--r-btn)!important;padding:11px 18px!important;font:600 15px/1.2 var(--font)!important;letter-spacing:0!important;text-transform:none!important;text-decoration:none!important;box-shadow:none!important;white-space:nowrap}
.mms .woocommerce-message .button:hover,.mms .woocommerce-info .button:hover{background:#3E7330!important}
.mms .woocommerce-message .button::after,.mms .woocommerce-message .button::before,.mms .woocommerce-info .button::after,.mms .woocommerce-info .button::before{display:none!important;content:none!important}
.mms .woocommerce-message a:not(.button){color:#2F5D22;font-weight:700;text-decoration:underline;text-underline-offset:3px}

/* lege winkelwagen: prijs zoals op de productpagina (van-prijs, prijs, je bespaart) */
.mms .pc em{align-items:flex-end}
.mms .pc .pc-price{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;font-size:inherit;color:var(--ink)}
.mms .pc .pc-price small{flex-basis:100%;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.mms .pc .pc-price s{font-size:15px;font-weight:600;color:var(--ink-3)}
.mms .pc .pc-price strong{font-size:26px;font-weight:700;letter-spacing:-.02em;line-height:1.1;color:var(--ink)}
.mms .pc .pc-price strong.pc-more{font-size:16px;letter-spacing:0}
.mms .pc .pc-price .it-save{font-style:normal;margin:0}