/* DPG Snelkeuze 0.5.7 – compacte rij: titel + specs | prijs | Kies */
.dpgsk{--dpgsk-accent:#0b6fb0;--dpgsk-strong:#0b6fb0;--dpgsk-hover:#f2fbff;--dpgsk-active:#eef9ff;--dpgsk-line:#dfe3e8;--dpgsk-muted:#5b6670;--dpgsk-radius:10px;margin:20px 0;border:1px solid var(--dpgsk-line);border-radius:var(--dpgsk-radius);background:#fff;color:#1f2328;font-family:inherit;overflow:hidden}
.dpgsk [hidden]{display:none!important}
.dpgsk .dpgsk-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;padding:12px 16px;background:#f6f8fa;border-bottom:1px solid var(--dpgsk-line)}
.dpgsk .dpgsk-heading{margin:0;padding:0;font-size:1.05rem;font-weight:700;line-height:1.3}
.dpgsk .dpgsk-sub{font-size:.82rem;line-height:1.4;color:var(--dpgsk-muted)}
.dpgsk .dpgsk-cards{display:grid}

.dpgsk .dpgsk-card{box-sizing:border-box;appearance:none;width:100%;min-height:64px;margin:0;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:6px 16px;padding:10px 16px;border:0;border-top:1px solid #e8ebef;border-radius:0;background:#fff;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:background .15s;box-shadow:none;text-transform:none;letter-spacing:normal}
.dpgsk .dpgsk-card:first-child{border-top:0}
.dpgsk .dpgsk-card:hover{background:var(--dpgsk-hover)}
.dpgsk .dpgsk-card--active,.dpgsk .dpgsk-card--active:hover{background:var(--dpgsk-active);box-shadow:inset 3px 0 0 var(--dpgsk-strong)}
.dpgsk .dpgsk-card:focus-visible{outline:3px solid var(--dpgsk-strong);outline-offset:-3px}
.dpgsk .dpgsk-card:disabled{cursor:wait;opacity:.72}
.dpgsk .dpgsk-card--active:disabled{opacity:1}
.dpgsk.dpgsk--has-active .dpgsk-card:not(.dpgsk-card--active){opacity:.7}

.dpgsk .dpgsk-content{display:flex;flex-direction:column;gap:2px;min-width:0}
.dpgsk .dpgsk-title{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;font-size:.95rem;font-weight:700;line-height:1.3}
.dpgsk .dpgsk-icon{flex:none;color:var(--dpgsk-accent)}
.dpgsk .dpgsk-off{padding:1px 8px;border-radius:999px;background:#e3f5e9;color:#17663a;font-size:.72rem;font-weight:700;line-height:1.5;white-space:nowrap}
.dpgsk .dpgsk-description{font-size:.88rem;line-height:1.4;color:var(--dpgsk-muted);overflow-wrap:anywhere}
.dpgsk .dpgsk-loading{font-size:.8rem;color:var(--dpgsk-muted)}

.dpgsk .dpgsk-price{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:flex-end;gap:2px 5px;white-space:nowrap}
.dpgsk .dpgsk-price strong{font-size:1.05rem;font-weight:700;line-height:1.3;color:inherit}
.dpgsk .dpgsk-price small,.dpgsk .dpgsk-price del{font-size:.75rem;line-height:1.3;color:var(--dpgsk-muted)}

.dpgsk .dpgsk-action{display:flex;justify-content:flex-end;min-width:64px;font-size:.88rem;font-weight:700;color:var(--dpgsk-strong);white-space:nowrap}
.dpgsk .dpgsk-kies,.dpgsk .dpgsk-chosen{display:inline-flex;align-items:center;gap:3px}
.dpgsk .dpgsk-chosen{display:none;padding:4px 10px;border-radius:999px;background:var(--dpgsk-strong);color:#fff;font-size:.78rem;gap:5px}
.dpgsk .dpgsk-card--active .dpgsk-kies{display:none}
.dpgsk .dpgsk-card--active .dpgsk-chosen{display:inline-flex}
.dpgsk .dpgsk-action svg,.dpgsk .dpgsk-title svg{display:block}

/* Statusregel (succesmelding alleen voor schermlezers) */
.dpgsk .dpgsk-status{margin:12px 0 0;font-size:.85rem;line-height:1.5}
.dpgsk .dpgsk-status:empty{display:none}
.dpgsk .dpgsk-status--loaded{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

@media(max-width:480px){
.dpgsk .dpgsk-head{padding:10px 12px}
.dpgsk .dpgsk-card{grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;padding:12px}
.dpgsk .dpgsk-content{grid-column:1/-1}
.dpgsk .dpgsk-price{grid-column:1;justify-content:flex-start}
.dpgsk .dpgsk-action{grid-column:2;min-height:28px;align-items:center}
}

/* Configurator tijdens/na snelkeuze */
connect-product-configurator.dpgsk-direct-hidden{display:none!important}
.dpgsk-edit{appearance:none;margin:12px 0;padding:12px 18px;border:1px solid #00a3b9;border-radius:8px;background:#fff;color:#202c35;font:inherit;cursor:pointer}
.dpgsk-edit:focus-visible{outline:3px solid #e8692a;outline-offset:3px}
.dpgsk-edit[hidden]{display:none!important}

/* Laadstatus met gereserveerde ruimte (voorkomt verspringen) */
.dpgsk-stage-loading{position:relative;min-height:var(--dpgsk-reserved-height,700px);overflow-anchor:none}
.dpgsk-pending{display:flex;align-items:center;gap:14px;margin:12px 0;padding:18px 20px;border:1px solid #dce3e7;border-radius:12px;background:#fff;color:#202c35;font:inherit}
.dpgsk-stage-loading>.dpgsk-pending{position:absolute;top:12px;left:0;right:0;z-index:2;box-sizing:border-box;margin:0}
.dpgsk-pending-text{display:flex;flex-direction:column;gap:2px;font-size:.93rem;line-height:1.4}
.dpgsk-pending-text span{color:#52606b;font-size:.85rem}
.dpgsk-summary-pending,.dpgsk-summary-pending *{visibility:hidden!important}
.dpgsk-summary-pending{pointer-events:none!important;overflow-anchor:none}
.dpgsk-spinner{flex-shrink:0;width:22px;height:22px;border:3px solid #d7eef2;border-top-color:#00a3b9;border-radius:50%;animation:dpgsk-spin .8s linear infinite}
@keyframes dpgsk-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.dpgsk .dpgsk-card{transition:none}.dpgsk-spinner{animation-duration:2.4s}}
