html {
  overflow: hidden;
}

#wrapper {
  display: grid;
  height: fit-content;
  transition: transform 0.2s linear;
  grid-template-areas: "sidebar header header" "sidebar main-area actionbar";
  grid-template-rows: fit-content(20px) 1fr;
  grid-template-columns: 56px 1fr auto;
  width: 100%;
  height: 100vh;
  margin: 0px;
}

#sidebar {
  grid-area: sidebar;
  position: sticky;
  top: 0;
}

#actionbar {
  grid-area: actionbar;
  position: sticky;
  top: 0;
  z-index: 25;
}

#header {
  grid-area: header;
  position: sticky;
  top: 0;
  background: white;
  z-index: 100;
  width: 100%;
}

#main-area {
  grid-area: main-area;
  min-width: 0;
  min-height: 0;
  overflow: auto;
}

#collapse-sidebar {
  grid-area: sidebar;
}

#settings-wrapper {
  display: grid;
  transition: transform 0.2s linear;
  grid-template-areas: "sidebar main-area";
  grid-template-columns: fit-content(20px) 1fr;
  height: 100%;
  margin: 0px;
}

#settings-area {
  grid-area: main-area;
  overflow: auto;
}

#settings-submenu {
  grid-area: sidebar;
  height: 100%;
}

.no-header {
  height: 100%;
}

#settings-submenu > div:first-child:not(:empty),
#collapse-sidebar > div:first-child:not(:empty),
.engagement-app-section > div:first-child:not(:empty),
#ntr-app-area > div:first-child:not(:empty),
.no-header > div:first-child:not(:empty) {
  height: 100%;
}

/* CSS loader */
#login-loader-wrapper {
  background: rgba(255, 255, 255);
  z-index: 9999;
}

.loader-wrapper {
  text-align: center;
  width: 100vw;
  height: 100vh;
  position: absolute;
  padding-top: 10vh;
  top: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.8);
}

.lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}

.lds-ellipsis div {
  position: absolute;
  top: 33px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #00338d;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
  left: 8px;
  animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
  left: 8px;
  animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
  left: 32px;
  animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
  left: 56px;
  animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0);
  }
}

@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }

  100% {
    transform: translate(24px, 0);
  }
}

.secondary-header {
  padding-top: 1.25rem;
  margin-left: 2rem;
  margin-right: 2rem;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid #e3e7e8;
}
.bread-crumb {
  padding-top: 1.25rem;
  margin-left: 1.25rem;
  margin-right: 1.25rem;
}
.action-bar-layout {
  display: flex;
}
.full-width {
  width: 100%;
}

#single-spa-application\:\@oneport\/action-bar {
  position: sticky;
  top: 0;
  height: 100%;
}

#single-spa-application\:\@oneport\/breadcrumbs {
  margin-bottom: 1rem;
}

.dashboard-t2 {
  margin-right: auto;
  margin-left: auto;
  max-width: 2100px;
  height: 100%;
}

#ntr-wrapper #ntr-app-area:empty {
  display: none;
}

#ntr-wrapper {
  display: grid;
  transition: transform 0.2s linear;
  grid-template-areas: "sidebar header" "sidebar main-area";
  grid-template-rows: fit-content(20px) 1fr;
  grid-template-columns: fit-content(10px) 1fr;
  height: 100%;
  grid-area: header;
}
.ntr-header {
  padding-top: 1.25rem;
  margin-left: 1rem;
  margin-right: 1rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #e3e7e8;
}
#ntr-app-area {
  height: 100%;
  /* padding: 0 1rem; */
  grid-area: main-area;
  overflow: auto;
}

.engagement-main-container .engagement-app-section:empty {
  display: none;
}

.engagement-main-container {
  transition: transform 0.2s linear;
  grid-template-areas:
    "sidebar header"
    "sidebar main-area";
  grid-template-rows: fit-content(20px) 1fr;
  grid-template-columns: fit-content(10px) 1fr;
  height: auto;
  grid-area: header;
}

.engagement-main-container:not(:has([name="@oneport-t1/home"])) {
  overflow-y: auto;
  overflow-x: hidden;
}

.engagement-main-container:has([name="@oneport/assistant-ui"]) {
  grid-template-areas: "main-area";
  grid-template-rows: 1fr;
  grid-template-columns: 1fr;
  height: calc(100vh - 3rem);
  overflow: hidden;
}

.engagement-main-container:has([name="@oneport/assistant-ui"])
  .secondary-header {
  display: none;
}

.engagement-app-section {
  margin-right: 2rem;
  margin-left: 2rem;
  height: 100%;
  grid-area: main-area;
}

.single-spa-container {
  height: 100%;
}
.single-spa-container > div:first-child {
  height: 100%;
}
div[id="single-spa-application:@oneport/workflow-tracker-ui"]:not(:empty) {
  height: 100%;
}