.o-spreadsheet {
  .o-color-picker-widget {
    display: flex;
    position: relative;
    align-items: center;
    height: 30px;

    .o-color-picker-button-style {
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 2px;
      padding: 3px;
      border-radius: 4px;
      cursor: pointer;
      &:not([disabled]):hover {
        background-color: var(--os-background-gray-color-hover);
      }
    }

    .o-color-picker-button {
      > div {
        height: 20px;
      }
      .o-colored-border {
        border-bottom: 4px solid;
      }
      &[disabled] {
        pointer-events: none;
        opacity: 0.3;
      }
    }
  }
}