#page-container .accordion-button {
  align-items: center;
  background-color: inherit;
  background-image: none;
  border-radius: 0;
  box-shadow: none;
  color: var(--text-secondary);
  display: flex;
  font-size: var(--text-size-02);
  height: 56px;
  letter-spacing: -0.014px;
  line-height: var(--text-size-03);
  overflow-anchor: none;
  padding: 16px 8px;
  position: relative;
  text-align: left;
  width: 100%;
}

#page-container .accordion-button:not(.collapsed) {
  color: var(--text-primary);
}

#page-container .accordion-button::after {
  background-image: none;
  background-repeat: no-repeat;
  content: "\2304";
  flex-shrink: 0;
  float: left !important;
  font-size: 16px;
  font-weight: 600;
  height: 24px;
  margin-left: auto;
  transform: scaleX(1.3);
  transform-origin: center center;
  transition: transform 0.3s ease-in-out;
  width: auto;
}

#page-container .accordion-button:not(.collapsed)::after {
  background-position: left;
  font-size: 16px;
  font-weight: 600;
  transform: scaleX(1.3) rotate(180deg);
}

#page-container .accordion-header {
  font-size: var(--text-size-02);
}

#page-container .accordion {
  display: flex;
  flex-direction: column;
  margin-top: -10px;
  overflow-x: hidden;
}

#page-container .accordion-item-header {
  background-color: inherit;
  border: none;
  border-bottom: 1px solid var(--border-subtle-alpha-01);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-01);
  width: 100%;
}

#page-container .accordion-item-header:last-child {
  border-bottom: none;
}

#page-container .accordion-body {
  align-items: start;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-01);
  padding: 0;
  width: 100%;
}

.accordion-item-link {
  align-items: center;
  background: transparent;
  border: none;
  border-radius: 0;
  color: var(--text-secondary);
  display: flex;
  font-size: var(--text-size-02);
  height: 40px;
  line-height: var(--text-size-03);
  padding: var(--spacing-02);
  text-transform: none;
  width: 100%;
}

.accordion-item-link.active {
  background-color: var(--state-overlays-selected);
  color: var(--text-primary);
}

.accordion-item-link:hover {
  background-color: var(--state-overlays-selected-hover);
  color: var(--text-primary);
}

#page-container .accordion-button:hover {
  color: var(--text-primary);
}

.material-symbols-outlined {
  color: var(--text-secondary);
}

.nav-icon-tooltip {
  height: 24px;
}

.accordion-body .accordion-item-link:last-child {
  margin-bottom: var(--spacing-03);
}
