.cmp-bediening{ display:flex; flex-wrap:wrap; gap:14px 24px; align-items:flex-end; margin-top:14px; }
.cmp-bediening .pt-field{ display:flex; flex-direction:column; gap:5px; }
.cmp-bediening label{ font-size:.82rem; font-weight:600; color:var(--to-tekst-2); }
.cmp-bediening input[type=range]{ width:160px; accent-color:var(--to-merk); margin:9px 0; }
.cmp-bediening #cmpOffset{ width:84px; }
.cmp-sens-val{ font-weight:500; color:var(--to-gedempt); }
.cmp-nav{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:12px; }
.cmp-nav-knoppen{ display:inline-flex; gap:6px; flex-wrap:wrap; }
.cmp-nav #cmpPageLbl{ margin-left:auto; }
.cmp-samenvatting{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:10px 0 6px; font-size:.84rem; color:var(--to-gedempt); }
.cmp-samenvatting.cmp-ok{ color:var(--to-goed); font-weight:600; }
.cmp-badge{ display:inline-block; padding:2px 9px; border-radius:999px; font-weight:600; font-size:.78rem; border:1px solid transparent; }
.cmp-badge.changed{ background:#fee2e2; color:#b91c1c; border-color:#fecaca; }
.cmp-badge.added{ background:#dcfce7; color:#15803d; border-color:#bbf7d0; }
.cmp-badge.removed{ background:#ffedd5; color:#c2410c; border-color:#fed7aa; }
.cmp-strip{ display:flex; flex-wrap:wrap; gap:4px; margin:0 0 10px; max-height:96px; overflow:auto; padding:2px; }
.cmp-chip{ min-width:26px; height:24px; padding:0 6px; border-radius:6px; border:1px solid var(--to-lijn-2); cursor:pointer; font:inherit; font-size:.72rem; font-weight:600; background:var(--to-vlak-2); color:var(--to-tekst-2); }
.cmp-chip.changed{ background:#fee2e2; color:#b91c1c; border-color:#fca5a5; }
.cmp-chip.added{ background:#dcfce7; color:#15803d; border-color:#86efac; }
.cmp-chip.removed{ background:#ffedd5; color:#c2410c; border-color:#fdba74; }
.cmp-chip.actief{ outline:2px solid var(--to-merk); outline-offset:1px; }
@media (max-width:640px){ .cmp-nav #cmpPageLbl{ margin-left:0; flex:1 1 100%; } }