/* 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.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 {
    min-width: 0 !important;
    max-width: 100%;
}

/* 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: 11px !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: 29px !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: #e2e8f0;
    --es-border-hover: #cbd5e1;
    --es-border-focus: #225aea;
    --es-control-shadow: 0 1px 2px 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;
    /* 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;

    display: flex;
    flex-wrap: wrap;
    align-items: flex-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: 80 !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) {
    display: none !important;
}

.dashboard-filters-explore.filters-bar > .select-wrapper {
    flex: 1 1 148px;
    min-width: 0;
    max-width: 220px;
    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 > .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 {
    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"] .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 {
    flex: 1.1 1 180px;
    max-width: 260px;
    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,
        #adranksummary,
        #reachsummary,
        #daysrunningSummary,
        #productsonstoreSummary,
        #priceSummary,
        #trafficSummary,
        #activeadssummary,
        #likessummary,
        #commentssummary,
        #sharessummary,
        #viewssummary,
        #specificlikessummary
    ) {
    flex: 1.45 1 260px;
    max-width: min(440px, 100%);
    /* Avoid flex-shrink to 0 width — placeholders like "Total Reactions" / "Store Traffic …" got clipped */
    min-width: min(100%, 220px);
}

.dashboard-filters-explore.filters-bar > .date-filters-row {
    flex-basis: 100% !important;
    width: 100%;
    flex-wrap: wrap !important;
    gap: var(--es-space-1) !important;
    margin-top: 2px;
    overflow: visible;
}

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

/*
 * 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;
}

/* 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: 0.82;
    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 29px 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% - 14.5px);
    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%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.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.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 {
    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.5l5.5 3v5L8 14l-5.5-3.5v-5L8 2.5zm0 0v11M2.5 8.5L8 11.5 13.5 8.5' stroke='%2394a3b8' stroke-width='1.35' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper.themes-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%3Crect x='2.5' y='2.5' width='5' height='5' rx='1' stroke='%2394a3b8' stroke-width='1.25'/%3E%3Crect x='9.5' y='2.5' width='4' height='5' rx='1' stroke='%2394a3b8' stroke-width='1.25'/%3E%3Crect x='2.5' y='8.5' width='5' height='5' rx='1' stroke='%2394a3b8' stroke-width='1.25'/%3E%3Crect x='9.5' y='8.5' width='4' height='5' rx='1' stroke='%2394a3b8' stroke-width='1.25'/%3E%3C/svg%3E");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#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");
}

.dashboard-filters-explore.filters-bar > .select-wrapper:has(#Order-2)::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 {
    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(#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 {
    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(#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");
}

.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;
}

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

/*
 * 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 29px 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: 11px !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: 11px !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;
    align-self: center;
}

/* 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: inline-block;
    color: var(--es-filter-text);
    font-size: 11px;
    line-height: 1.2;
    padding: 2px 0;
}

/*
 * Media type (#Order-2), page type (#pagetype), sort (#Order), scaling (#scaling), low impressions
 * (#lowimpressions), TikTok search field (#searchkeyword): caption-only capsules — Select2 still injects the
 * selected option text inside .select2-selection__rendered; hide it so only data-summary (::before) shows.
 * (#scaling and #lowimpressions are single-select but use the multi-summary JS helper.)
 */
.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(#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(#scaling) .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,
.dashboard-filters-explore.filters-bar .select-wrapper:has(#searchkeyword) .select2-selection--single .select2-selection__rendered.dashboard-select2-summary-active {
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}

.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(#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(#scaling) .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,
.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;
}

/* 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: transparent !important;
    -webkit-text-fill-color: transparent !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: 11px !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: 11px !important;
    line-height: 1.25 !important;
    letter-spacing: normal !important;
}

/*
 * 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;
}

body:has(.dashboard-filters-explore.filters-bar) .select2-dropdown.select2-dropdown--below {
    animation: none !important;
    -webkit-animation: none !important;
    transform: none !important;
    transform-origin: unset;
}

/* 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 {
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !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,
        #adranksummary,
        #reachsummary,
        #daysrunningSummary,
        #productsonstoreSummary,
        #priceSummary,
        #trafficSummary,
        #activeadssummary,
        #likessummary,
        #commentssummary,
        #sharessummary,
        #viewssummary,
        #specificlikessummary
    )
    > .div-block-71 {
    overflow: visible;
    max-width: none;
}

/* 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;
}

/* No dropdown chevrons inside the bar (plain fields, not “select” affordances) */
.dashboard-filters-explore.filters-bar > .select-wrapper::after {
    display: none !important;
    content: none !important;
}

.dashboard-filters-explore.filters-bar .cfd-trigger::before {
    display: none !important;
    content: none !important;
}

.dashboard-filters-explore.filters-bar .cfd-container.open .cfd-trigger::before {
    display: none !important;
}

.dashboard-filters-explore.filters-bar .n3-chevron {
    display: none !important;
}

/* 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: 29px !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: 11px !important;
    line-height: 1.2 !important;
    border: 1px solid var(--es-border) !important;
    border-radius: var(--es-radius-control) !important;
    background: #fff !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;
}

.dashboard-filters-explore.filters-bar
    > .select-wrapper:has(
        #adsetsumary,
        #adspendsummary,
        #copylengthsummary,
        #videolengthsummary,
        #adranksummary,
        #reachsummary,
        #daysrunningSummary,
        #productsonstoreSummary,
        #priceSummary,
        #trafficSummary,
        #activeadssummary,
        #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;
    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;
    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: 29px !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: 11px !important;
    line-height: 1.2 !important;
    border: 1px solid var(--es-border) !important;
    border-radius: var(--es-radius-control) !important;
    background: #fff !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: 29px !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;
    font-size: 11px !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;
}

.dashboard-filters-explore.filters-bar .cfd-search-input {
    font-size: 11px !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 .n3-trigger {
    min-height: 29px !important;
    padding: calc(3px + var(--es-filter-capsule-nudge)) 10px 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;
    font-size: 11px !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: 29px !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;
    font-size: 11px !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: 29px !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;
    box-sizing: border-box !important;
    font-size: 11px !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;
    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: 29px !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: 29px !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: 29px !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: 29px !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;
    font-size: 11px !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: 29px !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;
    box-sizing: border-box !important;
    font-size: 11px !important;
    color: var(--es-filter-text) !important;
    -webkit-text-fill-color: var(--es-filter-text) !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: 11px !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 > .date-filters-row input.form-input.ad {
    min-height: 29px !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: 11px !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;
    box-sizing: border-box !important;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-filters-explore.filters-bar > .date-filters-row input.form-input.ad:hover {
    border-color: var(--es-border-hover) !important;
    box-shadow: var(--es-control-shadow-hover) !important;
}

@media (max-width: 768px) {
    .dashboard-filters-explore.filters-bar {
        flex-direction: column;
        align-items: stretch;
        gap: var(--es-space-1);
        padding: 8px 0;
    }

    .dashboard-filters-explore.filters-bar > .select-wrapper {
        max-width: none !important;
        width: 100%;
    }

    .dashboard-filters-explore.filters-bar > .date-filters-row {
        flex-direction: column;
    }

    .dashboard-filters-explore.filters-bar > .date-filters-row > .select-wrapper {
        flex: 1 1 auto !important;
        width: 100% !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: 29px !important;
}

.dashboard-filters-explore.filters-bar #sortbyselectionbox .select2-container--default .select2-selection--single {
    min-height: 29px !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;
}