.rankup-product-filters {
    display:grid;
    gap:18px;
    color:var(--rankup-front-text, #111827);
}

.rankup-filter-toolbar {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.rankup-filter-mobile-toggle {
    display:none;
    align-items:center;
    gap:8px;
    border:1px solid #d8dee8;
    background:#fff;
    color:#111827;
    min-height:38px;
    padding:0 14px;
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    cursor:pointer;
}

.rankup-filter-active-count,
.rankup-filter-section-count {
    display:inline-grid;
    place-items:center;
    min-width:18px;
    height:18px;
    padding:0 5px;
    background:#0f172a;
    color:#fff;
    font-size:10px;
    font-weight:700;
    line-height:1;
}

.rankup-filter-reset {
    color:#111827;
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    text-decoration:underline;
    text-underline-offset:4px;
}

.rankup-filter-body {
    display:grid;
    gap:22px;
}

.rankup-product-filters.is-rey-filter-context {
    gap:0;
}

.rankup-product-filters.is-rey-filter-context .rankup-filter-body {
    display:block;
    gap:0;
}

.rankup-product-filters.is-rey-filter-context .reyajfilter-layered-list li.is-empty {
    opacity:.5;
}

.rankup-product-filters.is-rey-filter-context .rankup-rey-filter-group--empty {
    display:none;
}

.rankup-product-filters.is-rey-filter-context .reyajfilter-layered-list li > a {
    align-items:center;
    line-height:1.35;
}

.rankup-product-filters.is-rey-filter-context .reyajfilter-layered-list .__checkbox,
.rankup-product-filters.is-rey-filter-context .rankup-filter-swatch {
    align-self:center;
    box-sizing:border-box;
}

.rankup-product-filters.is-rey-filter-context .reyajfilter-layered-list .__name {
    display:inline-flex;
    align-items:center;
    min-width:0;
    font-size:14px;
    line-height:1.35;
    margin-top:3px;
}

.rankup-product-filters.is-rey-filter-context .reyajfilter-layered-list .__count {
    display:inline-flex;
    align-items:center;
    justify-content:flex-end;
    line-height:1;
}

.rankup-product-filters.is-rey-filter-context #rankup-rey-filter-categories .reyajfilter-layered-list li > a {
    max-width:100%;
}

.rankup-product-filters.is-rey-filter-context .rankup-filter-swatch {
    flex:0 0 21px;
    width:21px;
    height:16px;
    margin-inline-end:.7em;
    border-color:HSL(var(--neutral-2));
    box-shadow:none;
}

.rankup-filter-section {
    display:grid;
    gap:10px;
}

.rankup-filter-section h3,
.rankup-filter-section-toggle {
    margin:0;
    color:#a0a8b4;
    font-size:13px;
    font-weight:500;
    line-height:1.35;
}

.rankup-filter-section-toggle {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    width:100%;
    padding:0;
    border:0;
    background:transparent;
    text-align:left;
    cursor:pointer;
}

.rankup-filter-section-icon {
    position:relative;
    width:12px;
    height:12px;
    flex:0 0 12px;
}

.rankup-filter-section-icon::before,
.rankup-filter-section-icon::after {
    content:"";
    position:absolute;
    top:50%;
    left:1px;
    width:10px;
    height:1px;
    background:#a0a8b4;
    transform:translateY(-50%);
}

.rankup-filter-section-icon::after {
    transform:translateY(-50%) rotate(90deg);
    transition:opacity .18s ease;
}

.rankup-filter-section.is-open .rankup-filter-section-icon::after {
    opacity:0;
}

.rankup-product-filters.is-collapsible .rankup-filter-section.is-collapsed .rankup-filter-options {
    display:none;
}

.rankup-filter-options {
    display:grid;
    gap:8px;
}

.rankup-filter-option {
    display:grid;
    grid-template-columns:16px auto minmax(0,1fr) auto;
    gap:8px;
    align-items:center;
    min-height:18px;
    color:#5c6470;
    font-size:13px;
    line-height:1.35;
    cursor:pointer;
}

.rankup-filter-option input {
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.rankup-filter-box {
    display:grid;
    place-items:center;
    width:14px;
    height:14px;
    border:1px solid #232323;
    background:#fff;
}

.rankup-filter-option.is-active .rankup-filter-box {
    background:#0f172a;
    border-color:#0f172a;
}

.rankup-filter-option.is-active .rankup-filter-box::after {
    content:"";
    width:7px;
    height:4px;
    border-left:2px solid #fff;
    border-bottom:2px solid #fff;
    transform:rotate(-45deg) translate(1px,-1px);
}

.rankup-filter-swatch {
    width:20px;
    height:20px;
    border:1px solid #e5e7eb;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);
}

.rankup-filter-option:not(:has(.rankup-filter-swatch)) {
    grid-template-columns:16px minmax(0,1fr) auto;
}

.rankup-filter-option:not(:has(.rankup-filter-swatch)) .rankup-filter-label {
    grid-column:2;
}

.rankup-filter-label {
    min-width:0;
}

.rankup-filter-count {
    justify-self:end;
    color:#5c6470;
    font-size:11px;
}

.rankup-filter-option.is-empty {
    opacity:.55;
}

.rankup-filter-option.is-empty:not(.is-active) {
    cursor:default;
}

.rankup-filter-option:hover .rankup-filter-label,
.rankup-filter-option.is-active .rankup-filter-label {
    color:#111827;
}

.rankup-filter-apply {
    width:100%;
    min-height:42px;
    border:1px solid #0f172a;
    background:#0f172a;
    color:#fff;
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    cursor:pointer;
}

@media (max-width:767px) {
    .rankup-product-filters.is-mobile-collapsible .rankup-filter-mobile-toggle {
        display:inline-flex;
    }

    .rankup-product-filters.is-mobile-collapsible:not(.is-mobile-open) .rankup-filter-body {
        display:none;
    }

    .rankup-product-filters.is-mobile-collapsible .rankup-filter-toolbar {
        margin-bottom:2px;
    }
}