//
// Checkboxes
// --------------------------------------------------

@mixin checkbox-variant($parent, $color) {
  #{$parent} label:before {
    border-color: $color;
  }

  @each $theme, $map in $themes {
    .#{$theme} {
      #{$parent} label:before {
        border-color: $color;
      }

      #{$parent} input[type="checkbox"]:checked,
      #{$parent} input[type="radio"]:checked {
        &:not(:disabled) {
          &:hover + label {
            &:before {
              border-color: darken($color, 5%);
              background-color: darken($color, 5%);
            }
          }
        }
      }
    }
  }

  #{$parent} input[type="checkbox"]:checked + label,
  #{$parent} input[type="radio"]:checked + label {
    &:before {
      background-color: $color;
    }
    &:after {
      color: $color-white;
    }
    &.checkbox-circle {
      &:after {
        background-color: $color-white;
      }
    }
  }

  #{$parent} input[type="checkbox"]:disabled:checked + label,
  #{$parent} input[type="radio"]:disabled:checked + label {
    &:before {
      background-color: $color;
    }
  }

  #{$parent}.checkbox-circle input[type="checkbox"]:checked + label,
  #{$parent}.checkbox-circle input[type="radio"]:checked + label {
    &:after {
      background-color: $color-white;
    }
  }
}

@mixin checkbox-variant-indeterminate($parent, $color) {
  #{$parent} input[type="checkbox"]:indeterminate + label,
  #{$parent} input[type="radio"]:indeterminate + label {
    &:before {
      background-color: $color;
      border-color: $color;
    }
    &:after {
      background-color: $color-white;
    }
  }
}

@mixin radio-variant($parent, $color) {
  #{$parent} input[type="radio"] {
    + label {
      &:before {
        border-color: $color;
      }
      &:after {
        background-color: $color;
      }
    }
    &:checked + label {
      &:before {
        border-color: $color;
        background-color: $color;
      }
      &:after {
        background-color: $color-white;
      }
    }
  }
}