/* Color Theme for Next-Gen OneCloud */
/* Root Color Variables */
:root {
  --nxt-primary-color: #26890D;
  --nxt-secoundary-color: #86BC25;
  --nxt-black-color: #000000;
  --nxt-blue-color: #00A3E0;
  --nxt-white-FFFFFF: #FFFFFF;
  --nxt-black-000000: #000000;
  --next-light-scrollbar: #dee2e6;
  /* --nxt-light-text-color: #292929; */
  --nxt-dark-text-color: #E0E0E0;
  --nxt-dark-53565A: #53565A;
  --nxt-semibold-color: #3D3D3D;
  --nxt-setting-grey-color: #3D3D3D;
  --nxt-white-FFFFFF: #FFFFFF;
  --nxt-body-light-color: #f5f5f4;
  --nxt-body-dark-color: #151515;
  --nxt-menu-light-color: #FFFFFF;
  --nxt-menu-dark-color: #000000;
  --nxt-label-color: #525252;
  --nxt-card-light-color: #ffffff;
  --nxt-button-light-color: #F6F6F5;
  /* --nxt-disable-field-light-bgColor: #D0D0CE; */
  --nxt-light-D0D0CE: #D0D0CE;
  --nxt-light-D0D0CE6E: #D0D0CE6E;
  --nxt-disable-field-dark-bgColor: #3d3d3d;
  --nxt-card-dark-color: #292929;
  /* --nxt-setting-card-light-color: #D0D0CE; */
  --nxt-setting-card-dark-color: #2D2D2D;
  --nxt-searchbar-light-color: #FFFFFF;
  --nxt-searchbar-dark-color: #E0E0E0;
  /* --nxt-ative-nav-light-color: #F3F3F3; */
  --nxt-ative-nav-dark-color: #151515;
  --nxt-border-light-color: #E0E0E0;
  --nxt-border-dark-color: #7A7A7A;
  --nxt-field-border-light-color: #ffffff;
  --nxt-field-border-dark-color: #7D7D7D;
  --nxt-success-color: #43B02A;
  --nxt-info-color: #ED8B00;
  --nxt-danger-color: #DA291C;
  --nxt-draft-color: #00A3E0;
  --nxt-deleted-color: #000000;
  --nxt-declined-color: #00ABAB;
  --nxt-dark-deleted-color: #E0E0E0;
  --nxt-shadow-color: 0px 2px 4px rgba(0, 0, 0, 0.12);
  --nxt-success-light-gradient: linear-gradient(0deg, rgba(67, 176, 42, 0.1), rgba(67, 176, 42, 0.1)), linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
  --nxt-info-light-gradient: linear-gradient(0deg, rgba(237, 139, 0, 0.1), rgba(237, 139, 0, 0.1)), linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
  --nxt-danger-light-gradient: linear-gradient(0deg, rgba(218, 41, 28, 0.1), rgba(218, 41, 28, 0.1)), linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
  --nxt-draft-light-gradient: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%), linear-gradient(0deg, rgba(160, 220, 255, 0.28), rgba(160, 220, 255, 0.28));
  --nxt-deleted-light-gradient: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%), linear-gradient(0deg, #F8F8FA, #F8F8FA);
  --nxt-declined-light-gradient: #6FC2B41A;
  --nxt-success-dark-gradient: rgba(67, 176, 42, 0.1);
  --nxt-info-dark-gradient: rgba(237, 139, 0, 0.1);
  --nxt-danger-dark-gradient: rgba(218, 41, 28, 0.1);
  --nxt-draft-dark-gradient: rgba(0, 163, 224, 0.1);
  --nxt-deleted-dark-gradient: #E0E0E01A;
  --nxt-primary-rgb: 13, 110, 253;
  --nxt-secondary-rgb: 108, 117, 125;
  --nxt-font-sans-serif: "Open Sans";
  --nxt-body-font-family: var(--nxt-font-sans-serif);
  --nxt-body-font-size: 1rem;
  --nxt-body-font-weight: 600;
  --nxt-body-line-height: 24;
  --nxt-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --nxt-active-tile-dark-bg-color: #3D3D3D;
  --nxt-active-tile-light-bg-color: #E6F6FC;
  --nxt-notification-item-light-color: #F0F0F0;
  --nxt-notification-item-light-color1: #F9F9F9;
  --nxt-notification-item-dark-color: #151515;
  --nxt-search-bg-color: #FFFFFF;
  --nxt-search-text-color: #bbbcbc;
  --nxt-icon-light-color: #7A7A7A;
  --nxt-icon-dark-color: #FFFFFF;
  --nxt-pagination-active-color: #0000008a;
  --nxt-tag-chip-light-bg-color: #E6E6E6;
  --nxt-tag-chip-dark-bg-color: #3D3D3D;
  --nxt-tag-chip-light-border-color: #F6F6F6;
  --nxt-tag-chip-dark-border-color: #7A7A7A;
  --nxt-stroked-button-bg-light-color: #FFFFFF;
  --nxt-dark-292929: #292929;
  --nxt-dialog-bg-color: #ffffff;
  --nxt-dialog-dark-bg-color: #292929;
  --nxt-light-select-text-color: #75787B;
  /* --nxt-light-select-label-color: #53565A; */
  --nxt-stroked-button-bg-light-color-2: #F8F8FA;
  --nxt-stroked-button-bg-dark-color-2: #131313;
  --nxt-light-color-FAFAFA: #FAFAFA;
  --nxt-light-color-F3F3F3: #F3F3F3;
  --nxt-dark-color-3D3D3D: #3D3D3D;
  --nxt-light-box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  --nxt-dark-box-shadow: 0px 4px 4px 0px rgba(208, 208, 208, 0.43);
  --nxt-light-color-EEEEF0: #EEEEF0;
  --nxt-light-color-F8F8F8: #F8F8F8;
  --nxt-dark-color-2D2D2D: #2D2D2D;
  --nxt-light-color-E6E6E6: #E6E6E6;
  /* --nxt-tooltip-light-bgcolor: #53565A; */
  /* --nxt-tooltip-light-color: #FFFFFF; */
  /* --nxt-tooltip-dark-bgcolor: #E6E6E6; */
  /* --nxt-tooltip-dark-color: #53565A; */
}

/* Light Theme variable */
body {
  --nxt-primary-color: #26890D;
  --nxt-blue-color: #00A3E0;
  --nxt-black-color: #000000;
  --next-light-scrollbar: #dee2e6;
  --nxt-setting-bg-color: var(--nxt-white-FFFFFF);
  --nxt-setting-bg-color-2: var(--nxt-white-FFFFFF);
  --nxt-body-light-color: #f5f5f4;
  --nxt-card-light-color: #ffffff;
  --nxt-disable-field-light-bgColor: var(--nxt-light-D0D0CE);
  --nxt-setting-card-bg-color: var(--nxt-light-D0D0CE6E);
  --nxt-setting-card-shadow: var(--nxt-light-box-shadow);
  --nxt-menu-light-color: #FFFFFF;
  --nxt-light-text-color: var(--nxt-dark-292929);
  --nxt-notification-item-light-color1: #F9F9F9;
  --nxt-semibold-color: #3D3D3D;
  --nxt-label-color: #525252;
  --nxt-dark-text-color: #E0E0E0;
  --nxt-searchbar-light-color: #FFFFFF;
  --nxt-ative-nav-light-color: var(--nxt-light-color-F3F3F3);
  --nxt-border-light-color: #E0E0E0;
  --nxt-field-border-light-color: #ffffff;
  --nxt-button-light-color: #F6F6F5;
  --nxt-success-light-gradient: linear-gradient(0deg, rgba(67, 176, 42, 0.1), rgba(67, 176, 42, 0.1)), linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
  --nxt-info-light-gradient: linear-gradient(0deg, rgba(237, 139, 0, 0.1), rgba(237, 139, 0, 0.1)), linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
  --nxt-danger-light-gradient: linear-gradient(0deg, rgba(218, 41, 28, 0.1), rgba(218, 41, 28, 0.1)), linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
  --nxt-draft-light-gradient: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%), linear-gradient(0deg, rgba(160, 220, 255, 0.28), rgba(160, 220, 255, 0.28));
  --nxt-deleted-light-gradient: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%), linear-gradient(0deg, #F8F8FA, #F8F8FA);
  --nxt-search-dark-bg-color: #ffffff;
  --nxt-search-dark-text-color: var(--nxt-dark-292929);
  --nxt-icon-light-color: #7A7A7A;
  --nxt-search2-dark-text-color: var(--nxt-dark-292929);
  --nxt-pagination-active-color-darkmode: #fffffF;
  --nxt-pagination-disable-color: #0000001f;
  --nxt-pagination-disable-color-darkmode: #f8f8f838;
  --nxt-stroked-button-bg-light-color: #FFFFFF;
  --nxt-light-select-text-color: #75787B;
  --nxt-light-select-label-color: var(--nxt-dark-53565A);
  --nxt-stroked-button-bg-light-color-2: #F8F8FA;
  --nxt-stroked-button-bg-hover-color: var(--nxt-light-color-EEEEF0);
  --nxt-acnt-tag-desc-text-light: #63666A;
  --nxt-disabled-textfield-bg-light: var(--nxt-light-color-FAFAFA);
  --nxt-ticker-banner-bg-color: var(--nxt-light-color-F3F3F3);
  --nxt-left-menu-hover-color: var(--nxt-light-color-F8F8F8);
  --nxt-tooltip-bgcolor: var(--nxt-dark-53565A);
  --nxt-tooltip-color: var(--nxt-white-FFFFFF);
  --nxt-divider-color: var(--nxt-light-D0D0CE)
}

/* Dark Theme variable */
body.dark-theme {
  --nxt-primary-color: var(--nxt-secoundary-color);
  --nxt-black-color: var(--nxt-white-FFFFFF);
  --nxt-blue-color: var(--nxt-secoundary-color);
  --next-light-scrollbar: var(--nxt-body-dark-color);
  --nxt-setting-bg-color: var(--nxt-dark-292929);
  --nxt-setting-bg-color-2: var(--nxt-dark-color-3D3D3D);
  --nxt-body-light-color: var(--nxt-body-dark-color);
  --nxt-card-light-color: var(--nxt-card-dark-color);
  --nxt-disable-field-light-bgColor: var(--nxt-disable-field-dark-bgColor);
  --nxt-setting-card-bg-color: var(--nxt-dark-53565A);
  --nxt-setting-card-shadow: var(--nxt-dark-box-shadow);
  --nxt-ative-nav-light-color: var(--nxt-ative-nav-dark-color);
  --nxt-menu-light-color: var(--nxt-menu-dark-color);
  --nxt-light-text-color: var(--nxt-dark-text-color);
  --nxt-semibold-color: var(--nxt-dark-text-color);
  --nxt-label-color: var(--nxt-dark-text-color);
  --nxt-button-light-color: var(--nxt-card-dark-color);
  --nxt-searchbar-light-color: var(--nxt-searchbar-dark-color);
  --nxt-border-light-color: var(--nxt-border-dark-color);
  --nxt-field-border-light-color: var(--nxt-field-border-dark-color);
  --nxt-success-light-gradient: var(--nxt-success-dark-gradient);
  --nxt-info-light-gradient: var(--nxt-info-dark-gradient);
  --nxt-danger-light-gradient: var(--nxt-danger-dark-gradient);
  --nxt-draft-light-gradient: var(--nxt-draft-dark-gradient);
  --nxt-deleted-color: var(--nxt-dark-deleted-color);
  --nxt-deleted-light-gradient: var(--nxt-deleted-dark-gradient);
  --nxt-active-tile-light-bg-color: var(--nxt-active-tile-dark-bg-color);
  --nxt-notification-item-light-color: var(--nxt-notification-item-dark-color);
  --nxt-notification-item-light-color1: var(--nxt-notification-item-dark-color);
  --nxt-search-bg-color: var(--nxt-search-dark-bg-color);
  --nxt-search-text-color: var(--nxt-search-dark-text-color);
  --nxt-icon-light-color: var(--nxt-icon-dark-color);
  --nxt-search2-text-color: var(--nxt-search2-dark-text-color);
  --nxt-pagination-active-color: var(--nxt-pagination-active-color-darkmode);
  --nxt-pagination-disable-color: var(--nxt-pagination-disable-color-darkmode);
  --nxt-tag-chip-light-bg-color: var(--nxt-tag-chip-dark-bg-color);
  --nxt-tag-chip-light-border-color: var(--nxt-tag-chip-dark-border-color);
  --nxt-stroked-button-bg-light-color: var(--nxt-dark-292929);
  --nxt-dialog-bg-color: var(--nxt-dialog-dark-bg-color);
  --nxt-light-select-text-color: var(--nxt-dark-text-color);
  --nxt-light-select-label-color: var(--nxt-dark-text-color);
  --nxt-stroked-button-bg-light-color-2: var(--nxt-stroked-button-bg-dark-color-2);
  --nxt-stroked-button-bg-hover-color: var(--nxt-black-000000);
  --nxt-acnt-tag-desc-text-light: var(--nxt-dark-text-color);
  --nxt-disabled-textfield-bg-light: var(--nxt-dark-color-3D3D3D);
  --nxt-ticker-banner-bg-color: transparent;
  --nxt-left-menu-hover-color: var(--nxt-dark-color-2D2D2D);
  --nxt-tooltip-bgcolor: var(--nxt-light-color-E6E6E6);
  --nxt-tooltip-color: var(--nxt-dark-53565A);
  --nxt-divider-color: var(--nxt-dark-53565A)
}

body {
  background: var(--nxt-body-light-color) !important;
  font-family: apple-system, BlinkMacSystemFont, Open Sans, sans-serif !important;
  font-style: normal;
  font-weight: var(--nxt-body-font-weight) !;
  font-size: var(--nxt-body-font-size);
  line-height: var(--nxt-body-line-height);
  margin: 0;
  padding: 0;
}

::-webkit-scrollbar {
  width: 8px;
  height: 5px;
}

::-webkit-scrollbar-corner {
  height: 0;
}

::-webkit-scrollbar-track {
  background-color: transparent;
  border-radius: 25px;
}

::-webkit-scrollbar-thumb {
  background-color: var(--nxt-border-light-color);
  border-radius: 25px;
  cursor: pointer;
}

.common_icons {
  cursor: pointer;
  color: var(--nxt-icon-light-color);
}

.common_icons svg path {
  fill: currentcolor;
}

h4,
h5,
.mdc-data-table__header-cell,
.mdc-data-table__cell,
.mat-mdc-paginator,
.mat-mdc-icon-button {
  color: var(--nxt-semibold-color) !important;
}

.mat-mdc-table,
.mat-mdc-paginator {
  background-color: var(--nxt-card-light-color) !important;
}

.mdc-data-table__cell,
.mdc-data-table__header-cell {
  border-bottom: 1px solid #dee2e6 !important;
  padding: 0 8px 0 0px !important;
}

.modal-content {
  background-color: var(--nxt-card-light-color) !important;
}

/* Styles for microfrontend-layout.html */
main.app-content {
  display: flex;
}

.page-title {
  font-size: 14px;
  color: var(--nxt-dark-292929);
  margin-top: 12px;
  display: inline-block;
}

/* .app-header {
    height: 64px;
} */

.app-menu {
  z-index: 9;
}

.app-main {
  width: 100%;
  margin-left: 5rem;
  margin-top: 4.2rem;
}

* {
  margin: 0;
  padding: 0;
}

/* .root_container {
  background-color: #000000;
  height: 100vh;
  display: flex;
  justify-content: space-between;
  align-items: center;
} */

.left-content {
  /* margin-left: 70px;*/
  padding: 20px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: "Open Sans";
  font-weight: 600;

  .content-txt {
    color: #ffffff;
    font-size: 20px;
  }

  .content-btn {
    width: 160px;
    height: 40px;
    border: 1px solid #ffffff;
    background-color: #d9d9d9;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
  }

}

.imgbox {
  display: grid;
  height: 100%;
  margin-right: 45px;
  animation: move 8s infinite;
}

.center-fit {
  max-width: 100%;
  max-height: 100vh;
  margin: auto;
}
::ng-deep angular-editor-toolbar button i {
  font-family: FontAwesome !important; 
  }


@media (min-width:375px) and (max-width:576px) {
  .signin-container {
    height: auto !important;
  }
}

@media (max-height:220px) {
  .signin-container {
    height: auto !important;
  }
}

@keyframes move {
  0% {
    transform: translate(0, 0);
  }

  50% {
    transform: translate(20px, 20px);
  }

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