@charset "UTF-8";.gradient-picker{display:flex;flex-direction:column;gap:1rem}.gradient-picker__preview{width:100%;height:var(--gradient-picker-preview-height, 120px);border-radius:var(--gradient-picker-border-radius, 8px)}.gradient-picker__slider{height:var(--gradient-picker-input-height, 36px);border-radius:var(--gradient-picker-border-radius, 8px);box-shadow:var(--gradient-picker-box-shadow, inset 0 0 .5px 1px rgba(255, 255, 255, .1), 0 0 0 1px rgba(20, 21, 26, .075), 0 .3px .4px rgba(20, 21, 26, .02), 0 .9px 1.5px rgba(20, 21, 26, .045), 0 3.5px 6px rgba(20, 21, 26, .09));cursor:crosshair;position:relative}.gradient-picker__slider-handler{height:calc(100% + 8px);position:absolute;left:var(--handler-position);width:16px;transform:translate(-50%,-4px);border:var(--gradient-picker-handler-border, solid 3px #3d3d3d);border-radius:var(--gradient-picker-border-radius, 8px);background:var(--handler-color);cursor:ew-resize}.gradient-picker__colors{display:flex;flex-direction:column;gap:1rem}.gradient-picker__colors-variation{order:var(--color-order);display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%}.gradient-picker__colors-picker{display:flex;gap:8px;align-items:center;width:100%;width:-moz-available;width:-webkit-fill-available}.gradient-picker__colors-picker input{width:100%}.gradient-picker__colors-remover{font-size:24px;font-weight:700;cursor:pointer}.gradient-picker__colors-remover:after{content:"✕";color:var(--gradient-picker-remover-color, #555)}.gradient-picker__colors-remover:hover:after{color:var(--gradient-picker-remover-color-hover, #e54040)}@media screen and (max-width: 768px){.gradient-picker__colors-position{width:30%}}.gradient-picker__colors-position input{margin:0;border:var(--gradient-picker-input-border, unset);box-shadow:var(--gradient-picker-box-shadow, inset 0 0 .5px 1px rgba(255, 255, 255, .1), 0 0 0 1px rgba(20, 21, 26, .075), 0 .3px .4px rgba(20, 21, 26, .02), 0 .9px 1.5px rgba(20, 21, 26, .045), 0 3.5px 6px rgba(20, 21, 26, .09));text-transform:capitalize;background-color:#fff;width:clamp(30%,100%,100%);min-width:80px}.gradient-picker__options{display:flex;gap:1rem}.gradient-picker input[type=color]{appearance:none;-moz-appearance:none;-webkit-appearance:none;padding:0;width:var(--gradient-picker-input-height, 36px);min-width:var(--gradient-picker-input-height, 36px);height:var(--gradient-picker-input-height, 36px);border:var(--gradient-picker-input-border, unset);border-radius:var(--gradient-picker-border-radius, 8px);box-shadow:var(--gradient-picker-box-shadow, inset 0 0 .5px 1px rgba(255, 255, 255, .1), 0 0 0 1px rgba(20, 21, 26, .075), 0 .3px .4px rgba(20, 21, 26, .02), 0 .9px 1.5px rgba(20, 21, 26, .045), 0 3.5px 6px rgba(20, 21, 26, .09));cursor:pointer}.gradient-picker input[type=color]::-webkit-color-swatch-wrapper{padding:0}.gradient-picker input[type=color]::-webkit-color-swatch{border:0;border-radius:var(--gradient-picker-border-radius, 8px)}.gradient-picker input[type=color]::-moz-color-swatch,.gradient-picker input[type=color]::-moz-focus-inner{border:0}.gradient-picker input[type=color]::-moz-focus-inner{padding:0}.gradient-picker input[type=text],.gradient-picker input[type=number]{height:var(--gradient-picker-input-height, 36px);padding:var(--gradient-picker-input-padding, .5rem);border-radius:var(--gradient-picker-border-radius, 8px);font-size:var(--gradient-picker-font-size, 14px);border:var(--gradient-picker-input-border, unset);box-shadow:var(--gradient-picker-box-shadow, inset 0 0 .5px 1px rgba(255, 255, 255, .1), 0 0 0 1px rgba(20, 21, 26, .075), 0 .3px .4px rgba(20, 21, 26, .02), 0 .9px 1.5px rgba(20, 21, 26, .045), 0 3.5px 6px rgba(20, 21, 26, .09));line-height:var(--gradient-picker-line-height, 36px);background-color:var(--gradient-picker-background-color, white);color:var(--gradient-picker-color, black)}.gradient-picker__select{margin:0;border:var(--gradient-picker-input-border, unset);box-shadow:var(--gradient-picker-box-shadow, inset 0 0 .5px 1px rgba(255, 255, 255, .1), 0 0 0 1px rgba(20, 21, 26, .075), 0 .3px .4px rgba(20, 21, 26, .02), 0 .9px 1.5px rgba(20, 21, 26, .045), 0 3.5px 6px rgba(20, 21, 26, .09));text-transform:capitalize;background-color:#fff;border-radius:var(--gradient-picker-border-radius, 8px);padding:var(--gradient-picker-input-padding, .5rem);width:100%;height:var(--gradient-picker-input-height, 36px);line-height:var(--gradient-picker-line-height, 36px);font-size:var(--gradient-picker-font-size, 14px);background-color:var(--gradient-picker-background-color, white);color:var(--gradient-picker-color, black)}.gradient-picker input:focus,.gradient-picker select:focus{outline:var(--gradient-picker-focus-outline, none);box-shadow:var(--gradient-picker-focus-box-shadow, 0 0 0 2px #005fcc);border-color:var(--gradient-picker-focus-border-color, #005fcc)}