@import 'settings';
@import '../input/mixins';
@import '../../tools/mixins/border-radius';
@import '../../tools/mixins/flex';
@import '../../tools/mixins/spacing-responsive';
@import '~@collab-ui/icons/scss/mixins';

@mixin checkbox-color(
  $border-color: null,
  $background-color: null,
  $background-color--disabled: null,
  $background-color--hover: null,
  $background-color--checked: null,
  $background-color--checked-hover: null,
  $label-color: null
) {
  .#{$checkbox__class}__input {
    // Base Checkbox - Not Checked
    + .#{$checkbox__class}__label {
      font-family: $input__font-family;
      color: $label-color;

      &:before {
        background-color: $background-color;
        border: 1px solid $border-color;
      }

      &:hover,
      &.hover {
        &:before {
          background-color: $background-color--hover;
        }
      }
    }

    &:focus,
    &.focus {
      + .#{$checkbox__class}__label {
        &:before {
          @include focus-styles;
        }
      }
    }
    /** Checked */
    &:checked,
    &:indeterminate,
    &.indeterminate {
      + .#{$checkbox__class}__label {
        &:before {
          background-color: $background-color--checked;
          border: none;
        }

        &:hover,
        &.hover {
          &:before {
            background-color: $background-color--checked-hover;
          }
        }
      }
    }
    /** Disabled Settings */
    &:disabled,
    &.disabled {
      + .#{$checkbox__class}__label {
        &:before {
          background-color: $background-color--disabled;
          border: none;
        }
      }
      /**  Disabled--Checked/Indeterminate */
      &:checked,
      &:indeterminate,
      &.indeterminate {
        + .#{$checkbox__class}__label {
          &:before {
            background-color: $background-color--checked;
            border: none;
          }

          &:hover,
          &.hover {
            &:before {
              background-color: $background-color--checked;
            }
          }
        }
      }
    }
  }
}