// --------------------------------------------
// Check Base Mixin ---------------------------
// --------------------------------------------
@mixin check($type: check) {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  height: $checkbox-default-size;
  transition: $checkbox-transition;
  min-width: $checkbox-default-size;
  line-height: $checkbox-default-size - 1;

  &[disabled] label {
    cursor: not-allowed;
    color: $checkbox-label-disabled-color;
  }

  input {
    left: 0;
    opacity: 0;
    z-index: 1;
    bottom: -1px;
    cursor: pointer;
    position: absolute;
    width: $checkbox-default-size;
    height: $checkbox-default-size;

    @if ($type == radio) {
      border-radius: $radius-round;
    }

    @if ($type == check) {
      &:indeterminate + label {
        &::before {
          background: $checkbox-bg-checked;
          border: 1px solid $checkbox-checked-border-color;
        }

        &::after {
          top: 48%;
          left: 3px;
          width: 10px;
          content: "";
          height: 2px;
          position: absolute;
          background: $checkbox-checked-color;
          border-radius: $checkbox-radius;
        }
      }
    }

    &:checked + label::after,
    &:checked[disabled] + label::after {
      content: ' ';
      position: absolute;
      color: $checkbox-checked-color;

      @if ($type == radio) {
        top: 4px;
        left: 4px;
        width: 8px;
        height: 8px;
        display: table;
        border-radius: $radius-round;
        background-color: $checkbox-checked-color;
      } @else {
        top: 2px;
        left: 5px;
        width: 6px;
        height: 10px;
        border-top: 0;
        border-left: 0;
        display: table-cell;
        border-right: 2px solid;
        transform: rotate(45deg);
        border-bottom: 2px solid;
      }
    }

    &:checked + label::before {
      border-color: $checkbox-checked-border-color;
      background-color: $checkbox-bg-checked;
    }

    &[disabled] + label::before {
      cursor: not-allowed;
      background: $checkbox-bg-disabled;
      border-color: $checkbox-bd-disabled;
    }

    &:checked[disabled] {
      + label::before {
        cursor: not-allowed;
        // background: $checkbox-bg-checked-disabled;
        // border-color: $checkbox-bg-checked-disabled;
        opacity: .5;
      }

      + label::after {
        // color: $checkbox-checked-color-disabled;
        opacity: .5;
        @if ($type == radio) {
          // background: $checkbox-checked-color-disabled;
          opacity: .5;
        }
      }
    }
  }

  label {
    cursor: pointer;
    display: inherit;
    position: relative;
    font-size: $checkbox-label-font-size;
    font-weight: $checkbox-label-font-weight;

    &::before {
      left: 0;
      content: "\a0";
      position: relative;
      border: $checkbox-bd;
      display: inline-block;
      margin-right: $space-sm;
      width: $checkbox-default-size;
      height: $checkbox-default-size;
      background: $checkbox-bg-empty;
      transition: $checkbox-transition;

      @if ($type == radio) {
        border-radius: $radius-pill;
      } @else {
        border-radius: $checkbox-radius;
      }
    }

    &:empty::before {
      margin-right: $space-0;
    }
  }

  &:hover {
    label::before {
      border-color: $checkbox-bd-hover-color;
    }
  }
}


// --------------------------------------------
// Check Size Mixin ---------------------------
// --------------------------------------------
@mixin check-size($size:$checkbox-default-size, $type: check) {
  height: $size;
  min-width: $size;
  line-height: $size - 1;

  input {
    width: $size;
    height: $size;

    &:checked + label::after,
    &:checked[disabled] + label::after {
      @if ($type == radio) {
        top: round(calc($size / 4));
        left: round(calc($size / 4));
        width: round(calc($size / 2));
        height: round(calc($size / 2));
      } @else {
        top: round(calc($size / 6));
        left: round(calc($size / 3));
        width: round(calc($size / 3));
        height: round(calc($size / 2) + 2);
        @if $type == check and $size >= 26px {
          border-right: 3px solid;
          border-bottom: 3px solid;
        }
      }
    }
  }

  label {
    font-size: $size - 4;

    &:empty::before {
      margin-right: $space-0;
    }

    &::before {
      width: $size;
      height: $size;
      margin-right: round(calc($size / 3));
    }
  }
}


// --------------------------------------------
// Check Color Mixin --------------------------
// --------------------------------------------
@mixin check-color($bg: $checkbox-bg-checked, $type: check) {
  input {
    @if ($type == check) {
      &:checked + label::before {
        border-color: $bg;
      }

      &:checked + label::after {
        border-color: $bg;
        color: $bg;
      }

      &:indeterminate + label::before {
        background: $bg;
        border: 1px solid $bg;
      }
    } @else if ($type == radio) {
      &:checked + label::before {
        border-color: $bg;
        color: $bg;
      }

      &:checked + label::after {
        background-color: $bg;
      }
    }

    &:checked[disabled] + label {
      cursor: not-allowed;
      color: $checkbox-label-disabled-color;

      &::before {
        cursor: not-allowed;
        border-color: $checkbox-bg-checked-disabled;
        background-color: $checkbox-bg-checked-disabled;
      }
    }
  }
}