.cs-swatches{display:flex;flex-wrap:nowrap;align-items:center;gap:.375rem;min-height:2rem}.cs-swatches button.cs-swatch{-webkit-appearance:none;appearance:none;position:relative;display:block;flex:0 0 2rem;width:2rem;height:2rem;min-width:0;min-height:0;max-width:none;margin:0;padding:0;border:0;border-radius:9999px;overflow:hidden;line-height:0;background:#fff;box-shadow:0 0 0 1px #c9ced6;cursor:pointer;transition:box-shadow .2s ease,transform .2s ease}.cs-swatches button.cs-swatch:hover{box-shadow:0 0 0 1px #14181f;transform:scale(1.08)}.cs-swatches button.cs-swatch[aria-pressed=true]{box-shadow:0 0 0 2px #fff,0 0 0 3px #14181f}.cs-swatches button.cs-swatch:focus-visible{outline:2px solid rgb(18 32 63);outline-offset:3px}.cs-swatches .cs-swatch-img{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%;max-width:none;margin:0;padding:0;border-radius:0;object-fit:cover;object-position:center;transform:scale(1.18)}.cs-swatches .wf.cs-swatch-img{border-radius:9999px;transform:none}.cs-more-wrap{position:relative;display:inline-flex;flex:none;align-items:center}.cs-swatches button.cs-more{-webkit-appearance:none;appearance:none;min-width:0;min-height:0;margin:0 0 0 .25rem;padding:.25rem 0;border:0;background:none;font:inherit;font-size:.75rem;font-weight:500;line-height:1;color:#55585e;white-space:nowrap;cursor:pointer;transition:opacity .15s ease}.cs-extra{position:absolute;z-index:20;left:0;top:50%;display:grid;grid-template-columns:repeat(var(--cs-cols, 4),2rem);gap:.375rem;width:max-content;padding:.375rem;border-radius:1.25rem;background:#fff;box-shadow:0 8px 24px #12203f29,0 0 0 1px #c9ced699;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-50%) scale(.85);transform-origin:left center;transition:opacity .18s ease,transform .22s cubic-bezier(.22,1,.36,1),visibility 0s linear .22s}.cs-more-wrap:hover .cs-extra,.cs-more-wrap:focus-within .cs-extra{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(-50%) scale(1);transition-delay:0s}.cs-more-wrap:hover .cs-more,.cs-more-wrap:focus-within .cs-more{opacity:0}@media(prefers-reduced-motion:reduce){.cs-extra,.cs-swatches button.cs-swatch{transition:none}}@media(hover:none),(max-width:63.99rem){.cs-more-wrap:hover .cs-extra,.cs-more-wrap:focus-within .cs-extra{opacity:0;visibility:hidden;pointer-events:none}.cs-more-wrap:hover .cs-more,.cs-more-wrap:focus-within .cs-more{opacity:1}.cs-more-wrap[data-open] .cs-extra{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(-50%) scale(1);transition-delay:0s}.cs-more-wrap[data-open] .cs-more{opacity:0}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/collection-swatches.css.map */