card-variant-picker{display:block;position:relative;z-index:2;min-width:0;max-width:100%}.card__content:has(card-variant-picker){grid-template-columns:minmax(0,1fr)}.card-variant-picker__options{display:flex;flex-direction:column;gap:.3rem;margin:0 0 .8rem}.card-variant-picker__row{position:relative;min-width:0}.card-variant-picker__row--single{display:none}.card-variant-picker__fieldset{display:flex;flex-wrap:nowrap;gap:.4rem;border:0;margin:0;padding:.2rem 0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain;width:0;min-width:100%;max-width:100%}.card-variant-picker__fieldset::-webkit-scrollbar{display:none}.card-variant-picker__row:before,.card-variant-picker__row:after{content:"";position:absolute;top:0;bottom:0;width:2.2rem;opacity:0;pointer-events:none;transition:opacity var(--duration-short) ease}.card-variant-picker__row:before{left:0;background:linear-gradient(to right,rgb(var(--color-background)),rgba(var(--color-background),0))}.card-variant-picker__row:after{right:0;background:linear-gradient(to left,rgb(var(--color-background)),rgba(var(--color-background),0))}.card-variant-picker__row--has-prev:before,.card-variant-picker__row--has-next:after{opacity:1}.card-variant-picker__row--has-next .card-variant-picker__fieldset{padding-right:2.8rem}.card-variant-picker__row--has-prev .card-variant-picker__fieldset{padding-left:2.8rem}.card-variant-picker__nav{position:absolute;top:50%;z-index:3;display:none;align-items:center;justify-content:center;width:2.4rem;height:2.4rem;padding:0;transform:translateY(-50%);border:var(--variant-pills-border-width) solid rgba(var(--color-foreground),.35);border-radius:50%;background-color:rgb(var(--color-background));color:rgb(var(--color-foreground));cursor:pointer}.card-variant-picker__nav:hover{border-color:rgb(var(--color-foreground));background-color:rgb(var(--color-foreground));color:rgb(var(--color-background))}.card-variant-picker__nav svg{width:.7rem;height:1.1rem}.card-variant-picker__nav--prev{left:0}.card-variant-picker__nav--next{right:0}.card-variant-picker__row--has-prev .card-variant-picker__nav--prev,.card-variant-picker__row--has-next .card-variant-picker__nav--next{display:inline-flex}.card-variant-picker__legend{width:100%;padding:0;margin:0 0 .2rem;font-size:1.2rem;letter-spacing:.04rem;color:rgba(var(--color-foreground),.75)}.card-variant-picker__input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.card-variant-picker__label{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:2.4rem;margin:0;padding:.3rem .9rem;border:var(--variant-pills-border-width) solid rgba(var(--color-foreground),.35);border-radius:var(--variant-pills-radius);background-color:rgb(var(--color-background));color:rgba(var(--color-foreground),.85);font-size:1rem;line-height:1.2;letter-spacing:.02rem;max-width:143px;text-align:center;cursor:pointer;transition:border-color var(--duration-short) ease,background-color var(--duration-short) ease,color var(--duration-short) ease}.card-variant-picker__label:hover{border-color:rgb(var(--color-foreground));color:rgb(var(--color-foreground))}.card-variant-picker__input:checked+.card-variant-picker__label{background-color:rgb(var(--color-foreground));border-color:rgb(var(--color-foreground));color:rgb(var(--color-background))}.card-variant-picker__input.disabled+.card-variant-picker__label,.card-variant-picker__input:disabled+.card-variant-picker__label{border-color:rgba(var(--color-foreground),.1);color:rgba(var(--color-foreground),.5);text-decoration:line-through}.card-variant-picker__input.disabled:checked+.card-variant-picker__label,.card-variant-picker__input:disabled:checked+.card-variant-picker__label{color:rgba(var(--color-background),.6)}.card-variant-picker__input:focus-visible+.card-variant-picker__label{box-shadow:0 0 0 .3rem rgb(var(--color-background)),0 0 0 .5rem rgba(var(--color-foreground),.55)}.card-variant-picker__input.focused+.card-variant-picker__label{box-shadow:0 0 0 .3rem rgb(var(--color-background)),0 0 0 .5rem rgba(var(--color-foreground),.55)}@media screen and (min-width:750px){.card-variant-picker__label{min-height:2.6rem;padding:.35rem 1.1rem;font-size:1.1rem}.card-variant-picker__nav{width:2.6rem;height:2.6rem}}.quick-add .atc-save-badge{font-size:.85em}
/*# sourceMappingURL=/cdn/shop/t/91/assets/card-variant-picker.css.map */
