product-swatch{display:block;margin-top:var(--swatch-margin-top, 0);margin-bottom:var(--swatch-margin-bottom, 0)}@media(min-width:750px){product-swatch{margin-top:var(--swatch-margin-top-desktop, 0);margin-bottom:var(--swatch-margin-bottom-desktop, 0)}}.product-swatch__slider{display:flex;align-items:center;gap:.4rem;-webkit-user-select:none;user-select:none;opacity:0}.product-swatch--ready .product-swatch__slider,html.no-js .product-swatch__slider{opacity:1}.product-swatch__boxes{flex:1 1 auto;min-width:0;margin:0;padding:0}.product-swatch__track{align-items:stretch}.product-swatch__boxes .swiper-slide{width:auto;height:auto}.product-swatch .product-swatch__nav-button{flex-shrink:0;display:none;align-items:center;justify-content:center;width:2.4rem;height:2.4rem;padding:0;background-color:transparent;color:rgb(var(--color-foreground));cursor:pointer;transition:opacity var(--duration-default)}.product-swatch--has-overflow .product-swatch__nav-button{display:flex}.product-swatch__nav-button .icon{width:2.4rem;height:2.4rem}@media screen and (hover:hover)and (pointer:fine){.product-swatch__nav-button:hover{opacity:var(--hover-opacity)}}html.no-js .product-swatch__boxes{overflow-x:auto}.box--product{display:block;padding:.4rem;border:2px solid #ddd;border-radius:var(--border-radius-block);text-decoration:none;color:inherit;transition:border-color .2s ease;transform:scale(1.0001)}.box--product:hover{border-color:#323232}.box--active{cursor:default;border-color:#323232}.box__image{--swatch-size: 5rem;position:relative;display:block;width:var(--swatch-size);overflow:hidden;border-radius:var(--border-radius-block);background-color:rgb(var(--color-background-secondary))}@media(min-width:750px){.box__image{--swatch-size: 72px}}.box__image:after{content:"";display:block;width:0;padding-bottom:var(--swatch-ratio-padding, 100%)}.box__image .box__image-el{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;transition:var(--image-transition, transform .4s ease);transform:scale(1)}.box--product:hover .box__image-el{transform:scale(1.04)}@media(prefers-reduced-motion:reduce){.box__image .box__image-el,.box--product:hover .box__image-el{transition:none;transform:none}}
/*# sourceMappingURL=/cdn/shop/t/28/assets/component-product-swatch.css.map */
