@radix-ui/themes/src/components/checkbox-group.css

[](https://radix-ui.com/themes)

.rt-CheckboxGroupRoot {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}

.rt-CheckboxGroupItem {
  display: flex;
  gap: 0.5em;

  /* Make sure whitespace to the right of the text is not clickable */
  width: fit-content;
}

.rt-CheckboxGroupItemCheckbox {
  &:where(:focus-visible) {
    &::before {
      outline: 2px solid var(--focus-8);
      outline-offset: 2px;
    }
  }

  &:where(:disabled) {
    cursor: var(--cursor-disabled);

    &::before {
      background-color: var(--gray-a3);
    }
  }
}

.rt-CheckboxGroupItemInner {
  /* Make layouts with text truncation possible */
  min-width: 0;
}