.card-b__colors{position:relative;z-index:2;display:flex;width:fit-content;max-width:100%;gap:4px;height:44px;padding:2px;margin:0;overflow-x:auto;overflow-y:hidden;touch-action:pan-x pan-y pinch-zoom;overscroll-behavior-x:contain;scroll-padding-inline:2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.card-b__colors::-webkit-scrollbar{display:none}.card-b__color{position:relative;flex:0 0 40px;width:40px;height:40px;border-radius:2px;overflow:hidden;background:var(--color-card-media);transition:opacity var(--dur-fast) var(--ease-out)}.card-b__color-img{display:block;width:100%;height:100%;object-fit:cover}.card-b__color:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;box-shadow:inset 0 0 0 1px var(--color-border);transition:box-shadow var(--dur-fast) var(--ease-out);pointer-events:none}.card-b__color.is-selected:after{box-shadow:inset 0 0 0 2px var(--color-primary)}.card-b__color.is-sold-out{opacity:.45}.card-b__color.is-sold-out.is-selected{opacity:1}@media(hover:hover)and (pointer:fine){.card-b__color:hover:after{box-shadow:inset 0 0 0 2px var(--color-muted-3)}.card-b__color.is-sold-out:not(.is-selected):hover{opacity:.8}.card-b__color.is-selected:hover:after{box-shadow:inset 0 0 0 2px var(--color-primary-hover)}}.card-b__color:focus-visible{outline:var(--focus-ring);outline-offset:0}.card-b__color.is-sold-out:not(.is-selected):focus-visible{opacity:1}.card-b__color:focus-visible:after{box-shadow:inset 0 0 0 2px var(--color-surface)}.card-b__color.is-selected:focus-visible:after{box-shadow:inset 0 0 0 2px var(--color-surface),inset 0 0 0 4px var(--color-primary)}html:not(.motion-ok) .card-b__color,html:not(.motion-ok) .card-b__color:after{transition:none}@media(prefers-reduced-motion:reduce){.card-b__color,.card-b__color:after{transition:none}.card-b__colors{scroll-behavior:auto}}.card-b__colors{--card-colors-fade: 24px}.card-b__colors:has(:focus-visible){--card-colors-fade: 0px}.card-b__colors.has-overflow:not(.at-end){-webkit-mask-image:linear-gradient(to right,#000 calc(100% - var(--card-colors-fade)),transparent 100%);mask-image:linear-gradient(to right,#000 calc(100% - var(--card-colors-fade)),transparent 100%)}.card-b__colors.has-overflow:not(.at-start):not(.at-end){-webkit-mask-image:linear-gradient(to right,transparent 0,#000 var(--card-colors-fade),#000 calc(100% - var(--card-colors-fade)),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 var(--card-colors-fade),#000 calc(100% - var(--card-colors-fade)),transparent 100%)}.card-b__colors.has-overflow:not(.at-start).at-end{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 var(--card-colors-fade),#000 100%);mask-image:linear-gradient(to right,transparent 0,#000 var(--card-colors-fade),#000 100%)}[dir=rtl] .card-b__colors.has-overflow:not(.at-end){-webkit-mask-image:linear-gradient(to left,#000 calc(100% - var(--card-colors-fade)),transparent 100%);mask-image:linear-gradient(to left,#000 calc(100% - var(--card-colors-fade)),transparent 100%)}[dir=rtl] .card-b__colors.has-overflow:not(.at-start):not(.at-end){-webkit-mask-image:linear-gradient(to left,transparent 0,#000 var(--card-colors-fade),#000 calc(100% - var(--card-colors-fade)),transparent 100%);mask-image:linear-gradient(to left,transparent 0,#000 var(--card-colors-fade),#000 calc(100% - var(--card-colors-fade)),transparent 100%)}[dir=rtl] .card-b__colors.has-overflow:not(.at-start).at-end{-webkit-mask-image:linear-gradient(to left,transparent 0,#000 var(--card-colors-fade),#000 100%);mask-image:linear-gradient(to left,transparent 0,#000 var(--card-colors-fade),#000 100%)}.card-b--grid{--card-colors-band: 50px}.plp-grid:has(.card-b__colors) .card-b--grid:not(:has(.card-b__colors)) .card-b__media{margin-block-end:var(--card-colors-band)}.card-sizes .size-pill.is-first-shown:before{content:none}
/*# sourceMappingURL=/cdn/shop/t/10/assets/component-card-colors.css.map */