/* Study navigation: compact hierarchy and clearer progress cues for long question banks. */
.VPSidebar .nav {
  padding: 18px 12px 32px;
}

.VPSidebar .VPSidebarItem.level-0 {
  padding-bottom: 18px;
}

.VPSidebar .VPSidebarItem.level-0 > .item {
  margin: 0 4px 10px;
  padding: 0 10px 12px;
  border-bottom: 1px solid rgba(151, 125, 101, 0.2);
}

.VPSidebar .VPSidebarItem.level-0 > .item > .text {
  font-size: 16px;
  line-height: 1.45;
  letter-spacing: 0;
}

.VPSidebar .VPSidebarItem .item .link {
  min-height: 40px;
  margin: 2px 4px;
  border-radius: 8px;
  padding: 4px 10px;
}

.VPSidebar .VPSidebarItem.level-1 > .item > .link > .text {
  padding: 3px 0;
  line-height: 22px;
}

.VPSidebar .VPSidebarItem.level-1.collapsible > .item {
  margin: 7px 4px 2px;
  border: 1px solid transparent;
  border-radius: 8px;
}

.VPSidebar .VPSidebarItem.level-1.collapsible > .item:hover,
.VPSidebar .VPSidebarItem.level-1.collapsible:not(.collapsed) > .item {
  border-color: rgba(211, 157, 155, 0.24);
  background: rgba(255, 253, 249, 0.55);
}

.VPSidebar .VPSidebarItem.level-1.collapsible > .item .link {
  margin-right: 0;
  font-weight: 600;
}

.VPSidebar .VPSidebarItem.level-1.is-active > .item .link,
.VPSidebar .VPSidebarItem.level-2.is-active > .item .link {
  background: rgba(228, 177, 181, 0.2);
  box-shadow: inset 3px 0 var(--vp-c-brand-1);
}

.VPSidebar .VPSidebarItem.level-1.is-active > .item > .indicator,
.VPSidebar .VPSidebarItem.level-2.is-active > .item > .indicator {
  background-color: var(--vp-c-brand-1);
}

.VPSidebar .VPSidebarItem.level-1 .items {
  margin: 2px 10px 6px 14px;
  border-left-color: rgba(151, 125, 101, 0.24);
  padding-left: 10px;
}

.VPSidebar .VPSidebarItem .caret {
  width: 36px;
  height: 36px;
  margin-right: 0;
  border-radius: 8px;
}

.VPSidebar .VPSidebarItem.collapsible > .item:hover .caret,
.VPSidebar .VPSidebarItem.collapsible:not(.collapsed) > .item .caret {
  color: var(--vp-c-brand-2);
  background: rgba(224, 176, 177, 0.14);
}

.VPSidebar .VPSidebarItem .caret:focus-visible,
.VPSidebar .VPSidebarItem.collapsible > .item:focus-visible {
  outline: 2px solid rgba(185, 105, 132, 0.54);
  outline-offset: 2px;
}

.dark .VPSidebar .VPSidebarItem.level-1.collapsible > .item:hover,
.dark .VPSidebar .VPSidebarItem.level-1.collapsible:not(.collapsed) > .item {
  border-color: rgba(232, 160, 166, 0.24);
  background: rgba(255, 255, 255, 0.06);
}