/* TL_PRODUCTS_SIDEBAR_IPHONE_V3
   Desktop products sidebar (categories + filters) in the checkout iPhone theme, light and dark,
   laid out like iOS grouped lists: every block is one rounded card with hairline-separated rows,
   every popup (sort menu, brand list) has a solid surface, apply / clear sit side by side and
   stay visible at the bottom of the sidebar.
   Inside layer tl-storefront-iphone (the first declared layer) so the older layered !important
   sidebar rules cannot override it. Desktop sidebar and the phone filter sheet share the same components. */
@layer tl-storefront-iphone {
/* ---------- palette ---------- */
html:root body.storefront-body.products-route #main-content {
    --tl-sb-page: #fff;
    --tl-sb-card: #f2f2f7;
    --tl-sb-popup: #fff;
    --tl-sb-ink: #000;
    --tl-sb-muted: #6c6c70;
    --tl-sb-line: rgba(60,60,67,.18);
    --tl-sb-blue: #007aff;
    --tl-sb-secondary: #e5e5ea;
    --tl-sb-secondary-active: #d1d1d6;
    --tl-sb-switch-off: #e9e9eb;
    --tl-sb-hover: rgba(0,0,0,.04);
    --tl-sb-shadow: 0 12px 32px rgba(0,0,0,.16), 0 0 0 1px rgba(0,0,0,.06);
}
html:root[data-theme="dark"] body.storefront-body.products-route #main-content {
    --tl-sb-page: #000;
    --tl-sb-card: #1c1c1e;
    --tl-sb-popup: #2c2c2e;
    --tl-sb-ink: #fff;
    --tl-sb-muted: #98989d;
    --tl-sb-line: rgba(84,84,88,.6);
    --tl-sb-blue: #0a84ff;
    --tl-sb-secondary: #2c2c2e;
    --tl-sb-secondary-active: #48484a;
    --tl-sb-switch-off: #39393d;
    --tl-sb-hover: rgba(255,255,255,.05);
    --tl-sb-shadow: 0 12px 32px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.08);
}
html:root body.storefront-body.products-route #main-content #catalog-filters { color-scheme: light; }
html:root[data-theme="dark"] body.storefront-body.products-route #main-content #catalog-filters { color-scheme: dark; }

@media (min-width: 841px) {
/* ---------- sidebar shell ---------- */
html:root body.storefront-body.products-route #main-content #catalog-filters.catalog-discovery-form {
    background: var(--tl-sb-page) !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    color: var(--tl-sb-ink) !important;
    padding: 0 2px !important;
    gap: 18px !important;
    max-height: calc(100dvh - 232px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    font-size: 15px !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters :is(.catalog-mobile-panel, .catalog-filter-field, .catalog-quick-filters, .catalog-attribute-filters, .catalog-specialized-filter-head) {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: var(--tl-sb-ink) !important;
}
/* the sidebar scrolls as a whole; its blocks keep their full height */
html:root body.storefront-body.products-route #main-content #catalog-filters > *,
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-advanced-panel > * {
    flex-shrink: 0 !important;
}
/* the filters panel lets its children (and the action row) live directly in the sidebar */
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-mobile-panel.catalog-advanced-panel {
    display: contents !important;
}
/* ---------- categories card ---------- */
html:root body.storefront-body.products-route #main-content #catalog-filters .tl-catalog-main-categories {
    background: var(--tl-sb-card) !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    overflow: hidden !important;
    color: var(--tl-sb-ink) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .tl-catalog-main-categories__title {
    display: block !important;
    padding: 12px 16px 8px !important;
    color: var(--tl-sb-muted) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    background: transparent !important;
    border: 0 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .tl-catalog-main-categories .tl-header-category-menu__list {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    max-height: min(46dvh, 420px) !important;
    min-height: 0 !important;
    overflow-y: auto !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .tl-catalog-main-categories .tl-header-tree-node {
    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid var(--tl-sb-line) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .tl-catalog-main-categories .tl-header-tree-row {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    min-height: 46px !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .tl-catalog-main-categories .tl-header-tree-row:hover {
    background: var(--tl-sb-hover) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .tl-catalog-main-categories .tl-header-tree-row :is(a, button) {
    color: var(--tl-sb-ink) !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    font-size: 14px !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .tl-catalog-main-categories .tl-header-tree-chevron {
    color: var(--tl-sb-muted) !important;
}
/* ---------- section captions (iOS grouped-list header style) ---------- */
html:root body.storefront-body.products-route #main-content #catalog-filters :is(.catalog-desktop-filter-control > label, .catalog-specialized-filter-head strong) {
    display: block !important;
    margin: 0 0 6px !important;
    padding: 0 16px !important;
    color: var(--tl-sb-muted) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-specialized-filter-head > span {
    display: none !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-specialized-filter-head {
    margin: 0 0 -12px !important;
}
/* ---------- brand: one row card, native list with a solid surface ---------- */
html:root body.storefront-body.products-route #main-content #catalog-filters select {
    width: 100% !important;
    min-height: 46px !important;
    padding: 0 16px !important;
    background-color: var(--tl-sb-card) !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    color: var(--tl-sb-ink) !important;
    font: inherit !important;
    font-size: 15px !important;
    font-weight: 600 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters select option {
    background: var(--tl-sb-popup) !important;
    color: var(--tl-sb-ink) !important;
}
}

/* ---------- quick filters: one card, rows with iOS switches ---------- */
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-quick-filters {
    display: block !important;
    background: var(--tl-sb-card) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-quick-check {
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--tl-sb-ink) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-quick-check + .catalog-quick-check {
    border-top: 1px solid var(--tl-sb-line) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-quick-check input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: relative !important;
    flex: 0 0 auto !important;
    width: 46px !important;
    height: 28px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: var(--tl-sb-switch-off) !important;
    box-shadow: none !important;
    cursor: pointer;
    transition: background-color .2s ease;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-quick-check input[type="checkbox"]::before {
    content: "" !important;
    position: absolute !important;
    top: 2px !important;
    right: 2px !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    background: #fff !important;
    box-shadow: 0 2px 4px rgba(0,0,0,.25) !important;
    transition: transform .2s ease;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-quick-check input[type="checkbox"]:checked {
    background: #34c759 !important;
}
html:root[data-theme="dark"] body.storefront-body.products-route #main-content #catalog-filters .catalog-quick-check input[type="checkbox"]:checked {
    background: #30d158 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-quick-check input[type="checkbox"]:checked::before {
    transform: translateX(-18px);
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-quick-check input[type="checkbox"]::after {
    content: none !important;
    display: none !important;
}
/* ---------- sort: one row card + solid popup menu ---------- */
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    background: var(--tl-sb-card) !important;
    border: 0 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    position: relative !important;
    overflow: visible !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-caption {
    color: var(--tl-sb-ink) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-dropdown {
    position: static !important;
    background: transparent !important;
    border: 0 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-trigger {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    min-height: 36px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: var(--tl-sb-muted) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-trigger svg {
    width: 16px !important;
    height: 16px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-menu {
    position: absolute !important;
    top: calc(100% + 6px) !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 20 !important;
    display: block !important;
    margin: 0 !important;
    padding: 6px !important;
    background: var(--tl-sb-popup) !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 14px !important;
    box-shadow: var(--tl-sb-shadow) !important;
    opacity: 1 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-menu[hidden] {
    display: none !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-option {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    color: var(--tl-sb-ink) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-align: right !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-option:hover {
    background: var(--tl-sb-hover) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-option.is-selected {
    color: var(--tl-sb-blue) !important;
    font-weight: 700 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-option.is-selected::after {
    content: "\2713" !important;
    font-weight: 800 !important;
}
/* ---------- specialized filters: one card, one row per attribute ---------- */
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-filters {
    display: block !important;
    background: var(--tl-sb-card) !important;
    border-radius: 14px !important;
    overflow: hidden !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-filter {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-filter + .catalog-attribute-filter {
    border-top: 1px solid var(--tl-sb-line) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-filter > summary {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 46px !important;
    padding: 0 16px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: var(--tl-sb-ink) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    list-style: none !important;
    cursor: pointer;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-filter > summary::-webkit-details-marker {
    display: none !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-filter > summary:hover {
    background: var(--tl-sb-hover) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-filter > summary > span {
    flex: 1 1 auto !important;
    color: var(--tl-sb-ink) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-specialized-filter-head > span {
    display: none !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-filter > summary > small[hidden] {
    display: none !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-filter > summary > small {
    max-width: 62% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    padding: 2px 8px !important;
    border-radius: 999px !important;
    background: var(--tl-sb-blue) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-filter > summary > svg {
    flex: 0 0 auto !important;
    width: 16px !important;
    height: 16px !important;
    fill: none !important;
    stroke: var(--tl-sb-muted) !important;
    stroke-width: 2 !important;
    transform: rotate(90deg);
    transition: transform .2s ease;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-filter[open] > summary > svg {
    transform: rotate(0deg);
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-values {
    display: block !important;
    max-height: 232px !important;
    overflow-y: auto !important;
    margin: 0 !important;
    padding: 0 0 6px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-value {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 16px 0 16px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--tl-sb-ink) !important;
    font-size: 14px !important;
    cursor: pointer;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-value:hover {
    background: var(--tl-sb-hover) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-value > span {
    flex: 1 1 auto !important;
    color: var(--tl-sb-ink) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-value > small {
    color: var(--tl-sb-muted) !important;
    font-size: 12px !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-value input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    flex: 0 0 auto !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    border: 2px solid var(--tl-sb-muted) !important;
    border-radius: 50% !important;
    background: transparent !important;
    display: grid !important;
    place-items: center !important;
    cursor: pointer;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-value input[type="checkbox"]:checked {
    border-color: var(--tl-sb-blue) !important;
    background: var(--tl-sb-blue) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-attribute-value input[type="checkbox"]:checked::before {
    content: "" !important;
    width: 6px !important;
    height: 11px !important;
    margin-top: -2px !important;
    border: solid #fff !important;
    border-width: 0 2px 2px 0 !important;
    transform: rotate(45deg);
}
/* ---------- rows react to taps, not text selection ---------- */
html:root body.storefront-body.products-route #main-content #catalog-filters :is(.catalog-quick-check, .catalog-sort-row, .catalog-attribute-filter > summary, .catalog-attribute-value, .catalog-direct-option) {
    -webkit-user-select: none !important;
    user-select: none !important;
    -webkit-tap-highlight-color: transparent;
}
html:root body.storefront-body.products-route #main-content #catalog-filters :is(.catalog-quick-check, .catalog-attribute-value) > span {
    background: transparent !important;
    color: inherit !important;
}

/* ---------- focus ---------- */
html:root body.storefront-body.products-route #main-content #catalog-filters :is(select, input, button, summary, a):focus-visible {
    outline: 2px solid var(--tl-sb-blue) !important;
    outline-offset: 2px !important;
}
/* ---------- apply + clear: one row, always visible at the bottom ---------- */
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-filter-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 5 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    margin: auto 0 0 !important;
    padding: 10px 0 4px !important;
    background: var(--tl-sb-page) !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-filter-actions :is(.catalog-apply-filters, .catalog-clear-filters) {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 10px !important;
    border: 0 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    background-image: none !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-filter-actions .catalog-apply-filters {
    background: var(--tl-sb-blue) !important;
    color: #fff !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-filter-actions .catalog-clear-filters {
    background: var(--tl-sb-secondary) !important;
    color: var(--tl-sb-ink) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-filter-actions .catalog-clear-filters:active {
    background: var(--tl-sb-secondary-active) !important;
}

/* ---------- "no products" message ---------- */
html:root body.storefront-body.products-route #main-content .catalog-results .empty-state {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 120px !important;
    padding: 24px 16px !important;
    background: var(--tl-sb-card) !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    color: var(--tl-sb-muted) !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-align: center !important;
}

@media (max-width: 840px) {
/* ---------- mobile: same iPhone theme for the search bar, the three tool buttons and the filter sheet ---------- */
html:root body.storefront-body.products-route #main-content #catalog-filters.catalog-discovery-form {
    --tl-sb-page: #f2f2f7;
    --tl-sb-card: #fff;
    --tl-sb-popup: #fff;
    --tl-sb-secondary: #e5e5ea;
    --tl-sb-hover: rgba(0,0,0,.04);
    background: var(--tl-sb-page) !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 40px rgba(0,0,0,.18) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    color: var(--tl-sb-ink) !important;
}
html:root[data-theme="dark"] body.storefront-body.products-route #main-content #catalog-filters.catalog-discovery-form {
    --tl-sb-page: #1c1c1e;
    --tl-sb-card: #2c2c2e;
    --tl-sb-popup: #3a3a3c;
    --tl-sb-secondary: #3a3a3c;
    --tl-sb-secondary-active: #545458;
    --tl-sb-switch-off: #48484a;
    --tl-sb-hover: rgba(255,255,255,.06);
    box-shadow: 0 18px 40px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.06) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters :is(.catalog-mobile-panel, .catalog-direct-options) {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    color: var(--tl-sb-ink) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-mobile-panel.is-active {
    gap: 12px !important;
}
/* category / brand tiles */
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-direct-option {
    background: var(--tl-sb-card) !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    color: var(--tl-sb-ink) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-direct-option.is-selected {
    background: var(--tl-sb-blue) !important;
    color: #fff !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-direct-option :is(svg, i, b) {
    color: var(--tl-sb-muted) !important;
}
/* the action row stays visible at the bottom of the sheet while it scrolls */
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-filter-actions {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 5 !important;
    margin: 2px 0 0 !important;
    padding: 8px 0 2px !important;
    background: var(--tl-sb-page) !important;
    box-shadow: 0 14px 0 var(--tl-sb-page) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-direct-option > * {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    color: inherit !important;
}
/* search bar + tool buttons above the products */
html:root body.storefront-body.products-route #main-content .catalog-floating-search {
    background: var(--tl-sb-card) !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    color: var(--tl-sb-ink) !important;
}
html:root body.storefront-body.products-route #main-content .catalog-floating-search input {
    background: transparent !important;
    border: 0 !important;
    color: var(--tl-sb-ink) !important;
}
html:root body.storefront-body.products-route #main-content .catalog-mobile-tools button {
    background: var(--tl-sb-card) !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    color: var(--tl-sb-ink) !important;
    font-weight: 700 !important;
}
html:root body.storefront-body.products-route #main-content .catalog-mobile-tools button[aria-expanded="true"] {
    background: color-mix(in srgb, var(--tl-sb-blue) 16%, var(--tl-sb-card)) !important;
    color: var(--tl-sb-blue) !important;
}
html:root body.storefront-body.products-route #main-content .catalog-mobile-tools button svg {
    stroke: currentColor !important;
}

/* sheet uses the room down to the bottom bar, so it rarely needs to scroll */
html:root body.storefront-body.products-route #main-content #catalog-filters.catalog-discovery-form.is-open {
    max-height: calc(100dvh - 210px - env(safe-area-inset-bottom, 0px)) !important;
}
/* sort list opens inside its card (pushes the content down) instead of floating over it */
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-row {
    flex-wrap: wrap !important;
    padding: 0 16px !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-dropdown {
    display: contents !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-caption {
    flex: 1 1 auto !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-trigger {
    flex: 0 0 auto !important;
    width: auto !important;
    min-height: 46px !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-menu {
    position: static !important;
    flex: 1 0 100% !important;
    margin: 0 -16px !important;
    padding: 0 0 6px !important;
    background: transparent !important;
    border-top: 1px solid var(--tl-sb-line) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-sort-option {
    border-radius: 0 !important;
    padding: 0 16px !important;
    min-height: 42px !important;
}
/* category / brand tiles: chevron on the left */
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-direct-option > span {
    padding: 7px 12px 7px 26px !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-direct-option > span::before {
    content: "" !important;
    right: auto !important;
    left: 12px !important;
    top: 50% !important;
    width: 7px !important;
    height: 7px !important;
    border: solid currentColor !important;
    border-width: 0 0 2px 2px !important;
    transform: translateY(-50%) rotate(45deg) !important;
    font-size: 0 !important;
    color: var(--tl-sb-muted) !important;
}
html:root body.storefront-body.products-route #main-content #catalog-filters .catalog-direct-option.is-selected > span::before {
    color: #fff !important;
}
/* tabs: blue dot / count when something in that tab is chosen */
html:root body.storefront-body.products-route #main-content .catalog-mobile-tools button {
    position: relative !important;
    overflow: visible !important;
}
html:root body.storefront-body.products-route #main-content .catalog-mobile-tools button[data-tool-active="true"] {
    color: var(--tl-sb-blue) !important;
}
html:root body.storefront-body.products-route #main-content .catalog-mobile-tools button[data-tool-active="true"]::after {
    content: "" !important;
    position: absolute !important;
    top: 6px !important;
    left: 8px !important;
    width: 9px !important;
    height: 9px !important;
    border-radius: 50% !important;
    background: var(--tl-sb-blue) !important;
    box-shadow: 0 0 0 2px var(--tl-sb-card) !important;
}
html:root body.storefront-body.products-route #main-content .catalog-mobile-tools button[data-tool-count]::after {
    content: attr(data-tool-count) !important;
    background: #0a64d8 !important;
    -webkit-text-fill-color: #fff !important;
    text-shadow: none !important;
    top: 5px !important;
    left: 6px !important;
    width: auto !important;
    min-width: 18px !important;
    height: 18px !important;
    padding: 0 5px !important;
    border-radius: 999px !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 18px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}
}
}