body {
  font-size: 0.875rem;
}

.sidebar {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 100; /* Behind the navbar */
  padding: 48px 0 0; /* Height of navbar */
  background-color: #f0e7ff;
}

@media (max-width: 767.98px) {
  /* .sidebar {
    top: 5rem;
  } */
  #titlePage {
    font-size: 1rem;
  }
}

.sidebar-sticky {
  height: calc(100vh - 48px);
  overflow-x: hidden;
  overflow-y: auto;
}

.sidebar .nav-link,
.nav-tabs .nav-link {
  color: #291751;
  background-color: #f0e7ff;
  transition: color 0.4s ease 0s, background-color 0.4s ease 0s;
}

.sidebar .nav-link:hover,
.sidebar .nav-link.active,
.nav-tabs .nav-link.active,
.nav-tabs .nav-link:hover {
  color: #fff;
  background-color: #462d71;
}

.sidebar-heading {
  font-size: 0.75rem;
}

header {
  background-color: #462d71 !important;
}

.navbar-brand {
  color: #fff;
  background-color: #462d71;
  box-shadow: none;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

a.navbar-brand:hover {
  color: #fad652;
  background-color: #462d71;
}

.navbar .navbar-toggler {
  top: 0.25rem;
  right: 1rem;
}

sup {
  color: red;
  font-weight: bold;
}

.swal2-html-container {
  padding: 0.5em !important;
}

.postcard {
  background: #fad652;
  background: linear-gradient(
    180deg,
    rgba(250, 214, 82, 1) 50%,
    rgba(71, 129, 88, 1) 50%
  );
  border-radius: 1rem 0 0 1rem;
}

.page-link {
  color: #462d71 !important;
  background-color: #f0e7ff !important;
}
.active>.page-link {
  color: #fff !important;
  background-color: #462d71 !important;
  border-color: #462d71 !important;
}
.disabled>.page-link {
  color: #5f5f5f !important;
  background-color: #d4d4d4 !important;
}

.modal-header,
.offcanvas-header {
  background-color: #462d71;
  color: #fff;
}

/* ------------------------- */
.btn-purple-xxl {
  color: #fff;
  background-color: #462d71;
  border-color: #462d71;
}
.btn-purple-xs {
  color: #462d71;
  background-color: #f0e7ff;
  border-color: #462d71;
}

.btn-purple-xxl:hover {
  color: #392064;
  background-color: #fff;
  border-color: #392064;
}
.btn-purple-xs:hover,
.btn-purple-xs:focus {
  color: #f0e7ff;
  background-color: #462d71;
  border-color: #462d71;
}

.bg-purple-xl {
  background-color: #715c93;
}
.bg-purple-lg {
  background-color: #b684d2;
}
.bg-purple-md {
  background-color: #e2d0ff;
}
.bg-purple-xs {
  background-color: #f0e7ff;
}


.text-purple-xxl {
  color: #462d71;
}
.text-purple-xl {
  color: #654a90;
}
.text-purple-lg {
  color: #b684d2;
}
.text-purple-md {
  color: #e2d0ff;
}
.text-purple-xs {
  color: #f0e7ff;
}