.ecf{--ecf-accent:#0b2822;--ecf-thumb:22px;--ecf-size:44px}
.ecf-title{margin:0 0 14px;font-size:1.6em;font-weight:600}
.ecf-group{margin-bottom:36px}

/* price slider */
.ecf-range{position:relative;height:var(--ecf-thumb);direction:ltr}
.ecf-track{position:absolute;top:50%;left:calc(var(--ecf-thumb)/2);right:calc(var(--ecf-thumb)/2);height:4px;margin-top:-2px;background:#dcdcdc;border-radius:2px}
.ecf-track::after{content:"";position:absolute;top:0;bottom:0;border-radius:2px;background:var(--ecf-accent);left:calc(100% * var(--lo));right:calc(100% * (1 - var(--hi)))}
.ecf-range input{position:absolute;inset:0;width:100%;height:var(--ecf-thumb);margin:0;background:none;pointer-events:none;-webkit-appearance:none;appearance:none;outline:none}
.ecf-range input::-webkit-slider-runnable-track{background:none;height:var(--ecf-thumb)}
.ecf-range input::-moz-range-track{background:none}
.ecf-range input::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:var(--ecf-thumb);height:var(--ecf-thumb);border-radius:50%;background:var(--ecf-accent);border:0;cursor:pointer}
.ecf-range input::-moz-range-thumb{pointer-events:auto;width:var(--ecf-thumb);height:var(--ecf-thumb);border-radius:50%;background:var(--ecf-accent);border:0;cursor:pointer}
.ecf-vals{display:flex;justify-content:space-between;margin-top:10px;color:#666;direction:ltr}

/* colour swatches: thin ring, tiny gap, big dot */
.ecf-swatches{display:flex;flex-wrap:wrap;gap:7px}
.ecf-sw{position:relative;box-sizing:border-box;width:var(--ecf-size);height:var(--ecf-size);padding:1px;margin:0;border:2px solid #ddd;border-radius:50%;background:#fff;cursor:pointer;transition:border-color .15s;-webkit-appearance:none;appearance:none;min-height:0;box-shadow:none;-webkit-tap-highlight-color:transparent}
.ecf-sw:hover,.ecf-sw:focus-visible{border-color:#777;outline:none}
.ecf-sw.is-active{border-color:var(--ecf-accent)}
.ecf-dot{display:block;width:100%;height:100%;border-radius:50%;background-size:cover;background-position:center;box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}

/* tooltip */
.ecf-tip{position:fixed;z-index:999999;display:none;padding:8px 16px;border-radius:6px;background:#333;color:#fff;font-size:15px;line-height:1.2;font-weight:500;white-space:nowrap;pointer-events:none}
.ecf-tip::after{content:"";position:absolute;top:100%;left:var(--ax,50%);margin-left:-6px;border:6px solid transparent;border-top-color:#333}

.ecf-clear[hidden]{display:none!important}
.ecf-clear{background:none;border:0;padding:0;color:#666;text-decoration:underline;cursor:pointer}

/* loading */
.ecf-loading{opacity:.35;pointer-events:none;transition:opacity .12s}

/* availability pills */
.ecf-pills{display:flex;flex-wrap:wrap;gap:8px}
.ecf .ecf-pill{box-sizing:border-box;margin:0;min-height:0;height:38px;padding:0 16px;border:2px solid #ddd;border-radius:999px;background:#fff;color:#666;font:inherit;font-size:14px;line-height:1;text-transform:none;letter-spacing:normal;box-shadow:none;cursor:pointer;-webkit-appearance:none;appearance:none;transition:border-color .15s}
.ecf .ecf-pill:hover,.ecf .ecf-pill:focus-visible{border-color:#888;outline:none}
.ecf .ecf-pill.is-active{border-color:var(--ecf-accent);color:#111}
.ecf-sw[hidden]{display:none!important}

/* active filter chips (replaces the theme's bar) */
.ecf-chips{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:0 0 18px}
.ecf-chips[hidden]{display:none!important}
.ecf-chips .ecf-chip{display:inline-flex;align-items:center;gap:12px;box-sizing:border-box;height:auto;min-height:0;margin:0;padding:10px 16px;border:0;border-radius:0;background:#eee;color:#222;font:inherit;font-size:15px;line-height:1.2;text-transform:none;letter-spacing:normal;box-shadow:none;cursor:pointer}
.ecf-chips .ecf-chip:hover{background:#e2e2e2}
.ecf-chips .ecf-chip i{font-style:normal;font-size:18px;line-height:1}
.ecf-chips .ecf-chip-clear{background:none;padding:0 0 1px;border-bottom:2px solid currentColor;font-weight:600;margin-left:6px}
.ecf-chips .ecf-chip-clear:hover{background:none}
.ecf-theme-bar{display:none!important}

/* load error */
.ecf-err{margin:0 0 16px;padding:12px 16px;background:#f7f7f7;color:#444}
.ecf-err button{margin-left:8px;padding:0;border:0;background:none;color:inherit;text-decoration:underline;cursor:pointer}