.ads-Checkbox-LabelText--product {
  @apply text-gray-800;
}

.ads-Checkbox-Box--product {
  @apply bg-gray-100
         border-gray-600
         duration-150;

  transition-property: background-color, border-color, opacity;
}

.ads-Checkbox-Box--product.ads-Checkbox-Box--checked,
.ads-Checkbox-Box--product.ads-Checkbox-Box--checked.ads-Checkbox-Box--brandGreen {
  @apply bg-brandGreen-400
         border-brandGreen-400;
}

.ads-Checkbox-Box--product.ads-Checkbox-Box--checked.ads-Checkbox-Box--blue {
  @apply bg-blue-400
         border-blue-400;
}

.ads-Checkbox-Check--product {
  @apply text-white;
}

/* Disabled */
.ads-Checkbox.is-disabled .ads-Checkbox-LabelText--product {
  @apply text-gray-600;
}

.ads-Checkbox.is-disabled .ads-Checkbox-Box--product {
  @apply border-gray-400
    duration-150;
}

.ads-Checkbox.is-disabled .ads-Checkbox-Box--product.ads-Checkbox-Box--checked,
.ads-Checkbox.is-disabled
  .ads-Checkbox-Box--product.ads-Checkbox-Box--checked.ads-Checkbox-Box--brandGreen {
  @apply border-brandGreen-400 opacity-50;
}

.ads-Checkbox.is-disabled
  .ads-Checkbox-Box--product.ads-Checkbox-Box--checked.ads-Checkbox-Box--blue {
  @apply border-blue-400 opacity-50;
}