.item {
  composes: paddingY300 from "../boxWhitespace.css";
  composes: flexGrow from "../Layout.css";
  background-color: var(--color-background-tableofcontents-item-default);
}

html:not([dir="rtl"]) .itemEndPadding {
  padding-right: var(--space-400);
}

html[dir="rtl"] .itemEndPadding {
  padding-left: var(--space-400);
}

.itemHover {
  background-color: var(--color-background-tableofcontents-item-hover);
}

html:not([dir="rtl"]) .nestingIndentation1 {
  padding-left: var(--space-300);
}

html:not([dir="rtl"]) .nestingIndentation2 {
  padding-left: var(--space-800);
}

html:not([dir="rtl"]) .nestingIndentation3 {
  padding-left: var(--space-1300);
}

html:not([dir="rtl"]) .nestingIndentation4 {
  padding-left: 72px;
}

html:not([dir="rtl"]) .nestingIndentation5 {
  padding-left: 92px;
}

html[dir="rtl"] .nestingIndentation1 {
  padding-right: var(--space-300);
}

html[dir="rtl"] .nestingIndentation2 {
  padding-right: var(--space-800);
}

html[dir="rtl"] .nestingIndentation3 {
  padding-right: var(--space-1300);
}

html[dir="rtl"] .nestingIndentation4 {
  padding-right: 72px;
}

html[dir="rtl"] .nestingIndentation5 {
  padding-right: 92px;
}

html:not([dir="rtl"]) .item {
  border-radius: 2px 8px 8px 2px;
}

html[dir="rtl"] .item {
  border-radius: 8px 2px 2px 8px;
}
