.collection-switcher{padding-inline:0}.collection-switcher__track{display:flex;gap:24px;max-width:var(--bc-page);margin-inline:auto;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:2px var(--bc-gutter) 16px}.collection-switcher__track::-webkit-scrollbar{display:none}@media screen and (min-width:1024px){.collection-switcher__track{flex-wrap:wrap;justify-content:center;overflow-x:visible;gap:32px 40px;padding-bottom:2px}}.collection-switcher__item{flex:0 0 auto;width:104px;display:flex;flex-direction:column;align-items:center;gap:12px;text-decoration:none;scroll-snap-align:start}.collection-switcher__circle{display:block;width:104px;height:104px;border-radius:var(--bc-pill);overflow:hidden;background:var(--bc-bg-2);border:1px solid var(--bc-border);transition:transform var(--bc-base),box-shadow var(--bc-base),border-color var(--bc-base)}@media screen and (min-width:1024px){.collection-switcher__item,.collection-switcher__circle{width:128px}.collection-switcher__circle{height:128px}.collection-switcher__item{gap:16px}}.collection-switcher__image{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--bc-slow)}.collection-switcher__item:hover .collection-switcher__circle,.collection-switcher__item:focus-visible .collection-switcher__circle{box-shadow:var(--bc-shadow-md);transform:translateY(-4px)}.collection-switcher__item:hover .collection-switcher__image{transform:scale(1.07)}.collection-switcher__title{width:100%;font-family:var(--bc-font-body);font-size:13px;font-weight:var(--bc-fw-medium);line-height:1.25;text-align:center;color:var(--bc-text);min-height:2.5em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}@media screen and (min-width:1024px){.collection-switcher__title{font-size:14px}}.collection-switcher__item.is-active .collection-switcher__circle{border-color:var(--bc-accent);box-shadow:0 0 0 2px var(--bc-white),0 0 0 3.5px var(--bc-accent)}.collection-switcher__item.is-active .collection-switcher__title{font-weight:var(--bc-fw-semibold);color:var(--bc-accent)}@media(prefers-reduced-motion:reduce){.collection-switcher__circle,.collection-switcher__image{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/20/assets/custom-collection-switcher.css.map */