body {
  background-color: #f9fbfd;
  color: #293452;
  font-family: "Karla", sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  margin: 0;
  min-width: 344px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.sidebar {
  position: sticky;
  top: 0;
  height: 90vh;
  overflow-y: auto;
}

.content-section {
  scroll-margin-top: 20px;
}

.panel input {
  width: 140px;
  display: inline-block;
}

.alert {
  padding: 15px;
  border-left-width: 5px;
  border-left-style: solid;
  border-left-color: transparent;
  margin-bottom: 15px;
}

.alert-danger {
  background-color: #dfa5b3;
  border-left-color: #ec1a4f;
  --bs-alert-border-color: transparent;
}

.alert-primary {
  background-color: #cdc8e1;
  border-left-color: #f56ef5;
  --bs-alert-border-color: transparent;
}

.alert-secondary {
  background-color: #e6d7cd;
  border-left-color: #ff9b69;
  --bs-alert-border-color: transparent;
}

.alert-info {
  background-color: #e6e1c8;
  border-left-color: #ffd200;
  --bs-alert-border-color: transparent;
}

code {
  color: #664d03;
  background-color: #e6e1c8;
  border-left-color: #ffd200;
  border-left-width: 5px;
  border-left-style: solid;
  padding: 0.2rem 0.5rem;
  border-radius: 3px;
  display: inline-block;
}

h1,
h2,
h3,
h4,
h5,
h6,
.header__title {
  font-family: "Archia", sans-serif;
}

.button {
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-align: center;
  align-items: center;
}
.button svg {
  width: 12px;
  height: 12px;
  margin-left: 15px;
}
.button svg polygon {
  fill: white;
}
.flex-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.list-link {
  padding: 0.1875rem 0.5rem;
  margin-top: 0.25rem;
  margin-left: 0.25rem;
  border-radius: var(--bs-border-radius);
}
.list-link-0.btn-active,
.list-link-0:hover {
  color: #ffffff;
  background-color: #f56ef5;
}
.list-link-1.btn-active,
.list-link-1:hover {
  color: #ffffff;
  background-color: #ff9b69;
}
.list-link-2.btn-active,
.list-link-2:hover {
  color: #ffffff;
  background-color: #ffd200;
}
.list-link-2.btn-active,
.list-link-2:hover {
  color: #ffffff;
  background-color: #00e65f;
}