.garn{--garn-accent: #f1641e;--garn-accent-soft: rgba(241, 100, 30, .14);--garn-border: #e4e4e7;--garn-muted: #6b6b73;display:block}.garn *,.garn *:before,.garn *:after{box-sizing:border-box}.garn__trigger{display:flex;align-items:center;gap:1rem;width:100%;height:5.2rem;padding:0 1.6rem;background-color:#fff;border:.1rem solid var(--garn-border);border-radius:1rem;font-family:inherit;font-size:1.5rem;color:#1f1f1f;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}.garn__trigger:hover{border-color:#c9c9cf;background-color:#fcfcfd}.garn__trigger:focus-visible,.garn__trigger[aria-expanded=true]{outline:none;border-color:var(--garn-accent);box-shadow:0 0 0 .3rem var(--garn-accent-soft)}.garn__trigger-swatch{flex:0 0 auto;width:2.4rem;height:2.4rem;border-radius:50%;box-shadow:inset 0 0 0 .1rem #00000026}.garn__trigger-swatch[hidden]{display:none}.garn__trigger-text{flex:1 1 auto;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.garn__trigger-chevron{flex:0 0 auto;width:1.8rem;height:1.8rem;color:var(--garn-muted);transition:transform .18s ease}.garn__trigger[aria-expanded=true] .garn__trigger-chevron{transform:rotate(180deg)}.garn__panel{margin-top:.8rem}.garn--picker .garn__panel{padding:1.2rem;background-color:#fcfcfd;border:.1rem solid var(--garn-border);border-radius:1rem;max-height:34rem;overflow-y:auto}.garn__panel[hidden]{display:none}.garn__grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(6.4rem,1fr))}.garn--schau .garn__grid{gap:1.6rem;grid-template-columns:repeat(auto-fill,minmax(9rem,1fr))}.garn__item{display:flex;flex-direction:column;align-items:center;gap:.6rem;padding:0;background:none;border:0;cursor:pointer;font-family:inherit;color:inherit;-webkit-tap-highlight-color:transparent}.garn__spool{position:relative;display:block;width:100%;aspect-ratio:3 / 4;overflow:hidden;border-radius:.9rem;background-color:var(--garn-hex);box-shadow:inset 0 0 0 .1rem #0000001f;transition:transform .18s ease,box-shadow .18s ease}.garn--schau .garn__spool{border-radius:1.1rem}.garn__spool img{display:block;width:100%;height:100%;object-fit:cover}.garn__item:hover .garn__spool{transform:translateY(-.3rem);box-shadow:0 .8rem 2rem #12121238,inset 0 0 0 .1rem #0000001f}.garn__item:focus-visible{outline:none}.garn__item:focus-visible .garn__spool{box-shadow:0 0 0 .3rem var(--garn-accent-soft),inset 0 0 0 .2rem var(--garn-accent)}.garn__item[aria-checked=true] .garn__spool{transform:translateY(-.3rem);box-shadow:0 0 0 .3rem var(--garn-accent-soft),inset 0 0 0 .25rem var(--garn-accent)}.garn__nr{position:absolute;left:50%;bottom:.5rem;transform:translate(-50%);min-width:2.2rem;padding:.15rem .5rem;border-radius:.5rem;background-color:#ffffffeb;color:#1f1f1f;font-size:1.05rem;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.5;text-align:center}.garn__name{font-size:1.1rem;line-height:1.3;text-align:center;color:var(--garn-muted);-webkit-hyphens:auto;hyphens:auto}.garn--picker .garn__name{display:none}.garn__fallback.is-hidden{position:absolute;width:.1rem;height:.1rem;margin:-.1rem;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}@media screen and (max-width:749px){.garn__grid{grid-template-columns:repeat(auto-fill,minmax(5.6rem,1fr));gap:.8rem}.garn--schau .garn__grid{grid-template-columns:repeat(auto-fill,minmax(7.4rem,1fr));gap:1.1rem}.garn--picker .garn__panel{max-height:28rem}}@media(prefers-reduced-motion:reduce){.garn__spool,.garn__trigger,.garn__trigger-chevron{transition:none}.garn__item:hover .garn__spool,.garn__item[aria-checked=true] .garn__spool{transform:none}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/component-garnfarben.css.map */