#react-root{display:flex;column-gap:5rem;align-items:inherit;margin-bottom:1rem}#react-root>.pickerPanel{width:10rem}#react-root>.swatchPanel{flex:2 2 0}.colorPicker{margin-bottom:.5rem}.colorPicker label{font-weight:bold}.colorPicker .inputGroup{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%}.colorPicker .inputGroup input{position:relative;flex:1 1 auto;width:1%;min-width:0;outline:none}.colorPicker .inputGroup:focus-within,.colorPicker .inputGroup:focus-visible{box-shadow:0 .25rem .5rem .25rem #495057}.colorPicker .picker{position:relative}.colorPicker .swatch{width:2.25rem;height:100%;cursor:pointer;border:1px solid currentColor;border-left:0}.colorPicker .popover{position:absolute;top:0;left:calc(100% + 2px);border-radius:9px}.swatchPanel{display:flex;column-gap:.5rem;row-gap:.5rem;align-items:flex-start;align-content:flex-start;flex-wrap:wrap}.swatchPanel>*{flex:1 1 0px}.swatchPanel .swatch{min-width:20rem;border:1px solid currentColor;padding:.5rem}