/* ==========================================================================
   cpselect — CamperBay custom dropdown (the .dd filter look) applied to any
   native <select data-cpsel>. Self-contained, hex colours so it works on every
   surface (homepage, create/edit forms, inner pages). Paired with cpselect.js.
   ========================================================================== */
.cpsel{position:relative}
/* the real <select> stays for value + cascade + submit, just visually hidden */
.cpsel-native{position:absolute!important;width:1px;height:1px;padding:0!important;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0!important;opacity:0;pointer-events:none;min-height:0!important}
.cpsel-btn{width:100%;min-height:46px;border:1px solid #CBD4CC;border-radius:11px;background:#EFF1ED;padding:0 42px 0 14px;font:inherit;font-size:15px;color:#5C6A62;cursor:pointer;display:flex;align-items:center;text-align:left;position:relative;transition:border-color .15s,background .15s}
.cpsel-btn:hover{border-color:#4E8163}
.cpsel-btn .cpsel-val{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cpsel-btn .cpsel-chev{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:#5C6A62;transition:transform .2s cubic-bezier(.22,.61,.36,1);pointer-events:none}
.cpsel.open .cpsel-btn{border-color:#1F3D30;background:#fff}
.cpsel.open .cpsel-btn .cpsel-chev{transform:translateY(-50%) rotate(180deg)}
.cpsel-btn.set{border-color:#1F3D30;background:#fff;color:#15211C;font-weight:600}
.cpsel-disabled{opacity:.55;pointer-events:none}
/* position:fixed + JS-set left/top/width -> never clipped by an overflow:hidden ancestor */
.cpsel-menu{position:fixed;z-index:9999;box-sizing:border-box;background:#fff;border:1px solid #CBD4CC;border-radius:12px;box-shadow:0 22px 48px -16px rgba(21,33,28,.55);padding:6px;max-height:288px;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;display:none;text-align:left;font-family:inherit}
.cpsel-menu.open{display:block;animation:cpselpop .15s ease}
@keyframes cpselpop{from{opacity:0}to{opacity:1}}
.cpsel-search{display:flex;align-items:center;gap:8px;height:38px;margin:0 0 6px;border:1px solid #CBD4CC;border-radius:9px;background:#EFF1ED;padding:0 11px;color:#5C6A62;transition:border-color .15s}
.cpsel-search:focus-within{border-color:#4E8163;background:#fff}
.cpsel-search svg{width:15px;height:15px;flex-shrink:0;stroke:currentColor;fill:none}
/* minimalist: the search field is ONLY the bordered row — kill the browser/theme focus outline on the input */
.cpsel-search input{border:0!important;outline:0!important;box-shadow:none!important;background:none;font:inherit;font-size:14px;flex:1;color:#15211C;min-height:0}
.cpsel-search input:focus,.cpsel-search input:focus-visible{outline:0!important;box-shadow:none!important;border:0!important}
.cpsel-opt{display:flex;align-items:center;gap:9px;padding:10px 11px;border-radius:9px;font-size:14.5px;color:#2c3a33;cursor:pointer;transition:background .12s;white-space:nowrap}
.cpsel-opt:hover{background:#EFF1ED}
.cpsel-opt.cpsel-sel{background:#eef4f0;color:#1F3D30;font-weight:600}
.cpsel-opt .cpsel-tick{width:16px;height:16px;color:#1F3D30;margin-left:auto;opacity:0;flex-shrink:0}
.cpsel-opt.cpsel-sel .cpsel-tick{opacity:1}
.cpsel-opt.cpsel-hide{display:none}
.cpsel-empty{padding:14px;text-align:center;font-size:13px;color:#5C6A62}
