.rift-variant-option--media{--rift-variant-media-effective-gap: var(--rift-variant-media-gap);display:block;width:100%}.rift-variant-option-media__grid{display:grid;grid-template-columns:repeat(var(--rift-variant-media-columns-mobile),minmax(0,1fr));gap:var(--rift-variant-media-effective-gap);width:100%}@media screen and (max-width:749px){.rift-variant-option--media-columns-mobile-5{--rift-variant-media-effective-gap: min(var(--rift-variant-media-gap), 6px)}.rift-variant-option--media-columns-mobile-6{--rift-variant-media-effective-gap: min(var(--rift-variant-media-gap), 4px)}}.variant-picker .rift-variant-option--media .rift-variant-option-media__label{position:relative;display:grid;grid-template-rows:auto;align-content:start;min-width:0;min-height:44px;padding:0;border:var(--options-border-width) solid var(--color-variant-border);border-radius:var(--options-border-radius);overflow:visible;white-space:normal;background-color:var(--color-variant-background);color:var(--color-variant-text);box-sizing:border-box}.variant-picker .rift-variant-option--media .rift-variant-option-media__label:before,.variant-picker .rift-variant-option--media .rift-variant-option-media__label:after{content:none}.rift-variant-option-media__frame{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:var(--rift-variant-media-aspect-ratio);overflow:hidden;border-radius:max(0px,calc(var(--options-border-radius) - var(--options-border-width)));background-color:rgb(var(--color-foreground-rgb) / .04)}.rift-variant-option--media-below_image .rift-variant-option-media__frame{border-end-start-radius:0;border-end-end-radius:0}.rift-variant-option-media__image,.rift-variant-option-media__image-element{display:block;width:100%;height:100%}.rift-variant-option-media__image-element{object-fit:var(--rift-variant-media-fit);object-position:center}.rift-variant-option-media__placeholder{max-width:100%;padding:var(--padding-sm);color:var(--color-variant-text);font-size:var(--font-size--xs);line-height:1.3;text-align:center;overflow-wrap:anywhere}.rift-variant-option-media__tooltip{--rift-variant-tooltip-background: rgb(var(--color-foreground-rgb) / var(--opacity-85));--rift-variant-tooltip-shift-inline: 0px;position:absolute;z-index:10;inset-block-end:calc(100% + 7px);left:50%;width:max-content;max-width:min(18rem,calc(100vw - 24px));padding:6px 9px;border-radius:var(--rift-brand-corner-radius, var(--style-border-radius-popover));background-color:var(--rift-variant-tooltip-background);color:var(--color-background);font-size:var(--font-size--xs);line-height:1.35;text-align:start;white-space:normal;overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto;opacity:0;visibility:hidden;pointer-events:none;transform:translate(calc(-50% + var(--rift-variant-tooltip-shift-inline)),4px)}.rift-variant-option-media__tooltip:after{position:absolute;inset-block-start:100%;left:clamp(10px,calc(50% - var(--rift-variant-tooltip-shift-inline)),calc(100% - 10px));width:0;height:0;border-style:solid;border-width:7px 7px 0;border-color:var(--rift-variant-tooltip-background) transparent transparent;content:"";transform:translate(-50%)}.rift-variant-option-media__selected-indicator{position:absolute;z-index:4;inset-block-start:0;inset-inline-end:0;display:grid;place-items:center;width:16px;height:16px;border:0;border-radius:0;background-color:var(--color-selected-variant-background);box-shadow:inset 0 0 0 1px var(--color-selected-variant-border);color:var(--color-selected-variant-text);line-height:0;opacity:0;visibility:hidden;pointer-events:none}.rift-variant-option-media__selected-indicator .icon-checkmark{display:block;width:10px;height:10px;margin:0;--icon-stroke-width: 2px;transform:translateY(-.5px)}.rift-variant-option-media__caption{display:grid;place-items:center;min-height:44px;padding:var(--padding-xs) var(--padding-sm);color:inherit;font-size:var(--font-size--xs);line-height:1.3;text-align:center;overflow-wrap:anywhere}.rift-variant-option-media__caption--placeholder:after{content:"\a0"}.variant-picker .rift-variant-option--media .rift-variant-option-media__label:has(:checked){border-width:max(2px,var(--options-border-width));border-color:var(--color-selected-variant-border);background-color:var(--color-variant-background);color:var(--color-variant-text)}.variant-picker .rift-variant-option--media .rift-variant-option-media__label:has(:checked) .rift-variant-option-media__selected-indicator{opacity:1;visibility:visible}.variant-picker .rift-variant-option--media .rift-variant-option-media__label:not([data-rift-tooltip-suppressed]):has(input:focus-visible) .rift-variant-option-media__tooltip,.variant-picker .rift-variant-option--media .rift-variant-option-media__label[data-rift-tooltip-open]:not([data-rift-tooltip-suppressed]) .rift-variant-option-media__tooltip{opacity:1;visibility:visible;transform:translate(calc(-50% + var(--rift-variant-tooltip-shift-inline)))}.variant-picker .rift-variant-option--media .rift-variant-option-media__label:has(:focus-visible){border-color:var(--color-selected-variant-border);outline:var(--focus-outline-width) solid var(--color-foreground);outline-offset:var(--focus-outline-offset)}.variant-picker .rift-variant-option--media .rift-variant-option-media__label:has([data-option-available=false]){border-width:var(--options-border-width)}.variant-picker .rift-variant-option--media .rift-variant-option-media__label:has([data-option-available=false]) :is(.rift-variant-option-media__image-element,.rift-variant-option-media__placeholder){opacity:var(--opacity-60)}.variant-picker .rift-variant-option--media .rift-variant-option-media__label:has([data-option-available=false]):has(:checked){border-width:max(2px,var(--options-border-width));background-color:var(--color-variant-background)}@media(hover:hover){.variant-picker .rift-variant-option--media .rift-variant-option-media__label:hover{border-color:var(--color-variant-hover-border);background-color:var(--color-variant-hover-background);color:var(--color-variant-hover-text)}.variant-picker .rift-variant-option--media .rift-variant-option-media__label:has(:checked):hover{border-color:var(--color-selected-variant-hover-border);background-color:var(--color-variant-background);color:var(--color-variant-text)}.variant-picker .rift-variant-option--media .rift-variant-option-media__label:not([data-rift-tooltip-suppressed]):hover .rift-variant-option-media__tooltip{opacity:1;visibility:visible;transform:translate(calc(-50% + var(--rift-variant-tooltip-shift-inline)))}}@media screen and (min-width:750px){.rift-variant-option--media{--rift-variant-media-effective-gap: var(--rift-variant-media-gap)}.rift-variant-option--media-columns-desktop-7{--rift-variant-media-effective-gap: min(var(--rift-variant-media-gap), 6px)}.rift-variant-option--media-columns-desktop-8{--rift-variant-media-effective-gap: min(var(--rift-variant-media-gap), 4px)}.rift-variant-option-media__grid{grid-template-columns:repeat(var(--rift-variant-media-columns-desktop),minmax(0,1fr))}}@media(prefers-reduced-motion:no-preference){.variant-picker .rift-variant-option--media .rift-variant-option-media__label{transition:border-color var(--animation-speed) var(--animation-easing),background-color var(--animation-speed) var(--animation-easing),color var(--animation-speed) var(--animation-easing)}.rift-variant-option-media__tooltip,.rift-variant-option-media__selected-indicator{transition:opacity var(--animation-speed) var(--animation-easing),transform var(--animation-speed) var(--animation-easing),visibility var(--animation-speed) var(--animation-easing)}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/rift-variant-option-media.css.map */