.featured-collection-tabs{position:relative;width:100%}.collection-tabs__nav-wrapper{position:relative;width:100%;display:flex;align-items:center;gap:6px}.collection-tabs__wrapper-nav{display:flex;justify-content:start;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;scroll-behavior:smooth;position:relative;flex:1}.collection-tabs__wrapper-nav::-webkit-scrollbar{display:none}.collection-tabs__scroll-button{width:40px;height:40px;min-width:40px;background:#ebeaeb;border:1px solid rgba(var(--color-base-text),.15);border-radius:50%;display:none;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 8px #0000001a;flex-shrink:0}.collection-tabs__scroll-button:hover{background:rgba(var(--color-base-background),1);box-shadow:0 4px 12px #00000026;border-color:rgba(var(--color-base-text),.3)}.collection-tabs__scroll-button:active{transform:scale(.95)}.collection-tabs__scroll-button--left{order:0}.collection-tabs__scroll-button--right{order:2}.collection-tabs__scroll-button svg{width:20px;height:20px;fill:rgb(var(--color-base-text))}.collection-tabs__nav-wrapper.has-overflow .collection-tabs__scroll-button{display:flex}.collection-tabs__nav-wrapper.has-overflow .collection-tabs__wrapper-nav{order:1}.collection-tabs__nav-wrapper.has-overflow .collection-tabs__wrapper-nav:before,.collection-tabs__nav-wrapper.has-overflow .collection-tabs__wrapper-nav:after{content:"";position:absolute;top:0;bottom:3rem;width:60px;pointer-events:none;z-index:5}.collection-tabs__nav-wrapper.has-overflow .collection-tabs__wrapper-nav:before{left:0;background:linear-gradient(to right,rgba(var(--color-base-background),1),rgba(var(--color-base-background),0))}.collection-tabs__nav-wrapper.has-overflow .collection-tabs__wrapper-nav:after{right:0;background:linear-gradient(to left,rgba(var(--color-base-background),1),rgba(var(--color-base-background),0))}.collection-tabs__nav{display:flex;align-items:center;justify-content:center;gap:16px;padding:.5rem 0;width:100%}.collection-tabs__nav-item{position:relative;padding:1.4rem 2.8rem;background:transparent;border:none;border-radius:50px;font-size:1.8rem;font-weight:600;color:rgba(var(--color-base-text),.6);cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);white-space:nowrap;min-width:fit-content;text-transform:capitalize;letter-spacing:.02em;overflow:hidden;z-index:1;opacity:.8}.collection-tabs__nav-item:hover{color:rgba(var(--color-base-text),.8);background:rgba(var(--color-base-text),.04);transform:translateY(-1px);box-shadow:0 2px 8px #0000001a}.collection-tabs__nav-item--active{background:linear-gradient(135deg,rgb(var(--color-base-accent-1)),rgb(var(--color-base-accent-2)));color:rgb(var(--color-base-background));box-shadow:0 4px 16px rgba(var(--color-base-accent-1),.3),0 2px 8px #0000001a,inset 0 1px #fff3,inset 0 -1px #0000001a;transform:translateY(-2px)}.collection-tabs__nav-item--active:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.3) 50%,transparent 100%);animation:shine 2s ease-in-out infinite;z-index:1}@keyframes shine{0%{left:-100%}50%{left:100%}to{left:100%}}.collection-tabs__nav-item:focus{outline:none;box-shadow:0 0 0 3px rgba(var(--color-base-accent-1),.3),0 2px 8px #0000001a}.collection-tabs__nav-item--active:focus{box-shadow:0 4px 16px rgba(var(--color-base-accent-1),.3),0 2px 8px #0000001a,0 0 0 3px rgba(var(--color-base-accent-1),.4),inset 0 1px #fff3,inset 0 -1px #0000001a}.collection-tabs__nav-text{display:block;position:relative;z-index:2;font-weight:600}.collection-tabs__nav-item--active .collection-tabs__nav-text{text-shadow:0 1px 2px rgba(0,0,0,.1)}.collection-tabs__nav-item:active{transform:translateY(0);box-shadow:0 2px 4px #0000001a,inset 0 1px 2px #0000001a}.collection-tabs__nav-item--active:active{transform:translateY(-1px);box-shadow:0 2px 8px rgba(var(--color-base-accent-1),.3),0 1px 4px #0000001a,inset 0 1px #fff3,inset 0 -1px #0000001a}.collection-tabs__content{position:relative;min-height:400px}.collection-tabs__panel{width:100%;opacity:1;transition:opacity .3s ease,transform .3s ease}.collection-tabs__panel--hidden{display:none;opacity:0;transform:translateY(20px)}@media screen and (max-width: 989px){.collection-tabs__nav-wrapper{justify-content:start}}@media screen and (max-width: 749px){.collection-tabs__nav-wrapper{margin-bottom:2rem;padding:0 2rem}.collection-tabs__nav{padding:.3rem;min-width:fit-content}.collection-tabs__nav-item{padding:1.2rem 2rem;font-size:1.3rem;min-width:auto}.collection-tabs__nav-item--active{transform:translateY(-1px);box-shadow:0 3px 12px rgba(var(--color-base-accent-1),.25),0 1px 6px #0000001a,inset 0 1px #fff3,inset 0 -1px #0000001a}.collection-tabs__nav-item:hover{transform:translateY(-.5px);box-shadow:0 1px 6px #00000014}}@media screen and (max-width: 480px){.collection-tabs__nav-wrapper{padding:0 1.5rem;margin-bottom:1.5rem}.collection-tabs__nav{padding:.2rem}.collection-tabs__nav-item{padding:1rem 1.6rem;font-size:1.2rem}.collection-tabs__nav-item--active{transform:translateY(-.5px);box-shadow:0 2px 8px rgba(var(--color-base-accent-1),.2),0 1px 4px #00000014,inset 0 1px #ffffff26,inset 0 -1px #00000014}}.collection-tabs__nav-item:focus-visible{outline:3px solid rgb(var(--color-base-accent-1));outline-offset:2px;box-shadow:none}@media (prefers-contrast: high){.collection-tabs__nav{border:2px solid rgb(var(--color-base-text));background:rgb(var(--color-base-background))}.collection-tabs__nav-item{border:1px solid transparent}.collection-tabs__nav-item--active{border:1px solid rgb(var(--color-base-text));background:rgb(var(--color-base-accent-2))}}@media (prefers-reduced-motion: reduce){.collection-tabs__nav-item,.collection-tabs__panel,.collection-tabs__nav-item--active:before,.grid__item{transition:none!important;animation:none!important}.collection-tabs__panel .grid__item{opacity:1;transform:none}}@media (prefers-color-scheme: dark){.collection-tabs__nav-item:hover{background:#ffffff1a}.collection-tabs__nav-item--active{background:#ffffff1a;box-shadow:0 2px 10px #0000004d,0 1px 3px #0003}}.collection-tabs__nav-item,.collection-tabs__panel{will-change:transform,opacity}.collection-tabs__panel--hidden *{animation-play-state:paused}
/*# sourceMappingURL=/cdn/shop/t/24/assets/component-featured-collection-tabs.css.map */