.xw-sf {
    color: var(--e-global-color-text, #243044);
    --xw-sf-accent: var(--e-global-color-accent, #2463a9);
    --xw-sf-line: #dce2e9;
}
.xw-sf__heading { color: var(--e-global-color-primary, #172538); font-size: 1.125em; font-weight: 650; margin-block-end: 16px; }
.xw-sf__fields { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); }
.xw-sf .xw-sf__field { display: block; border: 0; padding: 0; margin: 0; min-width: 0; }
.xw-sf .xw-sf__field legend { color: inherit; font-weight: 600; padding: 0; margin-block-end: 7px; }
.xw-sf .xw-sf__input {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 42px;
    box-sizing: border-box;
    border: 1px solid var(--xw-sf-line);
    border-radius: 6px;
    padding: 7px 10px;
    margin: 0;
    background-color: #fff;
    color: #243044;
    font: inherit;
    box-shadow: none;
}
.xw-sf .xw-sf__input:focus,
.xw-sf .xw-sf__choice input:focus,
.xw-sf .xw-sf__apply:focus,
.xw-sf .xw-sf__reset:focus,
.xw-sf .xw-sf__chip:focus,
.xw-sf .xw-sf__slider input:focus { outline: none; box-shadow: none; }
.xw-sf__range { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.xw-sf__range label { display: grid; gap: 4px; font-size: .875em; min-width: 0; }
.xw-sf__slider {
    --xw-sf-track: #dce2e9;
    --xw-sf-track-active: var(--xw-sf-accent);
    --xw-sf-thumb: #fff;
    --xw-sf-thumb-border: var(--xw-sf-accent);
    --xw-sf-thumb-size: 30px;
    --xw-sf-slider-height: max(40px, calc(var(--xw-sf-thumb-size) + 8px));
    position: relative;
    height: calc(var(--xw-sf-slider-height) + 24px);
    margin: 2px 0 8px;
}
.xw-sf__slider.has-overlap { height: calc(var(--xw-sf-slider-height) + 44px); }
.xw-sf__track {
    position: absolute;
    top: calc(var(--xw-sf-slider-height) / 2);
    inset-inline: calc(var(--xw-sf-thumb-size) / 2);
    height: 4px;
    transform: translateY(-50%);
    border-radius: 4px;
    background: linear-gradient(to right, var(--xw-sf-track) var(--xw-sf-low), var(--xw-sf-track-active) var(--xw-sf-low) var(--xw-sf-high), var(--xw-sf-track) var(--xw-sf-high));
}
.xw-sf .xw-sf__slider input[type="range"] {
    position: absolute;
    inset: 0 0 auto;
    width: 100%;
    height: var(--xw-sf-slider-height);
    min-height: 0;
    margin: 0;
    padding: 0;
    appearance: none;
    border: 0;
    background: transparent;
    box-shadow: none;
    pointer-events: none;
}
.xw-sf .xw-sf__slider input[data-bound="max"] { z-index: 2; }
.xw-sf__slider input::-webkit-slider-thumb {
    appearance: none;
    box-sizing: border-box;
    width: var(--xw-sf-thumb-size);
    height: var(--xw-sf-thumb-size);
    border: 2px solid var(--xw-sf-thumb-border);
    border-radius: 50%;
    background: var(--xw-sf-thumb);
    box-shadow: 0 2px 5px #24304426;
    cursor: grab;
    pointer-events: auto;
}
.xw-sf__slider input::-moz-range-thumb {
    box-sizing: border-box;
    width: var(--xw-sf-thumb-size);
    height: var(--xw-sf-thumb-size);
    border: 2px solid var(--xw-sf-thumb-border);
    border-radius: 50%;
    background: var(--xw-sf-thumb);
    box-shadow: 0 2px 5px #24304426;
    cursor: grab;
    pointer-events: auto;
}
.xw-sf__slider-value {
    position: absolute;
    top: var(--xw-sf-slider-height);
    left: clamp(var(--xw-sf-label-half, 0px), calc(var(--xw-sf-thumb-size) / 2 + (100% - var(--xw-sf-thumb-size)) * var(--xw-sf-ratio, 0)), calc(100% - var(--xw-sf-label-half, 0px)));
    transform: translateX(-50%);
    white-space: nowrap;
    font-size: .85em;
    font-weight: 600;
    line-height: 20px;
    font-variant-numeric: tabular-nums;
}
.xw-sf__slider.has-overlap .is-max { top: calc(var(--xw-sf-slider-height) + 20px); }
.xw-sf__choices { display: flex; flex-direction: column; flex-wrap: wrap; gap: var(--xw-sf-choice-gap, 5px 12px); }
.xw-sf__choices.is-horizontal { flex-direction: row !important; }
.xw-sf__choices.is-vertical { flex-direction: column !important; }
.xw-sf__choice { display: flex; align-items: center; gap: 8px; cursor: pointer; min-height: 28px; }
.xw-sf__choice input { appearance: auto; accent-color: var(--xw-sf-accent); flex: 0 0 auto; width: 1em; height: 1em; margin: 0; }
.xw-sf__choices.is-buttons .xw-sf__choice,
.xw-sf__choices.is-swatches .xw-sf__choice { position: relative; }
.xw-sf__choices.is-buttons .xw-sf__choice input,
.xw-sf__choices.is-swatches .xw-sf__choice input,
.xw-sf__choice.is-label-hidden .xw-sf__choice-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}
.xw-sf__choices.is-buttons .xw-sf__choice-text {
    display: inline-block;
    padding: 7px 12px;
    border: 1px solid var(--xw-sf-line);
    border-radius: 5px;
    background: #fff;
}
.xw-sf__choices.is-buttons input:checked ~ .xw-sf__choice-text {
    border-color: var(--xw-sf-accent);
    background: #eef3f8;
}
.xw-sf__choices.is-swatches { --xw-sf-swatch-size: 32px; column-gap: var(--xw-sf-swatch-column-gap, var(--xw-sf-choice-gap, 12px)); }
.xw-sf__choices.is-swatches.is-horizontal {
    justify-content: flex-start;
}
.xw-sf__choices.is-swatches .xw-sf__choice { justify-content: center; gap: 5px; padding: 0; min-width: 0; max-width: 100%; }
.xw-sf__choices.is-swatches.is-vertical .xw-sf__choice { justify-content: start; align-self: start; }
.xw-sf__choices.is-swatches .is-label-below { flex-direction: column; }
.xw-sf__choices.is-swatches .is-label-below .xw-sf__choice-text { max-width: 100%; text-align: center; }
.xw-sf__choices.is-swatches .xw-sf__choice-text { overflow-wrap: anywhere; }
.xw-sf__swatch {
    flex: 0 0 auto;
    width: var(--xw-sf-swatch-size);
    height: var(--xw-sf-swatch-size);
    border: 1px solid #0003;
    border-radius: 50%;
    background: var(--xw-sf-swatch);
}
.xw-sf__choices.is-swatches input:checked ~ .xw-sf__swatch { outline: 2px solid var(--xw-sf-accent); outline-offset: 2px; }
.xw-sf__tooltip {
    display: none;
    position: absolute;
    bottom: 100%;
    left: 50%;
    z-index: 3;
    transform: translateX(-50%);
    width: max-content;
    max-width: min(12rem, 70vw);
    padding: 4px 8px;
    border-radius: 4px;
    background: #243044;
    color: #fff;
    font-size: .8em;
    overflow-wrap: anywhere;
    pointer-events: none;
}
.xw-sf__choice:hover .xw-sf__tooltip,
.xw-sf__choice input:focus-visible ~ .xw-sf__tooltip { display: block; }
@media (hover: none) {
    .xw-sf__choice:focus-within .xw-sf__tooltip { display: block; }
}
.xw-sf__actions { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; margin-block-start: 16px; }
.xw-sf .xw-sf__apply,
.xw-sf .xw-sf__reset {
    display: inline-flex;
    flex: var(--xw-sf-action-flex, 0 1 auto);
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    align-items: center;
    justify-content: center;
    padding: 7px 14px;
    min-height: 42px;
    border: 1px solid transparent;
    border-radius: 6px;
    font: inherit;
    font-weight: 600;
    line-height: 1.3;
    text-decoration: none;
}
.xw-sf .xw-sf__apply { background: #243044; color: #fff; }
.xw-sf .xw-sf__apply:hover { background: #36465c; color: #fff; }
.xw-sf .xw-sf__reset { background: #fff; color: #243044; border-color: var(--xw-sf-line); }
.xw-sf .xw-sf__reset:hover { background: #f3f5f8; color: #243044; }
.xw-sf .xw-sf__actions[hidden],
.xw-sf .xw-sf__reset[hidden] { display: none; }
.xw-sf .xw-sf__status { margin: 6px 0 0; font-size: .875em; }
.xw-sf .xw-sf__status:empty { margin: 0; }
.xw-sf__count { margin: 0 0 12px; font-size: .875em; }
.xw-sf__chips { display: flex; flex-wrap: wrap; gap: 6px; margin-block-end: 14px; }
.xw-sf__chips[hidden] { display: none; }
.xw-sf .xw-sf__chip,
.xw-sf .xw-sf__chip:hover,
.xw-sf .xw-sf__chip:focus {
    max-width: 100%;
    border: 1px solid var(--xw-sf-line);
    border-radius: 999px;
    padding: 5px 10px;
    background: #edf2f7;
    color: #243044;
    font: inherit;
    font-size: .875em;
    white-space: normal;
    overflow-wrap: anywhere;
}
.xw-sf .xw-sf__chip:hover { background: #e1eaf5; color: #243044; }
[data-xw-sf-grid][aria-busy="true"] { opacity: .65; }