//
// Checkbox
//

@checkbox-unselected-color: contrast(@background-color, fade(@color-black, 30%), fade(@color-white, 20%));
@checkbox-selected-color: @color-tint;
@checkbox-indeterminate-color: @checkbox-selected-color;

@checkbox-disabled-text-color: fade(@text-color, 50%);

@checkbox-focus-box-shadow: inset 0 0 0 1px @button-background-color;
@checkbox-focus-border-radius: @control-border-radius;

.tox {
  .tox-checkbox {
    align-items: center;
    border-radius: @control-border-radius;
    cursor: pointer;
    display: flex;
    height: 36px;
    min-width: 36px;
  }

  .tox-checkbox__input {
    /* Hide from view but visible to screen readers */
    height: 1px;
    overflow: hidden;
    position: absolute;
    top: auto;
    width: 1px;
  }

  .tox-checkbox__icons {
    align-items: center;
    border-radius: @checkbox-focus-border-radius;
    box-shadow: @checkbox-unfocused-box-shadow;
    box-sizing: content-box;
    display: flex;
    height: @textfield-line-height;
    justify-content: center;
    padding: calc(@button-padding-y - @button-border-width);
    width: @textfield-line-height;

    .tox-checkbox-icon__unchecked svg {
      display: block;
      fill: @checkbox-unselected-color;
    }

    .tox-checkbox-icon__indeterminate svg {
      display: none;
      fill: @checkbox-indeterminate-color;
    }

    .tox-checkbox-icon__checked svg {
      display: none;
      fill: @checkbox-selected-color;
    }
  }

  .tox-checkbox__icon {
    //
  }

  .tox-checkbox--disabled {
    color: @checkbox-disabled-text-color;
    cursor: not-allowed;
  }

  .tox-checkbox--disabled .tox-checkbox__icons {
    .tox-checkbox-icon__checked svg {
      fill: @checkbox-disabled-text-color;
    }

    .tox-checkbox-icon__unchecked svg {
      fill: @checkbox-disabled-text-color;
    }

    .tox-checkbox-icon__indeterminate svg {
      fill: @checkbox-disabled-text-color;
    }
  }

  input.tox-checkbox__input:checked + .tox-checkbox__icons {
    .tox-checkbox-icon__unchecked svg {
      display: none;
    }

    .tox-checkbox-icon__checked svg {
      display: block;
    }
  }

  input.tox-checkbox__input:indeterminate + .tox-checkbox__icons {
    .tox-checkbox-icon__unchecked svg {
      display: none;
    }

    .tox-checkbox-icon__indeterminate svg {
      display: block;
    }
  }

  input.tox-checkbox__input:focus + .tox-checkbox__icons {
    border-radius: @checkbox-focus-border-radius;
    box-shadow: @checkbox-focus-box-shadow;
    padding: calc(@button-padding-y - @button-border-width);
  }
}

.tox:not([dir=rtl]) {
  .tox-checkbox__label {
    margin-left: @pad-xs;
  }

  .tox-checkbox__input {
    left: -10000px;
  }

  .tox-bar {
    .tox-checkbox {
      margin-left: @pad-xs;
    }
  }
}

// RTL
.tox[dir=rtl] {
  .tox-checkbox__label {
    margin-right: @pad-xs;
  }

  .tox-checkbox__input {
    right: -10000px;
  }

  .tox-bar {
    .tox-checkbox {
      margin-right: @pad-xs;
    }
  }
}
