//
// Toolbar split button
//

@toolbar-split-button-chevron-touch-padding: 4px;

.tox {
  .tox-split-button {
    border: 0;
    border-radius: @toolbar-button-border-radius;
    box-sizing: border-box;
    display: flex;
    margin: (@toolbar-button-spacing-y + 1px) @toolbar-button-spacing-x @toolbar-button-spacing-y 0;
    overflow: hidden;
  }

  .tox-split-button:hover {
    box-shadow: 0 0 0 1px @toolbar-button-hover-background-color inset;
  }

  .tox-split-button:focus {
    background: @toolbar-button-focus-background-color;
    box-shadow: @toolbar-button-focus-box-shadow;
    color: @toolbar-button-focus-text-color;
  }

  .tox-split-button > * {
    border-radius: 0;
  }

  .tox-split-button__chevron {
    width: @toolbar-button-chevron-width;
  }

  .tox-split-button__chevron svg {
    fill: @toolbar-button-chevron-color;
  }

  .tox-split-button .tox-tbtn {
    margin: 0;
  }

  .tox-split-button.tox-tbtn--disabled:hover,
  .tox-split-button.tox-tbtn--disabled:focus,
  .tox-split-button.tox-tbtn--disabled .tox-tbtn:hover,
  .tox-split-button.tox-tbtn--disabled .tox-tbtn:focus {
    background: @toolbar-button-disabled-background-color;
    box-shadow: @toolbar-button-disabled-box-shadow;
    color: @toolbar-button-disabled-text-color;
  }

  // Increase the chevron size and decrease the button size on touch devices
  &.tox-platform-touch {
    .tox-split-button .tox-tbtn--select {
      padding: 0 (@toolbar-button-select-padding - @toolbar-split-button-chevron-touch-padding);
    }

    .tox-split-button .tox-tbtn:not(.tox-tbtn--select):first-child {
      width: @toolbar-button-width - @toolbar-split-button-chevron-touch-padding;
    }

    .tox-split-button__chevron {
      width: @toolbar-button-chevron-width + @toolbar-split-button-chevron-touch-padding;
    }
  }
}