/* Verandazeil configurator – sluit aan op de huisstijl van verandadoek.com */
.vdc{--c-ink:var(--ink,#22282b);--c-yel:var(--yel,#f2b300);--c-yeld:var(--yeld,#d99f00);--c-grey:var(--grey,#f2f2ef);--c-line:var(--line,#d9dad5);--c-mut:var(--muted,#5c6366);
  color:var(--c-ink);font-size:16px;line-height:1.5}
.vdc *,.vdc *::before,.vdc *::after{box-sizing:border-box}
.vdc button{font:inherit;color:inherit;cursor:pointer}
.vdc [hidden]{display:none!important}

/* tabs met zeilen */
.vdc-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px}
.vdc-tab{display:flex;align-items:stretch;border:1px solid var(--c-line);background:#fff}
.vdc-tab>button:first-child{background:none;border:0;padding:9px 14px;text-align:left;line-height:1.2}
.vdc-tab b{display:block;font-size:.95rem}
.vdc-tab span{display:block;font-size:.78rem;color:var(--c-mut)}
.vdc-tab.on{border-color:var(--c-ink);box-shadow:inset 0 -4px 0 var(--c-yel)}
.vdc-tab.bad b::after{content:" !";color:#b3261e}
.vdc-tab .x{background:none;border:0;border-left:1px solid var(--c-line);padding:0 11px;font-size:1.2rem;color:var(--c-mut)}
.vdc-tab .x:hover{color:#b3261e;background:var(--c-grey)}
.vdc-add{border:1px dashed var(--c-ink);background:transparent;padding:9px 14px;font-weight:700}
.vdc-add:hover{background:var(--c-yel);border-style:solid}

/* layout */
.vdc-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,1fr);gap:24px;align-items:start}
.vdc-stage{position:sticky;top:96px}
@media(max-width:960px){.vdc-grid{grid-template-columns:1fr}.vdc-stage{position:static}}

.vdc-viewbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.vdc-seg{display:inline-flex;border:1px solid var(--c-ink)}
.vdc-seg button{background:#fff;border:0;padding:8px 14px;font-weight:600;font-size:.9rem}
.vdc-seg button+button{border-left:1px solid var(--c-ink)}
.vdc-seg button.on{background:var(--c-ink);color:#fff}
.vdc-cam{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.vdc-cam button{background:none;border:1px solid var(--c-line);padding:6px 10px;font-size:.84rem}
.vdc-cam button:hover{border-color:var(--c-ink)}
.vdc-chk{display:inline-flex;align-items:center;gap:6px;font-size:.84rem;margin-left:6px}
.vdc-chk input{accent-color:var(--c-ink);width:16px;height:16px}

.vdc-view{position:relative;border:1px solid var(--c-line);background:#e9ebe7}
.vdc-3d{position:relative;height:min(62vh,560px);min-height:340px;overflow:hidden}
.vdc-canvas{display:block;width:100%;height:100%;cursor:grab}
.vdc-grab .vdc-canvas{cursor:grabbing}
.vdc-labels{position:absolute;inset:0;pointer-events:none}
.vdc-dim{position:absolute;left:0;top:0;background:var(--c-yel);color:var(--c-ink);font-weight:800;font-size:.85rem;padding:2px 7px;white-space:nowrap}
.vdc-hint{position:absolute;left:10px;bottom:8px;margin:0;font-size:.78rem;color:var(--c-mut);background:rgba(255,255,255,.8);padding:2px 7px}
.vdc-schets{background:#fff;padding:10px;min-height:340px;display:flex;align-items:center;justify-content:center}
.vdc-schets svg{width:100%;height:auto;max-height:min(62vh,560px)}
.vdc-nogl-msg{padding:40px 20px;text-align:center}
@media(max-width:600px){.vdc-3d{height:52vh;min-height:300px}.vdc-cam button{padding:6px 8px}}

.vdc-facts{margin-top:10px}
.vdc-facts dl{display:grid;grid-template-columns:repeat(3,1fr);margin:0;border:1px solid var(--c-line);background:#fff}
.vdc-facts dl>div{padding:9px 12px;border-right:1px solid var(--c-line);border-bottom:1px solid var(--c-line)}
.vdc-facts dl>div:nth-child(3n){border-right:0}
.vdc-facts dt{font-size:.74rem;color:var(--c-mut);text-transform:uppercase;letter-spacing:.04em}
.vdc-facts dd{margin:0;font-weight:700;font-size:.95rem}
@media(max-width:600px){.vdc-facts dl{grid-template-columns:1fr 1fr}.vdc-facts dl>div:nth-child(3n){border-right:1px solid var(--c-line)}.vdc-facts dl>div:nth-child(2n){border-right:0}}
.vdc-warn{list-style:none;margin:10px 0 0;padding:0}
.vdc-warn li{background:#fff8e1;border-left:4px solid var(--c-yel);padding:9px 12px;margin-bottom:6px;font-size:.92rem}
.vdc-warn li.block{background:#fdecea;border-left-color:#b3261e}

/* panel */
.vdc-panel{border:1px solid var(--c-line);border-top:4px solid var(--c-yel);background:#fff}
.vdc-step{padding:16px 18px;border-bottom:1px solid var(--c-line)}
.vdc-step h3{display:flex;align-items:center;gap:9px;font-size:1.15rem!important;margin:0 0 12px!important}
.vdc-step h3 span{display:grid;place-items:center;width:24px;height:24px;background:var(--c-ink);color:#fff;font-size:.8rem;font-family:inherit}
.vdc-step h3 small{font-weight:400;color:var(--c-mut);font-size:.85rem}
.vdc-help{font-size:.84rem;color:var(--c-mut);margin:10px 0 0}
.vdc-help a{font-weight:600}
.vdc-types{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.vdc-types button{background:#fff;border:1px solid #bfc2bd;padding:10px 8px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;color:#4c5457}
.vdc-types button svg{width:60px;height:40px;color:#4c5457}
.vdc-types b{color:var(--c-ink);font-size:.9rem;line-height:1.2}
.vdc-types small{font-size:.74rem;line-height:1.25;color:var(--c-mut)}
.vdc-types button.on{border-color:var(--c-ink);box-shadow:inset 0 0 0 1px var(--c-ink);background:#fff8e1}
@media(max-width:420px){.vdc-types small{display:none}}
.vdc-dims{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.vdc-num{display:block;font-weight:700;font-size:.88rem}
.vdc-inp{display:flex;align-items:center;border:1px solid #bfc2bd;margin-top:5px;background:#fff}
.vdc-inp:focus-within{outline:2px solid var(--c-yel);border-color:var(--c-ink)}
.vdc-inp input{flex:1;min-width:0;border:0;padding:10px 12px;font:600 1.05rem inherit;font-family:inherit;outline:0;background:transparent}
.vdc-inp i{font-style:normal;color:var(--c-mut);padding-right:12px;font-weight:400}
.vdc-num input[type=range]{width:100%;margin-top:8px;accent-color:var(--c-ink)}
.vdc-stepper{display:flex;align-items:center;gap:0}
.vdc-stepper button{width:44px;height:44px;border:1px solid var(--c-ink);background:#fff;font-size:1.3rem;font-weight:700}
.vdc-stepper button:hover{background:var(--c-yel)}
.vdc-stepper output{width:56px;height:44px;display:grid;place-items:center;border-top:1px solid var(--c-ink);border-bottom:1px solid var(--c-ink);font-weight:800;font-size:1.2rem}
.vdc-stepper span{margin-left:12px;font-weight:600}
.vdc-stepper span i{font-weight:400;color:var(--c-mut);font-style:normal}
.vdc-pos{margin-top:12px}
.vdc-fix>div{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:5px 0}
.vdc-fix>div>span{font-weight:600;font-size:.92rem}
.vdc-fix .vdc-seg button{padding:7px 12px;font-size:.86rem}
.vdc-colors{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.vdc-colors button{background:#fff;border:1px solid var(--c-line);padding:0;text-align:left}
.vdc-colors i{display:block;height:38px;border-bottom:1px solid var(--c-line)}
.vdc-colors span{display:block;padding:5px 7px;font-size:.76rem;font-weight:600;line-height:1.2}
.vdc-colors small{display:block;font-weight:400;color:var(--c-mut)}
.vdc-colors button.on{border-color:var(--c-ink);box-shadow:inset 0 0 0 2px var(--c-ink)}
.vdc-label{width:100%;border:1px solid #bfc2bd;padding:10px 12px;font:inherit}
.vdc-label:focus{outline:2px solid var(--c-yel);border-color:var(--c-ink)}
.vdc-next{display:flex;flex-wrap:wrap;gap:8px;padding:16px 18px;background:var(--c-grey)}
.vdc-ghost{background:#fff;border:1px solid var(--c-ink);padding:10px 14px;font-weight:600;font-size:.9rem}
.vdc-ghost:hover{background:var(--c-ink);color:#fff}
.vdc-go{margin-left:auto;background:var(--c-yel);color:var(--c-ink)!important;text-decoration:none!important;font-weight:700;padding:11px 16px}
.vdc-go:hover{background:var(--c-yeld)}
@media(max-width:600px){.vdc-go{margin-left:0;width:100%;text-align:center}}

/* aanvraag */
.vdc-request{margin-top:40px;padding-top:34px;border-top:2px solid var(--c-ink)}
.vdc-req-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:32px;align-items:start}
@media(max-width:900px){.vdc-req-grid{grid-template-columns:1fr}}
.vdc-request h2{margin:0 0 8px}
.vdc-muted{color:var(--c-mut)}
.vdc-list ol{list-style:none;margin:16px 0 0;padding:0;border-top:1px solid var(--c-line);counter-reset:z}
.vdc-list li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--c-line)}
.vdc-list li div{display:flex;flex-direction:column}
.vdc-list li span{font-size:.88rem;color:var(--c-mut)}
.vdc-list li .vdc-err{color:#b3261e;font-weight:600}
.vdc-list li button{background:none;border:1px solid var(--c-line);padding:6px 10px;font-size:.84rem;flex-shrink:0}
.vdc-list li button:hover{border-color:var(--c-ink)}
.vdc-form{background:#fff;border:1px solid var(--c-line);border-top:4px solid var(--c-yel);padding:22px}
.vdc-form label{display:block;font-weight:700;font-size:.86rem;margin-bottom:12px}
.vdc-form label em{font-style:normal;color:#b3261e}
.vdc-form input:not([type=radio]):not([type=checkbox]):not([type=file]),.vdc-form textarea{display:block;width:100%;margin-top:5px;border:1px solid #bfc2bd;padding:11px 12px;font:400 1rem inherit;font-family:inherit;background:#fff}
.vdc-form input:focus,.vdc-form textarea:focus{outline:2px solid var(--c-yel);border-color:var(--c-ink)}
.vdc-row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.vdc-row2{grid-template-columns:1fr}}
.vdc-radio{border:0;padding:0;margin:0 0 12px}
.vdc-radio legend{font-weight:700;font-size:.86rem;margin-bottom:6px;padding:0}
.vdc-radio label{display:inline-flex;align-items:center;gap:8px;font-weight:600;border:1px solid #bfc2bd;padding:9px 12px;margin:0 6px 6px 0}
.vdc-radio label:has(input:checked){border-color:var(--c-ink);background:#fff8e1}
.vdc-radio input,.vdc-acc input{accent-color:var(--c-ink);width:18px;height:18px}
.vdc-file input{display:block;margin-top:6px;width:100%;border:1px dashed #bfc2bd;padding:10px;background:var(--c-grey);font-size:.88rem}
.vdc-acc{display:flex!important;gap:8px;align-items:flex-start;font-weight:400!important;font-size:.9rem!important}
.vdc-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.vdc-submit{width:100%;padding:16px;background:var(--c-yel);border:0;font-weight:800;font-size:1.05rem}
.vdc-submit:hover{background:var(--c-yeld)}
.vdc-submit:disabled{opacity:.6;cursor:progress}
.vdc-status{margin:12px 0 0;font-size:.92rem;min-height:1.2em}
.vdc-status.err{color:#b3261e}
.vdc-status.ok{color:#2d6a3e;font-weight:700}