.kn-jumpto-section {
  display: flex;
}

.kn-jumpto-content {
  flex: 1;
  overflow-y: auto;
  max-height: calc(95vh - 120px);
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.kn-jumpto-content section {
  display: flex;
  width: 100%;
  padding: var(--padding-base) var(--padding-xs);
  gap: 8px;
  flex-direction: column;
} */



.kn-jumpto-content::-webkit-scrollbar,
.jumpto-nav::-webkit-scrollbar {
  display: none;
}

.jumpto-nav {
  flex-shrink: 0;
  width: max-content;
  display: flex;
  flex-direction: column;
  padding: 8px;
  padding-right: 0;
}

.jumpto-nav a {
  padding: 8px 8px 8px 12px;
  border-radius: 9px;
  border: none;
  background: transparent;
  color: var(--kn-text-dark);
  font: 600 15px/1 var(--kn-font-primary);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.1s ease-out;
  text-transform: unset;
}

.jumpto-nav a:hover:not(.active) {
  background: var(--kn-primary-light);
}

.jumpto-nav a.active {
  background: var(--kn-primary);
  color: #fff;
}

@media (min-width: 769px) {
  .jumpto-nav a {
    position: relative;
    display: inline-block;
    clip-path: polygon(
      0% 0%,
      calc(100% - 13px) 0%,
      100% 50%,
      calc(100% - 13px) 100%,
      0% 100%
    );
    border-radius: 9px 0 0 9px;
    padding-right: 20px !important;
  }
}

@media (max-width: 768px) {
  .kn-jumpto-section {
    flex-direction: column;
  }

  .kn-jumpto-content {
    max-height: calc(95vh - 289px);
  }

  .jumpto-nav {
    width: 100%;
    flex-direction: row;
    overflow-x: auto;
    padding: 8px;
    border-bottom: 1px solid var(--kn-border-light);
  }

  .jumpto-nav a {
    white-space: nowrap;
    padding: 8px 10px;
    font-size: 15px;
    flex-shrink: 0;
    text-align: center;
    border-radius: 9px;
    line-height: normal;
  }
}