:host {
  display: block;
}

.checkbox-group-container {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.group-label {
  font-weight: 500;
  margin-bottom: 0.25rem;
}
.group-label .required {
  color: var(--nylas-error);
  margin-left: 0.25rem;
}

.checkbox-list {
  display: flex;
  gap: 16px;
}
.checkbox-list.vertical {
  flex-direction: column;
}
.checkbox-list.horizontal {
  flex-direction: row;
  align-items: center;
}
.checkbox-list checkbox-component {
  width: max-content;
}
.checkbox-list checkbox-component::part(checkbox-label-span) {
  width: inherit;
  margin-left: 24px;
}

.error {
  color: var(--nylas-error);
  font-size: 0.875rem;
  margin-top: 0.25rem;
}