.card__swatches{flex-wrap:nowrap!important;overflow-x:auto;overflow-y:clip;row-gap:0!important;-webkit-overflow-scrolling:touch;padding-bottom:calc(var(--swatch-card-size, 24px) * .15);margin-bottom:calc(var(--swatch-card-size, 24px) * -.15);will-change:scroll-position;transform:translateZ(0)}.card__swatches::-webkit-scrollbar{display:none}.card__swatches{-ms-overflow-style:none;scrollbar-width:none}.card__swatches{column-gap:8px}.card__swatches>.opt-label{margin-inline-start:0;margin-inline-end:0}.card__swatches>.opt-label,.card__swatches>input{flex-shrink:0}.card__swatches{--fade-w: calc(var(--swatch-card-size, 24px) * 1.5)}@media(max-width:768px){.card__swatches{--fade-w: var(--swatch-card-size, 24px)}}.card__swatches{--fade-left: 0px;--fade-right: var(--fade-w);-webkit-mask-image:linear-gradient(to right,transparent,black var(--fade-left),black calc(100% - var(--fade-right)),transparent);mask-image:linear-gradient(to right,transparent,black var(--fade-left),black calc(100% - var(--fade-right)),transparent)}.card__swatches.is-scrolled-start{--fade-left: var(--fade-w)}.card__swatches.is-scrolled-end{--fade-right: 0px}.card__swatches{--swatch-border-color-active: 0 15 28}.card__swatches>.opt-label{transition:transform .15s ease}.card__swatches:not(.is-dragging)>.opt-label:hover{transform:scale(1.2);z-index:2}@media(max-width:768px){.card__swatches:not(.is-dragging)>.opt-label:hover{transform:none;z-index:auto}.card__swatches>.opt-label.swatch-pulse{transform:scale(1.2);z-index:2}}.card__swatches.is-dragging{cursor:grabbing!important}.card__swatches.is-dragging>.opt-label{pointer-events:none}.swatch-scroll-wrap{position:relative}quick-add-drawer .option-selector__btns{padding-left:12px}.swatch-scroll-arrow{position:absolute;right:-14px;bottom:calc(var(--swatch-card-size, 24px) * .5);transform:translateY(50%);z-index:5;width:20px;height:20px;display:flex;align-items:center;justify-content:center;background:rgba(var(--text-color, 0,0,0),.06);border:none;border-radius:50%;cursor:pointer;padding:0;opacity:.5;transition:opacity .2s,background .2s;pointer-events:auto}.swatch-scroll-arrow:hover{opacity:1;background:rgba(var(--text-color, 0,0,0),.12)}.swatch-scroll-arrow svg{width:10px;height:10px;fill:none;stroke:rgb(var(--text-color, 0,0,0));stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}.card__swatches.is-scrolled-end~.swatch-scroll-arrow,.card__swatches.is-dragging~.swatch-scroll-arrow{display:none}
/*# sourceMappingURL=/cdn/shop/t/25/assets/custom-card-swatches.css.map */