/* Keep custom include/exclude filters aligned with standard filter widths (explorer-bar layout). */
.dashboard-filters-explore.filters-bar > .select-wrapper.country-select .cfd-container,
.dashboard-filters-explore.filters-bar > .select-wrapper.website-select .cfd-container,
.dashboard-filters-explore.filters-bar > .select-wrapper.tracked-brands-select .cfd-container,
.dashboard-filters-explore.filters-bar > .select-wrapper.language-select .cfd-container,
.dashboard-filters-explore.filters-bar > .select-wrapper.apps-select .cfd-container,
.dashboard-filters-explore.filters-bar > .select-wrapper.niche-select .cfd-container,
.dashboard-filters-explore.filters-bar > .select-wrapper.store-based-in-select .cfd-container {
    min-width: 0 !important;
    max-width: 100%;
    width: 100%;
}

.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select,
.dashboard-filters-explore.filters-bar > .select-wrapper.store-visitor-country-select,
.dashboard-filters-explore.filters-bar > .select-wrapper.trustpilot-filter-select {
    position: relative;
    overflow: visible;
}

.dashboard-filters-explore.filters-bar > .select-wrapper.store-visitor-country-select > .div-block-71 {
    position: relative;
    width: 100%;
    min-width: 0;
    z-index: 3;
}

.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select > .div-block-71 {
    position: relative;
    width: 100%;
    min-width: 0;
    z-index: 3;
}

/* Ad rank summary trigger: fills capsule like other filters */
.dashboard-filters-explore.filters-bar > .select-wrapper.adrank-filter .div-block-71 {
    width: 100%;
    min-width: 0;
}
.dashboard-filters-explore.filters-bar > .select-wrapper.adrank-filter #adranksummary {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    padding: calc(3px + var(--es-filter-capsule-nudge)) 10px calc(3px - var(--es-filter-capsule-nudge))
        var(--es-filter-padding-left) !important;
    min-height: 34px !important;
}

/* ── Dashboard Meta ads filters: match Store Explorer filter bar ───────── */
.dashboard-filters-explore.filters-bar {
    --es-space-1: 8px;
    --es-space-2: 12px;
    --es-space-3: 16px;
    --es-radius-control: 8px;
    --es-border: #dde3ec;
    --es-border-hover: #cbd5e1;
    --es-border-focus: #225aea;
    --es-control-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 1px 1px rgba(15, 23, 42, 0.04);
    /* Match global .select2-selection depth so hover feels consistent (e.g. media type vs ad rank). */
    --es-control-shadow-hover: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
    --es-control-focus-ring: 0 0 0 3px rgba(34, 90, 234, 0.12), 0 1px 2px rgba(15, 23, 42, 0.06);
    --es-filter-text: #111827;
    --es-filter-text-placeholder: #111827;
    --es-filter-surface: var(--wh-filter-surface, #f8fafc);
    --es-filter-surface-hover: var(--wh-filter-surface-hover, #f1f5f9);
    --es-filter-surface-focus: var(--wh-filter-surface-focus, #eff6ff);
    /* Space for explorer-style glyph (::before on .select-wrapper) */
    --es-filter-padding-left: 26px;
    /* Nudge caption/value text downward inside pills (keep symmetric capsules balanced). */
    --es-filter-capsule-nudge: 1px;

    /* Equal-width filter capsules: one filter per grid column, identical width across
       all rows (auto-fill keeps the column count responsive). */
    --es-filter-col-min: 190px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(var(--es-filter-col-min), 1fr));
    align-items: start;
    gap: var(--es-space-1);
    padding: var(--es-space-2) 0;
    border-bottom: 1px solid var(--es-border);
    margin-bottom: var(--es-space-3);
    /* Baseline layer for filter capsules; opened panels are lifted below. */
    position: relative;
    isolation: isolate;
    z-index: 15;
}

#search-container {
    position: absolute;
    z-index: 2 !important;
}

#search-container:focus-within,
#search-container:has(#suggested-searches:not(.hidden)) {
    z-index: 120 !important;
}

.dashboard-filters-explore.filters-bar:has(.cfd-container.open),
.dashboard-filters-explore.filters-bar:has(.select2-container--open),
.dashboard-filters-explore.filters-bar:has(.n3-root.n3-open),
.dashboard-filters-explore.filters-bar:has(div[id^="tooltip"]:not(.hidden)),
.dashboard-filters-explore.filters-bar:has(.lightpick:not(.is-hidden)),
.dashboard-filters-explore.filters-bar:focus-within {
    z-index: 50;
}

/* Hide legacy spacer rows (sort direction UI, hide-inactive checkbox, etc.) */
.dashboard-filters-explore.filters-bar > div:not(.select-wrapper):not(.date-filters-row):not(.wh-filter-tabs) {
    display: none !important;
}

/* ── Category tab strip + active summary (progressive disclosure) ─────── */
.dashboard-filters-explore.filters-bar > .wh-filter-tabs {
    grid-column: 1 / -1;
    flex: 0 0 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin-bottom: 8px;
}

.wh-filter-tabs-head {
    display: flex;
    align-items: center;
    gap: var(--es-space-1);
    flex-wrap: wrap;
    width: 100%;
}

.wh-filter-tabs .wh-filter-tabs-divider {
    width: 100%;
    height: 0;
    border: none;
    border-top: 1px solid var(--es-border);
    margin: 8px 0 0;
    display: block;
    flex-shrink: 0;
}

.wh-tab-strip {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    min-width: 0;
}

.dashboard-filters-explore.filters-bar .wh-tab {
    -webkit-appearance: none;
    appearance: none;
    border: 1px solid var(--es-border);
    background: var(--es-filter-surface);
    color: var(--es-filter-text);
    font-size: 12px;
    font-weight: 600;
    padding: 5px 12px;
    border-radius: 9999px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    line-height: 1.2;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.wh-tab-icon {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    opacity: 0.85;
}

.dashboard-filters-explore.filters-bar .wh-tab.active .wh-tab-icon {
    opacity: 1;
}

.dashboard-filters-explore.filters-bar .wh-tab:hover {
    border-color: var(--es-border-hover);
    background: var(--es-filter-surface-hover);
}

.dashboard-filters-explore.filters-bar .wh-tab.active {
    background: var(--es-filter-surface-focus);
    border-color: var(--es-border-focus);
    color: var(--es-border-focus);
}

.wh-tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 16px;
    height: 15px;
    padding: 0 4px;
    border-radius: 9999px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    background:black;
    color: #fff;
}

.dashboard-filters-explore.filters-bar .wh-tab.active .wh-tab-count {
    background: #fff;
    color: black;
}

.wh-filter-summary {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.wh-active-label {
    font-size: 11px;
    color: #64748b;
    white-space: nowrap;
}

.wh-active-label strong {
    color: var(--es-filter-text);
    font-weight: 700;
}

.dashboard-filters-explore.filters-bar .wh-clear-all {
    -webkit-appearance: none;
    appearance: none;
    border: 1px solid var(--es-border);
    background: #fff;
    color: #475569;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: var(--es-radius-control);
    cursor: pointer;
    line-height: 1.2;
}

.dashboard-filters-explore.filters-bar .wh-clear-all:hover {
    border-color: var(--es-border-hover);
    background: var(--es-filter-surface-hover);
    color: #334155;
}

/* Hidden by tab selection */
.dashboard-filters-explore.filters-bar > .select-wrapper.wh-hide,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper.wh-hide {
    display: none !important;
}

@media (max-width: 991px) {
    .dashboard-filters-explore.filters-bar > .wh-filter-tabs {
        grid-column: 1 / -1 !important;
    }
    .wh-filter-tabs-head {
        flex-direction: column;
        align-items: flex-start;
    }
    .wh-filter-summary {
        margin-left: 0;
    }
}

.dashboard-filters-explore.filters-bar > .select-wrapper {
    min-width: 0;
    max-width: none;
    position: relative;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    /* Prefer wrapping + clipping over painting into the next pill */
    overflow: visible;
}

/*
 * Later sibling wrappers paint above earlier ones (auto stacking + same z-index).
 * Strong lift so calendars, range panels and anchors clear neighbours (e.g. Sort By after creation dates).
 */
.dashboard-filters-explore.filters-bar > .select-wrapper:has(.cfd-container.open),
.dashboard-filters-explore.filters-bar > .select-wrapper:has(.select2-container--open),
.dashboard-filters-explore.filters-bar > .select-wrapper:has(.n3-root.n3-open),
.dashboard-filters-explore.filters-bar > .select-wrapper:has(div[id^="tooltip"]:not(.hidden)),
.dashboard-filters-explore.filters-bar > .select-wrapper.store-visitor-country-select:has(.dashboard-store-vc-panel.open),
.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select:has(.dashboard-store-vc-panel.open),
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(.cfd-container.open),
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(.select2-container--open),
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(.n3-root.n3-open),
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(div[id^="tooltip"]:not(.hidden)),
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(.lightpick:not(.is-hidden)),
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:focus-within,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#datepickerstorecreation):has(.lightpick:not(.is-hidden)),
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#datepickerstorecreation):focus-within {
    z-index: 400;
}

.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"]:not(.hidden) {
    overflow: visible !important;
    z-index: 10060 !important;
}

.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"] .dashboard-ion-range-wrap {
    display: none !important;
    margin: 4px 0 14px;
    padding: 0 2px;
}

.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"] .dashboard-ion-range-wrap .irs {
    width: 100%;
}

.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"] .range-slider:has(.dashboard-ion-range-wrap) > .slider.slide,
.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"] .range-slider:has(.dashboard-ion-range-wrap) > .range-input.range {
    display: none !important;
}

.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"] .range-slider,
.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"] .irs,
.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"] .irs-grid,
.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"] .irs-line,
.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"] .irs-bar,
.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"] .irs-handle,
.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"] .slider {
    overflow: visible !important;
}

/* Open Select2 anchor above sibling capsules; dropdown is on body — z-index rule below */
.dashboard-filters-explore.filters-bar > .select-wrapper:has(.select2-container--open) > span.select2.select2-container,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(.select2-container--open) > span.select2.select2-container {
    z-index: 450 !important;
}

/*
 * Wrapper ::before filter glyphs use z-index 4 by default; the open Select2 span is 450, so the capsule
 * covered the leading icon after click. Keep the glyph above the pill (::before stays pointer-events: none).
 */
.dashboard-filters-explore.filters-bar > .select-wrapper:has(.select2-container--open)::before,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(.select2-container--open)::before {
    z-index: 460;
}

.dashboard-filters-explore.filters-bar > .select-wrapper.country-select,
.dashboard-filters-explore.filters-bar > .select-wrapper.website-select,
.dashboard-filters-explore.filters-bar > .select-wrapper.language-select,
.dashboard-filters-explore.filters-bar > .select-wrapper.niche-select,
.dashboard-filters-explore.filters-bar > .select-wrapper.apps-select,
.dashboard-filters-explore.filters-bar > .select-wrapper.themes-select,
.dashboard-filters-explore.filters-bar > .select-wrapper.store-based-in-select,
.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select,
.dashboard-filters-explore.filters-bar > .select-wrapper.store-visitor-country-select {
    max-width: none;
    min-width: 0;
}

/* Readonly min–max summary fields (often long numbers, units, EU adspend/reach timeframe suffix).
   Facebook Post Ads engagement tooltips: likessummary, commentssummary, sharessummary, viewssummary, specificlikes. */
.dashboard-filters-explore.filters-bar > .select-wrapper:has(
        #adsetsumary,
        #adspendsummary,
        #copylengthsummary,
        #videolengthsummary,
        #ad-rank-copylengthsummary,
        #ad-rank-videolengthsummary,
        #ad-rank-scalingsummary,
        #ad-rank-mediatypesummary,
        #ad-rank-adscoresummary,
        #ad-rank-impressionssummary,
        #ad-rank-daysrunningsummary,
        #adranksummary,
        #reachsummary,
        #audiencesummary,
        #daysrunningSummary,
        #productsonstoreSummary,
        #priceSummary,
        #trafficSummary,
        #growthSummary,
        #storerevenueSummary,
        #trustpilotSummary,
        #activeadssummary,
        #activeadsgrowthSummary,
        #reachgrowthSummary,
        #pagelikessummary,
        #likessummary,
        #commentssummary,
        #sharessummary,
        #viewssummary,
        #specificlikessummary
    ) {
    max-width: none;
    min-width: 0;
}

.dashboard-filters-explore.filters-bar > .date-filters-row {
    /* Dissolve the wrapper so date pickers + Sort By become items of the bar's grid,
       sharing the exact same equal columns as every other filter. */
    display: contents;
}

.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper {
    min-width: 0 !important;
    max-width: none !important;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: visible;
}

/*
 * Date-range pickers shrink-wrap to the placeholder label or selected range text
 * instead of stretching to a full grid column.
 */
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(
        #datepicker,
        #datepickerlastseen,
        #datepickerproductcreation,
        #datepickerpagecreation
    ),
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#datepickerstorecreation) {
    width: fit-content;
    min-width: var(--es-filter-col-min);
    max-width: 100%;
    justify-self: start;
    align-items: flex-start;
}

.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(
        #datepicker,
        #datepickerlastseen,
        #datepickerproductcreation,
        #datepickerpagecreation
    )
    > .w-embed,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#datepickerstorecreation) > .w-embed {
    width: auto;
    min-width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/*
 * Default label row styling (explorer-style: names live inside controls; JS adds
 * .dashboard-filter-label-sr to move names to placeholders / sr-only captions).
 */
.dashboard-filters-explore.filters-bar > .select-wrapper > .select-label,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper > .select-label {
    display: flex !important;
    align-items: center;
    gap: 4px;
    min-width: 0;
    width: 100%;
    font-size: 10px !important;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: var(--es-filter-text) !important;
    line-height: 1.2;
    text-transform: none;
}

/*
 * Visually hide inline filter names that move into placeholders / sr-only after
 * setupDashboardExploreInlineFilters() runs. :has(> .custom-popup) covers the first paint before JS
 * (popup is still inside the label); after hoisting, .dashboard-filter-label-sr keeps it hidden.
 */
.dashboard-filters-explore.filters-bar > .select-wrapper > .select-label.dashboard-filter-label-sr,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper > .select-label.dashboard-filter-label-sr,
.dashboard-filters-explore.filters-bar > .select-wrapper > .select-label:has(> .custom-popup),
.dashboard-filters-explore.filters-bar
    > .date-filters-row
    > .select-wrapper
    > .select-label:has(> .custom-popup) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
    display: block !important;
}

/* Tooltips hoist to wrapper; sit above capsules */
.dashboard-filters-explore.filters-bar > .select-wrapper.has-popup > .custom-popup:first-child,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper.has-popup > .custom-popup:first-child {
    z-index: 10050 !important;
}

/*
 * setupDashboardExploreInlineFilters() hoists .custom-popup to .select-wrapper's firstChild (not under .select-label).
 * Match that DOM; neutralize globals (.custom-popup { right: -240% }) so the bubble sits over the column center.
 */
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper.has-popup > .custom-popup:first-child {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) scale(0.8) !important;
}

/* Hoisted bubbles under narrow pills: legacy right: inline values read too far left */
.dashboard-filters-explore.filters-bar > .select-wrapper.niche-select.has-popup > .custom-popup:first-child,
.dashboard-filters-explore.filters-bar > .select-wrapper.adrank-filter.has-popup > .custom-popup:first-child {
    left: 50% !important;
    right: auto !important;
    transform: translateX(calc(-50% + 32px)) scale(0.8) !important;
}

/* Tall Adscore explainer — sit higher than legacy bottom:-315px */
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#adscore).has-popup > .custom-popup:first-child {
    bottom: -200px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) scale(0.8) !important;
}

/* Locked filters dim controls but keep explanation popups readable */
.dashboard-filters-explore.filters-bar > .select-wrapper.filter-locked > .custom-popup {
    opacity: 1 !important;
}

.dashboard-filters-explore.filters-bar > .select-wrapper > .select-label .inline-block.pointer-events-none {
    flex-shrink: 0;
}

/* Icons before filter name are optional; avoid squishing */
.dashboard-filters-explore.filters-bar > .select-wrapper > .select-label.inline-flex {
    flex-wrap: nowrap;
}

/*
 * Store Explorer–style leading icons (same pattern as Exploreshops .filters-group::before).
 * Only top-level bar wrappers — not nested .select-wrapper inside range tooltips.
 */
.dashboard-filters-explore.filters-bar > .select-wrapper::before,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper::before {
    content: "" !important;
    display: block !important;
    position: absolute;
    left: 9px;
    top: 50%;
    width: 13px;
    height: 13px;
    transform: translateY(-50%);
    pointer-events: none;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 13px 13px;
    opacity: 1;
    filter: brightness(0);
    z-index: 4;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.5 4.5H13.5M4 8H12M6 11.5H10' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}

/*
 * Wrapper ::before glyphs are absolutely positioned on the outer shell. When a caption row (.select-label)
 * sits above the pill, vertically centering the icon on the full wrapper places it between label and control
 * (“Sort By” / date labels collide with the leading icon horizontally). Indent labels and anchor the glyph
 * to the control row (capsule min-height 34px in this bar — see .select2-selection / CFD triggers above).
 */
.dashboard-filters-explore.filters-bar > .select-wrapper:has(> .select-label)::before,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(> .select-label)::before {
    top: calc(100% - 17px);
    transform: translateY(-50%);
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(> .select-label) > .select-label,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(> .select-label) > .select-label {
    padding-left: var(--es-filter-padding-left);
    box-sizing: border-box;
}

.dashboard-filters-explore.filters-bar > .select-wrapper.country-select::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#field)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Ccircle cx='8' cy='8' r='5.5' stroke='%2394a3b8' stroke-width='1.6'/%3E%3Cpath d='M2.8 8H13.2M8 2.5C9.2 3.9 9.9 5.9 9.9 8C9.9 10.1 9.2 12.1 8 13.5M8 2.5C6.8 3.9 6.1 5.9 6.1 8C6.1 10.1 6.8 12.1 8 13.5' stroke='%2394a3b8' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper.language-select::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.5 4.5H13.5M4 8H12M6 11.5H10' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper.website-select::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M5.5 12L2.5 9l3-3M10.5 12l3-3-3-3M9 14L7 2' stroke='%2394a3b8' stroke-width='1.45' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Ccircle cx='8' cy='8' r='2.25' stroke='%2394a3b8' stroke-width='1.35'/%3E%3Cpath d='M8 2.2v1.6M8 12.2v1.6M2.2 8h1.6M12.2 8h1.6M4.1 4.1l1.1 1.1M10.8 10.8l1.1 1.1M4.1 11.9l1.1-1.1M10.8 5.2l1.1-1.1' stroke='%2394a3b8' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper.tracked-brands-select::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#trackedBrands)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3.5 3.5h9v9H3.5z' stroke='%2394a3b8' stroke-width='1.25' stroke-linejoin='round'/%3E%3Cpath d='M6.2 3.5V2.8c0-.55.45-1 1-1h1.6c.55 0 1 .45 1 1v.7M8 6.8l1.35 1.35L6.2 11.3' stroke='%2394a3b8' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#eutransparency)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 1.8l5.2 2.1v4.2c0 3.1-2.2 5.35-5.2 6.4-3-1.05-5.2-3.3-5.2-6.4V3.9L8 1.8z' stroke='%2394a3b8' stroke-width='1.25' stroke-linejoin='round'/%3E%3Cpath d='M6 8.1l1.2 1.2 2.8-2.9' stroke='%2394a3b8' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper.niche-select::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.5 4.5H7M9 4.5H13.5M2.5 8H5.5M7.5 8H13.5M2.5 11.5H6.5M8.5 11.5H13.5' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper.apps-select::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#apps)::before {
    background-image: url("/images/shopify-bag.svg");
    filter: none;
}

.dashboard-filters-explore.filters-bar > .select-wrapper.themes-select::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#themes)::before {
    background-image: url("/images/shopify-bag.svg");
    filter: none;
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#scaling)::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#ad-rank-scaling)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.5 11.5L6.3 7.7L8.9 10.3L13.5 5.7M10.7 5.7H13.5V8.5' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Brand Details Ad Rank — Select2 capsules match .div-block-71 range-summary inputs */
#ad-rank-filters-bar.dashboard-filters-explore.filters-bar > .select-wrapper.ad-rank-select2-filter {
    flex: 1 1 148px;
    min-width: 0;
    max-width: 220px;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    > .div-block-71 {
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: stretch !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    > .select2-container {
    width: 100% !important;
    min-height: 29px !important;
    flex: 1 1 auto !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-container--default
    .select2-selection--single,
#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-container--default
    .select2-selection--multiple {
    min-height: 29px !important;
    height: 29px !important;
    margin-bottom: 0 !important;
    padding: calc(3px + var(--es-filter-capsule-nudge, 1px)) 26px
        calc(3px - var(--es-filter-capsule-nudge, 1px)) var(--es-filter-padding-left, 26px) !important;
    border: 1px solid var(--es-border, #e2e8f0) !important;
    border-radius: var(--es-radius-control, 8px) !important;
    box-shadow: var(--es-control-shadow, 0 1px 2px rgba(15, 23, 42, 0.04)) !important;
    background: var(--es-filter-surface, #f8fafc) !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    line-height: 1.2 !important;
    font-size: 11px !important;
    color: var(--es-filter-text, #111827) !important;
    -webkit-text-fill-color: var(--es-filter-text, #111827) !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-container:not(.select2-container--open)
    .select2-selection--single:hover,
#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-container:not(.select2-container--open)
    .select2-selection--multiple:hover {
    border-color: var(--es-border-hover, #cbd5e1) !important;
    background: var(--es-filter-surface-hover, #f1f5f9) !important;
    box-shadow: var(--es-control-shadow-hover, 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1)) !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-selection__rendered {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    line-height: 1.2 !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-selection__rendered.dashboard-select2-summary-active {
    font-size: 0 !important;
    letter-spacing: 0 !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-selection__rendered.dashboard-select2-summary-active::before {
    content: attr(data-summary) !important;
    display: block !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
    color: var(--es-filter-text, #111827) !important;
    -webkit-text-fill-color: var(--es-filter-text, #111827) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    max-width: 100% !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-selection__rendered.dashboard-select2-summary-active
    .select2-selection__choice,
#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-selection__rendered.dashboard-select2-summary-active
    > .select2-search--inline,
#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-selection--single
    .select2-selection__rendered.dashboard-select2-summary-active
    > * {
    display: none !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-container--open
    .select2-selection__rendered.dashboard-select2-summary-active {
    font-size: 11px !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-container--open
    .select2-selection__rendered.dashboard-select2-summary-active::before {
    display: none !important;
    content: none !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-container--open
    .select2-selection--multiple
    .select2-selection__rendered.dashboard-select2-summary-active
    > .select2-search--inline {
    display: inline-block !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-selection__placeholder {
    font-size: 11px !important;
    line-height: 1.2 !important;
    color: var(--es-filter-text-placeholder, #111827) !important;
    -webkit-text-fill-color: var(--es-filter-text-placeholder, #111827) !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-selection__clear {
    position: absolute !important;
    right: 6px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1 !important;
    color: #94a3b8 !important;
}

#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-selection--single,
#ad-rank-filters-bar.dashboard-filters-explore.filters-bar
    > .select-wrapper.ad-rank-select2-filter
    .div-block-71
    .select2-selection--multiple {
    position: relative !important;
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#Order-2)::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#ad-rank-media-type)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Crect x='2' y='3' width='12' height='10' rx='1.5' stroke='%2394a3b8' stroke-width='1.35'/%3E%3Ccircle cx='5.7' cy='6.5' r='1' stroke='%2394a3b8' stroke-width='1.1'/%3E%3Cpath d='M2 12l3-3.5 2 2L14 7' stroke='%2394a3b8' stroke-width='1.25' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#pagetype)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3 13V7l5-4.5L13 7v6H10V10H6v3H3z' stroke='%2394a3b8' stroke-width='1.35' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#adscore)::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#ad-rank-adscore)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 2l1.42 4h4.05l-3.26 2.5 1.42 4.05L8 10.62 4.37 12.55l1.42-4.05L2.53 6h4.05L8 2z' stroke='%2394a3b8' stroke-width='1.2' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper.adrank-filter::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#adranksummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 12V8M8 12V4M12 12V6' stroke='%2394a3b8' stroke-width='1.65' stroke-linecap='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#rankgrowth)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.5 11.5L6.3 7.7L8.9 10.3L13.5 5.7M10.7 5.7H13.5V8.5' stroke='%2394a3b8' stroke-width='1.65' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#lowimpressions)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M1.9 8s2.5-4 6.1-4 6.2 4 6.2 4-2.5 4-6.1 4-6.2-4-6.2-4z' stroke='%2394a3b8' stroke-width='1.35'/%3E%3Ccircle cx='8' cy='8' r='1.85' stroke='%2394a3b8' stroke-width='1.3'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#adspendsummary)::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#priceSummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 2.5v11M10.65 5.2C10.05 4.55 9.15 4.15 8 4.15c-1.55 0-2.55.75-2.55 1.85 0 1.05.85 1.55 2.55 2 1.8.38 2.45.88 2.45 2.05 0 1.2-1.1 2-2.5 2-1.1 0-2.08-.43-2.73-1.05' stroke='%2394a3b8' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#copylengthsummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.5 4.5H13.5M4 8H12M6 11.5H10' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#videolengthsummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Crect x='2' y='3' width='12' height='10' rx='1.5' stroke='%2394a3b8' stroke-width='1.3'/%3E%3Cpath d='M7 6v4l3.5-2L7 6z' fill='%2394a3b8'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#reachsummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 12.4h0M4.35 9.25a5.4 5.4 0 017.3 0M2.4 6.7a8.4 8.4 0 0111.2 0M.45 4.15a11.35 11.35 0 0115.1 0' stroke='%2394a3b8' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#audiencesummary)::before,
.dashboard-filters-explore.filters-bar > .select-wrapper#fw-demo-wrapper::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Ccircle cx='5.75' cy='5.25' r='1.65' stroke='%2394a3b8' stroke-width='1.25'/%3E%3Cpath d='M2.5 12.75v-.4c0-1.55 1.46-2.85 3.25-2.85s3.25 1.3 3.25 2.85' stroke='%2394a3b8' stroke-width='1.25' stroke-linecap='round'/%3E%3Ccircle cx='10.75' cy='5.75' r='1.35' stroke='%2394a3b8' stroke-width='1.2'/%3E%3Cpath d='M8.75 12.75v-.25c0-1.2 1-2.15 2.25-2.4' stroke='%2394a3b8' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#daysrunningSummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Ccircle cx='8' cy='8' r='6.25' stroke='%2394a3b8' stroke-width='1.45'/%3E%3Cpath d='M8 5.2v2.95l2.1 1.25' stroke='%2394a3b8' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(#datepicker)::before,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(#datepickerlastseen)::before,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(#datepickerproductcreation)::before,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(#datepickerpagecreation)::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#datepickerstorecreation)::before,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(#ad-rank-datepicker-creation)::before,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(#ad-rank-datepicker-lastseen)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#productsonstoreSummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Crect x='2.5' y='3' width='11' height='10' rx='1.8' stroke='%2394a3b8' stroke-width='1.55'/%3E%3Cpath d='M2.5 6H13.5M6 3V13' stroke='%2394a3b8' stroke-width='1.35'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#trafficSummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.5 12.5H13.5M4 10V7.5M7 10V5.5M10 10V8.2M13 10V4.5' stroke='%2394a3b8' stroke-width='1.75' stroke-linecap='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#growthSummary)::before,
.dashboard-filters-explore.filters-bar > #monthly-visit-growth-filter::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M2.5 11.5L6.3 7.7L8.9 10.3L13.5 5.7M10.7 5.7H13.5V8.5' stroke='%2394a3b8' stroke-width='1.65' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#storerevenueSummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 2.5V13.5M10.7 5.2C10.1 4.5 9.2 4.1 8 4.1C6.5 4.1 5.5 4.9 5.5 6C5.5 7.1 6.3 7.6 8 8C9.8 8.4 10.5 8.9 10.5 10.1C10.5 11.3 9.4 12 8 12C6.9 12 5.9 11.6 5.2 10.9' stroke='%2394a3b8' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper.store-based-in-select::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#storeBasedInField)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M8 1.6c-2.2 0-4 1.7-4 3.8 0 2.8 4 8.6 4 8.6s4-5.8 4-8.6c0-2.1-1.8-3.8-4-3.8z' stroke='%2394a3b8' stroke-width='1.45' stroke-linejoin='round'/%3E%3Ccircle cx='8' cy='5.4' r='1.35' stroke='%2394a3b8' stroke-width='1.25'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper.store-visitor-country-select::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#dashboardStoreVisitorCountryTrigger)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Ccircle cx='8' cy='8' r='5.5' stroke='%2394a3b8' stroke-width='1.6'/%3E%3Cpath d='M2.8 8H13.2M8 2.5C9.2 3.9 9.9 5.9 9.9 8C9.9 10.1 9.2 12.1 8 13.5M8 2.5C6.8 3.9 6.1 5.9 6.1 8C6.1 10.1 6.8 12.1 8 13.5' stroke='%2394a3b8' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper.trustpilot-filter-select::before,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#trustpilotSummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 37 37' fill='none'%3E%3Cpath d='M18.2629 0.595703L22.1545 12.5726H34.7477L24.5596 19.9747L28.4511 31.9516L18.2629 24.5495L8.07478 31.9516L11.9663 19.9747L1.77815 12.5726H14.3714L18.2629 0.595703Z' fill='%2300B57A'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#activeadssummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Crect x='2.5' y='3' width='8' height='5' rx='1' stroke='%2394a3b8' stroke-width='1.25'/%3E%3Crect x='4.5' y='8.5' width='8' height='5' rx='1' stroke='%2394a3b8' stroke-width='1.25'/%3E%3C/svg%3E");
}

/* Active ads growth — stacked page ads + rising bar chart (distinct from Page Active Ads & visit/reach growth) */
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#activeadsgrowthSummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Crect x='1.4' y='3.4' width='5.2' height='3.6' rx='0.75' stroke='%2394a3b8' stroke-width='1.15'/%3E%3Crect x='2.9' y='8.4' width='5.2' height='3.6' rx='0.75' stroke='%2394a3b8' stroke-width='1.15'/%3E%3Cpath d='M9.4 12V9.6M11.65 12V7.1M13.9 12V4.6' stroke='%2394a3b8' stroke-width='1.55' stroke-linecap='round'/%3E%3Cpath d='M13.9 4.6V3.15M13.9 4.6l-.7-.55M13.9 4.6l.7-.55' stroke='%2394a3b8' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* EU reach % growth — reach signal + upward trend */
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#reachgrowthSummary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3.8 9.1a4.6 4.6 0 016.4 0M2.2 6.9a7.2 7.2 0 019.6 0' stroke='%2394a3b8' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M9.5 10.8L11.4 8.6L13.8 5.8' stroke='%2394a3b8' stroke-width='1.45' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#pagelikessummary)::before {
    background-image: url("/images/facebook.c7130ef8.svg");
    filter: none;
}

.dashboard-filters-explore.filters-bar > .date-filters-row > #sortbyselectionbox::before,
.dashboard-filters-explore.filters-bar > .select-wrapper#sortbyselectionbox::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M5 12.5v-9M5 3.5L2.5 6M5 3.5L7.5 6M11 3.5v9m0 0l2.5-2.5M11 12.5 8.5 10' stroke='%2394a3b8' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#adsetsumary)::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 16 16' fill='none'%3E%3Crect x='2.5' y='8' width='11' height='5' rx='1' stroke='%2394a3b8' stroke-width='1.25'/%3E%3Crect x='2.5' y='3' width='11' height='5' rx='1' stroke='%2394a3b8' stroke-width='1.25'/%3E%3C/svg%3E");
}

/* ── Undo global styles.css hacks that hide filter text ───────────────
   .select2-selection { line-height: 0 } collapses captions; dashboard
   reuse those classes on <input> range triggers — text becomes invisible. */
.dashboard-filters-explore.filters-bar .select2-selection,
.dashboard-filters-explore.filters-bar .select2-selection--multiple {
    line-height: 1.25 !important;
}

.dashboard-filters-explore.filters-bar .select2-selection.select2-selection--single {
    display: flex !important;
    align-items: center !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
}

.dashboard-filters-explore.filters-bar input.select2-selection,
.dashboard-filters-explore.filters-bar input.select2-selection--multiple {
    line-height: 1.2 !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
}

.dashboard-filters-explore.filters-bar .select2-search__field {
    line-height: 1.25 !important;
    min-height: 22px !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
}

.dashboard-filters-explore.filters-bar .select2-container .select2-selection__placeholder {
    color: var(--es-filter-text-placeholder) !important;
    -webkit-text-fill-color: var(--es-filter-text-placeholder) !important;
}

/* Same as above but wins over text fill inherited from .select2-selection--single (below). */
.dashboard-filters-explore.filters-bar > .select-wrapper .select2-container--default .select2-selection__placeholder,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper .select2-container--default .select2-selection__placeholder {
    color: var(--es-filter-text-placeholder) !important;
    -webkit-text-fill-color: var(--es-filter-text-placeholder) !important;
}

/* Themes: compact summary on the inline search placeholder (same UX as Apps IncExcFilter). */
.dashboard-filters-explore.filters-bar #themes+.select2-container .select2-selection__rendered.themes-summary-active {
    flex-wrap: nowrap !important;
    overflow: hidden;
}

.dashboard-filters-explore.filters-bar #themes+.select2-container .select2-selection__rendered.themes-summary-active .select2-selection__choice {
    display: none !important;
}

.dashboard-filters-explore.filters-bar #themes+.select2-container .select2-selection__rendered.themes-summary-active .select2-search--inline {
    flex: 1 1 auto;
    width: 100%;
    max-width: 100%;
    float: none;
}

.dashboard-filters-explore.filters-bar #themes+.select2-container .select2-selection__rendered.themes-summary-active .select2-search__field {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
    margin: 0 !important;
}

.dashboard-filters-explore.filters-bar #themes+.select2-container .select2-selection__rendered.themes-summary-active .select2-search__field::placeholder {
    color: var(--es-filter-text) !important;
    opacity: 1;
}

/*
 * Global styles.css pads .select2-selection__rendered 5/20px, 13px type, and forces 23px chip rows —
 * clashes with explorer bar padding-left on the shell and 34px capsule height.
 */
.dashboard-filters-explore.filters-bar
    .select2-container--default
    .select2-selection--single
    .select2-selection__rendered {
    flex: 1 1 auto;
    min-width: 0;
    margin-right: 0 !important;
    padding: 0 22px 0 0 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
    font-size: 12px !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
    line-height: 1.2 !important;
    display: flex !important;
    align-items: center !important;
}

/* templateSelection HTML (e.g. ad score dot + label) — force primary text; do not inherit global #555 / #959595 */
.dashboard-filters-explore.filters-bar
    .select2-container--default
    .select2-selection--single
    .select2-selection__rendered
    span:not(.select2-selection__placeholder) {
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
}

.dashboard-filters-explore.filters-bar
    .select2-selection--multiple
    .select2-selection__rendered {
    margin: 0 !important;
    padding: 0 4px 0 0 !important;
    width: 100% !important;
    font-size: 12px !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
    line-height: 1.2 !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap;
    gap: 2px;
}

.dashboard-filters-explore.filters-bar .select2-selection__choice {
    margin-top: 0 !important;
    height: auto !important;
    min-height: 22px !important;
    line-height: 1.2 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.dashboard-filters-explore.filters-bar .select2-search--inline {
    margin-top: 0 !important;
    line-height: 1.2 !important;
    align-self: center;
}

.dashboard-filters-explore.filters-bar .select2-container .select2-selection__clear {
    margin-top: 0 !important;
    top: auto !important;
    align-self: center;
}

/* Dedicated text label span for caption-only Select2 filters */
.dashboard-filters-explore.filters-bar
    .select2-container
    .select2-selection__rendered
    .select2-caption-label {
    display: block;
    color: var(--es-filter-text);
    font-size: 12px;
    line-height: 1.2;
    padding: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 0 0 auto;
}

/*
 * Caption-only filters render "<name><value>" in one flex row (e.g. Sort By + Last Seen).
 * Add a colon + gap so the label and the selected value don't collide ("Sort By: Last Seen").
 */
.dashboard-filters-explore.filters-bar
    .select2-container
    .select2-selection__rendered.dashboard-select2-summary-active
    .select2-caption-label::after {
    content: ":";
    margin-right: 5px;
    color: var(--es-filter-text-placeholder);
    font-weight: 400;
}

.dashboard-filters-explore.filters-bar
    .select2-container
    .select2-selection__rendered.dashboard-select2-summary-active
    .select2-caption-label {
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
}

/* Multi-select chips hidden: one summary line (themes + scaling + rank growth, etc.). */
.dashboard-filters-explore.filters-bar .select2-container .select2-selection__rendered.dashboard-select2-summary-active {
    position: relative;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-filters-explore.filters-bar
    .select2-container
    .select2-selection__rendered.dashboard-select2-summary-active
    .select2-selection__choice {
    display: none !important;
}

.dashboard-filters-explore.filters-bar
    .select2-container
    .select2-selection__rendered.dashboard-select2-summary-active::before {
    content: attr(data-summary);
    display: block;
    color: var(--es-filter-text);
    font-size: 12px;
    line-height: 1.2;
    padding: 0;
    min-height: 0;
    overflow: visible;
}

/*
 * Multi-select summaries (#rankgrowth, #scaling): block ::before + flex-wrap stacked
 * the value (e.g. Rising) on a second line under the inline search. Keep one row.
 */
.dashboard-filters-explore.filters-bar
    .select2-selection--multiple
    .select2-selection__rendered.dashboard-select2-summary-active {
    flex-wrap: nowrap !important;
    align-items: center !important;
    overflow: hidden;
}

.dashboard-filters-explore.filters-bar
    .select2-selection--multiple
    .select2-selection__rendered.dashboard-select2-summary-active::before {
    display: inline !important;
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}

.dashboard-filters-explore.filters-bar
    .select2-container:not(.select2-container--open)
    .select2-selection--multiple
    .select2-selection__rendered.dashboard-select2-summary-active
    .select2-search--inline {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    flex: 0 0 0 !important;
}

/*
 * Caption-only capsules: page type, media type, sort, ad impressions. These now use a dedicated
 * .select2-caption-label span instead of ::before. Hide the native Select2 text.
 */
.dashboard-filters-explore.filters-bar .select-wrapper:has(#Order-2) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#ad-rank-media-type) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#ad-rank-adscore) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#pagetype) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#Order) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#lowimpressions) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active {
    color: black !important;
    -webkit-text-fill-color: black !important;
}

/* Prevent duplicate text like "newestnewest": show native Select2 label only. */
.dashboard-filters-explore.filters-bar .select-wrapper:has(#Order-2) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active::before,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#ad-rank-media-type) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active::before,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#ad-rank-adscore) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active::before,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#pagetype) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active::before,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#Order) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active::before,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#lowimpressions) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active::before {
    content: none !important;
    display: none !important;
}

/*
 * Multi/summary via ::before: scaling, search keyword.
 * Keep the ::before color override for these.
 */
.dashboard-filters-explore.filters-bar .select-wrapper:has(#scaling) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active::before,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#ad-rank-scaling) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active::before,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#searchkeyword) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active::before {
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
}

/*
 * With the dropdown open, hide the capsule summary — matches native Select2 (focus moves to results),
 * and avoids showing the collapsed label stacked over the inline search row for multi summaries.
 */
.dashboard-filters-explore.filters-bar
    .select2-container--open
    .select2-selection__rendered.dashboard-select2-summary-active::before {
    content: none !important;
    display: none !important;
}

.dashboard-filters-explore.filters-bar
    .select2-container--open
    .select2-selection__rendered.dashboard-select2-summary-active
    .select2-caption-label {
    display: none !important;
}

/* Single-selection pills with summary-active: native Select2 text is hidden; ::before shows data-summary.
   (#scaling, #lowimpressions — duplicate value+summary; #searchkeyword — caption-only bind was missing here.) */
.dashboard-filters-explore.filters-bar
    .select2-container--open
    .select2-selection--single
    .select2-selection__rendered.dashboard-select2-summary-active,
.dashboard-filters-explore.filters-bar
    .select2-container--open
    .select2-selection--single
    .select2-selection__rendered.dashboard-select2-summary-active * {
    color: black !important;
    -webkit-text-fill-color: black !important;
}

/*
 * Multi summary (#rankgrowth): templateSelection hides <li>s but stray text/icons can linger when open.
 * Kill residual capsule content; keep inline search legible (#rankgrowth only has one search field).
 */
.dashboard-filters-explore.filters-bar
    .select2-container--open
    .select2-selection--multiple
    .select2-selection__rendered.dashboard-select2-summary-active {
    font-size: 0 !important;
    line-height: 0 !important;
    letter-spacing: 0 !important;
}

.dashboard-filters-explore.filters-bar
    .select2-container--open
    .select2-selection--multiple
    .select2-selection__rendered.dashboard-select2-summary-active::after {
    content: none !important;
}

.dashboard-filters-explore.filters-bar
    .select2-container--open
    .select2-selection--multiple
    .select2-selection__rendered.dashboard-select2-summary-active > li:not(.select2-search) {
    display: none !important;
}

.dashboard-filters-explore.filters-bar
    .select2-container--open
    .select2-selection--multiple
    .select2-selection__rendered.dashboard-select2-summary-active
    .select2-search--inline {
    font-size: 12px !important;
    line-height: normal !important;
}

.dashboard-filters-explore.filters-bar
    .select2-container--open
    .select2-selection--multiple
    .select2-selection__rendered.dashboard-select2-summary-active
    .select2-search__field {
    font-size: 12px !important;
    line-height: 1.25 !important;
    letter-spacing: normal !important;
}

/*
 * Empty multi-select (#scaling, #rankgrowth, #themes): Select2's search adapter sets an inline
 * `width: 0px` on the inline search input, which hides the placeholder text. Force the
 * field to fill the capsule so placeholders stay visible.
 */
.dashboard-filters-explore.filters-bar
    #scaling + .select2-container
    .select2-selection--multiple
    .select2-search--inline,
.dashboard-filters-explore.filters-bar
    #rankgrowth + .select2-container
    .select2-selection--multiple
    .select2-search--inline,
.dashboard-filters-explore.filters-bar
    #themes + .select2-container
    .select2-selection--multiple
    .select2-search--inline {
    flex: 1 1 auto;
    width: 100%;
    max-width: 100%;
    float: none;
}

.dashboard-filters-explore.filters-bar
    #scaling + .select2-container
    .select2-selection--multiple
    .select2-search--inline
    .select2-search__field,
.dashboard-filters-explore.filters-bar
    #rankgrowth + .select2-container
    .select2-selection--multiple
    .select2-search--inline
    .select2-search__field,
.dashboard-filters-explore.filters-bar
    #themes + .select2-container
    .select2-selection--multiple
    .select2-search--inline
    .select2-search__field {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
    box-sizing: border-box;
    margin: 0 !important;
}

.dashboard-filters-explore.filters-bar
    #scaling + .select2-container
    .select2-selection--multiple
    .select2-search--inline
    .select2-search__field::placeholder,
.dashboard-filters-explore.filters-bar
    #rankgrowth + .select2-container
    .select2-selection--multiple
    .select2-search--inline
    .select2-search__field::placeholder,
.dashboard-filters-explore.filters-bar
    #themes + .select2-container
    .select2-selection--multiple
    .select2-search--inline
    .select2-search__field::placeholder {
    color: var(--es-filter-text-placeholder) !important;
    opacity: 1;
}

/*
 * Select2 dropdown is mounted on document.body (styles.css fallDown keyframes).
 * Disable the slide-open animation on Dashboard Meta ads only.
 * Neighbor capsules use z-index stacking; keep the list above the bar without beating modals (~9999).
 */
body:has(.dashboard-filters-explore.filters-bar) .select2-dropdown {
    z-index: 9200 !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1) !important;
    background: #fff !important;
}

/* Animate the Select2 filter dropdowns (Page type, Ad score, Scaling, Rank growth, …)
 * open. Uses opacity / blur + the independent `translate` & `scale` properties — never
 * `transform` — so it can't fight Select2's absolute positioning. !important + this
 * rule's high `body:has()` specificity are required to win over Select2's own styles. */
@keyframes whSelect2DropdownDown {
    from { opacity: 0; translate: 0 -6px; scale: 0.94; filter: blur(1px); }
    to   { opacity: 1; translate: 0 0;    scale: 1;    filter: blur(0); }
}
@keyframes whSelect2DropdownUp {
    from { opacity: 0; translate: 0 6px;  scale: 0.94; filter: blur(1px); }
    to   { opacity: 1; translate: 0 0;    scale: 1;    filter: blur(0); }
}
body:has(.dashboard-filters-explore.filters-bar) .select2-dropdown.select2-dropdown--below {
    animation: whSelect2DropdownDown 0.15s cubic-bezier(0.22, 1, 0.36, 1) both !important;
    transform: none !important;
    transform-origin: top center;
    will-change: opacity, translate, scale, filter;
}
body:has(.dashboard-filters-explore.filters-bar) .select2-dropdown.select2-dropdown--above {
    animation: whSelect2DropdownUp 0.15s cubic-bezier(0.22, 1, 0.36, 1) both !important;
    transform: none !important;
    transform-origin: bottom center;
    will-change: opacity, translate, scale, filter;
}
@media (prefers-reduced-motion: reduce) {
    body:has(.dashboard-filters-explore.filters-bar) .select2-dropdown.select2-dropdown--below,
    body:has(.dashboard-filters-explore.filters-bar) .select2-dropdown.select2-dropdown--above {
        animation: none !important;
    }
}

/* Apply the same open animation to the other filter panels in the bar (Magic AI etc.):
 * range/summary tooltips (EU adspend, days running, ad spend, reach, …) and the lightpick
 * date-range calendars (ad-creation / last-seen). These reveal by toggling `.hidden` /
 * `.is-hidden`, so the animation runs each time the panel becomes visible.
 *
 * Like the Select2 rule above we animate ONLY opacity / blur and the INDEPENDENT `translate`
 * & `scale` properties — never `transform` — because these panels are positioned with an
 * inline `transform: translate(…)` (popper) or absolute top/left (lightpick); `translate`
 * and `transform` compose, so the entrance can't fight their positioning. */
@keyframes whFilterPanelDown {
    from { opacity: 0; translate: 0 -6px; scale: 0.97; filter: blur(1px); }
    to   { opacity: 1; translate: 0 0;    scale: 1;    filter: blur(0); }
}
.dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"]:not(.hidden),
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper > div[id^="tooltip"]:not(.hidden),
body:has(.dashboard-filters-explore.filters-bar) .lightpick:not(.is-hidden) {
    animation: whFilterPanelDown 0.14s cubic-bezier(0.22, 1, 0.36, 1) both;
    transform-origin: top center;
    will-change: opacity, translate, scale, filter;
}
@media (prefers-reduced-motion: reduce) {
    .dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"]:not(.hidden),
    .dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper > div[id^="tooltip"]:not(.hidden),
    body:has(.dashboard-filters-explore.filters-bar) .lightpick:not(.is-hidden) {
        animation: none;
    }
}

/* Dropdown rows had no bar-scoped text color; grey inherited next to allowHtml template rows (ad score, rank growth). */
body:has(.dashboard-filters-explore.filters-bar)
    .select2-container--default
    .select2-results__option:not(.select2-results__message) {
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
}

body:has(.dashboard-filters-explore.filters-bar)
    .select2-container--default
    .select2-results__option--highlighted[aria-selected],
body:has(.dashboard-filters-explore.filters-bar)
    .select2-container--default
    .select2-results__option:hover,
body:has(.dashboard-filters-explore.filters-bar)
    .select2-container--default
    .select2-results__option:focus {
    background-color: #f1f5f9 !important;
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
}

body:has(.dashboard-filters-explore.filters-bar)
    .select2-container--default
    .select2-results__option[aria-selected='true']:not(.select2-results__option--highlighted) {
    background-color: #fff !important;
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
}

/* Multi-select dropdown checkboxes (Scaling, Themes, …) — SVG checkmark; avoids broken Glyphicons on some pages */
body:has(.dashboard-filters-explore.filters-bar)
    .select2-container--default
    .select2-results__option:not(.select2-results__message):before {
    content: '' !important;
    display: inline-block !important;
    flex-shrink: 0 !important;
    position: relative !important;
    height: 16px !important;
    width: 16px !important;
    min-width: 16px !important;
    min-height: 16px !important;
    border-radius: 4px !important;
    background-color: #fff !important;
    margin-right: 8px !important;
    vertical-align: middle !important;
    border: 1.5px solid #c0c0c0 !important;
    box-sizing: border-box !important;
    -webkit-text-fill-color: initial !important;
    color: inherit !important;
    font-family: inherit !important;
}

body:has(.dashboard-filters-explore.filters-bar)
    .select2-container--default
    .select2-results__option[aria-selected='true']:before,
body:has(.dashboard-filters-explore.filters-bar)
    .select2-container--default
    .select2-results__option--highlighted[aria-selected='true']:before {
    content: '' !important;
    border: 0 !important;
    background-color: #111827 !important;
    background-image: url('https://d3e54v103j8qbb.cloudfront.net/static/custom-checkbox-checkmark.589d534424.svg') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 10px 8px !important;
    -webkit-text-fill-color: initial !important;
}

body:has(.dashboard-filters-explore.filters-bar)
    .select2-container--default
    .select2-results__option--highlighted[aria-selected='false']:before {
    border: 1.5px solid #c0c0c0 !important;
    background-color: #fff !important;
    background-image: none !important;
}

/*
 * The Select2 dropdown search box used the global heavy #c6c6c6 border plus the browser's
 * default focus outline, so it read as a stray dark "bordered box" inside the otherwise
 * subtle filter dropdowns (most visible on small lists like Sort By). Match it to the
 * filter theme and swap the outline for a soft focus ring.
 */
body:has(.dashboard-filters-explore.filters-bar) .select2-dropdown .select2-search--dropdown .select2-search__field {
    border: 1px solid #dde3ec !important;
    border-radius: 8px !important;
    outline: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    font-size: 12px !important;
}

body:has(.dashboard-filters-explore.filters-bar) .select2-dropdown .select2-search--dropdown .select2-search__field:focus {
    border-color: #225aea !important;
    box-shadow: 0 0 0 3px rgba(34, 90, 234, 0.12) !important;
    -webkit-box-shadow: 0 0 0 3px rgba(34, 90, 234, 0.12) !important;
}

/*
 * Kill the default (often black) UA focus outline on the Select2 combobox capsules — the open
 * dropdown is the affordance. Covers bar filters and the relocated Sort By alike.
 */
body:has(.dashboard-filters-explore.filters-bar) .select2-container--default .select2-selection--single:focus,
body:has(.dashboard-filters-explore.filters-bar) .select2-container--default .select2-selection--multiple:focus,
body:has(.dashboard-filters-explore.filters-bar) .select2-container--default.select2-container--focus .select2-selection--single,
body:has(.dashboard-filters-explore.filters-bar) .select2-container--default.select2-container--focus .select2-selection--multiple {
    outline: none !important;
}

.dashboard-filters-explore.filters-bar > .select-wrapper > .div-block-71,
.dashboard-filters-explore.filters-bar > .select-wrapper > select.form-input.w-select:not(.hidden),
.dashboard-filters-explore.filters-bar > .select-wrapper > span.select2.select2-container {
    position: relative;
    z-index: 3;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(
        #adsetsumary,
        #adspendsummary,
        #copylengthsummary,
        #videolengthsummary,
        #ad-rank-copylengthsummary,
        #ad-rank-videolengthsummary,
        #ad-rank-scalingsummary,
        #ad-rank-mediatypesummary,
        #ad-rank-adscoresummary,
        #ad-rank-impressionssummary,
        #ad-rank-daysrunningsummary,
        #adranksummary,
        #reachsummary,
        #audiencesummary,
        #daysrunningSummary,
        #productsonstoreSummary,
        #priceSummary,
        #trafficSummary,
        #growthSummary,
        #storerevenueSummary,
        #trustpilotSummary,
        #activeadssummary,
        #activeadsgrowthSummary,
        #reachgrowthSummary,
        #pagelikessummary,
        #likessummary,
        #commentssummary,
        #sharessummary,
        #viewssummary,
        #specificlikessummary
    )
    > .div-block-71 {
    overflow: visible;
    max-width: none;
}

/* IncExc filters: hide live Select2 UI if it was initialized on the hidden sync <select>. */
.dashboard-filters-explore.filters-bar > .select-wrapper.store-based-in-select > .select2-container:not(.select-2-skeleton),
.dashboard-filters-explore.filters-bar > .select-wrapper.tracked-brands-select > .select2-container:not(.select-2-skeleton) {
    display: none !important;
}

/* Keep overflow visible so open CFD panels aren't clipped */
.dashboard-filters-explore.filters-bar > .select-wrapper > .cfd-container {
    position: relative;
    z-index: 3;
    min-width: 0;
    max-width: 100%;
    overflow: visible;
}

.dashboard-filters-explore.filters-bar > .select-wrapper .n3-root {
    position: relative;
    z-index: 3;
}

/*
 * Dropdown chevron on every filter control (same affordance as visitor country).
 * Uses a small border-arrow; open states rotate it upward.
 */
.dashboard-filters-explore.filters-bar {
    --es-filter-chevron-inset: 28px;
}

.dashboard-filters-explore.filters-bar > .select-wrapper > span.select2.select2-container:not(.select-2-skeleton)::after,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper > span.select2.select2-container:not(.select-2-skeleton)::after,
.dashboard-filters-explore.filters-bar > .select-wrapper > .div-block-71::after,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper > .div-block-71::after {
    content: '';
    position: absolute;
    right: 11px;
    top: 50%;
    margin-top: -5px;
    width: 6px;
    height: 6px;
    border: solid #94a3b8;
    border-width: 0 1.5px 1.5px 0;
    transform: rotate(45deg);
    pointer-events: none;
    z-index: 5;
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(> .select2-container--open) > span.select2.select2-container::after,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(> .select2-container--open) > span.select2.select2-container::after,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(> div[id^="tooltip"]:not(.hidden)) > .div-block-71::after,
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper:has(> div[id^="tooltip"]:not(.hidden)) > .div-block-71::after,
.dashboard-filters-explore.filters-bar > .select-wrapper.store-visitor-country-select:has(.dashboard-store-vc-panel.open) > .div-block-71::after {
    transform: rotate(225deg);
    margin-top: -3px;
}

.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select:has(.dashboard-store-vc-panel.open) > .div-block-71::after {
    transform: rotate(225deg);
    margin-top: -3px;
}

/* IncExc + niche keep their own chevrons; ensure niche SVG chevron is visible */
.dashboard-filters-explore.filters-bar .n3-chevron {
    display: inline-block !important;
    flex-shrink: 0;
}

.dashboard-filters-explore.filters-bar .n3-root.n3-open .n3-chevron {
    transform: rotate(180deg);
}

/* Global styles attach ::before chevrons / junk ::after to .select2-selection */
.dashboard-filters-explore.filters-bar span.select2-selection::before,
.dashboard-filters-explore.filters-bar .select2-selection--multiple::before,
.dashboard-filters-explore.filters-bar span.select2-selection::after,
.dashboard-filters-explore.filters-bar .select2-selection--multiple::after {
    display: none !important;
    content: none !important;
    border: none !important;
}

/* Range / summary text triggers + ordinary selects */
.dashboard-filters-explore.filters-bar > .select-wrapper .div-block-71 input.form-input[type="text"] {
    width: 100% !important;
    min-height: 34px !important;
    padding: calc(3px + var(--es-filter-capsule-nudge)) var(--es-filter-chevron-inset)
        calc(3px - var(--es-filter-capsule-nudge)) var(--es-filter-padding-left) !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    border: 1px solid var(--es-border) !important;
    border-radius: var(--es-radius-control) !important;
    background: var(--es-filter-surface) !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
    box-shadow: var(--es-control-shadow) !important;
    box-sizing: border-box !important;
    position: relative;
    z-index: 2;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Date range inputs rendered directly in wrapper embeds (e.g. Magic AI date + last seen). */
.dashboard-filters-explore.filters-bar > .select-wrapper > .w-embed > input.form-input[type="text"] {
    width: 100% !important;
    min-height: 34px !important;
    padding: calc(3px + var(--es-filter-capsule-nudge)) 10px calc(3px - var(--es-filter-capsule-nudge))
        var(--es-filter-padding-left) !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    border: 1px solid var(--es-border) !important;
    border-radius: var(--es-radius-control) !important;
    background: var(--es-filter-surface) !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
    box-shadow: var(--es-control-shadow) !important;
    box-sizing: border-box !important;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-filters-explore.filters-bar > .select-wrapper > .w-embed > input.form-input[type="text"]:hover {
    border-color: var(--es-border-hover) !important;
    background: var(--es-filter-surface-hover) !important;
    box-shadow: var(--es-control-shadow-hover) !important;
}

.dashboard-filters-explore.filters-bar > .select-wrapper > .w-embed > input.form-input[type="text"]:focus {
    border-color: var(--es-border-focus) !important;
    background: var(--es-filter-surface-focus) !important;
    outline: none !important;
    box-shadow: var(--es-control-focus-ring) !important;
}

.dashboard-filters-explore.filters-bar
    > .select-wrapper:has(
        #adsetsumary,
        #adspendsummary,
        #copylengthsummary,
        #videolengthsummary,
        #adranksummary,
        #reachsummary,
        #audiencesummary,
        #daysrunningSummary,
        #productsonstoreSummary,
        #priceSummary,
        #trafficSummary,
        #growthSummary,
        #storerevenueSummary,
        #trustpilotSummary,
        #activeadssummary,
        #activeadsgrowthSummary,
        #reachgrowthSummary,
        #pagelikessummary,
        #likessummary,
        #commentssummary,
        #sharessummary,
        #viewssummary,
        #specificlikessummary
    )
    .div-block-71
    input.form-input[type="text"] {
    overflow-x: auto;
    overflow-y: hidden;
    text-overflow: clip;
    white-space: nowrap;
}

.dashboard-filters-explore.filters-bar > .select-wrapper .div-block-71 input.form-input[type="text"]:hover {
    border-color: var(--es-border-hover) !important;
    background: var(--es-filter-surface-hover) !important;
    box-shadow: var(--es-control-shadow-hover) !important;
}

.dashboard-filters-explore.filters-bar > .select-wrapper .div-block-71 input.form-input[type="text"]:focus {
    border-color: var(--es-border-focus) !important;
    background: var(--es-filter-surface-focus) !important;
    outline: none !important;
    box-shadow: var(--es-control-focus-ring) !important;
}

.dashboard-filters-explore.filters-bar > .select-wrapper .div-block-71 input.form-input[type="text"]::placeholder {
    color: var(--es-filter-text-placeholder) !important;
    opacity: 1;
}

.dashboard-filters-explore.filters-bar
    > .select-wrapper:not(.themes-select):not(.niche-select)
    > select.form-input.w-select:not(.hidden) {
    width: 100% !important;
    min-height: 34px !important;
    padding: calc(3px + var(--es-filter-capsule-nudge)) 10px calc(3px - var(--es-filter-capsule-nudge))
        var(--es-filter-padding-left) !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    border: 1px solid var(--es-border) !important;
    border-radius: var(--es-radius-control) !important;
    background: var(--es-filter-surface) !important;
    color: var(--es-filter-text) !important;
    box-shadow: var(--es-control-shadow) !important;
    appearance: none;
    cursor: pointer;
    box-sizing: border-box !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
}

/* Include/exclude capsules — align with explorer custom dropdowns */
.dashboard-filters-explore.filters-bar .cfd-trigger {
    min-height: 34px !important;
    padding: calc(3px + var(--es-filter-capsule-nudge)) var(--es-filter-chevron-inset)
        calc(3px - var(--es-filter-capsule-nudge)) var(--es-filter-padding-left) !important;
    border: 1px solid var(--es-border) !important;
    border-radius: var(--es-radius-control) !important;
    box-shadow: var(--es-control-shadow) !important;
    background: var(--es-filter-surface) !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    color: var(--es-filter-text) !important;
    min-width: 0;
    overflow: hidden;
}

.dashboard-filters-explore.filters-bar .cfd-trigger:hover {
    border-color: var(--es-border-hover) !important;
    background: var(--es-filter-surface-hover) !important;
}

.dashboard-filters-explore.filters-bar .cfd-search-input {
    font-size: 12px !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
}

.dashboard-filters-explore.filters-bar .cfd-search-input::placeholder {
    color: var(--es-filter-text-placeholder) !important;
    opacity: 1;
}

.dashboard-filters-explore.filters-bar .cfd-panel .cfd-item-name {
    color: var(--es-filter-text);
}

.dashboard-filters-explore.filters-bar .cfd-panel .cfd-item-flag,
.dashboard-filters-explore.filters-bar .cfd-compact-icon.cfd-item-flag {
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.06);
}

.dashboard-filters-explore.filters-bar .cfd-panel .cfd-item-app-icon,
.dashboard-filters-explore.filters-bar .cfd-compact-icon.cfd-item-app-icon {
    border-radius: 3px;
}

.dashboard-filters-explore.filters-bar .dashboard-active-filter-chip-icon {
    width: 14px;
    height: 14px;
    border-radius: 2px;
    object-fit: cover;
    flex-shrink: 0;
}

.dashboard-filters-explore.filters-bar .dashboard-active-filter-chip-icon--app {
    border-radius: 3px;
}

.dashboard-filters-explore.filters-bar .dashboard-active-filter-chip-icon--star {
    width: auto;
    height: auto;
    font-size: 12px;
    line-height: 1;
}

.dashboard-filters-explore.filters-bar .n3-trigger {
    min-height: 34px !important;
    padding: calc(3px + var(--es-filter-capsule-nudge)) var(--es-filter-chevron-inset)
        calc(3px - var(--es-filter-capsule-nudge)) var(--es-filter-padding-left) !important;
    border-radius: var(--es-radius-control) !important;
    border: 1px solid var(--es-border) !important;
    box-shadow: var(--es-control-shadow) !important;
    background: var(--es-filter-surface) !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    color: var(--es-filter-text) !important;
}

.dashboard-filters-explore.filters-bar .n3-trigger-label {
    color: var(--es-filter-text) !important;
}

/* Select2 capsules (Themes, Sort, Scaling, Media type, Page type, …) */
.dashboard-filters-explore.filters-bar > .select-wrapper .select2-container--default .select2-selection--multiple {
    margin-bottom: 0 !important;
    min-height: 34px !important;
    padding: calc(2px + var(--es-filter-capsule-nudge)) var(--es-filter-chevron-inset)
        max(0px, calc(2px - var(--es-filter-capsule-nudge))) var(--es-filter-padding-left) !important;
    border: 1px solid var(--es-border) !important;
    border-radius: var(--es-radius-control) !important;
    box-shadow: var(--es-control-shadow) !important;
    background: var(--es-filter-surface) !important;
    font-size: 12px !important;
    box-sizing: border-box !important;
}

.dashboard-filters-explore.filters-bar > .select-wrapper .select2-container--default .select2-selection--single {
    margin-bottom: 0 !important;
    min-height: 34px !important;
    padding: calc(3px + var(--es-filter-capsule-nudge)) var(--es-filter-chevron-inset)
        calc(3px - var(--es-filter-capsule-nudge)) var(--es-filter-padding-left) !important;
    border: 1px solid var(--es-border) !important;
    border-radius: var(--es-radius-control) !important;
    box-shadow: var(--es-control-shadow) !important;
    background: var(--es-filter-surface) !important;
    box-sizing: border-box !important;
    font-size: 12px !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
}

/* Hover elevation: real Select2 capsules (media type, sort, etc.) — same treatment as summary inputs. */
.dashboard-filters-explore.filters-bar .select2-container:not(.select2-container--open) .select2-selection--single:hover,
.dashboard-filters-explore.filters-bar .select2-container:not(.select2-container--open) .select2-selection--multiple:hover {
    border-color: var(--es-border-hover) !important;
    background: var(--es-filter-surface-hover) !important;
    box-shadow: var(--es-control-shadow-hover) !important;
}

.dashboard-filters-explore.filters-bar .select2-container--default .select2-selection--single .select2-selection__arrow {
    display: none !important;
}

.dashboard-filters-explore.filters-bar > .select-wrapper span.select2.select2-container {
    width: 100% !important;
    min-height: 34px !important;
}

/*
 * Date row wrappers (#sortbyselectionbox, date pickers) are not direct children of .filters-bar.
 * Without these, global styles.css leaves Select2 pills with ~5px left inset while the wrapper
 * still paints a leading ::before glyph — "Sort By" / summary text collides with the icon.
 */
.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper > span.select2.select2-container {
    position: relative;
    z-index: 3;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    width: 100% !important;
    min-height: 34px !important;
    /* Row siblings stretch to the tallest date field; grow so the pill matches column height (Sort By). */
    flex: 1 1 auto;
    align-self: stretch;
}

.dashboard-filters-explore.filters-bar
    > .date-filters-row
    > #sortbyselectionbox
    .select2-container--default
    .select2-selection--single {
    height: 100% !important;
    min-height: 34px !important;
    box-sizing: border-box !important;
}

.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper .select2-container--default .select2-selection--multiple {
    margin-bottom: 0 !important;
    min-height: 34px !important;
    padding: calc(2px + var(--es-filter-capsule-nudge)) 8px
        max(0px, calc(2px - var(--es-filter-capsule-nudge))) var(--es-filter-padding-left) !important;
    border: 1px solid var(--es-border) !important;
    border-radius: var(--es-radius-control) !important;
    box-shadow: var(--es-control-shadow) !important;
    background: var(--es-filter-surface) !important;
    font-size: 12px !important;
    box-sizing: border-box !important;
}

.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper .select2-container--default .select2-selection--single {
    margin-bottom: 0 !important;
    min-height: 34px !important;
    padding: calc(3px + var(--es-filter-capsule-nudge)) 10px calc(3px - var(--es-filter-capsule-nudge))
        var(--es-filter-padding-left) !important;
    border: 1px solid var(--es-border) !important;
    border-radius: var(--es-radius-control) !important;
    box-shadow: var(--es-control-shadow) !important;
    background: var(--es-filter-surface) !important;
    box-sizing: border-box !important;
    font-size: 12px !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
}

.dashboard-filters-explore.filters-bar
    > .date-filters-row
    .select2-container:not(.select2-container--open)
    .select2-selection--single:hover,
.dashboard-filters-explore.filters-bar
    > .date-filters-row
    .select2-container:not(.select2-container--open)
    .select2-selection--multiple:hover {
    border-color: var(--es-border-hover) !important;
    background: var(--es-filter-surface-hover) !important;
    box-shadow: var(--es-control-shadow-hover) !important;
}

/* Rank growth: template icons + Tailwind gap/text read larger than other bar controls */
.dashboard-filters-explore.filters-bar .select-wrapper:has(#rankgrowth) svg.rankgrowth-select-icon,
body:has(.dashboard-filters-explore.filters-bar) .select2-dropdown .rankgrowth-select-icon {
    width: 12px !important;
    height: 12px !important;
}

.dashboard-filters-explore.filters-bar .select-wrapper:has(#rankgrowth) .inline-flex.items-center.gap-2,
body:has(.dashboard-filters-explore.filters-bar) .select2-dropdown .inline-flex.items-center.gap-2 {
    gap: 4px !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
}

.dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper > .w-embed {
    min-width: 0;
    max-width: 100%;
    /* Lightpick appends .lightpick to field.parentNode — must not clip the calendar */
    overflow: visible;
    position: relative;
}

.dashboard-filters-explore.filters-bar > .select-wrapper > .w-embed {
    position: relative;
}

.dashboard-filters-explore.filters-bar > .date-filters-row input.form-input.ad,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#datepickerstorecreation) input.form-input.ad {
    min-height: 34px !important;
    padding: calc(3px + var(--es-filter-capsule-nudge)) 10px calc(3px - var(--es-filter-capsule-nudge))
        var(--es-filter-padding-left) !important;
    font-size: 12px !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !important;
    border: 1px solid var(--es-border) !important;
    border-radius: var(--es-radius-control) !important;
    box-shadow: var(--es-control-shadow) !important;
    background: var(--es-filter-surface) !important;
    box-sizing: border-box !important;
    width: auto;
    min-width: var(--es-filter-col-min);
    max-width: 100%;
    field-sizing: content;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-filters-explore.filters-bar > .date-filters-row input.form-input.ad:hover,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#datepickerstorecreation) input.form-input.ad:hover {
    border-color: var(--es-border-hover) !important;
    background: var(--es-filter-surface-hover) !important;
    box-shadow: var(--es-control-shadow-hover) !important;
}

.dashboard-filters-explore.filters-bar > .date-filters-row input.form-input.ad:focus,
.dashboard-filters-explore.filters-bar > .select-wrapper:has(#datepickerstorecreation) input.form-input.ad:focus {
    border-color: var(--es-border-focus) !important;
    background: var(--es-filter-surface-focus) !important;
    outline: none !important;
    box-shadow: var(--es-control-focus-ring) !important;
}

/* =================================================================
   DASHBOARD FILTERS — MOBILE / TABLET (aligned with /explore-shops)
   ================================================================= */
@media (max-width: 991px) {
    .dashboard-filters-explore.filters-bar {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px !important;
        width: 100% !important;
        align-items: stretch !important;
        padding: 8px 0 !important;
    }

    .dashboard-filters-explore.filters-bar > .select-wrapper,
    .dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper {
        flex: none !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .dashboard-filters-explore.filters-bar > .date-filters-row {
        grid-column: 1 / -1 !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        width: 100% !important;
    }

    .dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper {
        flex: none !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        justify-self: stretch !important;
        align-items: stretch !important;
    }

    .dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper > .w-embed,
    .dashboard-filters-explore.filters-bar > .select-wrapper:has(#datepickerstorecreation) > .w-embed {
        width: 100% !important;
    }

    .dashboard-filters-explore.filters-bar > .date-filters-row input.form-input.ad,
    .dashboard-filters-explore.filters-bar > .select-wrapper:has(#datepickerstorecreation) input.form-input.ad {
        width: 100% !important;
        field-sizing: fixed;
    }

    /* Wider desktop pills — fill grid cells on mobile */
    .dashboard-filters-explore.filters-bar > .select-wrapper.country-select,
    .dashboard-filters-explore.filters-bar > .select-wrapper.website-select,
    .dashboard-filters-explore.filters-bar > .select-wrapper.language-select,
    .dashboard-filters-explore.filters-bar > .select-wrapper.niche-select,
    .dashboard-filters-explore.filters-bar > .select-wrapper.apps-select,
    .dashboard-filters-explore.filters-bar > .select-wrapper.themes-select,
    .dashboard-filters-explore.filters-bar > .select-wrapper.rankgrowth-filter {
        flex: none !important;
        max-width: none !important;
        min-width: 0 !important;
    }

    .dashboard-filters-explore.filters-bar > .select-wrapper:has(
            #adsetsumary,
            #adspendsummary,
            #copylengthsummary,
            #videolengthsummary,
            #adranksummary,
            #reachsummary,
            #audiencesummary,
            #daysrunningSummary,
            #productsonstoreSummary,
            #priceSummary,
            #trafficSummary,
            #activeadssummary,
            #activeadsgrowthSummary,
            #reachgrowthSummary,
            #pagelikessummary,
            #likessummary,
            #commentssummary,
            #sharessummary,
            #viewssummary,
            #specificlikessummary
        ) {
        flex: none !important;
        max-width: none !important;
        min-width: 0 !important;
    }

    .dashboard-filters-explore.filters-bar > .select-wrapper.country-select .cfd-container,
    .dashboard-filters-explore.filters-bar > .select-wrapper.website-select .cfd-container,
    .dashboard-filters-explore.filters-bar > .select-wrapper.language-select .cfd-container,
    .dashboard-filters-explore.filters-bar > .select-wrapper.apps-select .cfd-container,
    .dashboard-filters-explore.filters-bar > .select-wrapper.niche-select .cfd-container,
    .dashboard-filters-explore.filters-bar > .select-wrapper.store-based-in-select .cfd-container,
    .dashboard-filters-explore.filters-bar > .select-wrapper.store-visitor-country-select > .div-block-71,
    .dashboard-filters-explore.filters-bar > .select-wrapper.store-visitor-country-select #dashboardStoreVisitorCountryTrigger,
    .dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select > .div-block-71,
    .dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select #dashboardTrackingPixelsTrigger,
    .dashboard-filters-explore.filters-bar > .select-wrapper.adrank-filter .div-block-71,
    .dashboard-filters-explore.filters-bar > .select-wrapper.adrank-filter #adranksummary,
    .dashboard-filters-explore.filters-bar > .select-wrapper.rankgrowth-filter .select2-container {
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .dashboard-filters-explore.filters-bar > .select-wrapper > span.select2.select2-container,
    .dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper > span.select2.select2-container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .dashboard-filters-explore.filters-bar > .select-wrapper > .div-block-71,
    .dashboard-filters-explore.filters-bar > .select-wrapper > .div-block-71 .form-input,
    .dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper > .w-embed,
    .dashboard-filters-explore.filters-bar > .date-filters-row input.form-input.ad {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    /* Range / tooltip panels — stay inside viewport */
    .dashboard-filters-explore.filters-bar > .select-wrapper > div[id^="tooltip"]:not(.hidden) {
        max-width: min(328px, calc(100vw - 24px)) !important;
        width: min(328px, calc(100vw - 24px)) !important;
        box-sizing: border-box !important;
    }

    .dashboard-filters-explore.filters-bar .lightpick {
        max-width: calc(100vw - 16px) !important;
    }

    .dashboard-filters-explore.filters-bar > .select-wrapper > .cfd-container.open,
    .dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select .dashboard-store-vc-panel.open {
        max-width: min(328px, calc(100vw - 24px)) !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 480px) {
    .dashboard-filters-explore.filters-bar {
        grid-template-columns: 1fr !important;
    }

    .dashboard-filters-explore.filters-bar > .date-filters-row {
        grid-template-columns: 1fr !important;
    }
}

/* Pinterest / Meta-style pages: Sort By sits in the filter bar */
.dashboard-filters-explore.filters-bar #sortbyselectionbox > span.select2.select2-container {
    flex: 1 1 auto;
    align-self: stretch;
    min-height: 34px !important;
}

.dashboard-filters-explore.filters-bar #sortbyselectionbox .select2-container--default .select2-selection--single {
    min-height: 34px !important;
    height: 100% !important;
    box-sizing: border-box !important;
}

.dashboard-filters-explore.filters-bar #sortbyselectionbox .select2-selection__rendered {
    min-width: 0 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Match Dashboard Meta: keep promo badges out of compact bar labels */
.dashboard-filters-explore.filters-bar .select-label > .filter-label-badge {
    display: none !important;
}

/* Hide circle-i helpers next to labels — filter names live inside pills / placeholders */
.dashboard-filters-explore.filters-bar .select-label > .inline-block.pointer-events-none {
    display: none !important;
}

.dashboard-filters-explore.filters-bar img.adcostinfo,
.dashboard-filters-explore.filters-bar img[src*="question-circle"] {
    display: none !important;
}

/* ── "Sort By" control relocated to the results-count row ─────────────── */
#ad-results-sort-slot {
    position: relative;
    z-index: 50;
}

.select-wrapper.sortby-in-results {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    width: auto;
    min-width: 0;
    max-width: none;
    margin: 0;
    position: relative;
}

.select-wrapper.sortby-in-results .select-label {
    min-width: 0 !important;
    width: auto !important;
    margin: 0 !important;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    color: #374151;
    cursor: default;
}

.select-wrapper.sortby-in-results .select-label > .inline-block.pointer-events-none {
    display: none !important;
}

.select-wrapper.sortby-in-results .select2 {
    width: 170px !important;
    min-width: 150px;
    max-width: 220px;
}

/*
 * Relocated out of .filters-bar, so the bar-scoped caption styles no longer reach this
 * control. Without them the pill rendered the redundant standalone label PLUS a jammed
 * "Sort ByLast Seen". Re-create the bar treatment here: drop the external label and show
 * a single, separated "Sort By: Last Seen" caption inside the pill.
 */
.select-wrapper.sortby-in-results > .select-label {
    display: none !important;
}

.select-wrapper.sortby-in-results .select2-selection__rendered.dashboard-select2-summary-active {
    display: flex !important;
    align-items: center;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.select-wrapper.sortby-in-results .select2-caption-label {
    color: #374151 !important;
    -webkit-text-fill-color: #374151 !important;
    font-weight: 600;
}

.select-wrapper.sortby-in-results .select2-caption-label::after {
    content: ":";
    margin-right: 5px;
    color: #9ca3af;
    font-weight: 400;
}

/* Match the pill to the rest of the filter controls (surface + border) instead of the
   global plain-white Select2 box, and neutralize the purple clear "×".
   NOTE: literal colors — this control is relocated OUTSIDE .dashboard-filters-explore,
   so the --es-* custom properties are out of scope and would resolve to nothing. */
.select-wrapper.sortby-in-results .select2-container--default .select2-selection--single {
    background-color: #f8fafc !important;
    border: 1px solid #dde3ec !important;
    border-radius: 8px !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 1px 1px rgba(15, 23, 42, 0.04) !important;
}

.select-wrapper.sortby-in-results .select2-container--default .select2-selection--single:hover {
    background-color: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
}

.select-wrapper.sortby-in-results .select2-selection__clear {
    display: none !important;
}

/*
 * Filter dropdown panels (range/preset tooltips): the muted gray-600/500 helper text
 * reads as washed-out and jarring on large screens. Pull it close to the label black so
 * descriptions and sub-labels (Mode / Presets) stay legible and consistent with the bar.
 */
.dashboard-filters-explore.filters-bar [id^="tooltip"] .text-gray-600,
.dashboard-filters-explore.filters-bar [id^="tooltip"] .text-gray-500 {
    color: #1f2937 !important;
}

/* Store visitor country + tracking pixels — table panels (Explore Shops semantics) */
.dashboard-filters-explore.filters-bar > .select-wrapper.store-visitor-country-select #dashboardStoreVisitorCountryTrigger,
.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select #dashboardTrackingPixelsTrigger {
    cursor: pointer;
}

.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select,
.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select > .div-block-71 {
    position: relative;
    width: 100%;
    min-width: 0;
}

.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select .dashboard-tracking-pixels-panel,
.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select .dashboard-store-vc-panel {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    min-width: min(360px, calc(100vw - 24px));
    z-index: 1200;
    background: #fff;
    border: 1px solid var(--es-border);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
    overflow: hidden;
}

.dashboard-filters-explore.filters-bar > .select-wrapper.store-visitor-country-select .dashboard-store-vc-panel.open,
.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select .dashboard-store-vc-panel.open,
.dashboard-filters-explore.filters-bar > .select-wrapper.tracking-select .dashboard-tracking-pixels-panel.open {
    display: flex;
    flex-direction: column;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-search-wrap {
    padding: 8px 10px;
    border-bottom: 1px solid #eaeaea;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-search-wrap input {
    width: 100%;
    box-sizing: border-box;
    font-size: 12px;
    padding: 6px 8px;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-table-wrap {
    max-height: min(320px, 50vh);
    overflow: auto;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: 12px;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-table col.dashboard-store-vc-col-mode {
    width: 52px;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f8fafc;
    color: #64748b;
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 6px 6px;
    border-bottom: 1px solid #eaeaea;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-table thead th.dashboard-store-vc-col-mode {
    text-align: center;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-table tbody td {
    padding: 5px 6px;
    border-bottom: 1px solid #f1f5f9;
    vertical-align: middle;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-table tbody td.dashboard-store-vc-cell-mode {
    text-align: center;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-country-cell {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-flag {
    width: 20px;
    height: 14px;
    object-fit: cover;
    border-radius: 2px;
    flex-shrink: 0;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
    color: #0f172a;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-panel-summary {
    padding: 6px 10px;
    font-size: 11px;
    line-height: 1.4;
    color: #0f172a;
    background: #f8fafc;
    border-top: 1px solid #eaeaea;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-footer {
    display: flex;
    justify-content: flex-end;
    padding: 6px 10px;
    border-top: 1px solid #eaeaea;
    background: #fafafa;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-footer-btn {
    font-size: 11px;
    padding: 4px 10px;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #334155;
    cursor: pointer;
}

/* Global input[type=checkbox]::before clashes with custom panel checkboxes (double box). */
.dashboard-filters-explore.filters-bar .dashboard-store-vc-panel input[type='checkbox']::before,
.dashboard-filters-explore.filters-bar .dashboard-store-vc-panel input[type='checkbox']:checked::before {
    content: none !important;
    display: none !important;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-panel input[type='checkbox'] {
    -webkit-appearance: none;
    appearance: none;
    width: 16px;
    height: 16px;
    margin: 0 auto;
    cursor: pointer;
    border: 1.5px solid #cbd5e1;
    border-radius: 4px;
    background: #fff;
    display: inline-block;
    position: relative;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-panel input[type='checkbox']:checked {
    background: #225aea;
    border-color: #225aea;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-panel input[type='checkbox']:checked::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 2px;
    width: 4px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(.dashboard-store-vc-panel.open) {
    z-index: 500;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-th-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    position: relative;
    width: 100%;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-th-label .custom-popup {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
    min-width: 200px;
    max-width: 260px;
    text-transform: none;
    letter-spacing: normal;
    font-weight: 400;
    font-size: 11px;
    line-height: 1.35;
    z-index: 1300;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-th-label:hover .custom-popup,
.dashboard-filters-explore.filters-bar .dashboard-store-vc-th-label:focus-within .custom-popup {
    display: block;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-help-svg {
    flex-shrink: 0;
    color: #94a3b8;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-name-count {
    display: flex;
    align-items: baseline;
    gap: 6px;
    min-width: 0;
    flex: 1 1 0;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-row-count {
    flex-shrink: 0;
    color: #94a3b8;
    font-size: 10px;
    font-variant-numeric: tabular-nums;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-footer {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-footer-btn--primary {
    background: #225aea !important;
    border-color: #225aea !important;
    color: #fff !important;
}

.dashboard-filters-explore.filters-bar .dashboard-store-vc-footer-btn--primary:hover {
    background: #1a4fd4 !important;
    border-color: #1a4fd4 !important;
}

.dashboard-filters-explore.filters-bar .filter-locked.store-visitor-country-select .dashboard-store-vc-panel {
    pointer-events: none;
}

.dashboard-filters-explore.filters-bar .dashboard-tracking-px-bulk-actions {
    display: flex;
    gap: 6px;
    padding: 6px 10px;
    border-bottom: 1px solid #eaeaea;
}

.dashboard-filters-explore.filters-bar .dashboard-tracking-px-bulk-btn {
    flex: 1;
    padding: 5px 8px;
    font-size: 11px;
    font-weight: 600;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    background: #fff;
    color: #64748b;
    cursor: pointer;
}

.dashboard-filters-explore.filters-bar .dashboard-tracking-px-bulk-btn:hover {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #334155;
}

.dashboard-filters-explore.filters-bar .dashboard-tracking-px-icon {
    width: 18px;
    height: 18px;
    object-fit: contain;
    border-radius: 2px;
}