/* styled dropdown and multiselect (controls.js upgrades every native select) */
select.dd-native{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;margin:0!important;padding:0!important;border:0!important;clip-path:inset(50%)}
.dd{display:inline-flex;align-items:center;gap:var(--sp-2);min-height:28px;max-width:100%;padding:2px var(--sp-2) 2px var(--sp-3);border-radius:var(--r8);background:var(--bg);box-shadow:0 0 0 1px var(--line-2);font-size:var(--fs-3);color:var(--fg);text-align:left;cursor:pointer;transition:box-shadow .12s,background .12s;vertical-align:middle}
.dd:hover:not(:disabled){box-shadow:0 0 0 1px var(--fg-3)}
.dd:focus-visible,.dd.open{outline:0;box-shadow:0 0 0 1.5px var(--accent)}
.dd:disabled{opacity:.6;cursor:default;background:var(--bg-2)}
.dd[hidden]{display:none}
.dd .dd-val{flex:1;min-width:0;display:flex;align-items:center;gap:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dd.multi .dd-val{flex-wrap:wrap;white-space:normal;padding:1px 0}
.dd .dd-ph{color:var(--fg-3)}
.dd-chev{width:14px;height:14px;flex:none;stroke:var(--fg-3);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
.dd.open .dd-chev{transform:rotate(180deg)}
.dd-chip{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:var(--r8);background:var(--accent-soft);color:var(--accent-deep);font-size:var(--fs-2);font-weight:500;white-space:nowrap}
.dd-more{font-size:var(--fs-2);color:var(--fg-3);padding:0 2px}
.dd-pop{position:fixed;z-index:90;max-width:min(520px,calc(100vw - 16px));background:var(--bg);border-radius:var(--r12);box-shadow:var(--sh-2),0 0 0 1px var(--line);padding:4px;display:flex;flex-direction:column;animation:ddin .12s ease-out}
@keyframes ddin{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
.dd-list{overflow:auto;max-height:300px;display:flex;flex-direction:column;gap:1px}
.dd-opt{display:flex;align-items:center;gap:var(--sp-2);width:100%;padding:6px var(--sp-2);border-radius:var(--r8);font-size:var(--fs-3);text-align:left;color:var(--fg)}
.dd-opt[hidden]{display:none}.dd-opt:disabled{opacity:.45}
.dd-opt.hi{background:var(--bg-3)}
.dd-opt .dd-ot{flex:1;min-width:0;overflow-wrap:anywhere}
.dd-opt.on .dd-ot{font-weight:600}
.dd-tick{width:14px;height:14px;flex:none;stroke:var(--accent);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.dd-opt.on>.dd-tick{opacity:1}
.dd-box{width:16px;height:16px;flex:none;border-radius:5px;box-shadow:inset 0 0 0 1.5px var(--line-2);display:grid;place-items:center;transition:background .1s,box-shadow .1s}
.dd-box .dd-tick{width:11px;height:11px;stroke:#fff;opacity:0}
.dd-opt.on .dd-box{background:var(--accent);box-shadow:none}.dd-opt.on .dd-box .dd-tick{opacity:1}
.dd-search{padding:2px 2px 6px}
.dd-search input{width:100%;height:28px;border:0;border-radius:var(--r8);background:var(--bg-2);padding:0 var(--sp-2);font-size:var(--fs-2);color:var(--fg);outline:0}
.dd-search input:focus{box-shadow:0 0 0 1.5px var(--accent)}
.dd-foot{display:flex;align-items:center;gap:var(--sp-2);padding:6px 4px 2px;border-top:1px solid var(--line);margin-top:4px}.dd-foot .grow{flex:1}
.dd-link{font-size:var(--fs-2);color:var(--fg-2);padding:2px 6px;border-radius:var(--r8)}.dd-link:hover{background:var(--bg-3);color:var(--fg)}
.dd-done{font-size:var(--fs-2);font-weight:600;padding:3px 10px;border-radius:var(--r8);background:var(--fg);color:var(--bg)}
/* native checkboxes and radios take the accent colour wherever they remain */
input[type=checkbox],input[type=radio]{accent-color:var(--accent)}
/* places that sized the old native select */
.fsec .dd,.ag-appr>.dd{width:100%}.ag-appr>.dd{max-width:520px;margin-top:4px;min-height:30px}
.tn-form .dd{min-width:96px}.ag-rule .dd{width:100%}
.ag-ms{width:100%}
/* stacked dropdowns in a filter column get breathing room */
.fsec .dd{margin-bottom:var(--sp-2)}.fsec .dd:last-of-type{margin-bottom:var(--sp-1)}
.fsec .dd+.hint,.fsec .dd~p{margin-top:var(--sp-2)}
/* sliders: accent colour, thin rounded track */
input[type=range]{-webkit-appearance:none;appearance:none;height:16px;background:transparent;accent-color:var(--accent);cursor:pointer;margin:var(--sp-1) 0}
input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(to right,var(--accent) 0 var(--fill,0%),var(--line-2) var(--fill,0%) 100%)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:var(--bg);box-shadow:0 0 0 2px var(--accent),var(--sh-1);margin-top:-5px;transition:transform .1s}
input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.12)}
input[type=range]::-moz-range-track{height:4px;border-radius:2px;background:var(--line-2)}
input[type=range]::-moz-range-progress{height:4px;border-radius:2px;background:var(--accent)}
input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--bg);border:2px solid var(--accent)}
input[type=range]:focus-visible{outline:0}input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--accent),0 0 0 5px var(--accent-soft)}
