@use '../../../styles';
@use '../../../themes/defaults';

.jse-color-picker-button {
  font-size: defaults.$font-size-mono;

  width: defaults.$color-picker-button-size;
  height: defaults.$color-picker-button-size;
  box-sizing: border-box;
  padding: 0;
  margin: 2px 0 0 styles.$padding-half;
  display: inline-flex;
  vertical-align: top;

  border: 1px solid defaults.$text-color;
  border-radius: 2px;
  background: inherit;
  outline: none;
}

.jse-color-picker-button:not(.jse-readonly) {
  cursor: pointer;
}