.color-picker-property__helper{margin-block:calc(var(--spacing-0-5) * -1) var(--spacing-1);line-height:1.4}.color-picker-property__control{display:flex;align-items:center;gap:var(--spacing-1, .5rem);margin-block-start:var(--spacing-1)}.color-picker-property__trigger{display:inline-flex;align-items:center;gap:var(--spacing-2, 1rem);flex:1 1 auto;min-width:0;height:3.5rem;padding:0 var(--spacing-2, .75rem);font-family:inherit;font-size:var(--text-sm, .875rem);text-align:start;color:rgba(var(--text-color),1);background-color:rgba(var(--input-background),1);border:var(--input-border-width, 1px) solid rgba(var(--text-color),.2);border-radius:var(--input-border-radius, 0);cursor:pointer;transition:border-color .2s ease}.color-picker-property__trigger:hover{border-color:rgba(var(--text-color),.5)}.color-picker-property__trigger:focus-visible{outline:2px solid rgba(var(--text-color),1);outline-offset:2px}.color-picker-property__trigger-text{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.color-picker-property__trigger-icon{display:inline-flex;flex-shrink:0;color:rgba(var(--text-color),.5)}.color-picker-property__swatch{display:block;flex-shrink:0;width:2.5rem;height:2.5rem;border-radius:calc(var(--input-border-radius, 0) * .5);border:1px solid rgba(var(--text-color),.15);background-image:linear-gradient(45deg,#d4d4d4 25%,transparent 25%),linear-gradient(-45deg,#d4d4d4 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d4d4d4 75%),linear-gradient(-45deg,transparent 75%,#d4d4d4 75%);background-size:10px 10px;background-position:0 0,0 5px,5px -5px,-5px 0px}.color-picker-property__swatch[data-has-color=true]{background-image:none}.color-picker-property__reset{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:2rem;height:2rem;padding:0;border:0;background:transparent;color:rgba(var(--text-color),.6);cursor:pointer;border-radius:50%;transition:background-color .2s ease,color .2s ease}.color-picker-property__reset:hover{background-color:rgba(var(--text-color),.08);color:rgba(var(--text-color),1)}.color-picker-property__reset[hidden],.color-picker-property__popup[hidden]{display:none}.color-picker-property__popup{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:var(--spacing-3, 1rem)}.color-picker-property__backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background-color:#00000080;animation:color-picker-fade .18s ease}.color-picker-property__dialog{position:relative;width:100%;max-width:22rem;max-height:calc(100dvh - 2rem);overflow-y:auto;padding:var(--spacing-4, 1.25rem);background-color:rgb(var(--background, 255 255 255));color:rgba(var(--text-color),1);border-radius:min(var(--block-border-radius, 12px),20px);box-shadow:0 24px 60px #00000047;animation:color-picker-pop .2s ease}@keyframes color-picker-fade{0%{opacity:0}to{opacity:1}}@keyframes color-picker-pop{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.color-picker-property__dialog-header{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-2, 1rem);margin-block-end:var(--spacing-3, 1rem)}.color-picker-property__dialog-title{font-size:var(--text-base, 1rem);font-weight:600}.color-picker-property__close{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;margin:-.25rem -.5rem -.25rem 0;padding:0;border:0;background:transparent;color:rgba(var(--text-color),.6);cursor:pointer;border-radius:50%;transition:background-color .2s ease,color .2s ease}.color-picker-property__close:hover{background-color:rgba(var(--text-color),.08);color:rgba(var(--text-color),1)}.color-picker-property__preview{display:flex;align-items:flex-end;justify-content:flex-end;height:5.5rem;padding:var(--spacing-2, .75rem);margin-block-end:var(--spacing-3, 1rem);border-radius:12px;border:1px solid rgba(var(--text-color),.12);background-image:linear-gradient(45deg,#d4d4d4 25%,transparent 25%),linear-gradient(-45deg,#d4d4d4 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d4d4d4 75%),linear-gradient(-45deg,transparent 75%,#d4d4d4 75%);background-size:16px 16px;background-position:0 0,0 8px,8px -8px,-8px 0px}.color-picker-property__preview-hex{padding:.15rem .5rem;font-size:var(--text-sm, .875rem);font-weight:600;letter-spacing:.04em;border-radius:6px;background-color:#ffffffd9;color:#1a1a1a;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.color-picker-property__sv{position:relative;width:100%;height:9rem;margin-block-end:var(--spacing-3, 1rem);border-radius:10px;cursor:crosshair;touch-action:none;background-image:linear-gradient(to top,#000,#0000),linear-gradient(to right,#fff,#fff0)}.color-picker-property__sv:focus-visible{outline:2px solid rgba(var(--text-color),1);outline-offset:2px}.color-picker-property__sv-thumb{position:absolute;top:0;left:0;width:18px;height:18px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #0006;transform:translate(-50%,-50%);pointer-events:none}.color-picker-property__hue{position:relative;width:100%;height:1rem;margin-block-end:var(--spacing-3, 1rem);border-radius:999px;cursor:pointer;touch-action:none;background:linear-gradient(to right,red,#ff0 17%,#0f0 33%,#0ff,#00f 67%,#f0f 83%,red)}.color-picker-property__hue:focus-visible{outline:2px solid rgba(var(--text-color),1);outline-offset:2px}.color-picker-property__hue-thumb{position:absolute;top:50%;left:0;width:18px;height:18px;border-radius:50%;background-color:#fff;border:2px solid #fff;box-shadow:0 0 0 1px #0006,0 1px 3px #0000004d;transform:translate(-50%,-50%);pointer-events:none}.color-picker-property__hex-row{display:flex;align-items:center;gap:var(--spacing-1-5, .75rem)}.color-picker-property__hex{flex:1 1 auto;min-width:0;height:2.75rem;padding:0 var(--spacing-1-5, .75rem);font-family:inherit;font-size:var(--text-sm, .875rem);letter-spacing:.04em;text-transform:uppercase;border:var(--input-border-width, 1px) solid rgba(var(--text-color),.2);border-radius:var(--input-border-radius, 0);background-color:rgba(var(--input-background),1);color:rgba(var(--text-color),1)}.color-picker-property__hex::placeholder{color:rgba(var(--text-color),.4);text-transform:none;letter-spacing:0}.color-picker-property__hex:focus{outline:2px solid rgba(var(--text-color),1);outline-offset:1px;border-color:rgba(var(--text-color),1)}.color-picker-property__hex[aria-invalid=true]{border-color:#c20b5a;color:#c20b5a}.color-picker-property__apply{flex-shrink:0;height:2.75rem;padding:0 var(--spacing-3, 1.25rem);font-family:inherit;font-size:var(--text-sm, .875rem);font-weight:600;color:rgb(var(--primary-button-text-color, 255 255 255));background-color:rgb(var(--primary-button-background, 0 0 0));border:0;border-radius:var(--button-border-radius, 0);cursor:pointer;transition:opacity .2s ease}.color-picker-property__apply:hover{opacity:.85}body.color-picker-open{overflow:hidden}
/*# sourceMappingURL=/cdn/shop/t/12/assets/color-picker.css.map */