.component-system-button{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;justify-content:center;align-items:center;width:32px;height:32px;transition:all .2s;display:flex}.component-system-button.round{background-color:transparent;border-radius:50%;margin-left:8px;transition:all .2s}.component-system-button.round.red svg #icon{fill:#e36060}.component-system-button.round svg{width:24px;height:24px;transition:all .2s}.component-system-button.round svg #icon{fill:#788fa5}.component-system-button.round.disabled,.component-system-button.round.disabled:hover{background:0 0}.component-system-button.round:hover,.component-system-button.round.hover{color:#607990;background-color:#ededed}.component-system-button.round:hover #icon,.component-system-button.round.hover #icon{fill:#607990}.component-system-button.round:hover:active,.component-system-button.round:hover.active,.component-system-button.round.hover:active,.component-system-button.round.hover.active{color:#1897d6}.component-system-button.round:hover:active #icon,.component-system-button.round:hover.active #icon,.component-system-button.round.hover:active #icon,.component-system-button.round.hover.active #icon{fill:#1897d6}.component-system-button.round:hover.red,.component-system-button.round.hover.red{background-color:#e36060}.component-system-button.round:hover.red svg #icon,.component-system-button.round.hover.red svg #icon{fill:#fff}.component-system-button.round:active,.component-system-button.round.active{color:#4cb2e6}.component-system-button.round:active #icon,.component-system-button.round.active #icon{fill:#4cb2e6}.component-system-button.round:active.red,.component-system-button.round.active.red{background-color:#a63535}.component-system-button.round:active.red svg #icon,.component-system-button.round.active.red svg #icon{fill:#fff}.component-system-button.round.active svg,.component-system-button.round.active #icon{fill:#4cb2e6}.component-system-button.square{color:#fff;background-color:#4cb2e6;border-radius:4px;width:auto;margin-left:17px;padding:4px 16px;font-size:13px}.component-system-button.square.toolbar-add-row-button>svg{margin-right:0}.component-system-button.square.toolbar-add-row-button .add-button-text{margin-left:6px}.component-system-button.square:hover{background-color:#54c5ff}.component-system-button.square:active{background-color:#1897d6}.component-system-button.square svg{margin-right:6px}.component-system-button.square svg path{fill:#fff}.component-system-button.square.disabled{background-color:#4cb2e6}.component-system-button.square.green{background-color:#6fb83b}.component-system-button.square.green:hover{background-color:#7ed143}.component-system-button.square.green:active{background-color:#5b9c2c}.component-system-button.disabled{pointer-events:none;opacity:.4}.dock-extra-content .component-system-button{width:24px;height:24px}.dock-extra-content .component-system-button>svg{width:16px;height:16px}.dock-extra-content .component-system-button.locked{pointer-events:none}.dock-top .component-system-button,.dock-bottom .component-system-button{margin:0 0 0 8px}.dock-left .component-system-button,.dock-right .component-system-button{margin:8px 0 0}