.variant-picker__with-preview{position:relative;display:flex;flex-direction:column;margin:var(--nova-space-sm) 0 var(--nova-space-md);gap:var(--nova-space-xs);background:var(--variant-picker-bg, #f6f6f6);border:1px solid var(--variant-picker-border, #e4e4e7);border-radius:8px;padding:var(--variant-picker-pad-top, 20px) var(--variant-picker-pad-right, 18px) var(--variant-picker-pad-bottom, 20px) var(--variant-picker-pad-left, 18px)}.variant-picker__with-preview--labeled{margin-top:calc(var(--nova-space-sm) + 8px)}.variant-picker__border-label{position:absolute;top:0;left:16px;z-index:1;transform:translateY(-50%);margin:0;padding:0 8px;background:linear-gradient(to bottom,#fff 50%,var(--variant-picker-bg, #f6f6f6) 50%);color:var(--variant-picker-label-color, #18181b);font:var(--nova-body-utility);font-size:var(--variant-picker-label-size, 13px);font-weight:var(--variant-picker-label-weight, 700);letter-spacing:var(--variant-picker-label-spacing, .06em);line-height:1.2;text-transform:uppercase}@media screen and (min-width:768px){.variant-picker__with-preview{flex-direction:row;align-items:center;gap:var(--nova-space-xs)}.variant-picker__preview-wrap{flex-shrink:0;width:114px;max-width:114px}nova-variant-picker{flex:1 1 0;min-width:0}}nova-variant-picker{display:flex;flex-direction:column;gap:var(--nova-space-xs)}.variant-picker__preview-wrap{max-width:140px;border:1px solid var(--nova-brand-neutral);border-radius:8px;overflow:hidden;background-color:var(--nova-brand-reverse)}.variant-picker__preview{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}.variant-picker__preview[hidden]{display:none}.variant-picker__preview-trigger{display:block;width:100%;padding:0;margin:0;border:none;background:transparent;cursor:pointer;border-radius:inherit;font:inherit;color:inherit;text-align:inherit}.variant-picker__preview-trigger:focus-visible{outline:2px solid var(--nova-utility-focus);outline-offset:2px}.variant-picker__preview-trigger:disabled{cursor:not-allowed;opacity:.55}.variant-picker__preview-dialog{--width: 100vw;--body-spacing: 0;--header-spacing: 0;z-index:var(--nova-z-index-dialog)}.variant-picker__preview-dialog::part(overlay){background:#000000d9}.variant-picker__preview-dialog::part(panel){width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;background:#000000d9;border:none;border-radius:0;box-shadow:inset 0 1px #ffffff0f}.variant-picker__preview-dialog::part(header){position:absolute;top:0;right:0;left:0;z-index:4;align-items:flex-start;justify-content:flex-end;border:none;padding:calc(var(--nova-space-sm, 12px) + env(safe-area-inset-top,0px)) calc(var(--nova-space-md, 16px) + env(safe-area-inset-right,0px)) var(--nova-space-sm, 12px) calc(var(--nova-space-md, 16px) + env(safe-area-inset-left,0px))}.variant-picker__preview-dialog::part(title){display:none}.variant-picker__preview-dialog::part(close-button){flex-shrink:0;margin-left:auto;color:#fff;background:#eb0a1e;border-radius:4px;font-size:26px;transition:background-color .2s ease,color .2s ease}.variant-picker__preview-dialog::part(close-button):hover{background:var(--nova-brand-primary-hover, #ffffff);color:#eb0a1e}.variant-picker__preview-dialog::part(body){display:flex;flex-direction:column;height:100dvh;min-height:0;padding:0;overflow:hidden}.variant-picker__preview-dialog::part(footer){display:none}.variant-picker__preview-dialog-stage{box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0;min-height:0;padding:calc(4.5rem + env(safe-area-inset-top,0px)) calc(var(--nova-space-md, 16px) + env(safe-area-inset-right,0px)) calc(var(--nova-space-md, 16px) + env(safe-area-inset-bottom,0px)) calc(var(--nova-space-md, 16px) + env(safe-area-inset-left,0px))}.variant-picker__preview-dialog-img{display:block;width:auto;height:auto;min-width:0;max-width:100%;max-height:100%;margin:0 auto;object-fit:contain}.variant-picker__preview-dialog-img[hidden]{display:none}@media screen and (max-width:767px){.variant-picker__preview-wrap{width:100%;max-width:100%}}.variant-picker__input{padding:0;margin:0 0 1.2rem;min-width:fit-content;border:none}.variant-picker__legend-container{margin-bottom:var(--nova-space-xs)}.variant-picker__legend{font:var(--nova-body-utility);letter-spacing:1.4px;font-weight:700;text-transform:uppercase;padding:0}.variant-picker__size-guide-button{text-decoration:underline;text-underline-offset:var(--nova-space-2xs);line-height:140%;padding:0 var(--nova-space-xs) 0 0;font:var(--nova-body-utility);font-size:14px;text-transform:uppercase}.variant-picker__input .form__label{padding-left:0}fieldset.variant-picker__input .form__label{margin-bottom:.2rem}.variant-picker__option-group{padding:10px 10px 0}.variant-picker__options{display:grid;grid-column-gap:var(--nova-space-xs);grid-row-gap:var(--nova-space-xs);grid-template-columns:repeat(4,1fr)}.variant-picker__options--swatches{grid-template-columns:repeat(auto-fit,var(--nova-product-color-swatch-size))}.variant-picker__options__input{clip:rect(0,0,0,0);overflow:hidden;position:absolute;height:1px;width:1px}.variant-picker__options__label{border:1px solid var(--nova-brand-neutral);border-radius:var(--nova-border-radius-s);background-color:var(--nova-brand-reverse);color:var(--nova-color-foreground);text-align:center;transition:border var(--nova-duration-short) ease;cursor:pointer;height:var(--nova-button-height-s)}.variant-picker__options__label:focus-visible{outline:none}.variant-picker__options__input:focus-visible+.variant-picker__options__label:not(.variant-picker__color-label){outline:2px solid var(--nova-utility-focus)}.variant-picker__options__input[checked]+.variant-picker__options__label:not(.variant-picker__color-label){border:1px solid var(--nova-color-foreground)}.disabled.variant-picker__options__label:not(.variant-picker__color-label){color:var(--nova-brand-neutral);text-decoration:line-through}.variant-picker__color-label{height:var(--nova-product-color-swatch-size);width:var(--nova-product-color-swatch-size);border-radius:var(--nova-border-rounded);text-indent:-9999px;font-size:0;position:relative}.variant-picker__options__input:focus-visible+.variant-picker__color-label:before{content:"";position:absolute;top:calc(var(--nova-product-color-swatch-outline) * -1);left:calc(var(--nova-product-color-swatch-outline) * -1);right:calc(var(--nova-product-color-swatch-outline) * -1);bottom:calc(var(--nova-product-color-swatch-outline) * -1);outline:2px solid var(--nova-utility-focus);border-radius:var(--nova-border-rounded)}.variant-picker__options__input[checked]+.variant-picker__color-label:before{content:"";position:absolute;top:calc(var(--nova-product-color-swatch-outline) * -1);left:calc(var(--nova-product-color-swatch-outline) * -1);right:calc(var(--nova-product-color-swatch-outline) * -1);bottom:calc(var(--nova-product-color-swatch-outline) * -1);border:1px solid var(--nova-color-foreground);border-radius:var(--nova-border-rounded)}.disabled.variant-picker__color-label:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,transparent calc(50% - 1px),var(--nova-color-foreground) 50%,transparent calc(50% + 1px));pointer-events:none}@media screen and (min-width:768px){.disabled.variant-picker__color-label:after{top:1px;left:1px;right:1px;bottom:1px}}.variant-picker__select{background:transparent;position:relative}.variant-picker__dropdown__label{color:#fff;padding:10px;font:var(--nova-body-utility);font-size:16px;text-transform:uppercase;background:#eb0a1e;border-radius:6px 6px 0 0;margin-bottom:-2px}.variant-picker__dropdown__select::part(form-control-input) sl-popup{position:static}.variant-picker__dropdown__select sl-popup.select--focused sl-select::part(combobox){outline:none;box-shadow:none}.variant-picker__dropdown__select span.orp-sel{font-size:16px;font-weight:500}.variant-picker__dropdown__select::part(combobox){padding:0 var(--nova-space-xs);border-radius:0 6px 6px;border:1px solid var(--variant-picker-border, #e4e4e7);height:42px;min-height:unset;--sl-input-focus-ring-color: transparent;--sl-input-focus-ring-width: 0}.variant-picker__dropdown__select::part(expand-icon){position:absolute;right:var(--nova-space-xs);top:0}.variant-picker__dropdown__select::part(display-input){font-size:15px;line-height:140%;font-weight:500}.variant-picker__dropdown__select-option::part(label){font-size:22px;line-height:140%}.variant-picker__dropdown__select::part(listbox){background-color:#fff!important;border-radius:0 0 8px 8px!important;box-shadow:0 7px 5px 1px #00000059!important;padding:0!important;border:none!important;margin-top:-4px}
/*# sourceMappingURL=/cdn/shop/t/380/assets/snippet-variant-picker.css.map */
