.product__info-variants-with-color-picker{display:flex;flex-direction:column;gap:var(--sp-4)}.swatch--rainbow{aspect-ratio:1;display:block;width:40px;height:40px;border-radius:50%;background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red);box-shadow:inset 0 0 0 6px #fff;cursor:pointer}.custom-color-picker{display:flex}.custom-color-picker__opener{--swatch-size: clamp(var(--sp-10), 3.368vw, var(--sp-16));display:flex;align-items:center;justify-content:center;width:var(--swatch-size);height:auto;border:1px solid #F3F3F3;outline:none;background-color:#fafafa;border-radius:5px;overflow:hidden;transition:box-shadow .2s ease;aspect-ratio:var(--aspect-ratio)}.custom-color-picker__opener img{aspect-ratio:var(--aspect-ratio);object-fit:contain}.custom-color-picker__change{display:flex;justify-content:space-between;align-items:center;gap:16px;border:1px solid #f3f3f3;padding:12px 24px;border-radius:5px;background-color:#fafafa;width:100%;text-align:start}.custom-color-picker__change .custom-color-picker__change-text{text-decoration:underline;font-size:14px}.custom-color-picker__change:not(.show){display:none}.custom-color-picker__opener:hover,.custom-color-picker__opener.active{box-shadow:0 0 0 2px #000}.custom-color-picker__modal-wrapper{position:fixed;top:0;left:0;width:100%;height:100%;padding:12px;display:flex;align-items:center;justify-content:center;z-index:100;visibility:hidden;transition-property:visibility;transition-duration:.2s;transition-timing-function:ease}.custom-color-picker__modal{display:flex;flex-direction:column;opacity:0;visibility:hidden;transform:translateY(20px);position:relative;z-index:100;width:100%;max-width:690px;max-height:95vh;border-radius:16px;padding:16px;background-color:#fff;z-index:2;transition-property:visibility,opacity,transform;transition-duration:.2s;transition-timing-function:ease;overflow:hidden}.custom-color-picker__backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#000;opacity:0;visibility:hidden;pointer-events:none;z-index:1;transition-property:visibility,opacity;transition-duration:.2s;transition-timing-function:ease}.custom-color-picker__modal-wrapper.show{visibility:visible}.custom-color-picker__modal-wrapper.show .custom-color-picker__modal{opacity:1;visibility:visible;transform:translateY(0)}.custom-color-picker__modal-wrapper.show .custom-color-picker__backdrop{opacity:.3;visibility:visible;pointer-events:all}.custom-color-picker__modal-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.custom-color-picker__modal-title{font-weight:900}.custom-color-picker__modal-close{display:flex;align-items:center;justify-content:center;width:47px;height:47px;border:1px solid #F3F3F3;border-radius:50%;transition:background-color .3s ease}.custom-color-picker__modal-close:hover{background-color:#f3f3f3}.custom-color-picker__modal-body{display:flex;flex-direction:column;overflow:hidden}.custom-color-picker__modal-list{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;overflow:auto;margin-top:20px;padding-block:5px;padding-inline:5px}.custom-color-picker__modal-item{padding:8px 24px;white-space:nowrap}.custom-color-picker__modal-item.active{outline:1px solid #222222;outline-offset:2px}@media screen and (min-width:1280px){.custom-color-picker__modal-title{font-size:20px}.custom-color-picker__modal-list{grid-template-columns:repeat(4,1fr);margin-top:40px;padding-inline:20px}.custom-color-picker__modal-item{padding:16px 22px}}
/*# sourceMappingURL=/cdn/shop/t/23/assets/custom-color-picker.css.map */