:host {
  display: block;
}

.pl-form-field {
  position: relative;
}

.pl-form-field--checkbox .pl-form-field__label {
  position: relative;
  cursor: pointer;
  color: #212121;
  font-size: 14px;
  line-height: 1.28;
  margin-left: 24px;
  vertical-align: middle;
}

.pl-form-field--checkbox .pl-form-field__label::before {
  content: '';
  position: absolute;
  top: 50%;
  left: -24px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  background-color: #fafafa;
  border: 1px solid #727272;
  padding: 7px;
  border-radius: 3px;
  display: inline-block;
}

.pl-form-field--checkbox .pl-form-field__input {
  position: absolute;
  width: 1px;
  height: 1px;
  clip: rect(0, 0, 0, 0);
}

.pl-form-field--checkbox .pl-form-field__input:focus ~ .pl-form-field__label::before {
  box-shadow: 0 0 2px 4px rgba(77, 190, 255, 0.75);
  border-radius: 3px;
}

.pl-form-field--checkbox .pl-form-field__input:checked ~ .pl-form-field__label::after {
  content: '';
  position: absolute;
  top: 50%;
  left: -24px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  color: white;
  width: 16px;
  height: 16px;
  border-radius: 3px;
  background-color: #1774e5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='white' fill-rule='evenodd' d='M11.75 1.413L5.177 7.758A.87.87 0 0 1 4.57 8a.87.87 0 0 1-.606-.242L.251 4.17A.813.813 0 0 1 0 3.586c0-.457.384-.827.857-.827A.87.87 0 0 1 1.463 3l3.108 3.001 5.966-5.76A.871.871 0 0 1 11.143 0c.473 0 .857.37.857.828a.813.813 0 0 1-.25.585'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 2px 4px;
  background-size: 79%;
}

.pl-form-field--checkbox .pl-form-field__input:indeterminate ~ .pl-form-field__label::after {
  content: '';
  position: absolute;
  top: 50%;
  left: -21px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 10px;
  height: 2px;
  border-radius: 1px;
  background-color: white;
  background-image: none;
}

.pl-form-field--checkbox .pl-form-field__input:indeterminate ~ .pl-form-field__label::before {
  background-color: #1774e5;
}

.pl-form-field--checkbox .pl-form-field__input:disabled ~ .pl-form-field__label {
  color: #b6b6b6;
  cursor: default;
  /* disabling the max-nesting-depth property for technical limitation */
  /* stylelint-disable-next-line max-nesting-depth */
}

.pl-form-field--checkbox .pl-form-field__input.readonly:disabled ~ .pl-form-field__label {
  color: #212121;
  cursor: default;
  /* disabling the max-nesting-depth property for technical limitation */
  /* stylelint-disable-next-line max-nesting-depth */
}

.pl-form-field--checkbox .pl-form-field__input:disabled ~ .pl-form-field__label::before {
  border-color: #b6b6b6;
  border-radius: 2px;
  background-color: #f4f4f4;
}
