.color-picker-panel[data-v-a4fa894a]{padding:12px}.color-picker-panel .color-picker-pallete[data-v-a4fa894a]{height:180px;position:relative;margin-bottom:8px;cursor:crosshair;touch-action:none}.color-picker-panel .color-picker-pallete .color-picker-pallete-layer[data-v-a4fa894a]{position:absolute;inset:0}.color-picker-panel .color-picker-pallete .pallete-layer-shadowed[data-v-a4fa894a]{box-shadow:inset 0 0 2px #0000003d}.color-picker-panel .color-picker-preview[data-v-a4fa894a]{display:flex}.color-picker-panel .color-picker-preview .color-picker-preview-sliders[data-v-a4fa894a]{flex:1 0 auto}.color-picker-panel .color-picker-preview .color-picker-preview-sliders .color-picker-slider[data-v-a4fa894a]{margin-bottom:8px;position:relative;cursor:pointer;touch-action:none}.color-picker-panel .color-picker-preview .color-picker-preview-sliders .color-picker-slider.slider-empty[data-v-a4fa894a]{cursor:default}.color-picker-panel .color-picker-preview .color-picker-preview-sliders .color-picker-slider[data-v-a4fa894a]:after{content:"";position:absolute;border-radius:inherit;inset:0;box-shadow:inset 0 0 2px #0000003d;pointer-events:none}.color-picker-panel .color-picker-preview .color-picker-preview-sliders .color-picker-slider .color-picker-checkboard[data-v-a4fa894a]{background:#fff;position:absolute;inset:0}.color-picker-panel .color-picker-preview .color-picker-preview-sliders .color-picker-slider .color-picker-checkboard[data-v-a4fa894a]:after{background-image:linear-gradient(45deg,#ddd 25%,#0000 25%),linear-gradient(-45deg,#ddd 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#ddd 75%),linear-gradient(-45deg,#0000 75%,#ddd 75%);background-size:12px 12px;background-position:0 0,0 6px,6px -6px,-6px 0px;background-repeat:repeat;content:"";position:absolute;inset:0}.color-picker-panel .color-picker-preview .color-picker-preview-sliders .color-picker-slider .color-picker-slider-image[data-v-a4fa894a]{position:absolute;inset:0}.color-picker-panel .color-picker-preview .color-picker-preview-circle[data-v-a4fa894a]{position:relative;height:30px;width:30px;margin:0 0 8px 6px;border-radius:50%;box-shadow:#00000026 0 0 0 1px inset;overflow:hidden}.color-picker-panel .color-picker-preview .color-picker-preview-circle .color-picker-circle-fill[data-v-a4fa894a]{display:block;width:30px;height:30px}.color-picker-panel .color-picker-preview .color-picker-preview-circle .color-picker-circle-input[data-v-a4fa894a]{position:absolute;top:0;left:0;width:30px;height:30px;opacity:0;z-index:1}.color-picker-panel .color-picker-handle[data-v-a4fa894a]{z-index:1;box-shadow:0 0 2px 0 var(--va-text-color-3);position:absolute;background-color:#fff;overflow:hidden}.color-picker-panel .color-picker-handle .color-picker-handle-fill[data-v-a4fa894a]{border:2px solid white}.color-picker-panel .color-picker-input[data-v-a4fa894a]{display:flex;align-items:center}.color-picker-panel .color-picker-input .color-picker-input-mode[data-v-a4fa894a]{width:72px;text-align:center}.color-picker-panel .color-picker-input .color-picker-input-group[data-v-a4fa894a]{display:inline-flex;width:100%;flex-wrap:nowrap;vertical-align:bottom}.color-picker-panel .color-picker-input .color-picker-input-group[data-v-a4fa894a] .input-wrap{flex-grow:1;flex-basis:0}.color-picker-panel .color-picker-input .color-picker-input-group[data-v-a4fa894a] .input-wrap:not(:first-child){margin-left:-1px}.color-picker-panel .color-picker-input .color-picker-input-group[data-v-a4fa894a] .input-wrap:not(:first-child) .input-container{border-top-left-radius:0;border-bottom-left-radius:0}.color-picker-panel .color-picker-input .color-picker-input-group[data-v-a4fa894a] .input-wrap:not(:last-child) .input-container{border-top-right-radius:0;border-bottom-right-radius:0}.color-picker-panel .color-picker-input .color-picker-input-group[data-v-a4fa894a] .input-wrap .input-container{padding:1px 4px}.color-picker-panel .color-picker-input .color-picker-input-group[data-v-a4fa894a] .input-wrap .input-item{text-align:center}.color-picker-panel .color-picker-swatches[data-v-a4fa894a]{display:flex;gap:8px;flex-wrap:wrap;position:relative;margin-top:10px}.color-picker-panel .color-picker-swatches .color-picker-swatch[data-v-a4fa894a]{width:18px;height:18px;background-image:linear-gradient(45deg,#ddd 25%,#0000 25%),linear-gradient(-45deg,#ddd 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#ddd 75%),linear-gradient(-45deg,#0000 75%,#ddd 75%);background-size:8px 8px;background-position:0px 0,0px 4px,4px -4px,-4px 0px;background-repeat:repeat}.color-picker-panel .color-picker-swatches .color-picker-swatch .color-picker-swatch-fill[data-v-a4fa894a]{position:relative;width:100%;height:100%;border-radius:3px;box-shadow:#00000026 0 0 0 1px inset;cursor:pointer}.color-picker-panel .color-picker-swatches .color-picker-swatch[data-v-a4fa894a]:focus{outline:none}.color-picker-panel .color-picker-swatches .color-picker-swatch:focus .color-picker-swatch-fill[data-v-a4fa894a]:after{position:absolute;inset:0;background:inherit;filter:blur(2px);content:""}.panel-with-actions[data-v-a4fa894a]{padding-bottom:8px}.color-picker-actions[data-v-a4fa894a]{display:flex;gap:8px;border-top:1px solid var(--va-border-split-color);padding:8px 12px;justify-content:flex-end}.color-picker-footer[data-v-a4fa894a]{border-top:1px solid var(--va-border-split-color);padding:8px 12px}.color-picker[data-v-a4fa894a]{display:inline-block;outline:none;font-size:14px}.color-picker-custom-trigger[data-v-a4fa894a]{display:inline-flex;outline:none}.color-picker-display[data-v-a4fa894a]{display:inline-block;width:100%;height:100%;border-radius:4px;position:relative;outline:none}.color-picker-display:not(.color-picker-disabled):hover .color-picker-wrap[data-v-a4fa894a]{border-color:var(--va-cp-color-picker-primary-color-hover, var(--va-primary-color-hover))}.color-picker-display:not(.color-picker-disabled):focus .color-picker-wrap[data-v-a4fa894a],.color-picker-display[aria-expanded=true] .color-picker-wrap[data-v-a4fa894a]{border-color:var(--va-cp-color-picker-primary-color, var(--va-primary-color));box-shadow:0 0 0 2px var(--color-picker-primary-shadow-color, var(--va-cp-color-picker-primary-bg-color, var(--va-primary-bg-color)))}.color-picker-display .color-picker-wrap[data-v-a4fa894a]{height:100%;cursor:pointer;border:1px solid var(--va-border-color);border-radius:4px;transition:all .2s cubic-bezier(.4,0,.2,1)}.color-picker-display .color-picker-wrap .color-picker-fill[data-v-a4fa894a]{position:absolute;inset:4px;display:flex;align-items:center;justify-content:center}.color-picker-display .color-picker-wrap .color-picker-fill .color-picker-checkboard[data-v-a4fa894a]{background:#fff;position:absolute;inset:0}.color-picker-display .color-picker-wrap .color-picker-fill .color-picker-checkboard[data-v-a4fa894a]:after{background-image:linear-gradient(45deg,#ddd 25%,#0000 25%),linear-gradient(-45deg,#ddd 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#ddd 75%),linear-gradient(-45deg,#0000 75%,#ddd 75%);background-size:calc(var(--color-picker-block-size) * 2) calc(var(--color-picker-block-size) * 2);background-position:0 0,0 var(--color-picker-block-size),var(--color-picker-block-size) calc(-1 * var(--color-picker-block-size)),calc(-1 * var(--color-picker-block-size)) 0px;background-repeat:repeat;content:"";position:absolute;inset:0}.color-picker-display .color-picker-wrap .color-picker-fill .color-picker-value[data-v-a4fa894a]{white-space:nowrap;position:relative;font-size:14px;line-height:1.71428571}.color-picker-small .color-picker-wrap .color-picker-fill[data-v-a4fa894a]{inset:3px}.color-picker-small .color-picker-wrap .color-picker-fill .color-picker-value[data-v-a4fa894a]{line-height:1.28571429}.color-picker-large .color-picker-wrap .color-picker-fill[data-v-a4fa894a]{inset:5px}.color-picker-large .color-picker-wrap .color-picker-fill .color-picker-value[data-v-a4fa894a]{font-size:16px;line-height:1.875}.color-picker-disabled[data-v-a4fa894a],.color-picker-disabled .color-picker-wrap[data-v-a4fa894a]{cursor:not-allowed}

.color-picker-panel-container{width:240px;padding:0;font-size:14px;color:var(--va-text-color-1);background-color:var(--va-bg-elevated-color);border-radius:4px;box-shadow:0 6px 16px 0 var(--va-shadow-color),0 3px 6px -4px #0000001f,0 9px 28px 8px #0000000d;outline:none}.color-picker-zoom-enter-active,.color-picker-zoom-leave-active{animation-duration:.2s;animation-fill-mode:both}.color-picker-zoom-enter-active{animation-name:colorPickerZoomIn;animation-timing-function:cubic-bezier(0,0,.2,1)}.color-picker-zoom-leave-active{animation-name:colorPickerZoomOut;animation-timing-function:cubic-bezier(.4,0,1,1)}.color-picker-zoom-enter-from,.color-picker-zoom-leave-to{opacity:0}@keyframes colorPickerZoomIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes colorPickerZoomOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.9)}}
