.collection-subnav{--subnav-bleed: 2rem;--subnav-fade: calc(var(--subnav-bleed) + 4rem);display:block;position:relative;width:100%;margin-top:2rem}@media screen and (min-width:990px){.collection-subnav{--subnav-bleed: 0rem}}@media screen and (min-width:1200px){.collection-subnav{margin-top:2.8rem}}.collection-subnav__list{display:flex;flex-wrap:nowrap;gap:.8rem;margin:0 calc(-1 * var(--subnav-bleed));padding:0 var(--subnav-bleed);scroll-padding-inline:var(--subnav-bleed);list-style:none;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;-ms-overflow-style:none}.collection-subnav__list::-webkit-scrollbar{display:none}.collection-subnav--overflow-start .collection-subnav__list{-webkit-mask-image:linear-gradient(to right,transparent,#000 var(--subnav-fade));mask-image:linear-gradient(to right,transparent,#000 var(--subnav-fade))}.collection-subnav--overflow-end .collection-subnav__list{-webkit-mask-image:linear-gradient(to left,transparent,#000 var(--subnav-fade));mask-image:linear-gradient(to left,transparent,#000 var(--subnav-fade))}.collection-subnav--overflow-start.collection-subnav--overflow-end .collection-subnav__list{-webkit-mask-image:linear-gradient(to right,transparent,#000 var(--subnav-fade),#000 calc(100% - var(--subnav-fade)),transparent);mask-image:linear-gradient(to right,transparent,#000 var(--subnav-fade),#000 calc(100% - var(--subnav-fade)),transparent)}.collection-subnav__item{flex:0 0 auto;scroll-snap-align:start}.collection-subnav__link{display:inline-flex;align-items:center;justify-content:center;min-height:4rem;padding:1.1rem 1.6rem;border:.1rem solid transparent;border-radius:var(--border-radius-button);background-color:rgb(var(--color-button-tertiary-background));color:rgb(var(--color-button-tertiary-text));font-family:var(--font-button-family);font-style:var(--font-button-style);font-weight:var(--font-button-weight);font-size:1.2rem;line-height:1;letter-spacing:var(--font-button-letter-spacing);text-transform:uppercase;text-decoration:none;white-space:nowrap;transition:background-color var(--duration-default),color var(--duration-default),border-color var(--duration-default)}.collection-subnav__link:focus-visible{outline:.2rem solid rgb(var(--color-foreground));outline-offset:.2rem}.collection-subnav__link--static{cursor:default}@media(hover:hover)and (pointer:fine){.collection-subnav__link:not(.is-active):not(.collection-subnav__link--static):hover{background-color:rgb(var(--color-button-tertiary-background-hover))}}.collection-subnav__link.is-active{background-color:rgb(var(--color-button-secondary-background));color:rgb(var(--color-button-secondary-text))}.collection-subnav--outline .collection-subnav__link{background-color:transparent;border-color:rgba(var(--color-foreground),.25);color:rgb(var(--color-foreground))}@media(hover:hover)and (pointer:fine){.collection-subnav--outline .collection-subnav__link:not(.is-active):not(.collection-subnav__link--static):hover{background-color:transparent;border-color:rgb(var(--color-foreground))}}.collection-subnav--outline .collection-subnav__link.is-active{background-color:rgb(var(--color-foreground));border-color:rgb(var(--color-foreground));color:rgb(var(--color-background))}@media screen and (min-width:990px){.collection-subnav--wrap .collection-subnav__list{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none}.collection-subnav--wrap .collection-subnav__arrow{display:none}}.collection-subnav__arrow{position:absolute;top:50%;z-index:2;display:flex;align-items:center;justify-content:center;width:3.2rem;height:3.2rem;padding:0;border:.1rem solid rgba(var(--color-foreground),.15);border-radius:50%;background-color:rgb(var(--color-background));color:rgb(var(--color-foreground));box-shadow:0 .2rem .8rem #0000001f;cursor:pointer;opacity:0;pointer-events:none;transform:translateY(-50%) scale(.85);transition:opacity var(--duration-default),transform var(--duration-default)}.collection-subnav__arrow .icon{width:1.6rem;height:1.6rem}.collection-subnav__arrow--prev{left:calc(.4rem - var(--subnav-bleed))}.collection-subnav__arrow--prev .icon{transform:rotate(180deg)}.collection-subnav__arrow--next{right:calc(.4rem - var(--subnav-bleed))}.collection-subnav--overflow-start .collection-subnav__arrow--prev,.collection-subnav--overflow-end .collection-subnav__arrow--next{opacity:1;pointer-events:auto;transform:translateY(-50%) scale(1)}.collection-subnav__notice{margin:1.6rem 0 0;font-size:1.3rem;line-height:1.4;color:rgb(var(--color-foreground-secondary))}
/*# sourceMappingURL=/cdn/shop/t/13/assets/component-collection-subnav.css.map */
