/*#region Topbar (min-width: 801px)*/
.topbar {
  min-width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  top: 0;
}
@media (max-width: 800px) {
  .topbar {
    display: none;
    min-width: 0px !important;
    min-width: 0px !important;
    min-height: 0px !important;
    max-height: 0px !important;
  }
}
.topbar > .sidebar-toggler {
  display: none;
}
.topbar .primary-top-bar .nav-link {
  flex-wrap: nowrap;
  font-family: poppins;
  font-size: 13px;
}
.topbar .primary-top-bar {
  margin: 0;
  padding: 0;
  background-color: #3A3465;
  min-width: 100%;
  min-height: 60px;
  max-height: 60px;
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-start;
  gap: 3em;
  align-items: center;
  padding-inline-end: 5em;
  position: relative;
  z-index: 100;
}
.topbar .primary-top-bar .nav-link {
  font-size: 12pt;
}
.topbar .secondary-top-bar {
  min-height: 7em;
  max-height: 7em;
  background-color: #fff;
  min-width: 100%;
  box-shadow: rgba(28, 55, 90, 0.16) 0 2px 4px 1px inset, rgba(28, 52, 84, 0.26) 0px 3px 12px 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 100;
}
.topbar .secondary-top-bar .nav-link {
  font-weight: 500;
  font-size: 16pt;
  font-family: poppins-medium;
  flex-wrap: nowrap;
  margin-inline: 2rem;
}
.topbar .logo > img {
  min-height: 5.5em !important;
  max-height: 5.5em !important;
}

/*#endregion*/
.sidebar-wrapper {
  display: none;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  transition: background-color ease 0.6s;
}
@media (max-width: 800px) {
  .sidebar-wrapper {
    display: inline-flex;
  }
}

.sidebar-backdrop {
  z-index: 16;
}
.sidebar-backdrop:has(.sidebar-expand) {
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.2666666667);
  overflow: hidden;
  transition: background-color ease 0.6s;
}

.top-sidebar {
  min-height: 5em;
  max-height: 5em;
  display: none;
  z-index: 15;
}
@media (max-width: 800px) {
  .top-sidebar {
    display: inherit;
    position: fixed;
    top: 0;
    left: 0;
    min-width: 100vw;
    max-width: 100vw;
    background-color: white;
    box-shadow: rgba(28, 55, 90, 0.16) 0 2px 4px 1px inset, rgba(28, 52, 84, 0.26) 0px 2px 12px 1px;
  }
}
.top-sidebar > .sidebar-toggler {
  display: none;
}
@media (max-width: 800px) {
  .top-sidebar > .sidebar-toggler {
    display: inherit;
    min-width: fit-content;
    max-width: fit-content;
    border: none;
  }
  .top-sidebar > .sidebar-toggler > i {
    font-size: 22pt;
  }
}
.top-sidebar .logo {
  max-width: 6em;
  max-width: fit-content;
  position: absolute;
  left: 40%;
}
.top-sidebar .logo img {
  margin-inline: auto;
  max-height: 4em;
  min-height: 4em;
}

.sidebar {
  z-index: 14;
  position: fixed;
  background-color: var(--bs-100);
  transition: transform ease 0.6s;
  top: 4em;
  bottom: 0;
  max-width: 70% !important;
  min-width: 70% !important;
  padding-top: 3rem;
  overflow-y: hidden;
}
.sidebar .nav-link {
  margin-block: 0.25em;
}

.sidebar-body {
  display: flex;
  flex-direction: column;
  padding-inline: 2rem;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  padding-block: inherit;
}

.sidebar-header {
  display: flex;
  max-height: fit-content;
}
.sidebar-header .btn-close {
  margin-inline-start: auto;
  margin-inline-end: 1rem;
}

.sidebar-collapse {
  position: fixed;
  transform: translateX(-300%);
}

.sidebar-expand {
  transform: none !important;
}