:host {
  position: relative;
  box-sizing: border-box;
  font-feature-settings: "cv03", "cv04", "cv11";
}
:host *, :host *:before, :host *:after {
  box-sizing: inherit;
}

:host {
  display: block;
}

.sidebar {
  background: var(--sl-sidebar-background);
  flex-direction: column;
  height: 100%;
  min-height: 0;
  display: flex;
}

.sidebar__scroll {
  overflow-y: auto;
  flex-direction: column;
  flex: 1 1 0%;
  display: flex;
}

.sidebar:not(.sidebar--has-header) .sidebar__header,
.sidebar:not(.sidebar--has-footer) .sidebar__footer {
  display: none;
}

.sidebar__footer {
  border-top: 1px solid var(--sl-sidebar-footer-border-color);
  background-color: var(--sl-sidebar-footer-background);
}