/**
 * @license
 * Copyright Akveo. All Rights Reserved.
 * Licensed under the MIT License. See License.txt in the project root for license information.
 */

@mixin nb-checkbox-theme() {
  nb-checkbox {
    .custom-checkbox {
      width: nb-theme(checkbox-width);
      height: nb-theme(checkbox-height);
      background-color: nb-theme(checkbox-background-color);
      border-color: nb-theme(checkbox-border-color);
      border-style: nb-theme(checkbox-border-style);
      border-width: nb-theme(checkbox-border-width);
      border-radius: nb-theme(checkbox-border-radius);
      position: relative;
    }

    .custom-checkbox.checked {
      background-color: nb-theme(checkbox-primary-checked-background-color);
      border-color: nb-theme(checkbox-primary-checked-border-color);

      nb-icon {
        color: nb-theme(checkbox-primary-checked-checkmark-color);
      }
    }

    .custom-checkbox.indeterminate {
      background-color: nb-theme(checkbox-primary-indeterminate-background-color);
      border-color: nb-theme(checkbox-primary-indeterminate-border-color);

      nb-icon {
        color: nb-theme(checkbox-primary-indeterminate-checkmark-color);
      }
    }

    .native-input:focus + .custom-checkbox {
      border-color: nb-theme(checkbox-primary-focus-border-color);
    }

    .custom-checkbox:hover {
      background-color: nb-theme(checkbox-primary-hover-background-color);
      border-color: nb-theme(checkbox-primary-hover-border-color);
    }

    .native-input:active + .custom-checkbox {
      background-color: nb-theme(checkbox-primary-active-background-color);
      border-color: nb-theme(checkbox-primary-active-border-color);
    }

    .native-input:focus + .custom-checkbox {
      box-shadow: 0 0 0 nb-theme(checkbox-outline-width) nb-theme(checkbox-outline-color);
    }

    .native-input:disabled {
      & + .custom-checkbox {
        background-color: nb-theme(checkbox-disabled-background-color);
        border-color: nb-theme(checkbox-disabled-border-color);

        nb-icon {
          color: nb-theme(checkbox-disabled-checkmark-color);
        }
      }
      & ~ .text {
        color: nb-theme(checkbox-disabled-text-color);
      }
    }

    nb-icon {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 50%;
    }

    .text {
      color: nb-theme(checkbox-text-color);
      font-family: nb-theme(checkbox-text-font-family);
      font-size: nb-theme(checkbox-text-font-size);
      font-weight: nb-theme(checkbox-text-font-weight);
      line-height: nb-theme(checkbox-text-line-height);
    }
  }

  @each $status in nb-get-statuses() {
    @include nb-checkbox-status($status);
  }
}

@mixin nb-checkbox-status($status: '') {
  nb-checkbox.status-#{$status} {
    .custom-checkbox {
      background-color: nb-theme(checkbox-#{$status}-background-color);
      border-color: nb-theme(checkbox-#{$status}-border-color);
    }

    .custom-checkbox.checked {
      background-color: nb-theme(checkbox-#{$status}-checked-background-color);
      border-color: nb-theme(checkbox-#{$status}-checked-border-color);

      nb-icon {
        color: nb-theme(checkbox-#{$status}-checked-checkmark-color);
      }
    }

    .custom-checkbox.indeterminate {
      background-color: nb-theme(checkbox-#{$status}-indeterminate-background-color);
      border-color: nb-theme(checkbox-#{$status}-indeterminate-border-color);

      nb-icon {
        color: nb-theme(checkbox-#{$status}-indeterminate-checkmark-color);
      }
    }

    .native-input:focus + .custom-checkbox {
      border-color: nb-theme(checkbox-#{$status}-focus-border-color);
    }

    .custom-checkbox:hover {
      background-color: nb-theme(checkbox-#{$status}-hover-background-color);
      border-color: nb-theme(checkbox-#{$status}-hover-border-color);
    }

    .native-input:active + .custom-checkbox {
      background-color: nb-theme(checkbox-#{$status}-active-background-color);
      border-color: nb-theme(checkbox-#{$status}-active-border-color);
    }

    .native-input:disabled {
      & + .custom-checkbox {
        background-color: nb-theme(checkbox-disabled-background-color);
        border-color: nb-theme(checkbox-disabled-border-color);

        nb-icon {
          color: nb-theme(checkbox-disabled-checkmark-color);
        }
      }
      & ~ .text {
        color: nb-theme(checkbox-disabled-text-color);
      }
    }
  }
}