.card__colors{z-index:2;position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;pointer-events:visible;gap:.6rem;padding-top:.8rem;padding-bottom:.8rem}.card-article-info+.card__colors{margin-inline-start:auto}.card-information__top .card__colors{justify-content:center}.color-swatch{display:flex;justify-content:center;cursor:pointer;position:relative;width:4.4rem;height:4.4rem;border-radius:.5rem;backface-visibility:hidden;transition:transform var(--duration-default) ease,box-shadow var(--duration-default) ease;box-shadow:0 0 0 1.5px #0000001a;overflow:hidden;background-color:#f5f5f5}.card__colors--medium .color-swatch{width:4.4rem;height:4.4rem}.card__colors--large .color-swatch{width:5rem;height:5rem}.color-swatch:before,.color-swatch:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:.5rem;background-size:cover;background-position:center;background-color:var(--swatch-background-color);background-image:var(--swatch-background-image);transition:transform var(--duration-long) ease,opacity var(--duration-default) ease}@media(min-resolution:2dppx){.color-swatch:before,.color-swatch:after{background-image:var(--swatch-background-image-2x, var(--swatch-background-image))}}.color-swatch.is-active{box-shadow:0 0 0 2px #fff,0 0 0 4px #00c4af;transform:translateY(-1px)}.color-swatch a{width:100%;height:100%;border-radius:.5rem;z-index:1;position:relative;display:flex;align-items:center;justify-content:center}.color-swatch a:before{content:none}@media screen and (hover:hover){.color-swatch:not(.is-active):hover{transform:translateY(-2px);box-shadow:0 0 0 1.5px #00000026,0 4px 10px #0000001f}}.card__colors .link{display:flex;align-items:center;justify-content:center;width:4.4rem;height:4.4rem;border-radius:.5rem;background-color:#0000000d;box-shadow:0 0 0 1.5px #0000001a;font-size:1.1rem;font-weight:700;letter-spacing:.03em;color:rgba(var(--color-foreground),.65);text-decoration:none;transition:background-color var(--duration-default) ease,color var(--duration-default) ease;line-height:1}@media screen and (hover:hover){.card__colors .link:hover{background-color:#00c4af;color:#fff;box-shadow:0 0 0 1.5px #00c4af}}@media screen and (max-width:749px){.card__colors{gap:.5rem;padding-top:.6rem;padding-bottom:.6rem}.color-swatch,.card__colors--medium .color-swatch{width:3.6rem;height:3.6rem;border-radius:.4rem}.color-swatch:before,.color-swatch:after,.color-swatch a{border-radius:.4rem}.card__colors--large .color-swatch{width:4rem;height:4rem}.card__colors .link{width:3.6rem;height:3.6rem;border-radius:.4rem;font-size:1rem}}.card-variant-space .card__colors{padding-top:0;padding-bottom:0;flex-wrap:nowrap;overflow:visible;gap:.6rem}.card-variant-space .color-swatch,.card-variant-space .card__colors .link{flex:0 0 auto}@media screen and (max-width:749px){.card-variant-space .card__colors{gap:.5rem}}
/*# sourceMappingURL=/cdn/shop/t/76/assets/component-color-swatches.css.map */