.product-card card-variant-selects{display:block;inline-size:100%;min-inline-size:0;max-inline-size:100%}.product-form__input{padding:0;border:none;margin:0;width:100%;min-inline-size:0;max-inline-size:100%}.product-form__item input[type=radio]{clip:rect(0,0,0,0);overflow:hidden;position:absolute;top:0;left:0;height:1px;width:1px}.btn--variant-smallcard{--background: var(--color-button_cardswatches-block, var(--color-button_cardswatches));--color:var(--color-button-text_cardswatches-block, var(--color-base-section, var(--color-button-text_cardswatches, var(--color-base))));--border:var(--color-button-border_cardswatches-block, var(--color-button-border_cardswatches));--background-hover: var(--color-button-hover_cardswatches-block, var(--color-button-hover_cardswatches));--color-hover:var(--color-button-text-hover_cardswatches-block, var(--color-base-section, var(--color-button-text-hover_cardswatches, var(--color-base))));--border-hover:var(--color-button-border-hover_cardswatches-block, var(--color-base-section, var(--color-button-border-hover_cardswatches)));--border-width:var(--border-button-width_cardswatches-block, var(--border-button-width_cardswatches));--border-width-hover:var(--border-button-width-hover_cardswatches-block, var(--border-button-width-hover_cardswatches));--self-border-width:var(--border-button-width_cardswatches-block, var(--border-button-width_cardswatches));--icon:var(--color);--icon-hover:var(--color-hover);--height:100%;--shadow-button-current:unset;--shadow-button-current-hover:unset;--button-opacity-hover:1;--radius-button:var(--radius-button-swatches);font-weight:var(--font-body-weight);padding:8px 15px;min-height:42px;min-width:var(--swatch-min-width, 52px);line-height:1;--background-soldout: var(--color-button-soldout_cardswatches-block, var(--color-button-soldout_cardswatches));--color-soldout:var(--color-text-soldout_cardswatches-block, var(--color-text-soldout_cardswatches));--border-soldout:var(--color-border-soldout_cardswatches-block, var(--color-border-soldout_cardswatches))}.product-form__input input[type=radio]:checked+label{--color: var(--color-hover);--background: var(--background-hover);--border: var(--border-hover);--border-width: var(--border-width-hover);cursor:default}.product-form__item input[type=radio]:not(:checked)+.btn--variant-smallcard{--border: var(--swatch-btn-border, #C0C0C0);--border-width: var(--swatch-btn-border-width, 1px)}.product-form__item input[type=radio]:focus-visible+.btn--variant-smallcard{outline:3px solid var(--color-focus, #0909FF);outline-offset:-3px}@media(min-width:1025px){.product-form__item input[type=radio]:not(:checked)+.btn--variant-smallcard:hover{--border: var(--swatch-btn-border-hover, #888888);--background: var(--swatch-btn-bg-hover, #F3F4F6)}}.btn--variant-smallcard .variant__btn__text,.btn--variant-smallcard .btn__texts>*{padding-top:7px;padding-bottom:8px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-card .variant__btn__text{position:relative;z-index:1;padding-bottom:1px}.product-card.text-center .product-form__container__card{justify-content:center}.product-form__container__card{display:flex;align-items:center;min-height:var(--swatch-zone-min-height, 50px);inline-size:100%;min-inline-size:0;max-inline-size:100%;overflow:visible}.product-form__variant-scroll-shell{position:relative;display:block;inline-size:100%;min-inline-size:0;max-inline-size:100%}.product-form__variant-scroll-shell[data-has-overflow]{display:grid;grid-template-columns:32px minmax(0,1fr) 32px;grid-template-rows:minmax(44px,auto);column-gap:4px;align-items:center}.product-form__variant-scroll-shell[data-has-overflow] .product-form__container__scroll{grid-column:2;grid-row:1}.product-form__variant-scroll-button{--variant-scroll-rail-active-background: #1A1A1A;--variant-scroll-rail-active-foreground: #FAF8F5;--variant-scroll-focus-inner: #FAF8F5;--variant-scroll-focus-outer: #1A1A1A;position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;inline-size:32px;block-size:44px;padding:0;border:0;color:var(--color-base-section, var(--color-base));background:transparent;border-radius:3px;isolation:isolate;cursor:pointer;transition:color .15s ease}.product-form__variant-scroll-button:after{content:"";position:absolute;pointer-events:none;inset:50% auto auto 50%;inline-size:24px;block-size:36px;border:1px solid rgb(26 26 26 / 16%);border-radius:3px;background:#faf8f5b8;box-shadow:none;transform:translate(-50%,-50%);transition:border-color .15s ease,background-color .15s ease;z-index:-1}.product-form__variant-scroll-button--previous{grid-column:1;grid-row:1}.product-form__variant-scroll-button--next{grid-column:3;grid-row:1}:dir(rtl) .product-form__variant-scroll-button--previous{grid-column:3}:dir(rtl) .product-form__variant-scroll-button--next{grid-column:1}:dir(rtl) .product-form__variant-scroll-button svg{transform:scaleX(-1)}.product-form__variant-scroll-button[hidden]{display:none}.product-form__variant-scroll-button:disabled{opacity:.24;cursor:default}.product-form__variant-scroll-button:focus-visible{color:var(--variant-scroll-rail-active-foreground);outline:2px solid var(--variant-scroll-focus-inner);outline-offset:1px;box-shadow:0 0 0 4px var(--variant-scroll-focus-outer)}.product-form__variant-scroll-button:focus-visible:after{border-color:var(--variant-scroll-rail-active-background);background:var(--variant-scroll-rail-active-background)}.product-form__variant-scroll-button svg{position:relative;z-index:1;inline-size:14px;block-size:14px;pointer-events:none}.product-form__variant-scroll-button svg path{fill:currentColor}.product-form__container__scroll{display:flex;flex-wrap:nowrap;gap:var(--swatch-gap-card, 8px);align-items:center;inline-size:100%;min-inline-size:0;max-inline-size:100%;box-sizing:border-box;overflow-x:auto;overflow-y:visible;scroll-snap-type:x proximity;scroll-padding-inline:4px;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px 0}.product-form__container__scroll::-webkit-scrollbar{display:none}.product-form__container__card.product-form__container__color .product-form__container__scroll .product-form__item:has(.btn--variant-smallcard){flex:0 0 auto;min-width:var(--swatch-min-width, 44px);scroll-snap-align:start}.product-form__container__card.product-form__container__color .product-form__item:has(input:checked) label{font-weight:var(--font-body-weight-bold)}.visual-display__color__card{width:var(--swatch-color-size-card, 34px);height:var(--swatch-color-size-card, 34px)}.visual-display__image__card{width:var(--swatch-image-size-card, 44px);height:var(--swatch-image-size-card, 44px);max-width:44px;max-height:44px}.product-form__container__scroll>*{position:relative;flex:0 0 auto;max-width:100%;scroll-snap-align:start}.product-form__container__card:not(.product-form__container__color) .product-form__item{max-inline-size:88%}.product-form__container__card:not(.product-form__container__color) .btn--variant-smallcard{--radius-button: var(--radius, 3px);inline-size:100%;max-inline-size:100%}.product-form__container__card.product-form__container__card--image .product-form__container__scroll>*{flex:0 0 auto}@media(max-width:576px){.btn--variant-smallcard{min-height:44px}.visual-display__color__card{width:var(--swatch-color-size-card-mob, 40px);height:var(--swatch-color-size-card-mob, 40px)}.visual-display__image__card{width:var(--swatch-image-size-card-mob, 48px)!important;height:var(--swatch-image-size-card-mob, 48px)!important}.product-form__container__card{min-height:var(--swatch-zone-min-height-mob, 56px)}}@media(min-width:1025px){.product-form__variant-scroll-button:not(:disabled):hover{color:var(--variant-scroll-rail-active-foreground)}.product-form__variant-scroll-button:not(:disabled):hover:after{border-color:var(--variant-scroll-rail-active-background);background:var(--variant-scroll-rail-active-background)}.visual-display__image__card:hover .visual-display-swatch__image:after,.visual-display__image__card:hover .visual-display-swatch__image:before{opacity:1}}@media(prefers-reduced-motion:reduce){.product-form__variant-scroll-button,.product-form__variant-scroll-button:after{transition:none}}@media(forced-colors:active){.product-form__variant-scroll-button:not(:disabled):hover{color:ButtonText}.product-form__variant-scroll-button:after{border-color:ButtonText;background:Canvas}.product-form__variant-scroll-button:focus-visible{color:ButtonText;outline-color:LinkText;box-shadow:none}}
/*# sourceMappingURL=/cdn/shop/t/19/assets/component-visual-display-card.css.map */