.swatch-item{--swatch--border-radius: var(--variant-pills-radius, 50%);border:var(--variant-pills-border-width) solid rgb(var(--color-black-rgb) / var(--opacity-15));border-radius:var(--swatch--border-radius);padding:.2rem;box-shadow:var(--variant-pills-shadow-horizontal-offset) var(--variant-pills-shadow-vertical-offset) var(--variant-pills-shadow-blur-radius) var(--color-shadow)}.swatch-item:after{content:"";position:absolute;inset:calc(var(--variant-pills-border-width) * -1);border:var(--variant-pills-border-width) solid rgb(var(--color-black-rgb) / var(--opacity-100));border-radius:var(--swatch--border-radius);pointer-events:none;transform:scale(.8);transition:transform .3s ease,opacity .3s ease;opacity:var(--opacity-0)}.swatch-item.active:after{transform:scale(1);opacity:var(--opacity-100)}.swatch-item label{cursor:pointer}.swatch{--swatch--size: var(--swatch-input--size, 4.4rem);width:var(--swatch--size);aspect-ratio:1 / 1;background-color:var(--swatch--background-color);background-image:var(--swatch--background);background-position:var(--swatch-focal-point, initial);background-size:cover;background-origin:border-box;border-radius:var(--swatch--border-radius)}.swatch-item:has(.swatch--unavailable){border-style:dashed;border-color:rgb(var(--color-black-rgb) / var(--opacity-50))}.swatch-item:has(.swatch.active){border-style:solid;border-color:#000}.swatch-item .tooltip{display:none}@media(min-width:1025px){.swatch-item .tooltip{display:block;opacity:var(--opacity-0);visibility:hidden;pointer-events:none;color:#fff;background:#232323;padding:var(--padding-2xs);min-width:var(--size-40);margin:0 0 var(--margin-sm);border-radius:.2rem;transition:opacity ease .3s,transform ease .3s;font-size:var(--font-size--2xs);transform:translateY(.5rem)}.swatch-item .tooltip:before{content:"";position:absolute;bottom:-.4rem;left:1rem;height:0;width:0;border-top:.7rem solid #232323;border-left:.7rem solid transparent;border-right:.7rem solid transparent;transform:translate(-50%)}.swatch-item:hover .tooltip{opacity:var(--opacity-100);visibility:visible;transform:translateY(0)}.product-card-wrapper .swatch-item:nth-child(n+5) .tooltip{right:0;left:auto}.product-card-wrapper .swatch-item:nth-child(n+5) .tooltip:before{right:.3rem;left:auto;transform:none}.product-card-wrapper:has(.swatch-item:hover),:is(.product-grid__item,.grid__item,.swiper-slide,.resource-list__item):has(.product-card-wrapper .swatch-item:hover){position:relative;z-index:20}}.product-card-wrapper .card__swatch,.product-card-wrapper .card__swatch color-swatch{display:block;width:100%}.product-card-wrapper .card__swatch .swatch-list{justify-content:flex-start;width:100%}.product-card-wrapper .card__swatch .swatch-item{flex:0 0 auto}.product-card-wrapper .cyril-card-swatch-button{-webkit-appearance:none;appearance:none;position:relative;display:block;padding:0;border:0;color:inherit;background:transparent;cursor:pointer}.product-card-wrapper .cyril-card-swatch-button .swatch{--swatch--size: 3.2rem}.product-card-wrapper .cyril-card-swatch-button:focus-visible{outline:.2rem solid rgb(var(--color-foreground-rgb));outline-offset:.3rem}.product-card-wrapper .cyril-card-swatch-more{display:flex;flex:0 0 3.6rem;align-items:center;justify-content:center;width:3.6rem;height:3.6rem;border:.1rem solid rgb(var(--color-black-rgb) / var(--opacity-20));color:rgb(var(--color-foreground-rgb));background:rgb(var(--color-background-rgb));font-size:1.2rem;font-weight:600;line-height:1;letter-spacing:0;white-space:nowrap}.product-card-wrapper .cyril-card-swatch-more--mobile{display:none}@media screen and (min-width:750px){.product-card-wrapper .cyril-card-swatch-item--mobile-only{display:none}.template-index .product-card-wrapper .card__swatch--homepage-explore .swatch-list{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:.4rem;align-items:start;width:100%}.template-index .product-card-wrapper .card__swatch--homepage-explore.has-overflow .swatch-list{grid-template-columns:repeat(10,minmax(0,1fr)) minmax(2.4rem,auto)}.template-index .product-card-wrapper .card__swatch--homepage-explore .swatch-item{width:100%;max-width:3.2rem}.template-index .product-card-wrapper .card__swatch--homepage-explore .cyril-card-swatch-button,.template-index .product-card-wrapper .card__swatch--homepage-explore .cyril-card-swatch-button .swatch{width:100%}.template-index .product-card-wrapper .card__swatch--homepage-explore .cyril-card-swatch-button .swatch{--swatch--size: auto;aspect-ratio:1 / 1}.template-index .product-card-wrapper .card__swatch--homepage-explore .cyril-card-swatch-more{width:100%;min-width:2.4rem;max-width:3.2rem;height:auto;aspect-ratio:1 / 1}.template-collection .product-card-wrapper .card__swatch .swatch-list{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:.4rem;align-items:start;width:100%}.template-collection .product-card-wrapper .card__swatch.has-overflow .swatch-list{grid-template-columns:repeat(8,minmax(0,1fr)) minmax(2.4rem,auto)}.template-collection .product-card-wrapper .card__swatch .swatch-item{width:100%;max-width:3.6rem}.template-collection .product-card-wrapper .cyril-card-swatch-button,.template-collection .product-card-wrapper .cyril-card-swatch-button .swatch{width:100%}.template-collection .product-card-wrapper .cyril-card-swatch-button .swatch{--swatch--size: auto;aspect-ratio:1 / 1}.template-collection .product-card-wrapper .cyril-card-swatch-more{width:100%;min-width:2.4rem;max-width:3.6rem;height:auto;aspect-ratio:1 / 1}}@media screen and (max-width:749px){.product-card-wrapper .card__swatch .swatch-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem;align-items:start;width:100%}.product-card-wrapper .card__swatch .swatch-item{width:fit-content;padding:.15rem}.product-card-wrapper .cyril-card-swatch-button .swatch{--swatch--size: 2.4rem}.product-card-wrapper .cyril-card-swatch-item--desktop-only,.product-card-wrapper .cyril-card-swatch-more--desktop{display:none}.product-card-wrapper .cyril-card-swatch-more--mobile{display:flex}.product-card-wrapper .card__swatch--collection .swatch-list,.product-card-wrapper .card__swatch--homepage-explore .swatch-list{grid-template-columns:repeat(5,minmax(0,1fr));gap:.3rem}.product-card-wrapper .card__swatch--collection .cyril-card-swatch-button .swatch,.product-card-wrapper .card__swatch--homepage-explore .cyril-card-swatch-button .swatch{--swatch--size: 2.2rem}.product-card-wrapper .card__swatch.has-mobile-overflow .cyril-card-swatch-more{flex-basis:2.5rem;width:2.5rem;height:2.5rem;font-size:1.1rem}}
/*# sourceMappingURL=/cdn/shop/t/15/assets/component-swatch.css.map */
