@import "../lib.less";
@import "./button-group.less";
@import (reference) "../grouped-button.less";

.@{veui-prefix}-check-button-group {
  position: relative;

  .@{veui-prefix}-button {
    &:extend(._veui-grouped-button all);
  }

  .@{veui-prefix}-button &-checkmark {
    .absolute(@dls-checkbox-icon-spacing-strong, @dls-checkbox-icon-spacing-strong, _, _);
    color: @dls-button-border-color-basic;
    border: @dls-checkbox-icon-size-strong / 2 solid transparent;
    .border-color(currentColor, currentColor, _, _);
    .veui-transition(border-color);

    & + .@{veui-prefix}-icon:last-child {
      margin-right: 0;
    }
  }

  .@{veui-prefix}-button-selected &-checkmark {
    color: @dls-checkbox-border-color-strong-checked;
  }

  .@{veui-prefix}-disabled &-checkmark {
    color: @dls-button-border-color-basic-disabled;
  }

  .@{veui-prefix}-button-selected.@{veui-prefix}-disabled &-checkmark {
    color: @dls-checkbox-border-color-strong-checked-disabled;
  }
}