.color-swatch-label{display:inline-flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;margin-right:16px;margin-bottom:12px;transition:all .2s ease}.color-swatch-container{width:70px;height:70px;border:2px solid #E5E5E5;border-radius:10px;overflow:hidden;transition:all .3s ease;position:relative;background:#fff}.color-swatch-image{width:100%;height:100%;object-fit:cover;display:block}.color-swatch-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#f5f5f5;font-size:24px;font-weight:600;color:#666;text-transform:uppercase}.color-swatch-name{font-size:13px;color:#333;text-align:center;max-width:70px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}.color-variant-input:checked+.color-swatch-label .color-swatch-container{border-color:#7563c9!important;border-width:3px;background-color:#f4f1ff;box-shadow:inset 0 0 0 1px #7563c9,0 2px 8px #7563c940;transform:translateY(-2px)}.color-variant-input:checked+.color-swatch-label .color-swatch-name{color:#7563c9!important;font-weight:700}.color-swatch-label:hover .color-swatch-container{border-color:#7563c9;border-width:2px;transform:translateY(-2px);box-shadow:0 2px 6px #7563c933}.color-variant-input.disabled+.color-swatch-label{opacity:.4;cursor:not-allowed}.color-variant-input.disabled+.color-swatch-label .color-swatch-container{position:relative}.color-variant-input.disabled+.color-swatch-label .color-swatch-container:after{content:"";position:absolute;top:50%;left:-10%;right:-10%;height:2px;background-color:#e74c3c;transform:rotate(-45deg)}.color-variant-input{position:absolute;opacity:0;pointer-events:none}@keyframes selectBounce{0%,to{transform:translateY(-2px) scale(1)}50%{transform:translateY(-4px) scale(1.05)}}.color-variant-input:checked+.color-swatch-label .color-swatch-container{animation:selectBounce .3s ease}.product-form__input legend,.product-form__input .form__label,legend.form__label{font-weight:700!important;color:#000!important;font-size:15px!important}.product-form__input:has(.color-swatch-label),fieldset:has(.color-swatch-label){margin-bottom:4px!important;padding-bottom:0!important}.color-swatch-label{margin-bottom:0!important}.product-form__input+.product-form__input{margin-top:12px!important}
/*# sourceMappingURL=/cdn/shop/t/19/assets/custom-color-swatches.css.map */