:root {
  --aunt-checker-size: var(--aunt-font-size-xxl);
  --aunt-checker-border-width: var(--aunt-border-width-base);
  --aunt-checker-border-style: solid;
  --aunt-checker-border-color: var(--aunt-gray-5);
  --aunt-checker-square-radius: var(--aunt-border-radius-md);
  --aunt-checker-active-color: var(--aunt-brand-color);
  --aunt-checker-label-color: var(--aunt-text-color);
  --aunt-checker-label-font-size: var(--aunt-font-size-lg);
  --aunt-checker-label-margin: 0 0 0 var(--aunt-padding-xs);
  --aunt-checker-disabled-color: var(--aunt-gray-4);
  --aunt-checker-disabled-background-color: var(--aunt-gray-3);
}
.aunt-checker {
  display: flex;
  cursor: pointer;
  user-select: none;
  align-items: center;
}
.aunt-checker__icon {
  width: var(--aunt-checker-size);
  height: var(--aunt-checker-size);
  border-width: var(--aunt-checker-border-width);
  border-style: var(--aunt-checker-border-style);
  border-color: var(--aunt-checker-border-color);
  color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color, border-color, background-color var(--aunt-animation-duration-base);
}
.aunt-checker__icon--round {
  border-radius: var(--aunt-border-radius-max);
}
.aunt-checker__icon--square {
  border-radius: var(--aunt-checker-square-radius);
}
.aunt-checker__icon--active {
  border-color: var(--aunt-checker-active-color);
  background-color: var(--aunt-checker-active-color);
  color: var(--aunt-white-color);
}
.aunt-checker__label {
  font-size: var(--aunt-checker-label-font-size);
  margin: var(--aunt-checker-label-margin);
  color: var(--aunt-checker-label-color);
}
.aunt-checker--disabled {
  cursor: not-allowed;
}
.aunt-checker--disabled .aunt-checker__icon {
  background-color: var(--aunt-checker-disabled-background-color);
  border-color: var(--aunt-checker-disabled-color);
}
.aunt-checker--disabled .aunt-checker__icon--active {
  color: var(--aunt-checker-disabled-color);
}
.aunt-checker--disabled .aunt-checker__label {
  color: var(--aunt-checker-disabled-color);
}
.aunt-checker-group {
  display: flex;
  flex-wrap: wrap;
}
.aunt-checker-group--vertical {
  flex-direction: column;
}
.aunt-checker-group--horizontal {
  flex-direction: row;
  justify-content: space-between;
}
