.card__colors{--si-swatch-size: 1.6rem;--si-swatch-gap: .6rem;z-index:2;position:relative;display:flex;flex-wrap:wrap;align-items:center;pointer-events:visible;gap:var(--si-swatch-gap);padding-top:.5rem;padding-bottom:1rem}@media screen and (min-width:750px){.card__colors{--si-swatch-size: 1.8rem;--si-swatch-gap: .7rem}}.card__colors:hover,.card__colors:focus-within{z-index:3}.card-article-info+.card__colors{margin-inline-start:auto}.cardcard-information__top .card__colors{justify-content:flex-end}.color-swatch{display:flex;justify-content:center;cursor:pointer;position:relative;width:var(--si-swatch-size);height:var(--si-swatch-size);border-radius:50%;backface-visibility:hidden;transition:transform var(--duration-default) ease}.card__colors--large{gap:.3rem}.card__colors--medium{--si-swatch-size: 2.2rem}.card__colors--large{--si-swatch-size: 2.6rem}.color-swatch:before,.color-swatch:after{content:"";position:absolute;width:100%;height:100%;border-radius:50%;transform:scale(.8);background-size:cover;background-color:var(--swatch-background-color);background-image:var(--swatch-background-image);transition:transform var(--duration-long) ease}.color-swatch:before{box-shadow:inset 0 0 0 .1rem rgb(var(--color-border))}.color-swatch.is-active:before,.color-swatch.is-active:after{transform:scale(1)}.color-swatch a{width:100%;height:100%;border-radius:50%;z-index:1;position:relative;display:flex;align-items:center;justify-content:center}.color-swatch a:before{content:"";z-index:2;position:absolute;width:.5rem;height:.5rem;border-radius:50%;background-color:rgb(var(--color-background));transform:scale(0);transition:transform var(--duration-long) ease}.card__colors--large .color-swatch a:before{width:.6rem;height:.6rem}.color-swatch.is-active a:before{transform:scale(1)}.card__colors .link{line-height:1}.color-swatch__tip{--tip-x: 0;position:absolute;bottom:calc(100% + .6rem);right:0;transform:translate(var(--tip-x),.3rem);z-index:5;padding:.3rem .7rem;border-radius:.4rem;background-color:#1c1c1c;color:#fff;font-size:1.2rem;line-height:1.4;letter-spacing:0;white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;transition:opacity var(--duration-default) ease,transform var(--duration-default) ease,visibility 0s linear var(--duration-default)}.color-swatch__tip:after{content:"";position:absolute;top:100%;border:.4rem solid transparent;border-top-color:#1c1c1c;border-bottom-width:0}.color-swatch__tip.is-centred{--tip-x: -50%;right:auto;left:50%}.color-swatch__tip.is-left{right:auto;left:0}.color-swatch__tip:after{left:auto;right:calc(var(--si-swatch-size) / 2);margin-left:0;margin-right:-.4rem}.color-swatch__tip.is-centred:after{left:50%;right:auto;margin-left:-.4rem;margin-right:0}.color-swatch__tip.is-left:after{left:calc(var(--si-swatch-size) / 2);right:auto;margin-left:-.4rem;margin-right:0}.color-swatch a:focus-visible+.color-swatch__tip{opacity:1;visibility:visible;transform:translate(var(--tip-x));transition-delay:0s}@media(hover:hover){.color-swatch:hover .color-swatch__tip{opacity:1;visibility:visible;transform:translate(var(--tip-x));transition-delay:0s}}.color-swatch a:focus-visible{outline:.2rem solid rgb(var(--color-base-text));outline-offset:.2rem}.card:hover .media.media--hover-effect.media--no-hover>img+img{opacity:0}.card:hover .media.media--hover-effect.media--no-hover>img:first-child{transform:scale(1.03)}
/*# sourceMappingURL=/cdn/shop/t/89/assets/component-color-swatches.css.map */
