.variant-image-picker{margin-top:20px}.variant-image-picker__title{font-size:18px;margin-bottom:20px}.variant-image-picker__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-bottom:20px}.variant-image-card{border:2px solid #dcdcdc;border-radius:12px;overflow:visible;cursor:pointer;transition:all .25s ease;background:#fff;position:relative}.variant-image-card.active{border-color:#000}.variant-image-card:hover{transform:translateY(-2px)}.variant-image-card img{width:100%;display:block;object-fit:cover;height:101px;border-radius:9px}.variant-image-card__name{display:block;padding:10px;text-align:center;font-size:14px;font-weight:600}.variant-size-popup{position:absolute;left:50%;bottom:calc(100% + 12px);transform:translate(-50%) translateY(10px);background:#fff;border-radius:14px;padding:10px;min-width:371px;box-shadow:0 10px 30px #0000001f;opacity:0;visibility:hidden;transition:all .25s ease;z-index:10;flex-direction:row;gap:8px;width:100%;display:flex}.variant-image-card:hover .variant-size-popup{opacity:1;visibility:visible;transform:translate(-50%) translateY(0)}.variant-size-option{border:1px solid #e5e5e5;background:#fff;padding:8px;border-radius:12px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:10px;text-align:left;flex-direction:column}.variant-size-option:hover{background:#f5f5f5;color:#000}.variant-size-option__image{width:52px!important;height:52px!important;object-fit:cover;border-radius:8px;flex-shrink:0}.variant-size-option__text{font-size:14px;line-height:1.2}.variant-size-option.active{border:1px solid #000;background:#fff;color:#000}.variant-size-option.active .variant-size-option__image{border:1px solid #000}@media screen and (max-width:990px){.variant-image-picker__grid{grid-template-columns:repeat(3,1fr)}}@media screen and (max-width:749px){.variant-image-picker__grid{grid-template-columns:repeat(3,1fr)}.variant-size-popup{min-width:170px}.variant-size-popup{flex-direction:column;display:flex}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/variant-image-picker.css.map */