/* MC-Node 2026 — design tokens & componenten (bron: goedgekeurde HTML-designs) */
:root{
  --mc-bg:#0a0e14; --mc-panel:#0d1219; --mc-panel2:#10151d; --mc-line:rgba(255,255,255,.08);
  --mc-text:#e8edf4; --mc-muted:#8a94a3; --mc-soft:#aab4c2; --mc-blue:#2e9bff; --mc-blue-d:#1d7df0;
  --mc-blue-l:#6cbcff; --mc-green:#41d98d; --mc-amber:#f5b301;
}
/* ===== Legacy tokens (mcnode_cart css) — NIET VERWIJDEREN (vaste server-fix #2) ===== */
:root{
--blue:#0079FF; --darkerblue:#0171f0; --maindark:#12141C; --darkerdark:#0E1118;
--lighterdark:#151720; --lightdark:#1A1C29; --text:#FFFFFF; --gray:#9BA2AB;
--darkgray:#313841; --darkerthandark:#171924;
}
body.mc{margin:0;font-family:'Space Grotesk',sans-serif}
body.mc-dark{background:var(--mc-bg);color:var(--mc-text)}
body.mc-dark a{color:var(--mc-blue);text-decoration:none}
body.mc-dark a:hover{color:var(--mc-blue-l)}
@keyframes mcOrb{0%,100%{transform:translate(0,0) scale(1);opacity:.55}50%{transform:translate(0,-24px) scale(1.08);opacity:.85}}
@keyframes mcRise{0%{transform:translateY(0) scale(1);opacity:0}12%{opacity:.9}80%{opacity:.5}100%{transform:translateY(-780px) scale(.6);opacity:0}}
/* Design-animaties (namen identiek aan de HTML-designs) */
@keyframes orb{0%,100%{transform:translate(0,0) scale(1);opacity:.55}50%{transform:translate(0,-24px) scale(1.08);opacity:.85}}
@keyframes rise{0%{transform:translateY(0) scale(1);opacity:0}12%{opacity:.9}80%{opacity:.5}100%{transform:translateY(-760px) scale(.6);opacity:0}}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@keyframes pulse{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes gridmove{0%{background-position:0 0}100%{background-position:0 48px}}
@keyframes blink{0%,49%{opacity:1}50%,100%{opacity:0}}
.mc-marquee:hover{animation-play-state:paused}
/* Minecraft winkel: keuzehulp + vergelijk */
.kz-seg{background:#10151d;border:1px solid rgba(255,255,255,.1);color:#8a94a3}
.kz-seg.on{background:#1971db;border:0;color:#fff}
.kz-track{width:46px;height:26px;border-radius:100px;background:rgba(255,255,255,.12);position:relative;cursor:pointer;flex:none;transition:background .15s}
.kz-knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .15s;display:block}
.mc-tab.on{background:#1971db;color:#fff}
.mc-tab{color:#8a94a3}
.mc-cmp{width:20px;height:20px;border-radius:50%;font-size:11px;display:inline-flex;align-items:center;justify-content:center}
.mc-cmp.ok{background:rgba(46,155,255,.12);border:1px solid rgba(46,155,255,.4);color:#6cbcff}
.mc-cmp.no{background:rgba(255,122,107,.1);border:1px solid rgba(255,122,107,.4);color:#ff7a6b}
/* Nav loopt door in de pagina-achtergrond (zoals in de designs) */
body.mc-dark .mc-nav{background:transparent;position:relative;z-index:20}
.mc-underlay{margin-top:-120px;padding-top:120px}

/* Nav */
.mc-nav{background:var(--mc-bg);padding:0 56px}
.mc-nav-inner{max-width:1240px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:22px 0;gap:24px}
.mc-logo{font-weight:700;font-size:20px;color:var(--mc-text)!important}
.mc-logo span{color:var(--mc-blue)}
.mc-nav-links{display:flex;gap:30px;font-size:13.5px}
.mc-nav-links a{color:var(--mc-soft)!important}
.mc-nav-links a:hover{color:#fff!important}
.mc-nav-links a.active{color:#2e9bff!important}
.mc-nav-actions{display:flex;gap:16px;align-items:center;font-size:13.5px}
.mc-langs{display:flex;align-items:center;background:var(--mc-panel);border:1px solid rgba(255,255,255,.1);border-radius:8px;overflow:hidden}
.mc-langs a{padding:7px 10px;display:flex;align-items:center;opacity:.5}
.mc-langs a.active{background:var(--mc-blue);opacity:1}
.mc-langs img{width:22px;height:15px;border-radius:2px;display:block;box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.mc-cart{color:var(--mc-soft)!important;display:inline-flex;align-items:center;gap:6px}
.mc-cart:hover{color:#fff!important}
.mc-btn,.mc-btn-ghost{font-weight:700;font-size:13px;padding:12px 22px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}
.mc-btn{background:var(--mc-blue);color:#fff!important}
.mc-btn:hover{background:var(--mc-blue-d);color:#fff!important}
.mc-btn-ghost{border:1px solid rgba(46,155,255,.5);color:var(--mc-blue-l)!important;font-weight:500}
.mc-btn-ghost:hover{background:rgba(46,155,255,.12);color:#fff!important}
.mc-btn-outline{border:1px solid rgba(46,155,255,.55);color:var(--mc-blue-l)!important;font-weight:700;font-size:12.5px;padding:11px 18px;border-radius:9px;text-align:center;display:inline-block}
.mc-btn-outline:hover{background:var(--mc-blue);color:#fff!important}

/* Secties & typografie */
.mc-section{padding:56px 56px 60px}
.mc-wrap{max-width:1080px;margin:0 auto}
.mc-wrap-wide{max-width:1240px;margin:0 auto}
.mc-kicker{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--mc-blue);letter-spacing:2px;margin-bottom:14px}
.mc-h1{margin:0 0 18px;font-size:52px;line-height:1.06;font-weight:700;letter-spacing:-1.5px}
.mc-h2{margin:0 0 12px;font-size:32px;font-weight:700;letter-spacing:-.5px}
.mc-lead{margin:0;font-size:16px;line-height:1.65;color:var(--mc-muted);max-width:640px;text-wrap:pretty}
.mc-accent{color:var(--mc-blue)}
.mc-check{color:var(--mc-green);margin-right:8px}

/* Kaarten */
.mc-card{background:var(--mc-panel);border:1px solid var(--mc-line);border-radius:16px;padding:24px 26px;display:flex;flex-direction:column}
.mc-card:hover{border-color:rgba(46,155,255,.45)}
.mc-card-featured{background:linear-gradient(var(--mc-panel),var(--mc-panel)) padding-box,linear-gradient(150deg,rgba(46,155,255,.5),rgba(46,155,255,.06)) border-box;border:1px solid transparent}
.mc-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.mc-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.mc-grid-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
@media(max-width:980px){.mc-grid-3,.mc-grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.mc-grid-2,.mc-grid-3,.mc-grid-4{grid-template-columns:1fr}.mc-section{padding:40px 20px}.mc-nav{padding:0 20px}.mc-h1{font-size:36px}}
.mc-badge{font-size:10px;font-weight:700;letter-spacing:1px;background:rgba(46,155,255,.14);color:var(--mc-blue-l);border:1px solid rgba(46,155,255,.4);border-radius:20px;padding:3px 9px}
.mc-chip{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:1.5px;color:#7d8797}
.mc-price{color:var(--mc-blue);font-size:18px;font-weight:700}
.mc-price-free{color:var(--mc-green);font-size:18px;font-weight:700}

/* Plan-kaarten (winkels) */
.mc-plan{position:relative;background:var(--mc-panel);border:1px solid rgba(255,255,255,.09);border-radius:14px;padding:24px 22px;display:flex;flex-direction:column}
.mc-plan.rec{border:1.5px solid rgba(46,155,255,.55);box-shadow:0 20px 50px -24px rgba(46,155,255,0.25)}
.mc-plan .rec-badge{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:var(--mc-blue);color:#fff;font-size:10px;font-weight:700;letter-spacing:1px;border-radius:20px;padding:4px 12px}
.mc-plan h4{margin:0 0 6px;font-size:17px;font-weight:700}
.mc-plan .spec{font-size:13px;color:var(--mc-muted);line-height:1.9}
.mc-plan .price{margin:12px 0 0;font-size:24px;font-weight:700}
.mc-plan .price small{font-size:12.5px;color:var(--mc-muted);font-weight:400}
.mc-plan .mc-btn,.mc-plan .mc-btn-outline{margin-top:18px;display:block;text-align:center}

/* Console-venster */
.mc-console{background:#121a28;border:1px solid rgba(255,255,255,.12);border-radius:14px;overflow:hidden;box-shadow:0 30px 80px -30px rgba(0,0,0,.8)}
.mc-console-bar{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#182234;border-bottom:1px solid var(--mc-line)}
.mc-console-bar i{width:11px;height:11px;border-radius:50%;display:inline-block}
.mc-console-bar .r{background:#ff5f57}.mc-console-bar .y{background:#febc2e}.mc-console-bar .g{background:#28c840}
.mc-console-bar .t{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:#7d8797;margin-left:8px}
.mc-console-body{padding:16px 18px;font-family:'IBM Plex Mono',monospace;font-size:12.5px;line-height:1.9;color:var(--mc-muted)}

/* FAQ */
.mc-faq{background:var(--mc-panel);border:1px solid var(--mc-line);border-radius:12px;padding:18px 22px;margin-bottom:12px}
.mc-faq summary{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:15px;font-weight:700;color:var(--mc-text);cursor:pointer;list-style:none}
.mc-faq summary::-webkit-details-marker{display:none}
.mc-faq summary:after{content:'+';color:var(--mc-blue);font-size:18px}
.mc-faq[open] summary:after{content:'−'}
.mc-faq p{margin:12px 0 0;font-size:13.5px;line-height:1.65;color:var(--mc-muted)}

/* Footer */
.mc-footer{background:#070a0f;border-top:1px solid rgba(255,255,255,.06);padding:72px 56px 0;color:var(--mc-text)}
.mc-footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr 1.5fr;gap:36px;align-items:start}
@media(max-width:900px){.mc-footer-grid{grid-template-columns:1fr 1fr}}
.mc-footer h5{font-size:14px;font-weight:700;letter-spacing:1px;margin:0 0 16px;color:var(--mc-text)}
.mc-footer-col{display:flex;flex-direction:column;gap:10px}
.mc-footer-col a{color:var(--mc-muted)!important;font-size:14.5px}
.mc-footer-col a:hover{color:#fff!important}
.mc-footer-quote{font-size:36px;font-weight:700;line-height:1.25;letter-spacing:-.5px;text-align:center}
.mc-footer-meta{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--mc-line);margin-top:56px;padding:24px 0 28px;font-size:13.5px;color:var(--mc-muted);flex-wrap:wrap;gap:12px}
.mc-footer-meta a{color:var(--mc-muted)!important}
.mc-footer-meta a:hover{color:#fff!important}

/* Modal (RAM-waarschuwing) */
.mc-modal-overlay{position:fixed;inset:0;background:rgba(4,7,12,.78);backdrop-filter:blur(6px);z-index:90;display:none;align-items:center;justify-content:center;padding:24px}
.mc-modal-overlay.open{display:flex}
.mc-modal{background:#0b0f16;border:1px solid rgba(255,255,255,.12);border-radius:16px;max-width:520px;width:100%;overflow:hidden;box-shadow:0 40px 110px -30px rgba(0,0,0,.95)}
.mc-modal .mc-console-bar .x{margin-left:auto;width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;color:var(--mc-muted);cursor:pointer;font-size:13px}
.mc-modal .mc-console-bar .x:hover{color:#fff;background:rgba(255,255,255,.08)}
.mc-modal-body{padding:28px 30px 30px}
.mc-modal-body .mono-amber{font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--mc-amber);letter-spacing:2px}

/* Six client-area pagina's (fallback) leesbaar houden op donkere nav */
body.mc:not(.mc-dark){background:#f4f6f9}
.mc-main{padding:32px 0 56px}
/* Standaard six-homepage-restanten verbergen op de homepage */
body.mc-dark .home-shortcuts,body.mc-dark #main-body .row.text-center{display:none}

/* ===== Dark-skin voor systeem-orderform (viewcart/configureproduct/checkout/complete) ===== */
body[data-page="configureproduct"],body[data-page="checkout"],body[data-page="complete"],body[data-page="viewcart"]{background:#0a0e14;color:#e8edf4}
body[data-page="configureproduct"] .mc-main,body[data-page="checkout"] .mc-main,body[data-page="complete"] .mc-main{padding-top:40px}
body[data-page="configureproduct"] .panel,body[data-page="checkout"] .panel,body[data-page="complete"] .panel,body[data-page="viewcart"] .panel,body[data-page="configureproduct"] .card,body[data-page="checkout"] .card,body[data-page="complete"] .card,body[data-page="viewcart"] .card{background:#0d1219;border:1px solid rgba(255,255,255,.09);color:#e8edf4;border-radius:14px}

body[data-page="configureproduct"] .panel-heading,body[data-page="viewcart"] .panel-heading,body[data-page="checkout"] .panel-heading,body[data-page="configureproduct"] .card-header,body[data-page="viewcart"] .card-header,body[data-page="checkout"] .card-header{background:#10151d;border-bottom:1px solid rgba(255,255,255,.08);color:#e8edf4;border-radius:14px 14px 0 0}
body[data-page="configureproduct"] .form-control,body[data-page="viewcart"] .form-control,body[data-page="checkout"] .form-control,body[data-page="configureproduct"] select,body[data-page="checkout"] select,body[data-page="configureproduct"] input,body[data-page="checkout"] input{background:#10151d;border:1px solid rgba(255,255,255,.12);color:#e8edf4;border-radius:9px}
body[data-page="configureproduct"] .table,body[data-page="viewcart"] .table,body[data-page="checkout"] .table{color:#e8edf4}
body[data-page="configureproduct"] .table td,body[data-page="viewcart"] .table td,body[data-page="checkout"] .table td,body[data-page="configureproduct"] .table th,body[data-page="viewcart"] .table th,body[data-page="checkout"] .table th{border-color:rgba(255,255,255,.08)}
body[data-page="configureproduct"] .btn-primary,body[data-page="viewcart"] .btn-primary,body[data-page="checkout"] .btn-primary{background:#2e9bff;border-color:#2e9bff;font-weight:700;border-radius:9px}
body[data-page="configureproduct"] .btn-primary:hover,body[data-page="viewcart"] .btn-primary:hover,body[data-page="checkout"] .btn-primary:hover{background:#1d7df0;border-color:#1d7df0}
body[data-page="configureproduct"] .btn-default,body[data-page="viewcart"] .btn-default,body[data-page="checkout"] .btn-default{background:transparent;border:1px solid rgba(46,155,255,.5);color:#6cbcff;border-radius:9px}
body[data-page="configureproduct"] .list-group-item,body[data-page="viewcart"] .list-group-item{background:#0d1219;border-color:rgba(255,255,255,.08);color:#aab4c2}
body[data-page="configureproduct"] .list-group-item.active{background:#10151d;border-color:rgba(46,155,255,.4);color:#fff}
body[data-page="configureproduct"] .well,body[data-page="viewcart"] .well,body[data-page="checkout"] .well{background:#0d1219;border:1px solid rgba(255,255,255,.09);color:#aab4c2;border-radius:12px}
body[data-page="configureproduct"] .alert-info,body[data-page="checkout"] .alert-info,body[data-page="configureproduct"] .alert-warning{background:rgba(46,155,255,.08);border:1px solid rgba(46,155,255,.3);color:#aab4c2;border-radius:10px}
body[data-page="configureproduct"] a:not(.btn),body[data-page="viewcart"] a:not(.btn),body[data-page="checkout"] a:not(.btn){color:#6cbcff}
body[data-page="configureproduct"] .text-muted,body[data-page="viewcart"] .text-muted,body[data-page="checkout"] .text-muted{color:#8a94a3!important}
body[data-page="viewcart"] .mc-main{padding-top:40px}

/* Six-fallback pagina's in huisstijl (domainchecker, login, register, password reset) */
body[data-page="domainchecker"],body[data-page="login"],body[data-page="clientregister"],body[data-page="password-reset-container"],body[data-page="pwreset"]{background:#0a0e14;color:#e8edf4}
body[data-page="domainchecker"] .mc-main,body[data-page="login"] .mc-main,body[data-page="clientregister"] .mc-main{padding-top:40px}
body[data-page="domainchecker"] .panel,body[data-page="login"] .panel,body[data-page="clientregister"] .panel,body[data-page="password-reset-container"] .panel,body[data-page="pwreset"] .panel,body[data-page="domainchecker"] .card,body[data-page="login"] .card,body[data-page="clientregister"] .card,body[data-page="password-reset-container"] .card,body[data-page="pwreset"] .card,body[data-page="domainchecker"] .well,body[data-page="login"] .well,body[data-page="clientregister"] .well,body[data-page="password-reset-container"] .well,body[data-page="pwreset"] .well{background:#0d1219;border:1px solid rgba(255,255,255,.09);color:#e8edf4;border-radius:14px}
body[data-page="domainchecker"] .panel-heading,body[data-page="login"] .panel-heading,body[data-page="clientregister"] .panel-heading,body[data-page="password-reset-container"] .panel-heading,body[data-page="pwreset"] .panel-heading,body[data-page="domainchecker"] .card-header,body[data-page="login"] .card-header,body[data-page="clientregister"] .card-header,body[data-page="password-reset-container"] .card-header,body[data-page="pwreset"] .card-header{background:#10151d;border-bottom:1px solid rgba(255,255,255,.08);color:#e8edf4;border-radius:14px 14px 0 0}
body[data-page="domainchecker"] .form-control,body[data-page="login"] .form-control,body[data-page="clientregister"] .form-control,body[data-page="password-reset-container"] .form-control,body[data-page="pwreset"] .form-control,body[data-page="domainchecker"] input[type=text],body[data-page="login"] input[type=text],body[data-page="clientregister"] input[type=text],body[data-page="password-reset-container"] input[type=text],body[data-page="pwreset"] input[type=text],body[data-page="domainchecker"] input[type=email],body[data-page="login"] input[type=email],body[data-page="clientregister"] input[type=email],body[data-page="password-reset-container"] input[type=email],body[data-page="pwreset"] input[type=email],body[data-page="domainchecker"] input[type=password],body[data-page="login"] input[type=password],body[data-page="clientregister"] input[type=password],body[data-page="password-reset-container"] input[type=password],body[data-page="pwreset"] input[type=password],body[data-page="domainchecker"] select,body[data-page="login"] select,body[data-page="clientregister"] select,body[data-page="password-reset-container"] select,body[data-page="pwreset"] select{background:#10151d;border:1px solid rgba(255,255,255,.12);color:#e8edf4;border-radius:9px}
body[data-page="domainchecker"] .btn-primary,body[data-page="login"] .btn-primary,body[data-page="clientregister"] .btn-primary,body[data-page="password-reset-container"] .btn-primary,body[data-page="pwreset"] .btn-primary{background:#2e9bff;border-color:#2e9bff;font-weight:700;border-radius:9px}
body[data-page="domainchecker"] .btn-primary:hover,body[data-page="login"] .btn-primary:hover,body[data-page="clientregister"] .btn-primary:hover,body[data-page="password-reset-container"] .btn-primary:hover,body[data-page="pwreset"] .btn-primary:hover{background:#1d7df0;border-color:#1d7df0}
body[data-page="domainchecker"] label,body[data-page="login"] label,body[data-page="clientregister"] label,body[data-page="password-reset-container"] label,body[data-page="pwreset"] label,body[data-page="domainchecker"] .control-label,body[data-page="login"] .control-label,body[data-page="clientregister"] .control-label,body[data-page="password-reset-container"] .control-label,body[data-page="pwreset"] .control-label{color:#aab4c2}body[data-page="domainchecker"] .table,body[data-page="login"] .table,body[data-page="clientregister"] .table,body[data-page="password-reset-container"] .table,body[data-page="pwreset"] .table{color:#e8edf4}body[data-page="domainchecker"] .table td,body[data-page="login"] .table td,body[data-page="clientregister"] .table td,body[data-page="password-reset-container"] .table td,body[data-page="pwreset"] .table td,body[data-page="domainchecker"] .table th,body[data-page="login"] .table th,body[data-page="clientregister"] .table th,body[data-page="password-reset-container"] .table th,body[data-page="pwreset"] .table th{border-color:rgba(255,255,255,.08)}body[data-page="domainchecker"] h1,body[data-page="login"] h1,body[data-page="clientregister"] h1,body[data-page="password-reset-container"] h1,body[data-page="pwreset"] h1,body[data-page="domainchecker"] h2,body[data-page="login"] h2,body[data-page="clientregister"] h2,body[data-page="password-reset-container"] h2,body[data-page="pwreset"] h2,body[data-page="domainchecker"] h3,body[data-page="login"] h3,body[data-page="clientregister"] h3,body[data-page="password-reset-container"] h3,body[data-page="pwreset"] h3{color:#e8edf4}body[data-page="domainchecker"] .text-muted,body[data-page="login"] .text-muted,body[data-page="clientregister"] .text-muted,body[data-page="password-reset-container"] .text-muted,body[data-page="pwreset"] .text-muted,body[data-page="domainchecker"] small,body[data-page="login"] small,body[data-page="clientregister"] small,body[data-page="password-reset-container"] small,body[data-page="pwreset"] small{color:#8a94a3!important}

/* ===== MC-Node responsive (telefoon) ===== */
@media (max-width: 760px){
  [style*="56px"]{padding-left:18px!important;padding-right:18px!important}
  h1{font-size:34px!important;line-height:1.14!important;letter-spacing:-1px!important}
  h2{font-size:24px!important;letter-spacing:-.4px!important}
  h3{font-size:19px!important}
  [style*="grid-template-columns"]{grid-template-columns:1fr!important}
  [style*="repeat(4,minmax(0,1fr))"],[style*="repeat(4,1fr)"],[style*="repeat(5,minmax(0,1fr))"],[style*="repeat(5,1fr)"],[style*="grid-template-columns:repeat(3,1fr);gap:8px"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="repeat(auto-fill"]{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))!important}
  [style*="grid-template-columns:1fr 1fr 1fr 1.5fr"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  [style*="grid-template-columns:1.7fr 1fr 1fr 1fr 1fr"]{grid-template-columns:1.7fr repeat(4,1fr)!important;font-size:10.5px!important}
  [style*="grid-template-columns:1.4fr 1fr 1.2fr 1fr"]{grid-template-columns:1.4fr repeat(3,1fr)!important;font-size:10.5px!important}
  [style*="grid-template-columns:90px 1.1fr 1.4fr"]{grid-template-columns:64px 1fr 1.2fr!important;font-size:10.5px!important}
  [style*="grid-template-columns:110px 1fr 52px"]{grid-template-columns:80px 1fr 44px!important}
  [style*="display:flex"]{flex-wrap:wrap}
  [style*="flex-direction:column"],[style*="width:max-content"],[style*="animation:marquee"],[style*="height:340px"],[style*="height:300px"],[style*="writing-mode"],[style*="overflow-x:auto"],[style*="white-space:nowrap"]{flex-wrap:nowrap!important}
  [style*="justify-content:space-between"][style*="padding:22px 0"]{row-gap:10px}
  [style*="gap:30px"][style*="font-size:13.5px"]{order:3;width:100%;overflow-x:auto;flex-wrap:nowrap!important;padding-bottom:6px;scrollbar-width:none}
  [style*="position:sticky"]{position:static!important}
  [style*="font-size:66px"],[style*="font-size:58px"],[style*="font-size:54px"],[style*="font-size:52px"],[style*="font-size:50px"]{font-size:34px!important;line-height:1.14!important;letter-spacing:-1px!important}
  [style*="font-size:42px"],[style*="font-size:40px"],[style*="font-size:38px"],[style*="font-size:36px"]{font-size:27px!important}
  [style*="font-size:30px"]{font-size:22px!important}
  [style*="padding:72px 0"],[style*="padding:150px 0 170px"]{padding-top:44px!important;padding-bottom:52px!important}
  img,video{max-width:100%;height:auto}
  [style*="grid-column"]{grid-column:auto!important}
  [style*="grid-row"]{grid-row:auto!important}
  [style*="-46px"]{margin-left:0!important;margin-right:0!important;height:380px!important}
  [style*="1fr 1fr 1fr 1.5fr"] > div:last-child{grid-column:1 / -1!important;margin-top:10px}
  [style*="justify-content:flex-end"],[style*="justify-content: flex-end"]{justify-content:flex-start!important}
}
@media (max-width: 480px){
  [style*="repeat(4"],[style*="repeat(5"],[style*="repeat(3,minmax(0,1fr))"],[style*="repeat(3, minmax(0, 1fr))"]{grid-template-columns:1fr!important}
}

@media (max-width: 980px){
  .mc-nav{padding:0 18px}
  .mc-nav-inner{flex-wrap:wrap;row-gap:10px;padding:14px 0}
  .mc-nav-links{display:flex;order:3;width:100%;overflow-x:auto;white-space:nowrap;gap:18px;padding-bottom:6px;scrollbar-width:none}
  .mc-nav-links::-webkit-scrollbar{display:none}
  .mc-nav-actions{margin-left:auto;flex-wrap:wrap;row-gap:8px;justify-content:flex-end}
}
@media (max-width: 760px){
  .mc-footer{padding:48px 18px 0}
  .mc-footer-grid{grid-template-columns:1fr 1fr}
  .mc-footer-quote{font-size:24px}
  .configure-product{padding:0 0 56px}
  .summary{position:static}
  body[data-page] .mc-main.container{padding-left:12px;padding-right:12px}
}

/* Zachte overgang onder hero-secties */
.mc-underlay{position:relative}
.mc-underlay::after{content:'';position:absolute;left:0;right:0;bottom:0;height:150px;background:linear-gradient(180deg,rgba(10,14,20,0),#0a0e14);pointer-events:none;z-index:0}

@media (max-width: 980px){
  .mc-nav-actions{gap:10px}
  .mc-nav .mc-btn-ghost{padding:8px 13px;font-size:12.5px}
  .mc-logo{font-size:18px}
  .mc-nav-inner{padding:12px 0}
}

/* domainchecker-escape: designpagina altijd full-width, ook als de container-wrap meeloopt */
body[data-page="domainchecker"] .mc-main.container,body[data-page="domainregister"] .mc-main.container{max-width:none!important;width:100%!important;padding:0!important}
/* premium plannen: laatste rij gecentreerd (flex-kaarten) */
@media (max-width: 760px){[style*="calc(33.333% - 12px)"]{width:100%!important}}

/* Taal-dropdown (NL/EN/DE — vaste server-fix meertaligheid) */
.mc-langdd{position:relative}
.mc-langdd-btn{display:inline-flex;align-items:center;gap:7px;background:transparent;border:1px solid transparent;border-radius:9px;padding:7px 11px;color:#aab4c2;font-size:12.5px;font-weight:600;cursor:pointer;font-family:inherit;transition:border-color .15s}
.mc-langdd-btn:hover,.mc-langdd.open .mc-langdd-btn{border-color:rgba(255,255,255,.18)}
.mc-langdd-btn img{width:20px;height:14px;border-radius:2px;display:block}
.mc-langdd-btn svg{color:#7d8797}
.mc-langdd-menu{display:none;position:absolute;top:calc(100% + 8px);right:0;min-width:172px;background:#0d1219;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:6px;box-shadow:0 24px 60px -18px rgba(0,0,0,.85);z-index:60}
.mc-langdd.open .mc-langdd-menu{display:block}
.mc-langdd-menu a{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:8px;font-size:13px;font-weight:600;color:#aab4c2!important;text-decoration:none}
.mc-langdd-menu a:hover{background:rgba(255,255,255,.04);color:#fff!important}
.mc-langdd-menu a.on{background:rgba(46,155,255,.1);color:#6cbcff!important}
.mc-langdd-menu a img{width:20px;height:14px;border-radius:2px}

/* DEV-banner: vast onderin beeld op alle pagina's — duwt de layout nergens meer
   omlaag (dat gaf zwarte randen boven hero's) en blijft leesbaar als dev-indicatie.
   !important is nodig omdat WHMCS de banner inline styled. */
body.mc div[style*="ffffd2"]{
  position:fixed!important;bottom:16px;left:16px;z-index:60;
  width:230px!important;max-width:60vw;margin:0!important;padding:10px 14px!important;
  font-size:11px!important;line-height:1.55;text-align:left!important;border-radius:12px;opacity:.9;
  box-shadow:0 10px 30px rgba(0,0,0,.5);
}

/* Feedback 20-07: ankerlinks (bv. "bekijk pakketten" -> #pakketten) soepel scrollen */
html{scroll-behavior:smooth}
/* game.php: subtiele hover-lift op kaarten (o.a. populair) */
#mcGameGrid .mc-gcard{transition:transform .2s ease,border-color .2s ease}
#mcGameGrid .mc-gcard:hover{transform:translateY(-4px)}

/* Locatiekaart: markers met pulse + monolabels (20-07) */
.mc-map-dot{position:absolute;transform:translate(-50%,-50%);width:0;height:0}
.mc-map-dot span{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;display:block}
.mc-map-dot span::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1.5px solid currentColor;opacity:0;animation:mcMapPulse 3s ease-out infinite;color:rgba(46,155,255,.55)}
.mc-map-dot b{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;letter-spacing:.5px;color:#aab4c2;text-shadow:0 2px 8px rgba(0,0,0,.9)}
@keyframes mcMapPulse{0%{transform:scale(.4);opacity:.8}70%{transform:scale(1.6);opacity:0}100%{opacity:0}}
@media (max-width:700px){.mc-map-dot b{display:none}}

/* Pakket-grids (20-07): flex met centrering zodat onvolledige onderste rijen netjes in het midden staan */
.mc-plangrid>div{width:calc(25% - 12px)}
@media (max-width:1100px){.mc-plangrid>div{width:calc(50% - 8px)}}
@media (max-width:600px){.mc-plangrid>div{width:100%}}

/* Cart-pagina's (20-07): stappenbalk loopt full-bleed door — clip voorkomt een horizontale scrollbar
   door de 50vw-truc (clip i.p.v. hidden zodat position:sticky blijft werken) */
body.mc-dark{overflow-x:clip}
.mc-main .mc-cart-steps-bar{margin-top:-40px!important}
.mc-cart-steps-bar>div{overflow-x:auto;scrollbar-width:none}
.mc-cart-steps-bar>div::-webkit-scrollbar{display:none}

/* six-fallback pagina's: WHMCS-verborgen blokken ook zonder core-css echt verbergen.
   LET OP: .w-hidden bewust ZONDER !important — WHMCS' eigen scripts.js toont elementen met
   deze klasse via jQuery .slideDown()/.show() (inline style), wat een !important-regel
   permanent zou blokkeren (brak "Al geregistreerd?" op de afrekenpagina). #providerLinkingMessages
   wordt nooit door JS zichtbaar gemaakt (alleen uitgelezen), dus die mag wel hard verborgen blijven. */
.w-hidden{display:none}
#providerLinkingMessages{display:none!important}
/* six-login binnen 2026-schil: gecentreerde kaart */
body[data-page="login"] .logincontainer,body[data-page="password-reset-container"] .logincontainer{max-width:520px;margin:30px auto 70px;background:#0d1219;border:1px solid rgba(255,255,255,.09);border-radius:16px;padding:34px 34px 30px}
body[data-page="login"] .logincontainer .header-lined h1,body[data-page="password-reset-container"] .logincontainer .header-lined h1{font-size:26px;color:#e8edf4;border:0;margin:0 0 4px}
body[data-page="login"] .logincontainer .header-lined h1 small,body[data-page="login"] .logincontainer p,body[data-page="password-reset-container"] .logincontainer .header-lined h1 small,body[data-page="password-reset-container"] .logincontainer p{color:#8a94a3}
body[data-page="login"] .logincontainer .col-sm-7,body[data-page="login"] .logincontainer .col-sm-12,body[data-page="password-reset-container"] .logincontainer .col-sm-7,body[data-page="password-reset-container"] .logincontainer .col-sm-12{width:100%;max-width:100%;flex:0 0 100%}
body[data-page="login"] .logincontainer .col-sm-5,body[data-page="password-reset-container"] .logincontainer .col-sm-5{width:100%;max-width:100%;flex:0 0 100%;margin-top:18px}
body[data-page="login"] .logincontainer .btn-default,body[data-page="password-reset-container"] .logincontainer .btn-default{background:#10151d;border:1px solid rgba(255,255,255,.12);color:#e8edf4;border-radius:9px}
body[data-page="password-reset-container"] .logincontainer .form-group-feedback{position:relative}
body[data-page="password-reset-container"] .logincontainer .form-control-feedback{position:absolute;right:12px;top:38px;color:#5b6675}
body[data-page="password-reset-container"] .logincontainer #inputNewPassword2Msg{font-size:12px;margin-top:6px}
body[data-page="password-reset-container"] .logincontainer #inputNewPassword2Msg.text-success{color:#41d98d}
body[data-page="password-reset-container"] .logincontainer #inputNewPassword2Msg.text-danger{color:#ff9c8c}
body[data-page="password-reset-container"] .logincontainer .progress{background-color:#10151d;border-radius:6px;height:7px;border:1px solid rgba(255,255,255,.08);overflow:hidden;margin:6px 0 4px}
body[data-page="password-reset-container"] .logincontainer .alert{border-radius:10px;padding:13px 16px;font-size:13.5px;line-height:1.5;border:1px solid transparent}
body[data-page="password-reset-container"] .logincontainer .alert-info{background:rgba(46,155,255,.08);border-color:rgba(46,155,255,.4);color:#bcdcff}
body[data-page="password-reset-container"] .logincontainer .alert-danger{background:rgba(255,122,107,.08);border-color:rgba(255,122,107,.4);color:#ff9c8c}
body[data-page="password-reset-container"] .logincontainer .alert-success{background:rgba(65,217,141,.08);border-color:rgba(65,217,141,.4);color:#a6f0c6}
body[data-page="password-reset-container"] .logincontainer .alert h2{font-size:14px;margin:0 0 4px;color:inherit}
body[data-page="password-reset-container"] .logincontainer .help-block{color:#ff9c8c;font-size:12.5px;margin:6px 0 0}
body[data-page="password-reset-container"] .logincontainer .form-group.has-error .form-control{border-color:rgba(255,122,107,.5)!important}
body[data-page="password-reset-container"] .logincontainer .form-group.has-success .form-control{border-color:rgba(65,217,141,.5)!important}

/* Provider-feedback (Google-koppeling): duidelijke melding i.p.v. onzichtbare tekst */
.providerLinkingFeedback:not(:empty){display:block;background:rgba(245,179,61,.08);border:1px solid rgba(245,179,61,.45);border-radius:10px;padding:13px 16px;color:#f5d9a0;font-size:13.5px;line-height:1.5;margin:0 0 16px}
.providerLinkingFeedback:not(:empty) a{color:#f5b83d}
/* Google-knop netjes in de loginkaart: eigen sectie met scheidingslijn, gecentreerd */
body[data-page="login"] .logincontainer .col-sm-5{display:flex!important;flex-direction:column;align-items:center;gap:10px;border-top:1px solid rgba(255,255,255,.08);margin-top:22px;padding-top:20px}
body[data-page="login"] .logincontainer .providerPreLinking{display:flex;justify-content:center;width:100%}
body[data-page="login"] .logincontainer iframe{max-width:100%}

/* ============================================================
   Betaalpagina (viewinvoice → kaartbetaling) — MC-Node 2026
   Toegevoegd 31-08-2026. Alleen opmaak; de veldnamen en JS-haken
   van WHMCS zijn ongewijzigd. Terug te draaien door dit blok te
   verwijderen en de overrides in templates/mcnode2026/payment/.
   ============================================================ */
.mc-payform{--pay-line:rgba(255,255,255,.09);--pay-panel:#0d1219;--pay-tekst:#e8edf4;--pay-muted:#8a94a3;
  --pay-blauw:#2e9bff;--pay-blauw-d:#1d7df0;--pay-zacht:#10151d;
  color:var(--pay-tekst);font-family:'Space Grotesk',sans-serif}
.mc-pay-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:26px;align-items:start}
.mc-pay-panel{background:var(--pay-panel);border:1px solid var(--pay-line);border-radius:16px;
  padding:24px 26px;box-shadow:0 14px 34px -22px rgba(0,0,0,.7)}
.mc-pay-head{display:flex;align-items:center;gap:11px;margin:0 0 18px}
.mc-pay-head h3{margin:0;font-size:17px;font-weight:700;letter-spacing:-.2px}
.mc-pay-step{width:26px;height:26px;border-radius:50%;background:var(--pay-blauw);color:#fff;
  font-size:13px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex:none}
.mc-pay-methods{margin-bottom:20px}

/* velden */
.mc-field{margin:0 0 16px}
.mc-label{display:block;font-size:13px;font-weight:600;color:#aab4c2;margin:0 0 7px;letter-spacing:.1px}
.mc-input-wrap{position:relative}
.mc-input,.mc-input-wrap select{width:100%;height:46px;border:1px solid rgba(255,255,255,.14);border-radius:10px;
  padding:0 14px;font-size:15px;color:var(--pay-tekst);background:#10151d;box-shadow:none;
  transition:border-color .15s,box-shadow .15s;font-family:inherit}
.mc-input:focus,.mc-input-wrap select:focus{outline:none;border-color:var(--pay-blauw);
  box-shadow:0 0 0 3px rgba(46,155,255,.16)}
.mc-input::placeholder{color:#5c6675}
.mc-input-card{letter-spacing:1.4px;padding-right:96px;font-variant-numeric:tabular-nums}
.mc-field-pair{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mc-input-narrow{max-width:120px}
.mc-help{border:1px solid rgba(255,255,255,.18);background:transparent;color:var(--pay-muted);width:18px;height:18px;
  border-radius:50%;font-size:11px;line-height:1;padding:0;margin-left:5px;cursor:pointer;vertical-align:middle}
.mc-help:hover{border-color:var(--pay-blauw);color:var(--pay-blauw)}
.field-error-msg{display:none;color:#e5484d;font-size:12.5px;margin-top:6px}
.mc-field.has-error .mc-input{border-color:#e5484d;box-shadow:0 0 0 3px rgba(229,72,77,.14)}

/* kaartmerken in het nummerveld */
.mc-brands{position:absolute;right:12px;top:50%;transform:translateY(-50%);display:flex;gap:6px;pointer-events:none}
.mc-brands img{height:20px;width:auto;opacity:.85;transition:opacity .2s,filter .2s}
.mc-brands img.mc-brand-uit{opacity:.2;filter:grayscale(1)}

/* keuzerijen: opgeslagen kaarten en 'nieuwe kaart' */
.mc-cardlist{display:flex;flex-direction:column;gap:9px;margin-bottom:9px}
.mc-cardrow{display:flex;align-items:center;gap:12px;border:1px solid var(--pay-line);
  border-radius:12px;padding:12px 14px;background:#10151d;transition:border-color .15s,background .15s}
.mc-cardrow:hover{border-color:rgba(46,155,255,.45)}
.mc-cardrow:has(input:checked){border-color:var(--pay-blauw);background:rgba(46,155,255,.09)}
.mc-cardrow-body{display:flex;align-items:center;gap:12px;margin:0;flex:1;cursor:pointer;font-weight:400}
.mc-cardrow-icon{color:#8a94a3;width:24px;display:flex;justify-content:center;flex:none}
.mc-cardrow:has(input:checked) .mc-cardrow-icon{color:var(--pay-blauw)}
.mc-cardrow-tekst{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.mc-cardrow-naam{font-size:14.5px;font-weight:600}
.mc-cardrow-omschrijving{font-size:12.5px;color:var(--pay-muted)}
.mc-cardrow-datum{font-size:12.5px;color:var(--pay-muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.mc-cardrow-datum em{display:block;color:#e5484d;font-style:normal;font-size:11.5px}
.mc-cardrow-verlopen{opacity:.55}

/* factuuradres */
.mc-adres{margin-top:20px;padding-top:20px;border-top:1px solid var(--pay-line)}
.mc-adres-lijst{display:flex;flex-direction:column;gap:9px}
.mc-adres-optie{display:flex;align-items:flex-start;gap:11px;border:1px solid var(--pay-line);
  border-radius:12px;padding:12px 14px;margin:0;font-weight:400;cursor:pointer;transition:border-color .15s,background .15s}
.mc-adres-optie:hover{border-color:rgba(46,155,255,.45)}
.mc-adres-optie:has(input:checked){border-color:var(--pay-blauw);background:rgba(46,155,255,.09)}
.mc-adres-tekst{display:flex;flex-direction:column;gap:2px;font-size:13.5px;line-height:1.5}
.mc-adres-tekst strong{font-size:14px}
.mc-adres-regel{color:var(--pay-muted)}
.mc-adres-form{margin-top:16px;padding:18px;border:1px dashed rgba(255,255,255,.16);border-radius:12px;background:var(--pay-zacht)}
.mc-field-store{display:flex;align-items:center;gap:10px;margin-top:18px}
.mc-store-label{font-size:13.5px;color:#aab4c2;margin:0}

/* betaalknop */
.mc-pay-submit{margin-top:20px}
.mc-paybtn{display:block;width:100%;height:52px;border:0;border-radius:12px;cursor:pointer;
  background:linear-gradient(180deg,var(--pay-blauw),var(--pay-blauw-d));color:#fff;
  font-size:16px;font-weight:700;font-family:inherit;letter-spacing:.2px;
  box-shadow:0 6px 18px -8px rgba(29,125,240,.7);transition:filter .15s,transform .05s}
.mc-paybtn:hover{filter:brightness(1.06)}
.mc-paybtn:active{transform:translateY(1px)}
.mc-paybtn:disabled,.mc-paybtn.disabled{opacity:.6;cursor:not-allowed}
.mc-pay-trust{margin:14px 0 0;text-align:center;font-size:12.5px;color:var(--pay-muted);line-height:1.6}
.mc-pay-trust i{color:#41d98d;margin-right:5px}

/* factuuroverzicht */
.mc-sum{background:linear-gradient(var(--pay-panel),var(--pay-panel)) padding-box,linear-gradient(150deg,rgba(46,155,255,.5),rgba(46,155,255,.06)) border-box;border:1px solid transparent;border-radius:16px;padding:22px 24px;
  position:sticky;top:20px;box-shadow:0 14px 34px -22px rgba(0,0,0,.7)}
.mc-sum-kop{margin-bottom:16px}
.mc-sum-kicker{display:block;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:1.6px;
  text-transform:uppercase;color:var(--pay-muted)}
.mc-sum-kop h2{margin:2px 0 0;font-size:24px;font-weight:700;letter-spacing:-.6px}
.mc-sum-regel{display:flex;justify-content:space-between;gap:14px;font-size:13.5px;padding:7px 0;line-height:1.5}
.mc-sum-oms{color:#aab4c2;white-space:pre-line}
.mc-sum-bedrag{white-space:nowrap;font-variant-numeric:tabular-nums}
.mc-sum-regels{border-bottom:1px solid var(--pay-line);padding-bottom:8px;margin-bottom:8px}
.mc-sum-totalen{border-bottom:1px solid var(--pay-line);padding-bottom:8px;margin-bottom:8px;color:var(--pay-muted)}
.mc-sum-totalen .mc-sum-regel span:last-child{color:var(--pay-tekst);font-variant-numeric:tabular-nums}
.mc-sum-totaal{font-weight:700;color:var(--pay-tekst);font-size:14.5px}
.mc-sum-voet{color:var(--pay-muted);font-size:13px}
.mc-sum-openstaand{font-size:17px;font-weight:700;color:var(--pay-tekst);align-items:baseline}
.mc-sum-openstaand span:last-child{color:var(--pay-blauw);font-variant-numeric:tabular-nums}

/* gateway die zijn eigen formulier rendert (Stripe/3D Secure) */
.mc-pay-remote{max-width:760px;margin:0 auto}
.mc-pay-remote iframe{border:1px solid var(--pay-line);border-radius:14px;background:#fff}

/* smal scherm: eerst het bedrag, dan het formulier */
@media (max-width:900px){
  .mc-pay-grid{grid-template-columns:1fr}
  .mc-pay-side{order:-1}
  .mc-sum{position:static}
  .mc-pay-panel{padding:20px 18px}
  .mc-field-pair{grid-template-columns:1fr}
}

.mc-adres-optie{background:#10151d}
/* six/css/all.min.css wordt door dit thema niet geladen, waardoor Bootstrap's
   .hidden hier ontbreekt. WHMCS rendert de nieuwe-kaartvelden bij een
   voorgeselecteerde opgeslagen kaart met class="cc-details hidden"; zonder deze
   regel zouden die bij het laden tóch zichtbaar zijn. Bewust alleen binnen het
   betaalformulier, om andere pagina's niet te raken. whmcs.js haalt de class
   zelf weg (removeClass) voordat het slideDown() aanroept, dus !important
   blokkeert het uitklappen niet. */
.mc-payform .hidden{display:none!important}

/* ===== Dark-skin voor de factuurpagina (viewinvoice) — 31-08-2026 =====
   Zelfde aanpak als het checkout-blok hierboven: puur CSS, geen template-risico. */
body[data-page="viewinvoice"]{background:#0a0e14;color:#e8edf4}
body[data-page="viewinvoice"] .mc-main{padding-top:40px}
body[data-page="viewinvoice"] .panel,body[data-page="viewinvoice"] .card{background:#0d1219;border:1px solid rgba(255,255,255,.09);color:#e8edf4;border-radius:14px}
body[data-page="viewinvoice"] .panel-heading,body[data-page="viewinvoice"] .card-header{background:#10151d;border-bottom:1px solid rgba(255,255,255,.08);color:#e8edf4;border-radius:14px 14px 0 0}
body[data-page="viewinvoice"] .table{color:#e8edf4}
body[data-page="viewinvoice"] .table td,body[data-page="viewinvoice"] .table th{border-color:rgba(255,255,255,.08)}
body[data-page="viewinvoice"] .table-striped>tbody>tr:nth-of-type(odd){background:rgba(255,255,255,.03)}
body[data-page="viewinvoice"] .btn-primary{background:#2e9bff;border-color:#2e9bff;font-weight:700;border-radius:9px}
body[data-page="viewinvoice"] .btn-primary:hover{background:#1d7df0;border-color:#1d7df0}
body[data-page="viewinvoice"] .btn-default{background:transparent;border:1px solid rgba(46,155,255,.5);color:#6cbcff;border-radius:9px}
body[data-page="viewinvoice"] .well{background:#0d1219;border:1px solid rgba(255,255,255,.09);color:#aab4c2;border-radius:12px}
body[data-page="viewinvoice"] .alert-info{background:rgba(46,155,255,.08);border:1px solid rgba(46,155,255,.3);color:#aab4c2;border-radius:10px}
body[data-page="viewinvoice"] .alert-warning{background:rgba(245,179,1,.08);border:1px solid rgba(245,179,1,.3);color:#e6c66a;border-radius:10px}
body[data-page="viewinvoice"] .alert-danger{background:rgba(229,72,77,.08);border:1px solid rgba(229,72,77,.35);color:#f0a3a6;border-radius:10px}
body[data-page="viewinvoice"] .alert-success{background:rgba(65,217,141,.08);border:1px solid rgba(65,217,141,.3);color:#8fe6b8;border-radius:10px}
body[data-page="viewinvoice"] a:not(.btn){color:#6cbcff}
body[data-page="viewinvoice"] .text-muted,body[data-page="viewinvoice"] small{color:#8a94a3!important}
body[data-page="viewinvoice"] .form-control,body[data-page="viewinvoice"] select{background:#10151d;border:1px solid rgba(255,255,255,.12);color:#e8edf4;border-radius:9px}
body[data-page="viewinvoice"] .breadcrumb{background:transparent}
body[data-page="viewinvoice"] .invoice-status{filter:none}
body[data-page="viewinvoice"] .label-danger,body[data-page="viewinvoice"] .label-success{border-radius:6px}

/* ===== Veiligheidsblok op de betaalpagina ===== */
.mc-pay-veilig{margin-top:18px;border:1px solid rgba(65,217,141,.25);background:rgba(65,217,141,.05);
  border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:9px}
.mc-pay-veilig-kop{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:700;color:#8fe6b8}
.mc-pay-veilig-kop svg{flex:none}
.mc-pay-veilig ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:5px}
.mc-pay-veilig li{font-size:12.5px;color:#8a94a3;line-height:1.55;display:flex;gap:8px;align-items:baseline}
.mc-pay-veilig li svg{flex:none}
.mc-pay-veilig-logos{display:flex;gap:7px;align-items:center;margin-top:3px}
.mc-pay-veilig-logos img{height:17px;width:auto;opacity:.9}
.mc-pay-veilig-logos .mc-pv-chip{font-family:'IBM Plex Mono',monospace;font-size:9.5px;letter-spacing:1px;
  color:#7d8797;border:1px solid rgba(255,255,255,.14);border-radius:5px;padding:2px 7px}